:root { --ink:#171a21; --muted:#6d7380; --line:#e2e5ea; --brand:#563be8; --brand-dark:#3e28c5; --soft:#f4f3ff; font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; color:var(--ink); background:#f4f6f9; }
button,input,select { font:inherit; }
button { cursor:pointer; }
.login-shell { min-height:100vh; display:grid; grid-template-columns:minmax(360px,.8fr) minmax(480px,1.2fr); }
.login-panel { display:grid; place-items:center; padding:32px; background:#fff; }
.login-card { width:min(420px,100%); }
.brand-row { display:flex; align-items:center; gap:12px; margin-bottom:54px; }
.brand-mark { width:42px; height:42px; display:grid; place-items:center; border-radius:8px; color:#fff; background:var(--brand); font-weight:800; }
.brand-row b,.brand-row small { display:block; }
.brand-row small { color:var(--muted); margin-top:3px; }
h1 { margin:0 0 9px; font-size:34px; letter-spacing:0; }
.subtitle { margin:0 0 28px; color:var(--muted); line-height:1.6; }
.form { display:grid; gap:15px; }
label { display:grid; gap:7px; font-size:13px; font-weight:700; }
input,select { width:100%; min-height:44px; padding:10px 12px; border:1px solid var(--line); border-radius:8px; outline:none; background:#fff; }
input:focus,select:focus { border-color:var(--brand); box-shadow:0 0 0 3px rgba(86,59,232,.12); }
.primary { min-height:44px; border:0; border-radius:8px; color:#fff; background:var(--brand); font-weight:700; }
.primary:hover { background:var(--brand-dark); }
.error { min-height:20px; margin:2px 0 0; color:#c13f4c; font-size:13px; }
.login-visual { display:grid; place-items:center; padding:50px; overflow:hidden; background:linear-gradient(135deg,#f0eeff,#e7f7f5); }
.visual-copy { max-width:650px; }
.visual-copy h2 { margin:0 0 20px; font-size:clamp(38px,5vw,70px); line-height:1.02; }
.visual-copy p { max-width:560px; color:#515764; font-size:18px; line-height:1.75; }
.steps { display:flex; align-items:center; gap:10px; margin-top:45px; }
.steps span { padding:9px 12px; border:1px solid rgba(86,59,232,.2); border-radius:8px; background:rgba(255,255,255,.7); font-size:13px; font-weight:700; }
.steps i { width:24px; height:1px; background:#aaa2e8; }

.admin-shell { min-height:100vh; display:grid; grid-template-columns:230px minmax(0,1fr); }
.admin-sidebar { position:sticky; top:0; height:100vh; padding:22px 16px; color:#fff; background:#1b1d25; }
.admin-sidebar .brand-row { margin-bottom:34px; }
.admin-nav { display:grid; gap:6px; }
.admin-nav button { min-height:42px; padding:0 12px; border:0; border-radius:8px; color:#bfc3cd; background:transparent; text-align:left; }
.admin-nav button.active,.admin-nav button:hover { color:#fff; background:#30333e; }
.admin-main { min-width:0; padding:28px; }
.admin-topbar { display:flex; justify-content:space-between; align-items:center; gap:15px; margin-bottom:24px; }
.admin-topbar h1 { font-size:30px; }
.secondary { min-height:38px; padding:0 13px; border:1px solid var(--line); border-radius:8px; color:var(--ink); background:#fff; }
.admin-view { display:none; }
.admin-view.active { display:block; }
.metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:13px; margin-bottom:18px; }
.metric,.panel { padding:18px; border:1px solid var(--line); border-radius:8px; background:#fff; }
.metric span,.metric small { display:block; color:var(--muted); }
.metric strong { display:block; margin:9px 0 5px; font-size:27px; }
.panel-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:15px; }
.panel-head h2 { margin:0; font-size:18px; }
.split { display:grid; grid-template-columns:minmax(310px,.65fr) minmax(0,1.35fr); gap:15px; align-items:start; }
.table-wrap { overflow:auto; }
table { width:100%; border-collapse:collapse; font-size:13px; }
th,td { padding:11px 10px; border-bottom:1px solid var(--line); text-align:left; white-space:nowrap; }
th { color:var(--muted); font-weight:700; }
.status { display:inline-flex; padding:4px 7px; border-radius:999px; color:#08754d; background:#e6f7ef; font-size:11px; font-weight:700; }
.hint { color:var(--muted); font-size:12px; line-height:1.6; }
.two { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.config-stack { display:grid; gap:18px; max-width:760px; }
.button-row { display:flex; align-items:center; gap:10px; }
.toast { position:fixed; right:22px; bottom:22px; padding:12px 15px; transform:translateY(15px); opacity:0; color:#fff; border-radius:8px; background:#1d2027; transition:.2s; }
.toast.show { transform:none; opacity:1; }
@media(max-width:800px){.login-shell{grid-template-columns:1fr}.login-visual{display:none}.admin-shell{display:block}.admin-sidebar{position:static;height:auto}.admin-nav{grid-template-columns:repeat(2,1fr)}.admin-main{padding:18px}.metric-grid{grid-template-columns:1fr 1fr}.split,.two{grid-template-columns:1fr}}

/* Login entrance */
.login-page { background:#eef1f4; }
.login-page .login-shell { grid-template-columns:minmax(430px,.82fr) minmax(590px,1.18fr); }
.login-page .login-panel { place-items:stretch; min-height:100vh; padding:42px clamp(34px,5vw,76px); }
.login-page .login-card { display:flex; flex-direction:column; justify-content:center; width:min(470px,100%); margin:auto; }
.login-page .login-brand { width:max-content; margin:0 0 68px; color:inherit; text-decoration:none; }
.login-page .brand-mark { background:#20242b; }
.login-page .login-heading { margin-bottom:24px; }
.eyebrow { display:block; margin-bottom:10px; color:#5a42db; font-size:11px; font-weight:800; letter-spacing:0; }
.login-page h1 { font-size:36px; }
.login-page .subtitle { max-width:430px; margin-bottom:0; }
.role-guide { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-bottom:24px; }
.role-guide article { display:flex; gap:10px; min-width:0; padding:12px; border:1px solid var(--line); border-radius:8px; background:#f8f9fb; }
.role-guide b,.role-guide small { display:block; }
.role-guide b { margin-bottom:3px; font-size:13px; }
.role-guide small { color:var(--muted); font-size:11px; line-height:1.45; }
.role-icon { flex:0 0 30px; width:30px; height:30px; display:grid; place-items:center; border-radius:7px; color:#0e765e; background:#dff5ed; font-size:12px; font-weight:800; }
.role-icon.admin { color:#a54535; background:#fae9e5; }
.login-form { gap:16px; }
.login-form input { min-height:48px; }
.password-field { position:relative; display:block; }
.password-field input { padding-right:62px; }
.password-field button { position:absolute; top:5px; right:5px; height:38px; padding:0 10px; border:0; color:#555d69; background:#f0f2f5; border-radius:6px; font-size:12px; font-weight:700; }
.login-options { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:-3px; }
.remember { display:flex; grid-template-columns:none; align-items:center; gap:8px; color:#555d69; font-weight:500; }
.remember input { width:16px; min-height:16px; accent-color:var(--brand); }
.text-button { padding:0; border:0; color:#5540ca; background:transparent; font-size:12px; font-weight:700; }
.login-submit { min-height:50px; display:flex; align-items:center; justify-content:center; gap:12px; }
.login-submit:disabled { cursor:wait; opacity:.72; }
.login-help { display:flex; gap:8px; margin-top:18px; padding:12px 13px; border-left:3px solid #d59a26; color:#646b76; background:#fff8e8; font-size:12px; line-height:1.55; }
.login-help b { flex:0 0 auto; color:#75500b; }
.login-footer { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-top:28px; color:#8a9099; font-size:11px; }
.login-footer i { width:3px; height:3px; border-radius:50%; background:#b9bec6; }
.login-toast { position:fixed; left:50%; bottom:25px; z-index:20; transform:translate(-50%,16px); padding:11px 14px; opacity:0; pointer-events:none; color:#fff; background:#20242b; border-radius:7px; font-size:13px; transition:.2s; }
.login-toast.show { transform:translate(-50%,0); opacity:1; }

.login-page .login-visual { position:relative; min-height:100vh; display:flex; flex-direction:column; justify-content:space-between; align-items:stretch; padding:42px clamp(40px,5vw,78px); color:#f7f8fa; background:#20242b; }
.visual-top,.visual-foot { display:flex; align-items:center; justify-content:space-between; gap:18px; color:#aab0b8; font-size:11px; }
.visual-top div { display:flex; align-items:center; gap:8px; color:#d6d9de; }
.live-dot { width:7px; height:7px; border-radius:50%; background:#45c69b; box-shadow:0 0 0 4px rgba(69,198,155,.12); }
.login-page .visual-copy { margin:55px 0 34px; }
.login-page .visual-copy h2 { margin:0 0 20px; max-width:720px; color:#fff; font-size:54px; line-height:1.12; letter-spacing:0; }
.login-page .visual-copy p { max-width:600px; margin:0; color:#aeb4bd; font-size:16px; line-height:1.75; }
.workspace-preview { display:grid; grid-template-columns:56px minmax(0,1fr); width:min(760px,100%); min-height:330px; margin-bottom:36px; overflow:hidden; border:1px solid #3d424b; border-radius:8px; background:#f6f7f9; box-shadow:0 22px 60px rgba(0,0,0,.24); }
.workspace-preview aside { display:flex; flex-direction:column; align-items:center; gap:19px; padding:17px 0; background:#171a20; }
.preview-logo { width:30px; height:30px; display:grid; place-items:center; border-radius:6px; color:#171a20; background:#fff; font-size:11px; font-weight:900; }
.workspace-preview aside i { width:18px; height:5px; border-radius:2px; background:#4b515b; }
.workspace-preview aside i.active { background:#7b67ee; }
.preview-main { min-width:0; padding:24px; color:#20242b; }
.preview-main header { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px; }
.preview-main header small,.preview-main header b { display:block; }
.preview-main header small { margin-bottom:4px; color:#8b919b; font-size:10px; }
.preview-main header b { font-size:18px; }
.preview-main header > span { padding:6px 9px; border-radius:6px; color:#156b56; background:#dff5ed; font-size:11px; font-weight:800; }
.preview-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }
.preview-metrics article { padding:13px; border:1px solid #e0e3e8; border-radius:7px; background:#fff; }
.preview-metrics small,.preview-metrics b { display:block; }
.preview-metrics small { margin-bottom:7px; color:#858c96; font-size:10px; }
.preview-metrics b { font-size:22px; }
.preview-flow { display:flex; align-items:center; gap:7px; margin:18px 0; overflow:hidden; }
.preview-flow span { flex:0 0 auto; padding:6px 8px; border-radius:5px; color:#5145a9; background:#ebe8ff; font-size:9px; font-weight:800; }
.preview-flow i { min-width:10px; height:1px; background:#c9ccd2; }
.preview-list { display:grid; gap:8px; }
.preview-list article { display:grid; grid-template-columns:8px minmax(0,1fr) auto; align-items:center; gap:10px; padding:10px 12px; border:1px solid #e2e4e8; border-radius:7px; background:#fff; }
.preview-list article > span { width:8px; height:30px; border-radius:3px; background:#ed7765; }
.preview-list article:nth-child(2) > span { background:#45b995; }
.preview-list b,.preview-list small { display:block; }
.preview-list b { overflow:hidden; margin-bottom:3px; text-overflow:ellipsis; white-space:nowrap; font-size:11px; }
.preview-list small { color:#8a9099; font-size:9px; }
.preview-list em { color:#5a42db; font-size:10px; font-style:normal; font-weight:800; }
.visual-foot { justify-content:flex-start; flex-wrap:wrap; }
.visual-foot span { padding-right:16px; border-right:1px solid #454a53; }

@media(max-width:1050px){.login-page .login-shell{grid-template-columns:minmax(410px,.9fr) minmax(480px,1.1fr)}.login-page .visual-copy h2{font-size:42px}.preview-main{padding:20px}}
@media(max-width:820px){.login-page .login-shell{display:block}.login-page .login-panel{min-height:100vh;padding:30px 22px}.login-page .login-brand{margin-bottom:46px}.login-page .login-visual{display:none}.role-guide{grid-template-columns:1fr}.login-page h1{font-size:31px}.login-footer{margin-top:22px}}
@media(max-width:420px){.login-options{align-items:flex-start}.login-help{display:block}.login-help b{display:block;margin-bottom:3px}.login-footer i{display:none}.login-footer{gap:6px 12px}}

/* Liuguang authentication and admin theme */
:root{--ink:#171a2b;--muted:#6b7185;--line:#dfe3ef;--brand:#6257e8;--brand-dark:#4036bd;--soft:#eeefff}
body,.login-page{background:#f3f5fb}.login-page .login-panel{background:#fff}.login-page .brand-mark{background:#6257e8;box-shadow:0 0 0 1px rgba(98,87,232,.16),0 0 24px rgba(98,87,232,.28)}
.eyebrow{color:#6257e8}.role-guide article{border-color:#dfe3ef;background:#f8f9fd}.role-icon{color:#216d94;background:#e4f4fb}.role-icon.admin{color:#5146c2;background:#ecebff}
input:focus,select:focus{border-color:#695ee8;box-shadow:0 0 0 3px rgba(98,87,232,.12),0 0 18px rgba(98,87,232,.08)}.primary{background:#5c53df;box-shadow:0 7px 18px rgba(76,65,199,.2)}.primary:hover{background:#4036bd}.text-button{color:#5146c2}
.password-field button{color:#4c46a7;background:#efefff}.login-help{border-left-color:#6257e8;color:#5f6478;background:#f2f2ff}.login-help b{color:#4036bd}.login-toast{background:#202540;box-shadow:0 12px 30px rgba(18,21,52,.25)}
.login-page .login-visual{background:#15182d}.visual-top,.visual-foot{color:#8990ae}.live-dot{background:#36c8ca;box-shadow:0 0 0 4px rgba(54,200,202,.12),0 0 14px rgba(54,200,202,.38)}.login-page .visual-copy p{color:#adb4d0}
.workspace-preview{border-color:#343a66;box-shadow:0 24px 70px rgba(12,14,40,.38),0 0 34px rgba(99,87,232,.13)}.workspace-preview aside{background:#111426}.workspace-preview aside i.active{background:#7e75ff;box-shadow:0 0 12px rgba(126,117,255,.5)}
.preview-logo{color:#fff;background:#6257e8}.preview-main header>span{color:#166e88;background:#e2f6fb}.preview-flow span{color:#4c43bc;background:#ececff}.preview-list article>span{background:#6b61ed}.preview-list article:nth-child(2)>span{background:#28a4bd}.preview-list em{color:#5146c2}.visual-foot span{border-right-color:#343a66}
.admin-sidebar{background:#15182d;box-shadow:10px 0 30px rgba(27,30,70,.12)}.admin-sidebar .brand-mark{background:#6257e8;box-shadow:0 0 22px rgba(98,87,232,.32)}.admin-nav button{color:#adb4d0}.admin-nav button.active,.admin-nav button:hover{color:#fff;background:#292e58;box-shadow:inset 3px 0 #7e75ff}
.admin-main{background:#f3f5fb}.metric,.panel{border-color:#dfe3ef;box-shadow:0 9px 28px rgba(49,53,116,.06)}.status{color:#216d94;background:#e4f4fb}.secondary:hover{color:#4036bd;border-color:#aeb4ea;background:#f5f5ff}.toast{background:#202540;box-shadow:0 12px 30px rgba(18,21,52,.25)}

/* Premium Liuguang login entrance */
.login-page { background:#f5f7fc; }
.login-page .login-shell { grid-template-columns:minmax(460px,.74fr) minmax(700px,1.26fr); background:#0f1328; }
.login-page .login-panel { position:relative; z-index:1; padding:48px clamp(40px,5.8vw,92px); background:linear-gradient(180deg,#ffffff 0%,#f7f9ff 100%); }
.login-page .login-panel::before { content:""; position:absolute; inset:0 0 auto; height:7px; background:linear-gradient(90deg,#6257e8,#25a6c3,#8d78ff); }
.login-page .login-card { width:min(500px,100%); }
.login-page .login-brand { margin-bottom:58px; }
.login-page .brand-mark { width:46px; height:46px; border-radius:11px; background:linear-gradient(135deg,#6457f0,#1aa4c7); box-shadow:0 14px 34px rgba(87,77,225,.28),0 0 0 1px rgba(255,255,255,.7) inset; }
.login-page .brand-row b { color:#111629; font-size:16px; }
.login-page .brand-row small { color:#737a90; }
.login-page .login-heading { margin-bottom:26px; }
.login-page h1 { color:#111629; font-size:44px; line-height:1.08; }
.login-page .subtitle { max-width:480px; color:#666d82; font-size:15px; line-height:1.75; }
.login-page .eyebrow { color:#2a8fb8; letter-spacing:0; }
.role-guide { gap:10px; margin-bottom:26px; }
.role-guide article { min-height:76px; padding:14px; border-color:#e0e5f2; background:rgba(255,255,255,.82); box-shadow:0 10px 28px rgba(39,47,95,.05); }
.role-guide article:hover { border-color:#b8c0f5; background:#fff; }
.role-icon { border-radius:9px; color:#096a86; background:#def6fb; }
.role-icon.admin { color:#5548cf; background:#ecebff; }
.login-form input { min-height:54px; border-color:#dce2ef; background:#fff; box-shadow:0 1px 0 rgba(255,255,255,.8) inset,0 8px 22px rgba(35,46,92,.04); }
.password-field button { top:7px; right:7px; height:38px; border-radius:8px; color:#4f47bc; background:#f0efff; }
.login-submit { min-height:56px; border-radius:12px; background:linear-gradient(135deg,#6257e8,#238fb4); box-shadow:0 18px 38px rgba(67,78,206,.3); }
.login-submit:hover { background:linear-gradient(135deg,#5146d1,#177f9f); transform:translateY(-1px); }
.register-entry { display:flex; align-items:center; justify-content:center; gap:8px; margin-top:14px; color:#697187; font-size:13px; }
.register-form { margin-top:16px; padding:16px; border:1px solid #dfe5f5; border-radius:14px; background:#fff; box-shadow:0 16px 42px rgba(45,52,101,.08); }
.register-form.is-hidden { display:none; }
.register-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:4px; }
.register-head b { color:#161b30; font-size:15px; }
.register-head span { color:#7c8496; font-size:11px; }
.register-form .button-row { display:grid; grid-template-columns:1fr auto; gap:10px; }
.register-modal { position:fixed; inset:0; z-index:50; display:grid; place-items:center; padding:22px; }
.register-modal.is-hidden { display:none; }
.register-backdrop { position:absolute; inset:0; background:rgba(13,17,36,.48); backdrop-filter:blur(8px); }
.register-modal .register-form { position:relative; z-index:1; width:min(430px,100%); margin:0; }
.register-modal .register-head { align-items:flex-start; }
.register-modal .register-head div { display:grid; gap:4px; }
.modal-close { width:32px; height:32px; border:1px solid #dce2ef; border-radius:8px; color:#5f6478; background:#fff; font-size:20px; line-height:1; cursor:pointer; }
.modal-close:hover { color:#4036bd; border-color:#b9c1ef; background:#f4f5ff; }
.login-help { margin-top:20px; border-left:0; border-radius:10px; color:#626981; background:#f0f3ff; }
.login-help b { color:#4036bd; }
.login-assurance { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:18px; }
.login-assurance span { display:grid; place-items:center; min-height:34px; padding:0 8px; border:1px solid #dde3f3; border-radius:9px; color:#4a526b; background:#fff; font-size:11px; font-weight:800; }
.login-footer { color:#8b92a6; }

.login-page .login-visual { isolation:isolate; position:relative; padding:46px clamp(46px,5vw,90px); overflow:hidden; background:linear-gradient(135deg,#10142b 0%,#171a3a 52%,#0c3341 100%); }
.login-page .login-visual::before { content:""; position:absolute; inset:0; z-index:-2; background:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); background-size:42px 42px; mask-image:linear-gradient(90deg,transparent,black 16%,black 88%,transparent); }
.login-page .login-visual::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(115deg,transparent 0 28%,rgba(112,101,255,.2) 29%,transparent 44%),linear-gradient(155deg,transparent 0 55%,rgba(41,196,220,.22) 56%,transparent 74%); }
.visual-glow { position:absolute; right:8%; top:18%; z-index:-1; width:360px; height:360px; border:1px solid rgba(150,161,255,.34); transform:rotate(23deg); background:linear-gradient(135deg,rgba(98,87,232,.18),rgba(37,166,195,.08)); box-shadow:0 0 80px rgba(98,87,232,.18); }
.visual-top { position:relative; z-index:1; }
.visual-top,.visual-foot { color:#aeb8d8; }
.visual-top div { color:#eef4ff; }
.live-dot { background:#4dd7de; box-shadow:0 0 0 4px rgba(77,215,222,.14),0 0 20px rgba(77,215,222,.55); }
.login-page .visual-copy { position:relative; z-index:1; margin:54px 0 28px; }
.login-page .visual-copy .eyebrow { color:#77e3f2; }
.login-page .visual-copy h2 { max-width:820px; color:#fff; font-size:clamp(48px,5.5vw,78px); line-height:1.04; text-shadow:0 18px 42px rgba(0,0,0,.28); }
.login-page .visual-copy p { max-width:660px; color:#c1c9e7; font-size:17px; }
.visual-stage { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1fr) 190px; gap:14px; align-items:stretch; width:min(920px,100%); }
.visual-score-card { position:absolute; top:-42px; right:206px; z-index:3; min-width:180px; padding:14px 16px; border:1px solid rgba(194,204,255,.26); border-radius:12px; color:#fff; background:rgba(18,24,54,.78); box-shadow:0 20px 52px rgba(3,7,28,.34); backdrop-filter:blur(14px); }
.visual-score-card span,.visual-score-card small { display:block; color:#aeb9dd; font-size:10px; }
.visual-score-card strong { display:block; margin:4px 0; color:#83f0ff; font-size:38px; line-height:1; }
.visual-capability-grid { display:grid; gap:10px; }
.visual-capability-grid article { min-height:108px; padding:15px; border:1px solid rgba(183,194,255,.22); border-radius:12px; color:#eaf0ff; background:rgba(255,255,255,.075); box-shadow:inset 0 1px rgba(255,255,255,.08); backdrop-filter:blur(10px); }
.visual-capability-grid b,.visual-capability-grid span { display:block; }
.visual-capability-grid b { font-size:14px; }
.visual-capability-grid span { margin-top:9px; color:#aeb9dd; font-size:11px; line-height:1.55; }
.workspace-preview { position:relative; z-index:1; width:100%; min-height:376px; border:1px solid rgba(178,188,255,.22); border-radius:16px; background:rgba(247,249,255,.95); box-shadow:0 34px 90px rgba(4,8,35,.48),0 0 46px rgba(62,204,226,.12); backdrop-filter:blur(14px); }
.workspace-preview aside { background:#12162f; }
.preview-logo { border-radius:9px; background:linear-gradient(135deg,#6d63f3,#26a8c4); }
.workspace-preview aside i { background:#454d78; }
.workspace-preview aside i.active { background:#8d84ff; box-shadow:0 0 16px rgba(141,132,255,.68); }
.preview-main { padding:27px; }
.preview-main header b { color:#15192e; font-size:20px; }
.preview-main header > span { color:#0d728e; background:#def7fb; }
.preview-metrics article { border-color:#e3e7f4; border-radius:10px; box-shadow:0 10px 28px rgba(36,45,104,.06); }
.preview-metrics b { color:#15192e; }
.preview-flow { margin:20px 0; }
.preview-flow span { border:1px solid #d9dcff; border-radius:999px; color:#3f37aa; background:#f0efff; }
.preview-list article { border-color:#e3e7f4; border-radius:10px; }
.preview-command { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:12px; padding:13px 14px; border-radius:10px; color:#eef8ff; background:linear-gradient(135deg,#242c68,#12819c); box-shadow:0 14px 28px rgba(28,58,127,.18); }
.preview-command b,.preview-command span { display:block; }
.preview-command b { font-size:12px; }
.preview-command span { color:#d4f4fa; font-size:10px; }
.visual-foot { position:relative; z-index:1; gap:10px; }
.visual-foot span { padding:7px 11px; border:1px solid rgba(171,183,235,.22); border-radius:999px; color:#dfe7ff; background:rgba(255,255,255,.06); }

@media(max-width:1180px){.visual-stage{grid-template-columns:1fr}.visual-capability-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.visual-score-card{right:18px}}
@media(max-width:1050px){.login-page .login-shell{grid-template-columns:minmax(420px,.92fr) minmax(520px,1.08fr)}.login-page h1{font-size:36px}.login-page .visual-copy h2{font-size:48px}.workspace-preview{min-height:340px}}
@media(max-width:820px){.login-page .login-shell{display:block;background:#fff}.login-page .login-panel{padding:32px 22px}.login-page .login-brand{margin-bottom:44px}.login-page h1{font-size:32px}.login-assurance{grid-template-columns:1fr}.login-page .login-visual{display:none}}

/* Dedicated Admin Console */
.admin-body { min-height:100vh; color:#15192e; background:#eef2f8; }
.admin-body .admin-shell { grid-template-columns:260px minmax(0,1fr); }
.admin-body .admin-sidebar { padding:22px 16px; background:#101426; border-right:1px solid #252b4a; box-shadow:16px 0 40px rgba(14,18,44,.12); }
.admin-brand { align-items:center; padding:4px 4px 24px; border-bottom:1px solid #252b4a; margin-bottom:18px; }
.admin-brand .brand-mark { width:42px; height:42px; border-radius:10px; background:linear-gradient(135deg,#6257e8,#1aa4c7); box-shadow:0 12px 28px rgba(98,87,232,.28); }
.admin-brand b { color:#fff; }
.admin-brand small { color:#8f97ba; }
.admin-nav { gap:7px; }
.admin-nav span { margin:14px 10px 5px; color:#737b9f; font-size:10px; font-weight:900; letter-spacing:.08em; }
.admin-nav button { min-height:42px; border-radius:8px; color:#aeb6d8; font-weight:700; }
.admin-nav button.active,.admin-nav button:hover { color:#fff; background:#252b52; box-shadow:inset 3px 0 #7e75ff; }
.admin-sidebar-card { margin-top:22px; padding:14px; border:1px solid #2b3156; border-radius:10px; color:#b7bfdf; background:#171c35; }
.admin-sidebar-card b,.admin-sidebar-card span,.admin-sidebar-card small { display:block; }
.admin-sidebar-card b { color:#fff; font-size:13px; }
.admin-sidebar-card span { margin:8px 0 5px; color:#79e3f0; font-size:12px; font-weight:800; }
.admin-sidebar-card small { color:#8790b3; line-height:1.5; }
.admin-body .admin-main { padding:30px clamp(24px,3vw,42px) 42px; background:#eef2f8; }
.admin-topbar { min-height:58px; padding-bottom:18px; border-bottom:1px solid #d9dfec; }
.admin-topbar h1 { margin:3px 0 4px; color:#12172b; font-size:30px; }
.admin-topbar span { color:#69728a; font-size:12px; }
.admin-eyebrow { margin:0; color:#4d46c6; font-size:11px; font-weight:900; letter-spacing:.08em; }
.admin-console-hero { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(340px,.65fr); gap:22px; margin-bottom:18px; padding:26px; border:1px solid #252b4a; border-radius:14px; color:#ecf3ff; background:radial-gradient(circle at 16% 12%,rgba(98,87,232,.34),transparent 28%),linear-gradient(135deg,#12162f,#1b2250 56%,#0b4352); box-shadow:0 20px 48px rgba(23,31,78,.2); }
.admin-console-hero h2 { max-width:760px; margin:5px 0 10px; color:#fff; font-size:34px; line-height:1.18; }
.admin-console-hero span { color:#c1cbe8; line-height:1.7; }
.admin-console-hero .admin-eyebrow { color:#77e3f2; }
.admin-health-grid { display:grid; grid-template-columns:1fr; gap:10px; }
.admin-health-grid article { padding:15px; border:1px solid rgba(185,197,255,.2); border-radius:10px; background:rgba(255,255,255,.08); backdrop-filter:blur(8px); }
.admin-health-grid small,.admin-health-grid b { display:block; }
.admin-health-grid small { color:#adb8d9; font-size:10px; }
.admin-health-grid b { margin-top:6px; color:#fff; font-size:18px; }
.admin-body .metric-grid { gap:14px; }
.admin-body .metric,.admin-body .panel { border-color:#dbe2ef; border-radius:12px; box-shadow:0 10px 30px rgba(28,39,88,.06); }
.admin-body .metric { min-height:118px; padding:19px; background:linear-gradient(180deg,#fff,#f8faff); }
.admin-body .metric strong { color:#12172b; font-size:30px; }
.admin-body .metric:nth-child(1) { box-shadow:inset 0 3px #6257e8,0 10px 30px rgba(28,39,88,.06); }
.admin-body .metric:nth-child(2) { box-shadow:inset 0 3px #238fb4,0 10px 30px rgba(28,39,88,.06); }
.admin-body .metric:nth-child(3) { box-shadow:inset 0 3px #34a9c0,0 10px 30px rgba(28,39,88,.06); }
.admin-body .metric:nth-child(4) { box-shadow:inset 0 3px #8178ee,0 10px 30px rgba(28,39,88,.06); }
.admin-quick-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:16px 0 18px; }
.admin-quick-grid button { min-height:106px; padding:17px; border:1px solid #dbe2ef; border-radius:12px; text-align:left; background:#fff; box-shadow:0 10px 28px rgba(28,39,88,.05); transition:.18s ease; }
.admin-quick-grid button:hover { transform:translateY(-2px); border-color:#aeb6f1; box-shadow:0 16px 34px rgba(60,70,150,.12); }
.admin-quick-grid b,.admin-quick-grid span { display:block; }
.admin-quick-grid b { margin-bottom:9px; color:#12172b; font-size:15px; }
.admin-quick-grid span { color:#69728a; font-size:12px; line-height:1.6; }
.admin-section-head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:16px; padding:18px 20px; border:1px solid #dbe2ef; border-radius:12px; background:#fff; box-shadow:0 10px 28px rgba(28,39,88,.05); }
.admin-section-head h2 { margin:3px 0 4px; font-size:22px; }
.admin-section-head span { color:#69728a; font-size:12px; }
.admin-table-panel { overflow:hidden; padding:0; }
.admin-table-panel .panel-head { padding:18px 20px 0; }
.admin-body .table-wrap { border-top:1px solid #e2e7f2; }
.admin-body table th { color:#69728a; background:#f7f9fd; font-size:11px; }
.admin-body table td { border-bottom-color:#edf0f6; }
.admin-body .status { color:#0d728e; background:#def7fb; }
.admin-body .primary { border-radius:9px; background:#5c53df; box-shadow:0 9px 20px rgba(76,65,199,.2); }
.admin-body .secondary { border-color:#d4dbea; background:#fff; }
.admin-body .secondary:hover { color:#4036bd; border-color:#aeb4ea; background:#f5f5ff; }
.admin-login-page .login-visual { background:radial-gradient(circle at 18% 12%,rgba(98,87,232,.4),transparent 30%),linear-gradient(135deg,#101426,#1b2250 58%,#103743); }
@media(max-width:1050px){.admin-console-hero{grid-template-columns:1fr}.admin-health-grid{grid-template-columns:repeat(3,1fr)}.admin-quick-grid{grid-template-columns:1fr 1fr}}
@media(max-width:800px){.admin-body .admin-shell{display:block}.admin-body .admin-sidebar{position:static;height:auto}.admin-console-hero,.admin-section-head{padding:18px}.admin-console-hero h2{font-size:26px}.admin-health-grid,.admin-quick-grid{grid-template-columns:1fr}.admin-body .metric-grid{grid-template-columns:1fr 1fr}}

/* Refined one-screen customer login */
.login-page { min-height:100vh; overflow:hidden; background:#0f1328; }
.login-page .login-shell { min-height:100vh; max-height:100vh; grid-template-columns:minmax(430px,.42fr) minmax(0,.58fr); background:#0f1328; }
.login-page .login-panel { min-height:100vh; display:grid; place-items:center; padding:34px clamp(36px,5vw,76px); background:linear-gradient(180deg,#fff,#f8f9ff); }
.login-page .login-card { width:min(430px,100%); }
.login-page .login-brand { margin-bottom:34px; }
.login-page .brand-mark { width:42px; height:42px; border-radius:10px; }
.login-page .login-heading { margin-bottom:20px; }
.login-page h1 { max-width:390px; font-size:36px; line-height:1.12; }
.login-page .subtitle { max-width:410px; font-size:13px; line-height:1.65; }
.login-form { gap:13px; }
.login-form input { min-height:48px; }
.password-field button { top:6px; height:36px; }
.login-submit { min-height:50px; border-radius:10px; }
.register-entry { margin-top:12px; }
.login-help { margin-top:14px; padding:10px 12px; font-size:11px; }
.login-assurance { margin-top:12px; }
.login-assurance span { min-height:30px; font-size:10px; }
.login-footer { margin-top:16px; font-size:10px; }
.login-page .login-visual { min-height:100vh; display:grid; grid-template-rows:auto minmax(0,1fr) auto; gap:18px; padding:34px clamp(34px,4.5vw,70px); background:linear-gradient(135deg,#0f1328 0%,#171b3a 52%,#0d3442 100%); }
.login-page .login-visual::after { background:linear-gradient(125deg,transparent 0 25%,rgba(111,99,244,.18) 26%,transparent 43%),linear-gradient(155deg,transparent 0 58%,rgba(42,190,215,.2) 59%,transparent 76%); }
.visual-glow { right:10%; top:12%; width:300px; height:300px; border-radius:24px; opacity:.72; }
.visual-top { min-height:28px; }
.login-page .visual-copy { align-self:end; margin:0 0 8px; }
.login-page .visual-copy h2 { max-width:650px; margin-bottom:14px; font-size:clamp(40px,4.8vw,66px); line-height:1.04; }
.login-page .visual-copy p { max-width:560px; font-size:15px; line-height:1.75; }
.visual-stage { align-self:start; width:min(680px,100%); grid-template-columns:1fr; }
.visual-score-card,.visual-capability-grid { display:none; }
.workspace-preview { min-height:292px; border-radius:14px; box-shadow:0 28px 76px rgba(2,6,28,.42),0 0 34px rgba(62,204,226,.1); }
.workspace-preview aside { width:52px; gap:16px; }
.preview-main { padding:22px; }
.preview-main header b { font-size:18px; }
.preview-metrics { gap:8px; }
.preview-metrics article { min-height:70px; padding:12px; }
.preview-flow { margin:14px 0; gap:7px; }
.preview-flow span { padding:7px 10px; font-size:10px; }
.preview-list { gap:8px; }
.preview-list article { min-height:55px; padding:10px; }
.visual-foot { justify-content:flex-start; flex-wrap:wrap; }
.visual-foot span { padding:6px 10px; font-size:10px; }
@media(max-height:760px) and (min-width:821px){
  .login-page .login-panel { padding-top:24px; padding-bottom:24px; }
  .login-page .login-brand { margin-bottom:22px; }
  .login-page h1 { font-size:32px; }
  .login-page .subtitle { font-size:12px; }
  .login-help,.login-footer { display:none; }
  .login-page .visual-copy h2 { font-size:44px; }
  .workspace-preview { min-height:250px; }
}