/* CENTROBOX product tokens and shared components. */
:root{color-scheme:light;--bg:#f3f6fa;--side:#101e32;--panel:#fff;--panel2:#f8fafc;--text:#192b43;--muted:#65778e;--green:#087c58;--blue:#087eb5;--line:#dfe7ef;--radius:16px;--shadow:0 5px 22px #152e4710}
body{font-family:'Segoe UI',Inter,system-ui,sans-serif;line-height:1.5;background:var(--bg);color:var(--text)}
body,main,section,form,article,header{min-width:0}button,input,select,textarea{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}:focus-visible{outline:3px solid #20a9de;outline-offset:3px}
aside{width:244px;padding:30px 20px;background:var(--side);border:0;color:#fff;z-index:40}.brand{font-size:16px;letter-spacing:.045em;justify-content:flex-start}.brand img{width:36px!important;height:36px!important;flex-basis:36px!important}.brand .app-version{color:#7bb6cf}.brand strong{color:#fff}aside nav{margin-top:40px;gap:6px}aside nav a,aside .logout{color:#aebed0;font-size:14px;padding:13px 15px}aside nav a:hover,aside nav a.active{background:#203951;color:#7dd8f7;box-shadow:inset 3px 0 #31b8df}aside .logout:hover{color:white}
.dashboard{margin-left:244px;padding:36px 40px;max-width:1800px}h1{font-size:clamp(23px,2.3vw,32px);letter-spacing:-.035em;font-weight:700}h2{font-size:20px;letter-spacing:-.025em}.eyebrow{color:var(--blue);font-size:10px;letter-spacing:.13em}.shop-current,.sync-note,.sync-explainer,.admin-note{color:var(--muted)}header{margin-bottom:28px}.header-status{font-size:12px}.live{background:#e6f4ed;color:#087c58;border-radius:30px;padding:8px 12px}.live.disconnected{background:#fcebed}
.cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0}.metric{position:relative;padding:23px 24px;box-shadow:var(--shadow);border:1px solid var(--line);border-radius:var(--radius)}.metric span{font-size:12px;font-weight:600;margin-bottom:10px}.metric strong{font-size:28px;letter-spacing:-.035em;font-variant-numeric:tabular-nums}.metric.primary{background:#087eb5;color:white;border:1px solid #087eb5}.metric.primary span{color:#d4f0ff}.metric::after{content:'';position:absolute;right:22px;top:24px;width:7px;height:7px;border-radius:50%;background:#44b7d0}.health-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:20px 0}.health-cards .metric{padding:17px}.health-cards strong{font-size:18px}.health-cards .metric::after{display:none}
.panel{padding:26px;border-radius:var(--radius);box-shadow:var(--shadow);background:var(--panel)}.connection-summary{background:#fff;border-left:4px solid #1299c5}.connection-summary small{color:var(--muted)}.pc-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}.pc-card{background:var(--panel);border:1px solid var(--line);padding:20px;border-radius:14px;align-items:flex-start;transition:box-shadow .15s,border-color .15s}.pc-card:hover{box-shadow:var(--shadow);border-color:#98bfd4}.pc-card strong{font-size:18px}.computer-card{display:block}.computer-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:18px}.computer-head h3{margin:0;font-size:17px}.status-badge{display:inline-flex!important;border-radius:20px;padding:4px 9px;font-size:10px!important;font-weight:700;letter-spacing:.04em;background:#fcebed;color:#bf3448!important}.status-badge.online{background:#e2f5ed;color:#087c58!important}.computer-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;color:var(--muted);font-size:12px}.computer-fields b{display:block;color:var(--text);font-weight:600;overflow-wrap:anywhere}.computer-actions{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:14px;margin-top:18px;gap:8px}.pc-countdown{color:#087eb5!important}.computer-actions button{font-size:12px}
button,.sync-button,.admin-link{border-radius:9px;min-height:42px;padding:9px 14px;border:1px solid var(--line);background:#edf5fa;color:#126a93;font-weight:600;text-decoration:none}.sync-button:hover,button:hover{background:#e2f0f8}.sync-button.connected{background:#e7f5ef;color:#087c58;border-color:#bddfce}.sync-button.disconnected{background:#fff0f1;color:#b52c41;border-color:#f1c9ce}.sync-close{background:#edf2f7;color:var(--text);min-width:42px;min-height:42px}.shop-current button,.shop-options button{background:#eff7fb;color:var(--text);border-color:var(--line)}.shop-options small{color:var(--muted)}
input:not([type=checkbox]):not([type=radio]),select,textarea,.login-card input,.activity-controls select{max-width:100%;min-height:44px;background:#fff;color:var(--text);border:1px solid #cbd7e3;border-radius:9px;padding:10px 12px}.login-page{background:#edf3f8}.login-card{box-shadow:0 18px 70px #19345114;background:#fff;border-radius:20px}.login-card button{background:var(--blue)}.login-brand-image{width:48px;height:48px}.error{background:#fdebed;color:#b52c41}.warning{background:#fff4d7;color:#8a5b06}
table{font-variant-numeric:tabular-nums}th{background:#f5f8fb;font-size:10px;padding:13px 16px;color:var(--muted);letter-spacing:.05em}td{padding:16px;font-size:13px}tbody tr:hover{background:#f7fbfd}.table-wrap{border:1px solid var(--line);border-radius:12px;max-width:100%;overscroll-behavior:contain}.amount,.coin-log-value{color:#087c58}.activity-controls label,.activity-controls>span{color:var(--muted)}
dialog,.sync-dialog{background:#fff;color:var(--text);border:1px solid var(--line);border-radius:18px;padding:28px;box-shadow:0 28px 100px #142c4b40;width:min(620px,calc(100vw - 32px));max-height:calc(100dvh - 40px);overflow:auto}dialog::backdrop{background:#0c1c32a8;backdrop-filter:blur(3px)}.sync-machine{background:#f5f8fb}.sync-machine small{color:var(--muted)}.metrics-tile,.metrics-network,.metrics-notice{background:#f5f8fb;border-color:var(--line)}.metrics-label,.metrics-detail,.metrics-footer,.metrics-caption,.metrics-traffic,.metrics-notice{color:var(--muted)}.server-metrics .metrics-value,.metrics-adapter-name{color:var(--text)}.server-metrics .metrics-link-speed{color:#087c58}.metrics-meter{background:#e0eaf1}.metrics-meter>span{background:#169fc6}.metrics-adapter,.server-metrics{border-color:var(--line)}
.admin-section,.license-card,.account-card,.account-modal{background:#fff;color:var(--text);border-color:var(--line)}.admin-grid label,.admin-inline label,.account-search label{color:var(--muted)}.account-state.online,.account-modal-status.online{background:#e2f5ed;color:#087c58}.account-state.offline,.account-modal-status.offline{background:#fcebed;color:#b52c41}.account-state.unverified{background:#edf2f7;color:#65778e}.account-refresh{background:#e2f5ed;color:#087c58!important}.license-stats span{background:#fff;border-color:var(--line);color:var(--text)}.license-card h3,.license-card small{color:var(--text)}
.mobile-bar,.nav-shade{display:none}.cb-toast{position:fixed;bottom:24px;right:24px;max-width:calc(100vw - 32px);padding:14px 20px;border-radius:12px;background:#142d43;color:#fff;box-shadow:var(--shadow);z-index:100}
@media(max-width:1100px){.dashboard{padding:28px 24px}.health-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:800px){.mobile-bar{display:flex;position:sticky;top:0;z-index:30;align-items:center;justify-content:space-between;background:#101e32;color:white;padding:10px 16px}.mobile-bar button{background:#203951;color:white;border:0}.dashboard{margin-left:0;padding:24px 16px}aside{position:fixed!important;width:244px!important;height:100dvh!important;transform:translateX(-100%);transition:transform .18s;inset:0 auto 0 0!important;padding:28px 20px!important}body.nav-open aside{transform:translateX(0)}body.nav-open .nav-shade{display:block;position:fixed;inset:0;background:#071b3599;z-index:35}body aside nav,body:not(.admin-mode) aside nav{display:grid!important;overflow:visible;margin-top:35px}aside .brand{justify-content:flex-start}body aside .logout{position:static!important;margin-top:auto}header,.panel-head{flex-wrap:wrap}.panel{padding:20px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.header-status{justify-content:flex-start}.admin-grid{grid-template-columns:1fr!important}}
@media(max-width:480px){.cards,.health-cards{gap:10px}.metric{padding:17px 14px}.metric strong{font-size:22px}.metric::after{display:none}.health-cards strong{font-size:15px}.pc-grid{grid-template-columns:minmax(0,1fr)}.panel{padding:16px}.dashboard{padding:20px 12px}.activity-controls{width:100%}.activity-controls label{flex-wrap:wrap}.sync-dialog,dialog{padding:20px;width:calc(100vw - 24px)}.login-card{padding:25px 20px}.admin-inline{flex-direction:column;align-items:stretch}.metrics-grid{grid-template-columns:1fr}input,select,textarea{font-size:16px}}
.account-dialog{background:#fff;color:var(--text);border-color:var(--line)}.account-facts>div{background:#f0f5f9}.account-facts span,.account-subtitle,.account-help,.account-edit-form label,.account-card-head small{color:var(--muted)}.account-open,.account-edit-form button{background:var(--blue);color:white}.account-edit-form input,.account-edit-form select{background:white;color:var(--text);border-color:var(--line)}.account-dialog-head button{background:#edf2f7;color:var(--text)}.account-card{background:#fff}.account-state.unknown{background:#edf2f7;color:var(--muted)}
/* Content sizing: keep long machine IDs and shop names within their cards. */
.dashboard{width:calc(100% - 244px)}.dashboard>header>div,.panel-head>div,.connection-summary>div,.header-status,.computer-head>*{min-width:0}.metric strong,.shop-current,.connection-summary p,.sync-machine b,.sync-machine strong,.computer-head h3{overflow-wrap:anywhere}.metric strong{line-height:1.3}.health-cards .metric{min-height:104px}.panel-head{align-items:flex-start}.sync-machine>div{flex-wrap:wrap}.sync-machine-list{max-height:none;overflow:visible}.computer-actions button{flex:1}.admin-inline,.account-form-actions{flex-wrap:wrap}.admin-inline>*{min-width:0;max-width:100%}dialog form,dialog input,dialog select{min-width:0}.license-grid,.account-grid{min-width:0}.license-card,.account-card{overflow-wrap:anywhere}.account-facts>div{min-width:0}.account-form-actions button{white-space:normal}.brand strong{min-width:0}.activity-controls select{max-width:100%}
@media(max-width:800px){.dashboard{width:100%}body .dashboard{padding:24px 16px}body aside .logout{margin-top:12px}.header-status{width:100%}.connection-summary{align-items:stretch}.connection-summary>.sync-button{align-self:flex-start}}
@media(max-width:480px){body .dashboard{padding:20px 12px}.panel-head>span{font-size:11px}.account-edit-form label{min-width:0}.account-form-actions{flex-direction:column}.account-form-actions button{width:100%}.shop-options button{white-space:normal}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}