:root{--ink:#12323c;--muted:#597079;--paper:#f4f7f6;--surface:#fff;--line:#d9e3e0;--gold:#f3c867;--teal:#147d74;--teal-soft:#e7f4f1;--shadow:0 18px 48px #12323c1f}*{box-sizing:border-box}html{font-size:16px}body{background:var(--paper);color:var(--ink);margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.5}button,input{font:inherit}button{cursor:pointer}.topbar{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);z-index:10;background:#ffffffe0;justify-content:space-between;align-items:center;height:72px;padding:0 max(20px,50vw - 590px);display:flex;position:sticky;top:0}.brand{align-items:center;gap:10px;font-size:1.05rem;display:flex}.brand span{background:var(--gold);border-radius:11px;place-items:center;width:36px;height:36px;font-size:1.2rem;font-weight:900;display:grid}.account,.primary,.secondary{border:0;border-radius:12px;padding:11px 15px;font-weight:780}.account,.primary{background:var(--ink);color:#fff}.account:disabled,.primary:disabled{opacity:.6}.secondary{color:var(--ink);border:1px solid var(--line);background:#fff}.shell{max-width:1180px;margin:auto;padding:42px 20px 80px}.heading{justify-content:space-between;align-items:end;gap:20px;display:flex}.heading h1{letter-spacing:-.045em;margin:6px 0 8px;font-family:Georgia,serif;font-size:clamp(2.2rem,5vw,3.5rem);line-height:1}.heading p{color:var(--muted);margin:0}.eyebrow{text-transform:uppercase;letter-spacing:.13em;font-weight:850;color:var(--teal)!important;font-size:.76rem!important}.notice,.demo{border-radius:15px;margin-top:22px;padding:15px 17px}.notice{background:var(--teal-soft);color:var(--teal);font-weight:700}.demo{background:#fff5d6;border:1px solid #ead694;justify-content:space-between;align-items:center;gap:20px;display:flex}.demo p{color:#695514;margin:3px 0 0}.demo button{color:var(--ink);background:0 0;border:0;font-weight:800}code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.toolbar{justify-content:space-between;align-items:center;margin:34px 0 16px;display:flex}.classGrid{grid-template-columns:repeat(3,1fr);gap:18px;display:grid}.classCard{border:1px solid var(--line);background:#fff;border-radius:19px;padding:22px;box-shadow:0 4px 18px #12323c0b}.cardTop{justify-content:space-between;display:flex}.cardTop span{letter-spacing:.08em;color:var(--teal);font-size:.75rem;font-weight:850}.cardTop small{color:var(--muted)}.classCard h2{margin:22px 0 4px;font-family:Georgia,serif;font-size:1.55rem;line-height:1.1}.classCard>p{color:var(--muted);margin:0}.stats{border-top:1px solid var(--line);border-bottom:1px solid var(--line);grid-template-columns:1fr 1fr;margin:22px 0 16px;padding:15px 0;display:grid}.stats div+div{border-left:1px solid var(--line);padding-left:16px}.stats b,.stats small{display:block}.stats b{font-size:1.2rem}.stats small{color:var(--muted)}.classCard>button{color:var(--teal);background:0 0;border:0;padding:0;font-weight:800}.empty{text-align:center;color:var(--muted);border:2px dashed #b9c9c5;border-radius:19px;grid-column:1/-1;padding:48px}.empty strong{color:var(--ink);font-size:1.15rem}.overlay{z-index:30;background:#0a1e258c;place-items:center;padding:18px;display:grid;position:fixed;inset:0}.dialog{width:min(540px,100%);box-shadow:var(--shadow);background:#fff;border-radius:22px;gap:16px;padding:26px;display:grid}.dialog h2{margin:3px 0;font-family:Georgia,serif;font-size:2rem}.dialog p{color:var(--muted);margin:0}.dialog label{gap:7px;font-size:.85rem;font-weight:800;display:grid}.dialog input{width:100%;color:var(--ink);border:1px solid #bbc9c6;border-radius:11px;padding:12px 13px}.two{grid-template-columns:1fr 1fr;gap:12px;display:grid}.dialogActions{justify-content:flex-end;gap:10px;margin-top:4px;display:flex}@media (max-width:850px){.classGrid{grid-template-columns:1fr 1fr}}@media (max-width:600px){.topbar{height:64px;padding:0 16px}.shell{padding:28px 16px 60px}.heading{display:block}.heading .primary{width:100%;margin-top:20px}.classGrid{grid-template-columns:1fr}.demo{align-items:flex-start;display:block}.demo button{padding:10px 0 0}.toolbar{font-size:.9rem}.two{grid-template-columns:1fr}.dialog{padding:21px}}
