.demo-shell{position:relative;width:340px;height:580px;flex-shrink:0;transform:perspective(1500px) rotateY(-10deg);transform-origin:left center;border-radius:1rem}.demo-card-bg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;border-radius:1rem;opacity:0;transform:scale(1.08);transition:opacity .8s ease,transform .8s ease;z-index:1}.demo-card-bg.visible{opacity:1;transform:scale(1)}.demo-card-bg.departing{opacity:0;transform:scale(.92)}.demo-card-img{width:75%;height:auto;max-height:90%;-o-object-fit:contain;object-fit:contain;filter:drop-shadow(0 8px 32px rgba(168,85,247,.3))}.demo-overlay{position:absolute;inset:0;z-index:2;opacity:0;transform:scale(1.06);transition:opacity .8s ease,transform .8s ease;pointer-events:none;display:flex;flex-direction:column}.demo-overlay.visible{opacity:1;transform:scale(1);pointer-events:auto}.demo-overlay.departing{opacity:0;transform:scale(.92);pointer-events:none}.demo-overlay-inner{flex:1;display:flex;flex-direction:column;background:linear-gradient(135deg,#0f172af7,#2d143cf7);backdrop-filter:blur(16px);border-radius:1rem;border:1px solid rgba(168,85,247,.2);box-shadow:0 0 80px -12px #a855f726,0 25px 60px -12px #0000008c;font-family:Inter,system-ui,sans-serif;color:#e2e8f0;overflow:hidden}.demo-header{display:flex;align-items:center;justify-content:space-between;padding:.625rem .75rem;border-bottom:1px solid rgba(255,255,255,.06);flex-shrink:0}.demo-header-left{display:flex;align-items:center;gap:.5rem}.demo-logo{font-size:.875rem;font-weight:700;color:#818cf8}.demo-toggle{width:1.75rem;height:1rem;border-radius:999px;background:#6366f1;padding:2px;cursor:default}.demo-toggle-knob{width:.75rem;height:.75rem;border-radius:50%;background:#fff;transform:translate(.7rem)}.demo-dot{width:6px;height:6px;border-radius:50%;background:#22c55e;box-shadow:0 0 6px #22c55e;animation:demo-pulse 2s ease-in-out infinite}@keyframes demo-pulse{0%,to{opacity:1}50%{opacity:.4}}.demo-match-badge{font-size:.5625rem;font-weight:700;padding:.125rem .375rem;border-radius:999px;background:#6366f14d;color:#a5b4fc}.demo-card-area{padding:.75rem;flex-shrink:0}.demo-card-inner{display:flex;gap:.625rem;border-radius:.625rem;border:2px solid rgba(99,102,241,.2);background:#1a1a2e;overflow:hidden;height:8.5rem}.demo-card-img-wrap{position:relative;width:6rem;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:#111127}.demo-overlay .demo-card-img{width:100%;height:100%;-o-object-fit:contain;object-fit:contain;opacity:0;transition:opacity .4s ease}.demo-overlay .demo-card-img.loaded{opacity:1}.demo-match-badge{position:absolute;top:.25rem;right:.25rem;font-size:.5625rem;font-weight:700;padding:.125rem .375rem;border-radius:999px;background:#0009;color:#a5b4fc;backdrop-filter:blur(4px);opacity:0;transition:opacity .3s ease .3s}.demo-overlay.visible .demo-match-badge{opacity:1}.demo-card-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:.25rem;padding:.5rem .625rem .5rem 0}.demo-card-name{font-size:.875rem;font-weight:700;color:#f1f5f9;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.demo-card-set{font-size:.6875rem;color:#94a3b8;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.demo-card-tags{display:flex;gap:.25rem;flex-wrap:wrap;margin-top:.3125rem}.demo-tag{display:inline-block;font-size:.5625rem;font-weight:700;padding:.125rem .4375rem;border-radius:.25rem;line-height:1.3;white-space:nowrap}.demo-tag-h{background:#eab3088c;color:#fef3c7}.demo-tag-rh{background:#a855f78c;color:#ede9fe}.demo-tag-sir{background:#6366f173;color:#c7d2fe}.demo-tag-ir{background:#6366f159;color:#c7d2fe}.demo-tag-ur{background:#ef444466;color:#fca5a5}.demo-tag-rr{background:#38bdf866;color:#7dd3fc}.demo-tag-secret{background:#eab30866;color:#fde68a}.demo-tag-rainbow{background:#a855f766;color:#c4b5fd}.demo-tag-gold{background:#f59e0b8c;color:#fde68a}.demo-tag-promo{background:#34d3998c;color:#d1fae5}.demo-tag-1st{background:#f59e0b8c;color:#fef3c7}.demo-tag-default{background:#6366f14d;color:#c7d2fe}.demo-card-price-row{margin-top:.375rem;display:flex;align-items:baseline;gap:.375rem;margin-top:auto}.demo-market-price{font-size:1.0625rem;font-weight:800;color:#f1f5f9;line-height:1;transition:all .3s ease}.demo-market-strike{text-decoration:line-through;color:#475569;font-size:.75rem;font-weight:600;display:none}.demo-market-strike.visible{display:inline}.demo-condition-label{font-size:.5625rem;font-weight:700;color:#818cf8;transition:opacity .3s}.demo-condition-bar{display:flex;gap:.1875rem;padding:0 .75rem .4375rem;flex-shrink:0;opacity:0;transition:opacity .4s ease}.demo-condition-bar.visible{opacity:1}.demo-cond-pill{flex:1;padding:.1875rem 0;border:none;border-radius:.25rem;font-size:.5625rem;font-weight:700;cursor:default;background:#ffffff0d;color:#475569;text-align:center;transition:all .25s;line-height:1.3}.demo-cond-pill.active{background:#6366f166;color:#c7d2fe;box-shadow:0 0 0 1px #818cf880}.demo-grade-table{margin:0 .75rem .375rem;padding:0;border-radius:.4375rem;border:1px solid rgba(255,255,255,.06);background:#ffffff05;overflow:hidden;flex-shrink:0;opacity:0;transform:translateY(4px);transition:all .4s ease}.demo-grade-table.visible{opacity:1;transform:translateY(0)}.demo-grade-title{font-size:.5625rem;font-weight:700;letter-spacing:.05em;color:#64748b;padding:.375rem .5rem .1875rem}.demo-grade-count{color:#818cf8}.demo-grade-rows{display:flex;flex-direction:column}.demo-grade-row{display:flex;align-items:center;padding:.3125rem .5rem;gap:.375rem;border-bottom:1px solid rgba(255,255,255,.03);opacity:0;transform:translate(-6px);transition:opacity .25s ease,transform .25s ease}.demo-grade-row:last-child{border-bottom:none}.demo-grade-row.visible{opacity:1;transform:translate(0)}.demo-grade-company{font-size:.5rem;font-weight:700;text-transform:uppercase;letter-spacing:.02em;color:#64748b;min-width:1.75rem;flex-shrink:0}.demo-grade-label{font-size:.625rem;font-weight:700;color:#94a3b8;flex-shrink:0;min-width:1.25rem}.demo-grade-price{font-size:.625rem;font-weight:700;color:#cbd5e1;flex:1;text-align:right}.demo-grade-mult{font-size:.625rem;font-weight:800;min-width:2rem;text-align:right;flex-shrink:0;transition:all .3s ease;color:#475569}.demo-grade-mult.hot{color:#4ade80;font-weight:800}.demo-grade-mult.great{color:#f59e0b;font-weight:900;text-shadow:0 0 10px rgba(245,158,11,.5)}.demo-grade-mult.warm{color:#94a3b8}.demo-grade-mult.cold{color:#475569}.demo-bid-panel{margin:0 .75rem .375rem;padding:.4375rem .625rem;border-radius:.4375rem;border:1px solid rgba(34,197,94,.15);background:#22c55e0a;flex-shrink:0;opacity:0;transform:translateY(6px);transition:all .4s ease}.demo-bid-panel.visible{opacity:1;transform:translateY(0)}.demo-bid-panel.overpay{border-color:#ef444426;background:#ef44440a}.demo-bid-label{font-size:.5625rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#22c55e;margin-bottom:.1875rem}.demo-bid-panel.overpay .demo-bid-label{color:#ef4444}.demo-bid-row{display:flex;align-items:center;justify-content:space-between}.demo-bid-amount{font-size:1.0625rem;font-weight:800;color:#f1f5f9;transition:transform .15s ease}.demo-bid-amount.bump{transform:scale(1.08)}.demo-bid-next{font-size:.5625rem;color:#64748b;margin-top:.125rem;display:flex;justify-content:space-between}.demo-bid-delta{font-size:.5625rem;font-weight:700;padding:.125rem .4375rem;border-radius:.3125rem;transition:all .3s ease}.demo-bid-delta.good{background:#22c55e33;color:#4ade80}.demo-bid-delta.bad{background:#ef444433;color:#f87171}.demo-bid-delta.warn{background:#eab30833;color:#facc15}.demo-value-section{margin-top:.25rem;padding-top:.25rem;border-top:1px solid rgba(255,255,255,.05)}.demo-value-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.125rem}.demo-value-label{font-size:.5625rem;font-weight:700;letter-spacing:.05em;color:#475569}.demo-value-text{font-size:.5625rem;font-weight:700;transition:color .3s}.demo-value-track{height:.25rem;border-radius:999px;background:#ffffff1a;overflow:hidden}.demo-value-fill{height:100%;border-radius:999px;width:0%;transition:width .5s ease,background .3s ease}.demo-won-overlay,.demo-skip-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0f172aeb;backdrop-filter:blur(8px);opacity:0;pointer-events:none;transition:opacity .5s ease;border-radius:1rem;z-index:10}.demo-won-overlay.visible,.demo-skip-overlay.visible{opacity:1}.demo-won-inner,.demo-skip-inner{text-align:center;transform:scale(.8);transition:transform .4s cubic-bezier(.175,.885,.32,1.275)}.demo-won-overlay.visible .demo-won-inner,.demo-skip-overlay.visible .demo-skip-inner{transform:scale(1)}.demo-won-icon,.demo-skip-icon{font-size:2rem;margin-bottom:.375rem}.demo-won-title{font-size:.625rem;font-weight:700;letter-spacing:.15em;color:#fbbf24;margin-bottom:.125rem}.demo-won-price{font-size:1.5rem;font-weight:900;color:#f1f5f9;margin-bottom:.125rem}.demo-won-savings{font-size:.6875rem;font-weight:600}.demo-won-savings.good{color:#4ade80}.demo-skip-title{font-size:.625rem;font-weight:700;letter-spacing:.15em;color:#94a3b8;margin-bottom:.25rem}.demo-skip-reason{font-size:.6875rem;color:#64748b}@media(max-width:1023px){.demo-shell{width:330px;height:460px;margin:0 auto;transform:perspective(1500px) rotateY(0)}}@media(max-width:639px){.demo-shell{width:300px;height:440px}}
