:root { color-scheme: dark; --bg:#08101d; --panel:#101a2b; --panel2:#0d1625; --text:#f4f7fb; --muted:#93a4bb; --line:#233149; --accent:#4c8dff; --accent2:#2c6fe8; --danger:#ff7272; --ok:#5dd39e; }
* { box-sizing:border-box; }
html,body { margin:0; min-height:100%; background:radial-gradient(circle at top,#14243e 0,#08101d 44%,#060b13 100%); color:var(--text); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
body { min-height:100vh; }
.shell { width:min(100%,680px); margin:0 auto; padding:24px 18px calc(32px + env(safe-area-inset-bottom)); }
.center { min-height:100vh; display:grid; place-items:center; }
.card { background:linear-gradient(180deg,rgba(18,30,49,.96),rgba(12,22,37,.96)); border:1px solid var(--line); border-radius:22px; box-shadow:0 28px 80px rgba(0,0,0,.34); }
.auth-card { width:100%; padding:32px 24px; text-align:center; }
.logo-mark { width:58px; height:58px; border-radius:17px; display:grid; place-items:center; margin:0 auto 18px; background:linear-gradient(145deg,var(--accent),#734dff); font-weight:800; letter-spacing:-1px; }
.eyebrow { margin:0 0 8px; font-size:12px; font-weight:800; letter-spacing:.14em; color:#86aaf5; }
h1 { margin:0 0 10px; font-size:32px; letter-spacing:-.04em; }
h2 { margin:0 0 10px; font-size:21px; }
.muted { color:var(--muted); line-height:1.55; }
.small { font-size:11px; letter-spacing:.12em; font-weight:800; }
button,.input { font:inherit; }
button { cursor:pointer; }
button:disabled { opacity:.55; cursor:wait; }
.primary { width:100%; border:0; color:white; background:linear-gradient(180deg,var(--accent),var(--accent2)); border-radius:16px; font-weight:800; box-shadow:0 12px 32px rgba(59,119,238,.28); }
.big { min-height:58px; padding:15px 20px; margin-top:22px; font-size:17px; }
.ghost { border:1px solid var(--line); background:var(--panel2); color:var(--text); border-radius:12px; padding:10px 13px; }
.status { min-height:24px; margin:16px 0 0; font-size:14px; }
.status.error { color:var(--danger); }
.field-label { display:block; text-align:left; color:var(--muted); font-size:13px; margin:22px 0 8px; }
.input { width:100%; padding:15px 16px; color:var(--text); background:#091322; border:1px solid var(--line); border-radius:14px; outline:none; }
.input:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(76,141,255,.13); }
.app-shell { padding-top:max(24px,env(safe-area-inset-top)); }
.app-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.app-header h1 { font-size:27px; margin:0; }
.user-card,.disabled-panel { padding:20px; margin-bottom:16px; }
.permission-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin-top:18px; }
.permission { padding:11px 12px; border:1px solid var(--line); border-radius:12px; background:#0a1422; font-size:13px; }
.permission.yes { color:var(--ok); }
.permission.no { color:#73849b; }
@media (max-width:500px) { .permission-grid{grid-template-columns:1fr}.auth-card{padding:28px 20px}.shell{padding-left:14px;padding-right:14px} }

/* 0.2.0-dev read-only customer utility */
.tiny{font-size:10px;letter-spacing:.11em;font-weight:800}.small-label{display:block;font-size:11px;letter-spacing:.11em;font-weight:800;margin-bottom:9px}.user-strip{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;margin-bottom:14px}.user-strip div{display:flex;flex-direction:column;gap:3px}.user-strip strong{font-size:14px}.search-panel,.customer-panel{padding:18px;margin-bottom:14px}.search-box{position:relative}.search-box .input{padding-right:44px}.search-clear{position:absolute;right:7px;top:7px;width:36px;height:36px;border:0;border-radius:10px;background:transparent;color:var(--muted);font-size:25px;line-height:1}.search-status{font-size:12px;margin:10px 2px 0}.search-results{margin-top:10px;border-top:1px solid var(--line)}.customer-result{width:100%;display:flex;align-items:center;justify-content:space-between;gap:14px;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--text);text-align:left;padding:14px 4px}.customer-result span{min-width:0;display:flex;flex-direction:column;gap:4px}.customer-result strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.customer-result small{color:var(--muted);font-size:11px}.customer-result b{font-size:14px;white-space:nowrap}.empty-result{padding:18px 4px;color:var(--muted);font-size:13px}.customer-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.customer-head h2{font-size:24px;margin:4px 0}.customer-account{font-size:12px;margin:0}.compact{padding:7px 10px;font-size:12px}.balance-card{margin-top:20px;padding:22px 18px;border:1px solid rgba(76,141,255,.35);border-radius:18px;background:linear-gradient(145deg,rgba(76,141,255,.13),rgba(44,111,232,.035));text-align:center}.balance-card span{display:block;color:#9fb9ee;font-size:10px;font-weight:900;letter-spacing:.13em}.balance-card strong{display:block;font-size:39px;letter-spacing:-.045em;margin:6px 0 3px}.balance-card small{color:var(--muted);font-size:11px}.customer-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}.customer-stats>div{padding:14px;border:1px solid var(--line);border-radius:14px;background:#0a1422}.customer-stats span{display:block;color:var(--muted);font-size:10px;line-height:1.35;margin-bottom:6px}.customer-stats strong{font-size:17px}.credit-detail{margin-top:10px;padding:4px 13px;border:1px solid var(--line);border-radius:13px;background:#0a1422}.credit-detail>div{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);font-size:11px}.credit-detail>div:last-child{border-bottom:0}.credit-detail span{color:var(--muted);text-transform:capitalize}.action-stack{display:grid;gap:9px;margin-top:18px}.action-button{min-height:54px;border-radius:15px;font-weight:900;font-size:15px}.action-button:disabled{cursor:not-allowed;opacity:.43}.secondary-action{border:1px solid var(--line);background:#14223a;color:var(--text)}.read-only-note{margin:10px 4px 0;color:var(--muted);font-size:10px;line-height:1.45;text-align:center}.access-details{padding:0 16px;margin-bottom:18px}.access-details summary{cursor:pointer;padding:15px 0;color:var(--muted);font-size:12px}.access-details .permission-grid{padding:0 0 16px;margin-top:0}@media(max-width:500px){.user-strip{align-items:flex-start}.customer-stats{grid-template-columns:1fr 1fr}.balance-card strong{font-size:36px}}