:root{--bg:#0f1020;--surface:#1a1d33;--text:#f6f7ff;--muted:#b8bdd4;--accent:#ff75ba;--accent2:#9a7cff;--cool:#65d7ff;--border:color-mix(in srgb,var(--text) 16%,transparent)}
*{box-sizing:border-box}
html{min-width:0;background:var(--bg)}
body{min-height:100dvh;margin:0;background:radial-gradient(circle at 50% -10%,color-mix(in srgb,var(--accent2) 25%,transparent),transparent 48%),var(--bg);color:var(--text)}
.quick-shell { width:100%; max-width:420px; min-width:0; margin:0 auto; padding:max(18px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(22px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left)); }
.quick-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px}
.quick-header h1{margin:2px 0 0;font-size:clamp(1.8rem,8vw,2.4rem);line-height:1}
.quick-header .eyebrow{margin:0;color:var(--cool);font-weight:800;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase}
.quick-header a{flex:0 0 auto;color:var(--muted);font-size:.82rem;font-weight:750;text-decoration:none;padding:10px 0}
.quick-header a:hover,.quick-header a:focus-visible{color:var(--cool)}
.quick-connect,.quick-console{min-width:0;padding:18px;border:1px solid var(--border);border-radius:22px;background:color-mix(in srgb,var(--surface) 92%,transparent);box-shadow:0 20px 55px color-mix(in srgb,#000 35%,transparent)}
.quick-connect h2{margin:0 0 12px;font-size:1.15rem}
.quick-connect label,.quick-reason span{display:block;margin-bottom:7px;color:var(--muted);font-size:.82rem;font-weight:800}
.quick-connect-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
.quick-connect-row input,.quick-reason input{width:100%;min-width:0;min-height:48px;border-radius:12px}
.quick-connect-row button{min-height:48px}
.quick-lane{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.quick-lane button{min-width:0;max-width:100%;min-height:48px;padding-inline:4px;white-space:normal;overflow-wrap:anywhere;line-height:1.1;background:transparent;color:var(--muted);border-color:var(--border)}
.quick-lane button[aria-pressed="true"]{background:color-mix(in srgb,var(--cool) 18%,var(--surface));border-color:var(--cool);color:var(--text)}
.quick-lane button[data-quick-channel="sandbox"][aria-pressed="true"]{background:color-mix(in srgb,var(--accent2) 20%,var(--surface));border-color:var(--accent2)}
.quick-lane-help{min-height:2.5em;margin:9px 2px 0;color:var(--muted);font-size:.8rem;line-height:1.35}
.quick-balance{display:grid;justify-items:center;margin:10px 0 20px;padding:14px 8px 18px;border-bottom:1px solid var(--border)}
.quick-balance span{color:var(--muted);font-size:.72rem;font-weight:850;letter-spacing:.1em;text-transform:uppercase}
.quick-balance strong{font-size:clamp(4.5rem,25vw,7rem);font-variant-numeric:tabular-nums;line-height:.95;background:linear-gradient(145deg,var(--text),var(--cool) 46%,var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 18px color-mix(in srgb,var(--cool) 30%,transparent))}
.quick-balance small{color:var(--muted);font-weight:800}
.quick-reason{display:block;min-width:0}
.quick-reason small{font-weight:500}
.quick-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:14px}
.quick-point-button { min-width:0; min-height:64px; padding:10px 4px; border-radius:15px; font-size:1.28rem; font-weight:900; }
.quick-point-button.add{background:color-mix(in srgb,var(--accent) 24%,var(--surface));border-color:color-mix(in srgb,var(--accent) 65%,transparent);color:var(--text)}
.quick-point-button.subtract{background:color-mix(in srgb,var(--accent2) 13%,var(--surface));border-color:color-mix(in srgb,var(--accent2) 50%,transparent);color:var(--text)}
.quick-feedback{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:52px;margin-top:8px}
.quick-feedback p{min-width:0;margin:0;color:var(--muted);font-size:.84rem;overflow-wrap:anywhere}
.quick-feedback p.good{color:#9fffc9}.quick-feedback p.bad{color:#ff9eb2}
.quick-feedback button{flex:0 0 auto;min-height:44px}
.quick-console[aria-busy="true"] button{opacity:.55;cursor:wait}
[hidden]{display:none!important}
@media(max-width:360px){.quick-shell{padding-inline:12px}.quick-header{align-items:center;flex-wrap:wrap}.quick-header a{max-width:100%;overflow-wrap:anywhere}.quick-header h1{font-size:1.75rem}.quick-connect,.quick-console{padding:14px}.quick-point-button{min-height:60px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
