/* Phase1 Premium UI additions (works with /ui-pro.css + /ui-phase1.css) */
:root{
  --pm-bg0:#f4f7ff;
  --pm-bg1:#ffffff;
  --pm-card:#ffffff;
  --pm-text:#0f172a;
  --pm-muted:#64748b;
  --pm-line:rgba(15,23,42,.10);
  --pm-shadow:0 18px 40px rgba(15,23,42,.10);
  --pm-shadow2:0 10px 22px rgba(15,23,42,.08);
  --pm-accent:#1d4ed8;
  --pm-accent2:#2563eb;
  --pm-accentSoft:rgba(37,99,235,.10);
  --pm-radius:22px;
  --pm-radius2:16px;
}

body{
  background: radial-gradient(900px 420px at 20% 0%, rgba(37,99,235,.12), transparent 60%),
              radial-gradient(800px 380px at 80% 10%, rgba(34,197,94,.10), transparent 60%),
              linear-gradient(180deg, var(--pm-bg0), #ffffff 45%);
}

.pm-shell{min-height:100vh;}
.pm-top{
  position:sticky; top:0; z-index:10;
  background: rgba(244,247,255,.86);
  backdrop-filter: blur(10px);
  border-bottom:1px solid var(--pm-line);
}
.pm-topin{
  max-width:1180px;margin:0 auto;
  padding:14px 18px;
  display:flex;align-items:center;justify-content:space-between;
}
.pm-brand{display:flex;align-items:center;gap:12px;min-width:200px;}
.pm-mark{
  width:44px;height:44px;border-radius:14px;
  background: linear-gradient(135deg, rgba(37,99,235,.14), rgba(37,99,235,.06));
  border:1px solid rgba(37,99,235,.18);
  box-shadow: 0 10px 20px rgba(15,23,42,.08);
  display:grid;place-items:center;
}
.pm-mark svg{width:22px;height:22px;display:block;}
.pm-brandtxt{line-height:1.15;}
.pm-brandtxt .t1{font-weight:900;font-size:16px;color:var(--pm-text);letter-spacing:.2px;}
.pm-brandtxt .t2{font-size:12px;color:var(--pm-muted);margin-top:4px;display:flex;align-items:center;gap:8px;}
.pm-dot{width:8px;height:8px;border-radius:99px;background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.10);}

.pm-userbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end;}
.pm-pill{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 12px;border-radius:999px;
  background:#fff;border:1px solid var(--pm-line);
  color:var(--pm-text);font-weight:700;font-size:12px;
  box-shadow:0 8px 18px rgba(15,23,42,.06);
}
.pm-pill .mini{color:var(--pm-muted);font-weight:700;}
.pm-btn{
  appearance:none;border:1px solid rgba(37,99,235,.22);
  background:linear-gradient(180deg, #ffffff, rgba(37,99,235,.06));
  color:var(--pm-accent);
  padding:10px 14px;border-radius:14px;
  font-weight:900;font-size:13px;
  box-shadow:0 10px 20px rgba(15,23,42,.08);
  cursor:pointer;text-decoration:none;
}
.pm-btn:hover{filter:brightness(.98);} 
.pm-btn:active{transform:translateY(1px);} 

.pm-main{max-width:1180px;margin:0 auto;padding:22px 18px 40px;}
.pm-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:18px;align-items:start;}
@media (max-width: 980px){ .pm-grid{grid-template-columns:1fr;} .pm-topin{padding:12px 14px;} .pm-main{padding:16px 14px 30px;} }

.pm-card{
  background:var(--pm-card);
  border:1px solid rgba(15,23,42,.08);
  border-radius:var(--pm-radius);
  box-shadow:var(--pm-shadow);
  overflow:hidden;
}
.pm-cardin{padding:18px 18px;}
.pm-title{font-weight:950;color:var(--pm-text);font-size:18px;letter-spacing:.2px;margin:0;}
.pm-sub{margin-top:6px;color:var(--pm-muted);font-size:12px;line-height:1.6;}
.pm-hr{height:1px;background:var(--pm-line);margin:14px 0;}

