/* Demo galleries: motion is decorative; chart values never auto-update. */
.show-switch,.show-shell{width:100%;max-width:1200px;margin:0 auto;min-width:0}.show-switch{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:18px 0;border-bottom:1px solid var(--show-border)}.show-switch button,.show-btn,.show-period button{font:inherit;font-size:12px;line-height:1.3;padding:8px 12px;border:1px solid var(--show-border);color:var(--show-ink);background:var(--show-paper);border-radius:var(--show-radius);cursor:pointer;text-decoration:none}.show-switch button[aria-pressed=true],.show-period button[aria-pressed=true],.show-primary{background:var(--show-accent);color:var(--show-accent-ink);border-color:var(--show-accent)}.show-switch p{font-size:11px;line-height:1.5;margin:0 0 0 auto;color:var(--show-muted);max-width:48ch}.show-shell{padding-bottom:30px}.show-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:35px;align-items:center;padding:34px 0 24px;min-height:365px}.show-eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.14em;display:block;margin-bottom:14px}.show-hero h1{font-size:clamp(36px,4.8vw,66px);line-height:1.04;margin:0 0 22px;max-width:16ch;letter-spacing:-.035em;color:var(--show-ink)}.show-hero-copy>p{font-size:16px;line-height:1.65;max-width:49ch;color:var(--show-muted);margin:0 0 22px}.show-hero-actions{display:flex;gap:8px;flex-wrap:wrap}.show-character-wrap{min-width:0;position:relative;padding:0 12px}.show-character{display:block;width:100%;max-width:440px;margin:auto;padding:0;border:0;cursor:pointer;background:none;color:var(--show-ink);--look-x:0px;--look-y:0px;touch-action:manipulation}.show-character svg{width:100%;height:auto;display:block;overflow:visible}.show-character-caption{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:10px;line-height:1.5;text-transform:uppercase;letter-spacing:.08em;color:var(--show-muted);border-top:1px solid var(--show-border);padding-top:10px;max-width:380px;margin:0 auto}.show-character-caption span{max-width:28ch}.show-character-caption button{font-size:10px;padding:6px 8px;flex:none}.show-motion-note{font-size:11px;color:var(--show-muted);margin:6px 0;min-height:1.4em}.show-market-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin:14px 0 16px}.show-market-head h2{font-size:27px;line-height:1.2;margin:0}.show-market-head p{font-size:11px;color:var(--show-muted);max-width:36ch;text-align:right;margin:0}.show-demo-badge{display:inline-block;background:var(--show-accent);color:var(--show-accent-ink);font-size:10px;font-weight:700;letter-spacing:.13em;padding:5px 7px;margin-bottom:8px}.show-market{display:grid;grid-template-columns:minmax(260px,.78fr) minmax(0,1.6fr);gap:18px;align-items:start}.show-tokens{display:grid;gap:12px;min-width:0}.show-token{border:1px solid var(--show-border);border-radius:var(--show-radius);background:var(--show-card);overflow:hidden;animation:show-enter .45s both;animation-delay:calc(var(--card-index)*60ms)}.show-select{display:block;width:100%;min-width:0;text-align:left;background:none;border:0;border-left:3px solid transparent;color:var(--show-ink);padding:14px;cursor:pointer;font:inherit;transition:background .16s,border-color .16s}.show-select[aria-pressed=true]{border-left-color:var(--show-accent);background:var(--show-selected)}.show-select:hover{background:var(--show-selected)}.show-token-top{display:flex;gap:10px;align-items:center}.show-token-top img{width:34px;height:34px;object-fit:cover;border:1px solid var(--show-border);border-radius:var(--show-radius)}.show-token-top strong{font-size:13px;display:block;line-height:1.2}.show-token-top small{display:block;font-size:10px;color:var(--show-muted);margin-top:4px}.show-change{font-size:11px;margin-left:auto;font-weight:600;color:var(--show-ink);white-space:nowrap}.show-spark{display:block;width:100%;height:42px;margin:8px 0;overflow:visible}.show-spark path{stroke:var(--show-line);fill:none;stroke-width:2;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}.show-token-bottom{display:flex;justify-content:space-between;gap:8px;font-size:9px;color:var(--show-muted)}.show-token-bottom strong{display:block;font-size:12px;color:var(--show-ink);margin-top:5px}.show-token-bottom>span:last-child{text-align:right}.show-detail{display:flex;justify-content:space-between;padding:8px 14px;font-size:10px;border-top:1px solid var(--show-border);color:var(--show-muted);text-decoration:none}.show-detail:hover{color:var(--show-ink)}.show-focus{border:1px solid var(--show-border);background:var(--show-card);border-radius:var(--show-radius);padding:22px;position:sticky;top:100px;min-width:0}.show-focus-head{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:start}.show-focus h3{font-size:16px;margin:0 0 10px;line-height:1.4}.show-focus-price{font-size:clamp(22px,3vw,38px);font-weight:600;display:block;line-height:1.2}.show-focus-change{display:block;font-size:11px;margin-top:8px;color:var(--show-muted)}.show-focus-volume{font-size:10px;text-align:right;color:var(--show-muted);line-height:1.7}.show-focus-volume strong{font-size:19px;display:block;color:var(--show-ink)}.show-chart-toolbar{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:22px 0 12px;padding-top:14px;border-top:1px solid var(--show-border)}.show-chart-toolbar>span{font-size:10px;color:var(--show-muted)}.show-period{display:flex;gap:4px}.show-period button{font-size:10px;padding:5px 8px}.show-chart{width:100%;min-width:0;touch-action:pan-y}.show-chart svg{width:100%;height:auto;display:block;overflow:visible}.show-gridlines path{stroke:var(--show-border);fill:none;stroke-width:1;stroke-dasharray:3 7}.show-line{stroke:var(--show-line);fill:none;stroke-width:2.5;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;animation:show-draw 1s ease-out both}.show-area{fill:var(--show-line);opacity:.065}.show-volume-bars rect{fill:var(--show-volume);opacity:.55}.show-cursor{stroke:var(--show-muted);stroke-width:1;stroke-dasharray:3 5;opacity:.6}.show-dot{fill:var(--show-card);stroke:var(--show-line);stroke-width:2}.show-axis{display:flex;justify-content:space-between;gap:8px;font-size:9px;color:var(--show-muted);margin-top:5px}.show-inspector{display:block;margin-top:18px;padding-top:12px;border-top:1px solid var(--show-border);font-size:10px;color:var(--show-muted);line-height:1.6}.show-inspector input{display:block;width:100%;margin:10px 0;accent-color:var(--show-volume)}.show-inspector output{display:block;min-height:2.5em;font-size:11px}.show-focus-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:15px;border-top:1px solid var(--show-border);padding-top:15px}.show-focus-foot p{font-size:10px;line-height:1.5;color:var(--show-muted);max-width:35ch;margin:0}.show-focus-foot a{flex:none;font-size:10px}.show-legend{display:flex;gap:12px;font-size:9px;color:var(--show-muted)}.show-legend i{display:inline-block;width:12px;height:3px;margin-right:5px;vertical-align:middle;background:var(--show-line)}.show-legend span:last-child i{height:8px;background:var(--show-volume)}.show-character .char-pupils{transform:translate(var(--look-x),var(--look-y));transition:transform .12s}.show-character .char-body{transform-origin:50% 80%;animation:show-breathe 4s ease-in-out infinite}.show-character .char-eyes{transform-origin:center;transform-box:fill-box;animation:show-blink 6s infinite}.show-character .char-leaves{transform-origin:50% 80%;animation:show-sway 5s ease-in-out infinite}.show-character .char-floating{animation:show-float 4s ease-in-out infinite}.show-character .char-arm{transform-origin:68% 59%;animation:show-stamp 4s ease-in-out infinite}.show-character .char-leaves.second{animation-delay:-2s}.show-character.is-tapped .char-body{animation:show-greet .8s ease-in-out}.show-character.is-greeting .char-mouth{transform:scaleX(1.15);transform-origin:center;transform-box:fill-box}.motion-off *,.motion-off *::before,.motion-off *::after{animation:none!important;transition:none!important}.show-shell.motion-off .show-character .char-pupils{transform:none}.show-switch :focus-visible,.show-shell :focus-visible{outline:2px solid var(--show-accent);outline-offset:4px}
@keyframes show-enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes show-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}@keyframes show-breathe{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-5px) rotate(1deg)}}@keyframes show-blink{0%,43%,46%,100%{transform:scaleY(1)}44%,45%{transform:scaleY(.07)}}@keyframes show-sway{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(4deg)}}@keyframes show-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes show-stamp{0%,55%,100%{transform:rotate(-6deg)}68%,79%{transform:rotate(12deg) translateY(8px)}}@keyframes show-greet{0%,100%{transform:translateY(0)}35%{transform:translateY(-14px) rotate(-5deg)}70%{transform:translateY(-4px) rotate(4deg)}}
@media(max-width:900px){.show-market{grid-template-columns:minmax(0,.9fr) minmax(0,1.35fr)}.show-hero{gap:20px}.show-focus{padding:16px}.show-focus-head{gap:12px}.show-focus-volume{text-align:left}.show-axis{font-size:8px}.show-axis span:nth-child(2){display:none}.show-focus-foot{align-items:start;flex-direction:column}}
@media(max-width:640px){.show-switch p{margin:0;width:100%;max-width:none}.show-hero{grid-template-columns:minmax(0,1fr);padding-top:28px;gap:10px}.show-hero h1{font-size:42px;max-width:14ch;margin-bottom:16px}.show-hero-copy>p{font-size:14px;margin-bottom:18px}.show-character-wrap{max-width:350px;width:100%;margin:auto;padding:0}.show-character{max-width:310px}.show-character-caption{max-width:300px}.show-market{grid-template-columns:minmax(0,1fr)}.show-tokens{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.show-token:first-child:last-child{grid-column:1/-1}.show-select{padding:10px}.show-token-top{flex-wrap:wrap;gap:6px}.show-token-top img{width:27px;height:27px}.show-token-top strong{font-size:11px}.show-token-top small{font-size:9px}.show-change{font-size:10px;margin-left:0;width:100%;text-align:right}.show-spark{height:36px}.show-token-bottom{flex-direction:column;font-size:9px;gap:8px}.show-token-bottom>span:last-child{text-align:left}.show-token-bottom strong{font-size:11px;margin-top:2px}.show-detail{font-size:9px;padding:8px 10px}.show-focus{position:static;padding:16px}.show-market-head h2{font-size:24px}.show-market-head{align-items:start}.show-market-head p{max-width:23ch;font-size:10px}.show-focus-price{font-size:28px}.show-focus h3{font-size:14px}.show-focus-volume strong{font-size:17px}.show-chart-toolbar{margin-top:16px}.show-switch{padding-top:14px}.show-tokens .show-token:last-child:nth-child(odd){grid-column:1/-1}.show-tokens .show-token:last-child:nth-child(odd) .show-token-bottom{flex-direction:row}.show-tokens .show-token:last-child:nth-child(odd) .show-change{width:auto;margin-left:auto}.show-tokens .show-token:last-child:nth-child(odd) .show-spark{height:36px}}
@media(prefers-reduced-motion:reduce){.show-shell *,.show-shell *::before,.show-shell *::after{animation:none!important;transition:none!important}.show-character .char-pupils{transform:none!important}}
:root{--show-paper:var(--paper);--show-card:var(--paper);--show-ink:var(--ink);--show-muted:var(--ink-60);--show-border:var(--ink-30);--show-accent:var(--signal);--show-accent-ink:var(--signal-ink);--show-line:var(--ink);--show-volume:var(--signal);--show-selected:var(--paper-deep);--show-radius:0}.show-hero h1,.show-market-head h2{font-family:var(--font-display)}.show-eyebrow,.show-btn,.show-period,.show-demo-badge{font-family:var(--font-mono)}.show-focus{box-shadow:4px 4px 0 var(--ink);border-color:var(--ink)}.show-token{border-color:var(--ink)}.show-character .char-body,.show-character .char-arm,.show-character .char-eyes{animation-timing-function:steps(4)}

/* Local, individually curated demo token photography. */
.demo-token-photo{display:inline-flex;position:relative;flex:0 0 44px;width:44px;height:44px;align-items:center;justify-content:center;overflow:hidden;border-radius:12px;background:var(--bg-soft,#25282b);border:1px solid currentColor;color:inherit;vertical-align:middle;isolation:isolate;font-size:12px;font-weight:700}
.demo-token-photo::before{content:attr(data-fallback);opacity:.55}
.demo-token-photo img{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover;border:0;border-radius:inherit;display:block}
.demo-token-photo--focus{margin:0 10px 8px 0;width:48px;height:48px;flex-basis:48px}

/* The live / sample flag next to the mode switch. showcase.js draws it; there is
   no PadUI strip to call. It sits last in the bar, after the status sentence
   the base rule already pushes to the right. Built only from the RAREPAD tokens. */
.show-flag{display:inline-flex;align-items:center;font:700 10px/1 var(--font-mono);text-transform:uppercase;letter-spacing:.13em;padding:6px 7px;border:1px solid var(--ink);background:var(--paper);color:var(--ink);flex:none}
.show-flag[data-flag=live]{background:var(--signal);color:var(--signal-ink)}
.show-flag[data-flag=demo]{background:var(--paper);border-style:dashed}
.show-flag[data-flag=soon]{background:var(--paper-deep)}
