:root{--demo-bg:#050505;--demo-card:#0e0e0f;--demo-card-2:#111114;--demo-line:#ffffff14;--demo-line-strong:#ffffff24;--st-green:#30d158;--st-blue:#6aa6ff;--st-amber:#ffd60a;--st-red:#ff4a5c;--st-purple:#bf5af2;--st-orange:#ff6b35}body.demo-page{background:var(--demo-bg)}.demo-shell{min-height:100vh;padding-top:88px}.chip{letter-spacing:.06em;text-transform:uppercase;background:color-mix(in oklab, currentColor 12%, transparent);white-space:nowrap;border:1px solid;border-radius:999px;align-items:center;gap:6px;padding:3px 9px;font-family:JetBrains Mono,ui-monospace,monospace;font-size:10px;font-weight:500;display:inline-flex}.chip-dot{background:currentColor;border-radius:999px;width:5px;height:5px}.chip-green{color:var(--st-green)}.chip-blue{color:var(--st-blue)}.chip-amber{color:var(--st-amber)}.chip-red{color:var(--st-red)}.chip-purple{color:var(--st-purple)}.chip-orange{color:var(--st-orange)}.chip-muted{color:var(--ink-3);border-color:var(--line-strong);background:#ffffff0a}.demo-card{background:var(--demo-card);border:1px solid var(--demo-line);border-radius:14px}.stat-tile{background:var(--demo-card);border:1px solid var(--demo-line);border-radius:12px;flex-direction:column;gap:6px;min-width:0;padding:14px 16px;display:flex;position:relative;overflow:hidden}.stat-tile .stat-label{color:var(--ink-3);letter-spacing:.12em;text-transform:uppercase;font-size:10px}.stat-tile .stat-value{letter-spacing:-.025em;font-family:Geist,system-ui,sans-serif;font-size:28px;font-weight:500;line-height:1}.stat-tile .stat-sub{color:var(--ink-4);font-size:11px}.tab-bar{background:var(--demo-card);border:1px solid var(--demo-line);border-radius:12px;gap:2px;padding:4px;display:flex}.tab{letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);text-align:center;white-space:nowrap;border-radius:9px;flex:1;padding:10px 14px;font-size:12px;transition:background .2s,color .2s}.tab:hover{color:var(--ink-2)}.tab.active{color:var(--ink);background:#ffffff0f}.world-card{background:var(--demo-card);border:1px solid var(--demo-line);cursor:pointer;text-align:left;border-radius:22px;flex-direction:column;gap:18px;min-height:320px;padding:34px 32px 28px;transition:opacity .35s,transform .35s,border-color .35s,box-shadow .35s;display:flex;position:relative;overflow:hidden}.world-card:hover{transform:translateY(-3px)}.world-card.dim{opacity:.38}.world-card.selected{border-color:color-mix(in oklab, var(--card-accent) 55%, transparent);box-shadow:0 0 0 1px color-mix(in oklab, var(--card-accent) 35%, transparent), 0 0 80px -10px color-mix(in oklab, var(--card-accent) 55%, transparent)}.world-card .accent-bar{background:var(--card-accent);opacity:0;width:3px;transition:opacity .35s;position:absolute;top:0;bottom:0;left:0}.world-card.selected .accent-bar{opacity:1}.world-card .glow{background:var(--card-accent);filter:blur(120px);opacity:0;pointer-events:none;border-radius:50%;width:280px;height:280px;transition:opacity .6s;position:absolute;top:-80px;right:-80px}.world-card.selected .glow{opacity:.35}.world-icon{background:color-mix(in oklab, var(--card-accent) 18%, transparent);width:48px;height:48px;color:var(--card-accent);border:1px solid color-mix(in oklab, var(--card-accent) 30%, transparent);border-radius:12px;place-items:center;display:grid}.feed-row{border-bottom:1px solid var(--demo-line);cursor:pointer;grid-template-columns:56px 28px 140px 1fr auto;align-items:center;gap:12px;padding:12px 14px;transition:background .2s;display:grid}.feed-row:hover{background:#ffffff06}.feed-row.entering{animation:.55s cubic-bezier(.2,.7,.2,1) both fadeSlideUp}@keyframes fadeSlideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.feed-row .time{color:var(--ink-3);font-family:JetBrains Mono,monospace;font-size:11px}.feed-row .sender{color:var(--ink);font-size:13px;font-weight:500}.feed-row .preview{color:var(--ink-2);text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.ch-icon{border-radius:7px;place-items:center;width:24px;height:24px;font-size:11px;display:grid}.ch-wa{color:var(--st-green);background:#30d15824}.ch-email{color:var(--st-blue);background:#6aa6ff24}.ch-phone{color:var(--st-purple);background:#bf5af224}.phone-frame{background:linear-gradient(165deg,#2a2a2e 0%,#0a0a0c 55%,#1c1c20 100%);border-radius:44px;width:360px;height:740px;padding:14px;position:relative;box-shadow:0 60px 120px -30px #000000e6,inset 0 0 0 1px #ffffff0f}.phone-screen{background:#0a1014;border-radius:32px;flex-direction:column;height:100%;display:flex;position:relative;overflow:hidden}.phone-notch{z-index:4;background:#050507;border-radius:999px;width:110px;height:28px;position:absolute;top:9px;left:50%;transform:translate(-50%)}.msg-bubble{word-wrap:break-word;border-radius:12px;max-width:78%;padding:7px 11px 5px;font-size:13px;line-height:1.4;position:relative}.msg-bubble .t{color:#ffffff80;text-align:right;margin-top:2px;font-family:JetBrains Mono,monospace;font-size:9.5px}.msg-in{color:#e8eef2;background:#1c2730;border-bottom-left-radius:4px;align-self:flex-start}.msg-out{color:#e8f5ee;background:#054d3d;border-bottom-right-radius:4px;align-self:flex-end}.msg-bubble.entering{animation:.35s cubic-bezier(.2,.7,.2,1) both bubbleIn}@keyframes bubbleIn{0%{opacity:0;transform:translateY(8px)scale(.96)}to{opacity:1;transform:none}}.typing{background:#1c2730;border-radius:12px;align-self:flex-start;gap:3px;padding:8px 12px;display:inline-flex}.typing span{background:#ffffff80;border-radius:999px;width:5px;height:5px;animation:1.2s infinite bounce}.typing span:nth-child(2){animation-delay:.15s}.typing span:nth-child(3){animation-delay:.3s}@keyframes bounce{0%,to{opacity:.4;transform:translateY(0)}50%{opacity:1;transform:translateY(-4px)}}.demo-table{border-collapse:collapse;width:100%}.demo-table th{text-align:left;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-4);border-bottom:1px solid var(--demo-line);padding:10px 12px;font-size:10px;font-weight:500}.demo-table td{color:var(--ink-2);border-bottom:1px solid var(--demo-line);padding:14px 12px;font-size:13px}.demo-table tr:last-child td{border-bottom:none}.demo-table tr:hover td{background:#ffffff05}.demo-table .strong{color:var(--ink);font-weight:500}.btn-sm{letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;border-radius:7px;padding:6px 11px;font-family:JetBrains Mono,monospace;font-size:11px;font-weight:500;transition:all .2s}.btn-sm-ghost{border:1px solid var(--demo-line-strong);color:var(--ink-2)}.btn-sm-ghost:hover{color:var(--ink);border-color:var(--ink-3);background:#ffffff0d}.btn-sm-amber{border:1px solid color-mix(in oklab, var(--st-amber) 40%, transparent);color:var(--st-amber);background:color-mix(in oklab, var(--st-amber) 10%, transparent)}.btn-sm-amber:hover{background:color-mix(in oklab, var(--st-amber) 18%, transparent)}.btn-sm-red{border:1px solid color-mix(in oklab, var(--st-red) 40%, transparent);color:var(--st-red);background:color-mix(in oklab, var(--st-red) 10%, transparent)}.btn-sm-red:hover{background:color-mix(in oklab, var(--st-red) 18%, transparent)}.live-dot{color:var(--ink-3);letter-spacing:.06em;text-transform:uppercase;align-items:center;gap:6px;font-family:JetBrains Mono,monospace;font-size:11px;display:inline-flex}.live-dot:before{content:"";background:var(--st-green);border-radius:999px;width:6px;height:6px;animation:1.6s infinite pulseDot;box-shadow:0 0 8px #30d15899}@keyframes pulseDot{0%,to{opacity:1}50%{opacity:.4}}.toast{border:1px solid var(--demo-line-strong);color:var(--ink);z-index:100;background:#0a1014;border-radius:12px;align-items:center;gap:10px;padding:14px 20px;font-size:13px;animation:.35s cubic-bezier(.2,.7,.2,1) both toastIn;display:flex;position:fixed;bottom:28px;left:50%;transform:translate(-50%);box-shadow:0 30px 60px -20px #000c}@keyframes toastIn{0%{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%)}}.spinner{border:2px solid #ffffff26;border-top-color:var(--accent);border-radius:50%;width:14px;height:14px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.ward-map{border:1px solid var(--demo-line);background:#07090d;border-radius:16px;padding:18px;position:relative;overflow:hidden}.ward-pin{cursor:pointer;border:2px solid #0a1014;border-radius:50%;width:14px;height:14px;transition:transform .2s;position:absolute;transform:translate(-50%,-50%)}.ward-pin:hover{z-index:5;transform:translate(-50%,-50%)scale(1.4)}.ward-pin:after{content:"";opacity:.4;border:1.5px solid;border-radius:50%;animation:2s infinite pinPulse;position:absolute;inset:-8px}@keyframes pinPulse{0%{opacity:.7;transform:scale(.8)}to{opacity:0;transform:scale(2)}}.election-count{letter-spacing:-.05em;background:linear-gradient(180deg, var(--ink) 0%, var(--ink-3) 100%);color:#0000;-webkit-background-clip:text;background-clip:text;font-family:Geist,system-ui,sans-serif;font-size:clamp(80px,14vw,200px);font-weight:300;line-height:.85}.d-row{align-items:center;display:flex}.d-col{flex-direction:column;display:flex}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}.gap-5{gap:24px}.table-scroll{-webkit-overflow-scrolling:touch;overflow-x:auto}.table-scroll .demo-table{min-width:560px}@media (max-width:1100px){.restaurant-grid,.municipal-grid{grid-template-columns:1fr!important}.restaurant-grid>div:last-child{position:static!important}}@media (max-width:1000px){.broadcast-grid{grid-template-columns:1fr!important}}@media (max-width:900px){.selector-grid,.conv-grid,.intel-grid,.election-grid{grid-template-columns:1fr!important}}@media (max-width:768px){.demo-shell{padding-top:72px}.stat-grid-5{grid-template-columns:repeat(3,1fr)!important}.stat-grid-4{grid-template-columns:repeat(2,1fr)!important}.table-orders-grid{grid-template-columns:1fr!important}.tab-bar{flex-wrap:nowrap;gap:2px;overflow-x:auto}.tab{flex:none;min-width:fit-content;padding:10px 12px;font-size:11px}.phone-frame{width:min(360px,100%)!important}.feed-row{gap:8px;grid-template-columns:48px 120px 1fr!important}.feed-row .time{font-size:10px}.feed-row .sender{font-size:12px}.feed-row .preview{display:none}.ward-pin{width:18px!important;height:18px!important}.world-card{padding:24px 20px 20px;min-height:240px!important}}@media (max-width:600px){.stat-grid-5,.stat-grid-4{grid-template-columns:repeat(2,1fr)!important}.feed-row{grid-template-columns:44px 1fr auto!important}.conv-grid{grid-template-columns:1fr!important}.demo-shell{padding-top:64px}}@media (max-width:700px){.ward-grid{grid-template-columns:repeat(2,1fr)!important}}@media (max-width:500px){.ward-grid{grid-template-columns:1fr!important}}