:root { --ink:#10251f; --muted:#5e6d66; --paper:#f6f0e4; --card:#fffaf0; --line:#d8cdb9; --orange:#f06b36; --green:#177c5b; --red:#a83c31; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:inherit; }
.portal-nav { min-height:58px; padding:0 24px; display:flex; align-items:center; gap:28px; color:#eef7f2; background:var(--ink); border-bottom:3px solid var(--orange); position:relative; z-index:1000; }
.portal-nav__brand { font-size:.78rem; font-weight:900; letter-spacing:.14em; text-decoration:none; white-space:nowrap; }
.portal-nav nav { display:flex; gap:8px; flex:1; }
.portal-nav nav a { padding:9px 11px; color:#d3e1da; border-radius:6px; font-size:.86rem; text-decoration:none; }
.portal-nav nav a:hover { background:#ffffff14; color:white; }
.portal-nav__account { display:flex; align-items:center; gap:12px; font-size:.8rem; }
.portal-nav__account form { margin:0; }
.portal-nav__account button { border:1px solid #ffffff45; border-radius:5px; color:white; background:transparent; padding:7px 10px; cursor:pointer; }
.portal-main { width:min(1180px,calc(100% - 40px)); margin:0 auto; padding:58px 0 80px; }
.narrow-main { width:min(820px,calc(100% - 40px)); }
.page-heading { margin-bottom:32px; }
.page-heading h1 { margin:.25rem 0 .6rem; font-family:Georgia,serif; font-size:clamp(2.2rem,6vw,4.5rem); line-height:.95; font-weight:500; }
.page-heading p:last-child { margin:0; color:var(--muted); font-size:1.08rem; }
.page-heading--row { display:flex; justify-content:space-between; align-items:end; gap:24px; }
.eyebrow { margin:0; color:var(--orange); font-size:.72rem; font-weight:900; letter-spacing:.17em; }
.tool-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.tool-card { min-height:330px; display:flex; flex-direction:column; justify-content:space-between; padding:24px; border:1px solid var(--line); border-radius:12px; color:var(--ink); background:var(--card); text-decoration:none; box-shadow:0 8px 24px #2b382e0b; transition:transform .15s,box-shadow .15s; }
.tool-card:hover { transform:translateY(-3px); box-shadow:0 14px 35px #2b382e1c; }
.tool-card__number { align-self:flex-end; color:#a99e8d; font:700 1rem/1 ui-monospace,monospace; }
.tool-card p { margin:0 0 10px; color:var(--orange); font-size:.7rem; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }
.tool-card h2 { margin:0 0 12px; font:500 2rem/1 Georgia,serif; }
.tool-card div span { color:var(--muted); line-height:1.5; }
.tool-card b { font-size:.83rem; letter-spacing:.08em; text-transform:uppercase; }
.tool-card--telemetry { border-top:6px solid #d95536; }.tool-card--timer { border-top:6px solid #177c5b; }.tool-card--display { border-top:6px solid #2d6f99; }
.notice { margin-top:24px; padding:15px 18px; border-left:4px solid #ca8f28; background:#fff7d8; }
.login-page { min-height:100vh; background:linear-gradient(120deg,#10251f 0 42%,#dfe8df 42% 100%); }
.login-shell { min-height:100vh; padding:30px; display:grid; place-items:center; }
.login-card { width:min(480px,100%); padding:44px; border-radius:14px; background:var(--card); box-shadow:0 28px 80px #0005; }
.login-card h1 { margin:10px 0 16px; font:500 3.1rem/.95 Georgia,serif; }.login-card .intro { color:var(--muted); line-height:1.55; }
.stack-form,.admin-form { display:grid; gap:18px; }.stack-form label,.admin-form label { display:grid; gap:7px; font-size:.82rem; font-weight:800; }
input,textarea { width:100%; border:1px solid #bdb3a3; border-radius:6px; padding:12px 13px; color:var(--ink); background:white; font:inherit; }.admin-form input:focus,.stack-form input:focus,textarea:focus { outline:3px solid #f06b3630; border-color:var(--orange); }
.primary-button { border:0; border-radius:6px; padding:13px 18px; color:white; background:var(--orange); font:800 .82rem/1 inherit; letter-spacing:.06em; text-transform:uppercase; cursor:pointer; text-decoration:none; text-align:center; }.inline-button { display:inline-block; }
.help-text { margin:20px 0 0; color:var(--muted); font-size:.8rem; line-height:1.45; }
.flash-stack { position:fixed; right:18px; top:76px; z-index:2000; display:grid; gap:8px; }.flash { padding:12px 16px; border-radius:7px; color:white; background:#39483f; box-shadow:0 6px 25px #0003; }.flash--error { background:var(--red); }.flash--success { background:var(--green); }
.admin-table-wrap { overflow:auto; border:1px solid var(--line); border-radius:9px; background:var(--card); }.admin-table { width:100%; border-collapse:collapse; }.admin-table th,.admin-table td { padding:14px 16px; border-bottom:1px solid var(--line); text-align:left; }.admin-table th { color:var(--muted); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; }.admin-table small { display:block; color:var(--muted); margin-top:3px; }.admin-table a { font-weight:800; color:var(--green); }
.state-chip { padding:4px 8px; border-radius:99px; font-size:.72rem; font-weight:800; }.state-chip--on { color:#09593f; background:#d5eee4; }.state-chip--off { color:#7e332c; background:#f2d9d5; }
.admin-form fieldset { margin:0; padding:22px; border:1px solid var(--line); border-radius:9px; background:var(--card); }.admin-form legend { padding:0 8px; font:600 1.2rem Georgia,serif; }.admin-form small { color:var(--muted); font-weight:400; }.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }.check-row { display:flex!important; grid-template-columns:auto 1fr!important; align-items:center; margin-top:16px; }.check-row input { width:auto; }.danger-check { color:var(--red); }.form-actions { display:flex; justify-content:flex-end; align-items:center; gap:18px; }
.tool-page .portal-nav { position:relative; }.tool-page .titlebar { top:0; }.tool-config-warning { padding:10px 18px; color:#6d3b00; background:#fff0bd; border-bottom:1px solid #d8b95b; text-align:center; font-weight:700; }
@media (max-width:800px) { .portal-nav { padding:10px 14px; flex-wrap:wrap; gap:8px 14px; }.portal-nav nav { order:3; width:100%; overflow:auto; }.portal-nav__account { margin-left:auto; }.tool-grid { grid-template-columns:1fr; }.tool-card { min-height:230px; }.form-grid { grid-template-columns:1fr; }.page-heading--row { align-items:start; flex-direction:column; }.login-card { padding:30px 24px; } }