:root{color-scheme:dark;font-family:system-ui,sans-serif;background:#07101f;color:#edf3ff}*{box-sizing:border-box}body{margin:0}.demo-shell{max-width:1100px;margin:auto;padding:24px}header{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px}header strong{font-size:24px}header span,.eyebrow{color:#ff76ad}a{color:#bfdbfe}.demo-notice{padding:16px;border:1px solid #526588;border-radius:12px;background:#14233b;line-height:1.6;margin-bottom:24px}.demo-panel,.demo-card{padding:24px;border:1px solid #334563;border-radius:18px;background:#101c31;margin-bottom:16px}.demo-login{max-width:620px;margin:40px auto}.demo-tabs,.demo-match-list{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:24px}button{font:inherit;color:#fff;background:#6c35c8;border:1px solid #9463ed;padding:12px 18px;border-radius:12px;cursor:pointer}button[aria-pressed=true]{background:#b62a6a;border-color:#ff76ad}button:hover{filter:brightness(1.15)}button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid #93c5fd;outline-offset:3px}.secondary{background:#24324a;border-color:#526588}label{display:block;margin:18px 0 8px}input{font:inherit;padding:14px;width:100%;background:#07101f;color:#fff;border:1px solid #526588;border-radius:10px;margin-bottom:16px}.demo-catalog{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;margin-top:24px}.demo-card .symbol{font-size:40px;color:#ff76ad}.demo-card p{color:#cbd5e1;line-height:1.6}.demo-card button{margin:8px 8px 0 0}.demo-metrics{display:flex;gap:16px;margin-bottom:20px}.demo-metrics article{flex:1;background:#14233b;padding:20px;border-radius:16px}.demo-metrics strong,.demo-metrics span{display:block}.demo-metrics strong{font-size:32px}.demo-message{padding:14px;border-radius:12px;background:#24324a;margin:12px 0;overflow-wrap:anywhere}.demo-message.mine{background:#44225d}.demo-message strong{display:block;margin-bottom:6px}[hidden]{display:none!important}.eyebrow{font-size:12px;font-weight:700;letter-spacing:.1em}h1{font-size:clamp(28px,5vw,40px)}@media(max-width:600px){.demo-shell{padding:16px}.demo-panel,.demo-card{padding:18px}.demo-tabs button{flex:1}header strong{font-size:21px}}