.pm-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px;}
.pm-chip{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 10px;border-radius:999px;
  background:rgba(15,23,42,.03);
  border:1px solid rgba(15,23,42,.08);
  color:var(--pm-text);font-weight:800;font-size:12px;
}
.pm-chip b{font-weight:950;}
.pm-chip .k{color:var(--pm-muted);font-weight:800;}
.pm-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px;}
.pm-primary{
  display:inline-flex;align-items:center;justify-content:center;
  padding:12px 14px;border-radius:16px;
  background:linear-gradient(180deg, var(--pm-accent2), var(--pm-accent));
  color:white;font-weight:950;font-size:13px;
  border:1px solid rgba(37,99,235,.30);
  box-shadow:0 14px 26px rgba(37,99,235,.25);
  text-decoration:none; cursor:pointer;
}
.pm-secondary{
  display:inline-flex;align-items:center;justify-content:center;
  padding:12px 14px;border-radius:16px;
  background:#fff;color:var(--pm-text);
  border:1px solid rgba(15,23,42,.12);
  box-shadow:0 10px 20px rgba(15,23,42,.08);
  text-decoration:none; cursor:pointer;
}
.pm-secondary:hover{background:rgba(15,23,42,.02);} 
.pm-note{
  margin-top:12px;
  padding:12px 14px;border-radius:16px;
  background:rgba(37,99,235,.06);
  border:1px solid rgba(37,99,235,.14);
  color:var(--pm-muted);font-size:12px;line-height:1.6;
}
.pm-foot{ text-align:center;color:rgba(100,116,139,.70); margin-top:18px;font-size:12px; }

.pm-menu{display:flex;flex-direction:column;gap:10px;margin-top:12px;}
.pm-item{
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;padding:12px 12px;border-radius:16px;
  border:1px solid rgba(15,23,42,.10);
  background:linear-gradient(180deg, #ffffff, rgba(15,23,42,.02));
  box-shadow:var(--pm-shadow2);
  text-decoration:none;
}
.pm-item:hover{background:linear-gradient(180deg, #ffffff, rgba(37,99,235,.05)); border-color:rgba(37,99,235,.18);} 
.pm-itxt .h{font-weight:950;color:var(--pm-text);font-size:14px;line-height:1.2;} 
.pm-itxt .d{margin-top:4px;color:var(--pm-muted);font-size:12px;} 
.pm-iicon{
  width:38px;height:38px;border-radius:14px;
  background:rgba(37,99,235,.10);
  border:1px solid rgba(37,99,235,.18);
  display:grid;place-items:center;flex:0 0 auto;
}
.pm-iicon svg{width:18px;height:18px;display:block;fill:var(--pm-accent);} 
.pm-arrow{color:rgba(37,99,235,.8);font-weight:950;flex:0 0 auto;}

.pm-login-wrap{min-height:100vh;display:grid;place-items:center;padding:20px 14px;}
.pm-login-grid{width:100%;max-width:980px;display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:stretch;}
@media (max-width: 920px){ .pm-login-grid{grid-template-columns:1fr;} }
.pm-login-card{padding:18px 18px;}
.pm-input{ width:100%;border-radius:14px;padding:12px 12px; border:1px solid rgba(15,23,42,.14); background:#fff;outline:none; }
.pm-input:focus{border-color:rgba(37,99,235,.40); box-shadow:0 0 0 5px rgba(37,99,235,.12);} 
.pm-label{font-size:12px;color:var(--pm-muted);font-weight:800;margin:14px 0 6px;} 
.pm-err{ margin-top:10px;padding:10px 12px;border-radius:14px; background:rgba(239,68,68,.08);border:1px solid rgba(239,68,68,.18); color:#b91c1c;font-weight:800;font-size:12px; }
.pm-check{display:flex;align-items:center;gap:10px;margin-top:12px;color:var(--pm-muted);font-size:12px;} 
.pm-check input{width:16px;height:16px;}