/* The web dashboard showcase (2026-10-03): a browser window that plays the real dashboard's tabs (letsrallytonight.com/venue). Drawn samples, tagged SAMPLE. */
.webdash{margin-top:90px}
.webdash .wd-head{max-width:640px}
.webdash .wd-num{font:800 12px var(--body);letter-spacing:.14em;color:var(--teal);margin-bottom:10px;text-transform:uppercase}
.webdash .wd-h{font:800 clamp(34px,6.5vw,58px)/.98 var(--display);letter-spacing:-.03em;text-wrap:balance}
.webdash .wd-p{margin-top:12px;color:var(--muted);font-size:18px;max-width:36ch}
.wd-stage{position:relative;margin-top:30px;display:grid;place-items:center}
.wd-stage::before{content:"";position:absolute;inset:8% 6%;border-radius:50%;background:radial-gradient(circle,rgba(79,209,197,.22),transparent 68%);filter:blur(30px)}
.wd-frame{position:relative;width:100%;max-width:1040px;border-radius:18px;background:#0b111c;border:1px solid rgba(255,255,255,.14);box-shadow:0 50px 90px -30px #000,0 0 0 1px #1d2636;overflow:hidden}
.wd-bar{display:flex;align-items:center;gap:8px;padding:11px 14px;background:#111826;border-bottom:1px solid var(--line)}
.wd-bar i{width:11px;height:11px;border-radius:50%;background:#2c374a}.wd-bar i:nth-child(1){background:#FF5F57}.wd-bar i:nth-child(2){background:#FEBC2E}.wd-bar i:nth-child(3){background:#28C840}
.wd-url{flex:1;margin-left:10px;max-width:420px;background:#0b111c;border:1px solid var(--line);border-radius:99px;padding:5px 14px;font:600 12px var(--body);color:var(--muted);display:flex;gap:6px;align-items:center}
.wd-url b{color:var(--teal-text);font-weight:700}
.wd-app{display:grid;grid-template-columns:170px 1fr;min-height:430px}
.wd-nav{padding:14px 10px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:4px;background:rgba(17,24,38,.6)}
.wd-logo{font:800 18px var(--display);padding:4px 10px 12px}
.wd-nav button{appearance:none;border:0;background:transparent;color:var(--muted);text-align:left;font:700 14px var(--body);padding:10px 12px;border-radius:12px;cursor:pointer;display:flex;align-items:center;gap:10px;position:relative;overflow:hidden;transition:background .25s,color .25s}
.wd-nav button svg{width:18px;height:18px;flex:none}
.wd-nav button:hover{background:rgba(255,255,255,.05)}
.wd-nav button.on{background:rgba(255,255,255,.1);color:var(--text)}.wd-nav button.on svg{color:var(--teal)}
.wd-nav button.on::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--teal);transform-origin:left;transform:scaleX(0);animation:wd-prog var(--wdms,4.6s) linear forwards}
@keyframes wd-prog{to{transform:scaleX(1)}}
.wd-main{padding:20px 22px;position:relative;overflow:hidden}
.wd-p-{display:none}
.wd-pane{display:none}.wd-pane.on{display:block;animation:wd-in .55s var(--ease)}
@keyframes wd-in{from{opacity:0;transform:translateY(14px)}}
.wd-pane h4{font:800 22px var(--display);margin:0 0 14px;display:flex;justify-content:space-between;align-items:center;gap:10px}
.wd-g{display:grid;gap:12px}.wd-g.two{grid-template-columns:1fr 1fr}.wd-g.three{grid-template-columns:repeat(3,1fr)}
.wd-c{background:var(--ink-2);border:1px solid var(--line);border-radius:16px;padding:14px}
.wd-c h5{font:800 14px var(--body);margin:0 0 10px;color:var(--body-2)}
.wd-big{font:800 56px/1 var(--display);letter-spacing:-.03em}.wd-sm{color:var(--muted);font-size:12px;margin-top:4px}
.wd-chip{display:inline-block;border-radius:99px;padding:3px 10px;font:700 11px var(--body);background:rgba(79,209,197,.16);color:#86F2E6}.wd-chip.amber{background:rgba(255,181,71,.16);color:#FFB547}.wd-chip.green{background:rgba(63,207,142,.16);color:#3FCF8E}
.wd-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--line);font-size:13px}.wd-row:last-child{border-bottom:0}.wd-row span{color:var(--muted)}.wd-row b{font-weight:600}
.wd-btns{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.wd-btns div{text-align:center;border-radius:12px;padding:12px;font:800 16px var(--display);background:var(--ink-3)}.wd-btns .in{background:var(--teal);color:var(--teal-ink)}
.wd-meter{height:10px;border-radius:99px;background:#1c2638;overflow:hidden;margin-top:10px}.wd-meter i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,var(--teal),#86F2E6);transition:width 1.2s var(--ease)}.wd-pane.on .wd-meter i{width:var(--w)}
.wd-bars{display:flex;align-items:flex-end;gap:8px;height:130px}.wd-bars i{flex:1;border-radius:6px 6px 2px 2px;background:linear-gradient(180deg,var(--teal),#1f7a73);transform:scaleY(0);transform-origin:bottom;transition:transform .9s var(--ease);transition-delay:calc(var(--i)*70ms)}.wd-pane.on .wd-bars i{transform:none}
.wd-ax{display:flex;justify-content:space-between;color:var(--faint);font-size:11px;margin-top:6px}
.wd-price{font:800 14px var(--display);color:var(--teal)}
.wd-code{font:800 20px var(--display);letter-spacing:.14em;color:var(--teal-text)}
.wd-tag{position:absolute;right:12px;bottom:10px;font:800 9px var(--body);letter-spacing:.14em;color:#8fa0bd;background:rgba(10,15,24,.8);padding:3px 8px;border-radius:99px}
.wd-cta{margin-top:22px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}.wd-cta span{color:var(--muted);font-size:14px}
@media (max-width:760px){
  .wd-app{grid-template-columns:1fr}.wd-nav{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line);padding:8px;scrollbar-width:none}.wd-nav::-webkit-scrollbar{display:none}.wd-logo{display:none}.wd-nav button{flex:none}
  .wd-g.two,.wd-g.three{grid-template-columns:1fr}.wd-main{padding:16px}.wd-big{font-size:46px}
}
@media (prefers-reduced-motion:reduce){.wd-nav button.on::after{animation:none;transform:scaleX(1)}.wd-pane.on{animation:none}.wd-bars i,.wd-meter i{transition-duration:.01s}}
