:root{--color-primary: #3B82F6;--color-primary-variant: #1D4ED8;--color-secondary: #F59E0B;--color-accent: #10B981;--bg: #F8FAFC;--surface: #FFFFFF;--surface-muted: #fafafa;--text: #0F172A;--muted: #64748B;--border: #E5E7EB;--white: #ffffff;--radius: 10px;--card-radius: 12px;--card-padding: 12px;--card-transition: transform .18s cubic-bezier(.2,.9,.3,1), box-shadow .18s ease, background .18s ease, border-color .18s ease;--shadow-soft: 0 6px 18px rgba(0,0,0,.12);--shadow-medium: 0 12px 28px rgba(0,0,0,.18);--card-elevation: var(--shadow-soft);--card-elevation-hover: var(--shadow-medium);--border-alpha-04: rgba(15,23,42,.04);--border-alpha-20: rgba(15,23,42,.2);--shadow-alpha-04: rgba(2,6,23,.04);--overlay: rgba(0,0,0,.6);--overlay-25: rgba(0,0,0,.25);--overlay-35: rgba(0,0,0,.35);--overlay-45: rgba(0,0,0,.45);--overlay-50: rgba(0,0,0,.5);--shadow-popover: 0 2px 8px rgba(0,0,0,.15);--shadow-modal: 0 6px 24px rgba(0,0,0,.3);--focus-ring: rgba(59,130,246,.14);--primary-a-02: rgba(59,130,246,.02);--primary-a-04: rgba(59,130,246,.04);--primary-a-06: rgba(59,130,246,.06);--primary-a-08: rgba(59,130,246,.08);--primary-a-12: rgba(59,130,246,.12);--primary-a-18: rgba(59,130,246,.18);--secondary-a-02: rgba(16,185,129,.02);--secondary-a-04: rgba(16,185,129,.04);--secondary-a-08: rgba(16,185,129,.08);--secondary-a-18: rgba(16,185,129,.18);--accent-a-02: rgba(16,185,129,.02);--accent-a-06: rgba(16,185,129,.06);--white-a-85: rgba(255,255,255,.85);--white-a-90: rgba(255,255,255,.9);--white-a-06: rgba(255,255,255,.06);--white-a-03: rgba(255,255,255,.03);--black-a-05: rgba(0,0,0,.05);--black-a-06: rgba(0,0,0,.06);--black-a-08: rgba(0,0,0,.08);--black-a-10: rgba(0,0,0,.1);--black-a-80: rgba(0,0,0,.8);--border-alpha-03: rgba(15,23,42,.03);--border-alpha-06: rgba(15,23,42,.06);--danger: #e11d48;--card-width: 140px;--card-height: 200px;--hand-thumb-width: 120px;--hand-thumb-height: 90px;--gutter: 12px;--font-system: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;--font-weight-regular: 400;--font-weight-strong: 700;--font-weight-black: 900;--on-surface: #0F172A;--icon-bg-primary: #eef2ff;--icon-fg-primary: #1f2937;--icon-bg-secondary: #fff7ed;--icon-fg-secondary: #92400e;--icon-bg-accent: #eefbf7;--icon-fg-accent: #065f46;--color-secondary-strong: #34D399;--section-strip-bg: linear-gradient(90deg, var(--color-secondary), var(--color-secondary-strong));--section-strip-fg: var(--white);--btn-primary-bg: var(--color-primary);--btn-primary-fg: var(--white);--btn-secondary-bg: #10B981;--btn-secondary-fg: var(--white);--btn-ghost-bg: var(--surface-muted);--btn-ghost-hover-bg: var(--border-alpha-04);--btn-ghost-border: var(--border-alpha-06);--btn-ghost-fg: var(--text)}:root[data-theme=dark],[data-theme=dark]{--bg: #0E1117;--surface: #1A1D23;--surface-muted: #232730;--text: #FFFFFF;--text-main: #ffffff;--muted: #94a3b8;--color-primary: #3882F6;--color-primary-variant: #3b82f6;--color-secondary: #10B981;--card-elevation: 0 6px 20px rgba(0,0,0,.6);--card-elevation-hover: 0 18px 48px rgba(0,0,0,.6);--border: #2D3138;--border-alpha-04: rgba(255,255,255,.03);--shadow-alpha-04: rgba(0,0,0,.6);--overlay: rgba(0,0,0,.6);--danger: #EF4444;--white: #ffffff;--on-surface: #ffffff;--surface-on: #0F172A;--btn-primary-bg: var(--color-primary);--btn-primary-fg: var(--white);--btn-secondary-bg: var(--color-secondary);--btn-secondary-fg: var(--white);--btn-ghost-bg: var(--surface-muted);--btn-ghost-hover-bg: rgba(255,255,255,.06);--btn-ghost-border: rgba(255,255,255,.1);--btn-ghost-fg: var(--text)}:root{--alpha-02: rgba(0,0,0,.02);--alpha-04: rgba(0,0,0,.04)}.option-card{color:var(--on-surface)}.option-card .option-card__title{font-weight:900;color:inherit;font-variation-settings:"wght" 900;font-family:var(--font-system)}.option-card .option-card__desc{color:inherit;opacity:.95}.option-card--primary,.option-card--secondary{color:inherit}.site-header .site-title{color:var(--on-surface, var(--text))!important}.content-panel h1,.site-title,.page-title{color:var(--text)}html,body{margin:0;padding:0}body{font-family:var(--font-system);background:linear-gradient(180deg,var(--bg) 0%,var(--surface) 50%,var(--surface) 100%);color:var(--text)}[data-theme=dark] body{background:linear-gradient(180deg,var(--bg) 0%,var(--bg) 40%,var(--surface) 100%);color:var(--text)}.site-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 20px;background:linear-gradient(90deg,var(--primary-a-04),var(--accent-a-02));border-radius:12px;margin-bottom:18px;border:1px solid var(--border-alpha-03)}.site-brand{display:flex;align-items:center;gap:12px}.site-logo{width:48px;height:48px;object-fit:contain;border-radius:8px;box-shadow:var(--shadow-soft)}.site-title{font-weight:700;font-size:18px}.site-actions{margin-left:auto}[data-theme=dark] .btn-ghost{background:var(--btn-ghost-bg);border-color:var(--btn-ghost-border);color:var(--btn-ghost-fg)}[data-theme=dark] .btn-primary{box-shadow:none}.btn-primary{background:var(--btn-primary-bg);color:var(--btn-primary-fg);border-radius:var(--radius);box-shadow:var(--shadow-soft);border:none;padding:8px 12px;cursor:pointer}.btn-primary:hover{transform:translateY(-1px);box-shadow:var(--shadow-medium)}.btn-secondary{background:var(--btn-secondary-bg);color:var(--btn-secondary-fg);border-radius:var(--radius);box-shadow:var(--shadow-soft);border:none;padding:8px 12px;cursor:pointer}.btn-secondary:hover{transform:translateY(-1px);box-shadow:var(--shadow-medium)}.btn-ghost{background:var(--btn-ghost-bg);border:1px solid var(--btn-ghost-border);color:var(--btn-ghost-fg);padding:8px 12px;border-radius:8px;cursor:pointer;transition:background .12s,transform .08s,box-shadow .12s}.btn-ghost:hover{background:var(--btn-ghost-hover-bg);transform:translateY(-1px);box-shadow:var(--shadow-soft)}.btn-ghost:focus,.btn-ghost:focus-visible{outline:3px solid var(--focus-ring);outline-offset:3px}.btn-theme{background:linear-gradient(90deg,var(--primary-a-12),var(--accent-a-06));border:none;color:var(--text);padding:8px 12px;border-radius:8px;font-weight:600;display:flex;align-items:center;gap:8px;cursor:pointer}.btn-theme:hover{transform:translateY(-2px);box-shadow:var(--shadow-medium)}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:none}.card-frame{overflow:hidden;border-radius:calc(var(--radius) - 2px);background:var(--surface)}.card .card-title{font-weight:600;margin-bottom:6px}.card-name,.modal h3{color:var(--text)}.tile{background:linear-gradient(180deg,var(--white-a-85),var(--white-a-90));padding:10px;border-radius:8px;border:1px solid var(--border-alpha-04);box-shadow:0 8px 20px var(--shadow-alpha-04)}.tile.large{padding:12px}.tile-header{font-weight:700;margin-bottom:6px}.slot{width:var(--card-width);height:var(--card-height);display:flex;align-items:center;justify-content:center;border-radius:8px;background:linear-gradient(180deg,var(--surface),var(--surface-muted));border:1px dashed transparent}.slot.empty{opacity:.6;border:1px dashed var(--border-alpha-04);background:linear-gradient(180deg,var(--surface-muted),var(--surface))}.slot.battlefield{width:var(--card-width);height:var(--card-height);background:transparent;border:none}.card-frame.battlefield{width:var(--card-width);height:var(--card-height);display:grid;place-items:center;background:transparent;border-radius:0;overflow:visible;border:none;box-shadow:none;transition:transform .16s cubic-bezier(.2,.9,.2,1),box-shadow .18s ease,background .16s ease}.card-frame.battlefield img{width:100%;height:100%;object-fit:contain;display:block}.card-frame.battlefield:hover{transform:translateY(-6px) scale(1.02);background:linear-gradient(180deg,var(--secondary-a-08),var(--secondary-a-04));box-shadow:0 12px 30px var(--secondary-a-18)}.card-frame.support{width:calc(var(--card-width) - 28px);height:var(--hand-thumb-height);border-radius:6px}.hand-row{display:flex;gap:var(--gutter);flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:6px}.hand-thumb{flex:0 0 auto;width:var(--hand-thumb-width);height:var(--hand-thumb-height);background:var(--surface);border:1px solid var(--border-alpha-04);border-radius:8px;display:grid;place-items:center;overflow:hidden;box-shadow:0 6px 14px var(--shadow-alpha-04);cursor:grab}.hand-thumb img{width:100%;height:100%;object-fit:contain;display:block}.thumb-inner{width:100%;height:100%;display:grid;place-items:center;background:var(--surface-muted);overflow:hidden}.support-thumb{width:90px;height:70px;background:var(--surface);border:1px solid var(--border-alpha-04);border-radius:6px;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 6px 12px var(--shadow-alpha-04)}.support-thumb img{max-width:100%;max-height:100%;object-fit:contain}.break-thumb{width:120px;height:90px;background:var(--surface);border:1px solid var(--border-alpha-04);border-radius:8px;display:flex;flex-direction:column;align-items:center}.break-thumb .thumb-inner{height:90px}.thumb-label{font-size:12px;margin-top:6px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;max-width:100%}.target-highlight{outline:3px solid var(--color-secondary);outline-offset:-4px}.bf-row{display:flex;gap:var(--gutter);align-items:flex-start}.bf-center{display:flex;gap:28px;align-items:center}.stage-slot{width:180px}.stage-inline .card-frame{width:160px;height:90px}.small-stack{display:flex;gap:8px;flex-wrap:wrap}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--overlay);display:grid;place-items:center;z-index:1150}.modal{background:var(--surface);border-radius:12px;box-shadow:var(--shadow-medium);padding:12px;max-width:90vw;max-height:calc(100vh - 32px);box-sizing:border-box;display:flex;flex-direction:column}.modal .modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;flex:0 0 auto}.badge{background:var(--color-accent);color:var(--white);border-radius:9999px;padding:0 8px;font-weight:600;display:inline-block;font-size:12px}.phase-helper{padding:6px 10px;border-radius:9999px;background:transparent;border:1px solid var(--border-alpha-06);cursor:pointer}.phase-active-helper{background:var(--color-secondary);color:var(--white);box-shadow:var(--shadow-soft)}.menu-btn{background:var(--btn-ghost-bg);color:var(--btn-ghost-fg);border:1px solid var(--btn-ghost-border);padding:8px 10px;border-radius:8px;cursor:pointer}.menu-btn:hover{background:var(--btn-ghost-hover-bg)}.menu-btn{display:inline-flex}@media (max-width:900px){.menu-btn{display:inline-flex}}.duel-board{background-image:url(/assets/bg-pattern.png);background-size:cover;background-position:center;padding:12px;border-radius:8px}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:url(/assets/bg-pattern.png);background-size:1400px auto;background-position:center top;opacity:.06;pointer-events:none;z-index:0}.content-panel{margin-top:12px;padding:18px;background:linear-gradient(180deg,var(--bg),var(--surface));border-radius:12px;border:1px solid var(--border-alpha-03);box-shadow:0 8px 30px var(--shadow-alpha-04)}[data-theme=dark] .content-panel{background:linear-gradient(180deg,var(--bg),var(--surface));border:1px solid var(--white-a-03);box-shadow:var(--shadow-medium)}.content-panel .option-card,.content-panel .match-card,.content-panel .card{background:var(--surface);box-shadow:var(--shadow-soft)}.main-menu .option-card__title{color:var(--text-main)}.menu-group{margin-top:12px}.menu-group__title{font-weight:800;color:var(--text);margin:4px 2px 10px;opacity:.95}.main-menu .option-card{border-color:var(--border-alpha-06)}.menu-group+.menu-group{margin-top:28px}.main-menu .card-grid{gap:22px}.main-menu .header-row{display:flex;align-items:center;gap:16px;margin-bottom:18px}.main-menu .header-left{flex:1 1 auto;min-width:0}.main-menu .header-right{width:260px;flex:0 0 auto}@media (max-width: 720px){.main-menu .header-row{flex-direction:column;align-items:flex-start;gap:10px}.main-menu .header-right{width:100%}.main-menu .header-right>*{width:100%;display:flex;flex-wrap:wrap;gap:8px}.main-menu .header-left h1{line-height:1.1}@media (max-width:420px){.deckbuilder.content-panel{padding-left:8px;padding-right:8px}}}.main-menu .option-card{border-radius:var(--card-radius);transition:var(--card-transition)}.main-menu .option-card:hover{background:linear-gradient(180deg,var(--surface),var(--surface-muted));border-color:var(--border-alpha-20)}.main-menu .option-card--primary:hover{box-shadow:var(--card-elevation-hover),0 10px 26px var(--primary-a-12)}.main-menu .option-card--secondary:hover{box-shadow:var(--card-elevation-hover),0 10px 26px var(--secondary-a-18)}.main-menu .option-card--neutral:hover{box-shadow:var(--card-elevation-hover),0 10px 26px var(--black-a-08)}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}@media (max-width: 1200px){.feature-grid{grid-template-columns:repeat(3,1fr)}}@media (max-width: 900px){.feature-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 600px){.feature-grid{grid-template-columns:1fr}}.main-menu .feature-grid .option-card{flex-direction:column;align-items:center;text-align:center;gap:4px;padding:var(--feature-card-padding, 18px)}.main-menu .feature-grid .option-card__media{width:72px;height:72px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(145deg,var(--secondary-a-06),var(--secondary-a-18));box-shadow:inset 0 1px 0 var(--white-a-06),0 10px 22px var(--black-a-08)}.main-menu .feature-grid .option-card__title{font-size:1.08rem}.main-menu .feature-grid .option-card__desc{max-width:40ch;margin-inline:auto}.main-menu .feature-grid .option-card:hover{box-shadow:var(--card-elevation-hover),0 12px 28px var(--secondary-a-18)}.menu-group__title{display:inline-flex;align-items:center;gap:10px;padding:8px 12px;border-radius:12px;background:var(--section-strip-bg);color:var(--section-strip-fg);opacity:1;margin:0 0 14px;font-weight:800}div[role=root],#root{position:relative;z-index:1}.row{display:flex;gap:8px;align-items:center}.col{display:flex;flex-direction:column;gap:8px}.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px}.option-card{background:var(--surface);border-radius:var(--card-radius);padding:var(--card-padding);display:flex;gap:12px;align-items:center;box-shadow:var(--card-elevation);transition:var(--card-transition);cursor:pointer;border:1px solid var(--border-alpha-04);text-decoration:none;color:inherit}.option-card:focus,.option-card:focus-visible{outline:none;box-shadow:var(--card-elevation-hover);transform:translateY(-4px)}.option-card:hover{transform:translateY(-3px);box-shadow:var(--card-elevation-hover)}.option-card__media{width:64px;height:64px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--primary-a-06),var(--secondary-a-02))}.option-card__media img{width:48px;height:48px;object-fit:contain}.option-card__content{flex:1 1 auto;display:flex;flex-direction:column;gap:6px}.option-card__title{font-weight:900;font-size:1.04rem;font-variation-settings:"wght" 900;font-family:var(--font-system)}.option-card__desc{color:var(--muted);font-size:.95rem}.option-card__cta{margin-left:12px}.option-card--primary{border-left:4px solid var(--accent)}.option-card--secondary{border-left:4px solid var(--accent-2)}.option-card--neutral{border-left:4px solid transparent}.decklists-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;align-items:start}.decklist-card{display:grid;grid-template-columns:1fr 2fr;grid-template-areas:"title title" "icon actions";grid-template-rows:1fr 2fr;align-items:start;padding:16px;min-height:140px;box-shadow:var(--card-elevation);transition:var(--card-transition)}.decklist-card:hover{transform:translateY(-6px);box-shadow:var(--card-elevation-hover)}.decklist-title{grid-area:title;font-weight:800;font-size:1.02rem;color:var(--text);align-self:flex-start;line-height:1.15}.decklist-card__icon{grid-area:icon;display:flex;align-items:flex-end;justify-content:flex-start;height:100%;align-self:end}.decklist-card__icon img{width:80px;height:80px;object-fit:contain;filter:drop-shadow(0 4px 8px var(--shadow-alpha-06))}.decklist-count{width:48px;height:48px;border-radius:12px;background:linear-gradient(180deg,var(--primary-a-06),var(--secondary-a-02));display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1rem}.decklist-title{font-weight:800;font-size:1.02rem;color:var(--text);flex:1;word-break:break-word}.decklist-card__actions{grid-area:actions;display:grid;grid-auto-rows:min-content;gap:6px;justify-self:end;align-self:end;width:max-content}.decklist-actions-row{width:100%;display:flex;gap:6px;justify-content:flex-start}.decklist-card__actions .action-subscribe{justify-self:start;width:100%}.decklists-filter{display:flex;gap:8px;align-items:center;margin-bottom:12px}.decklists-filter .filter-label{font-weight:700;color:var(--text)}.decklists-filter .filter-icon img{width:24px;height:24px;display:block}.decklists-filter .filter-icon{padding:6px 8px}.decklists-filter .filter-clear{padding:6px 10px}.decklist-card__actions .btn-ghost,.decklist-card__actions .btn-primary,.decklist-card__actions .btn-secondary{padding:6px 10px;font-size:12px;border-radius:6px}@media (max-width:900px){.decklists-grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}}.deck-view-grid{align-items:start;padding:8px}.modal--deck-view{position:relative;width:75vw;height:75vh;max-width:calc(100vw - 40px);max-height:calc(100vh - 40px);padding:8px;display:flex;flex-direction:column;box-sizing:border-box;border-radius:12px}.modal--deck-view .modal-body{flex:1 1 auto;overflow:hidden;display:flex;padding:0}.deck-view-grid{align-items:start;padding:0;height:100%;width:100%;box-sizing:border-box;gap:0}.deck-modal-grid-wrap{display:flex;gap:12px;align-items:stretch;width:100%;height:100%;box-sizing:border-box}.deck-modal-sidebar{width:320px;max-width:40vw;background:var(--surface);border-left:1px solid var(--border-alpha-04);box-shadow:none;overflow:auto}.deck-view-card{position:relative;border:2px solid var(--border-alpha-04);border-radius:8px;overflow:hidden;background:linear-gradient(180deg,var(--surface),var(--surface-muted));box-shadow:0 6px 18px var(--shadow-alpha-04);display:flex;align-items:flex-end;justify-content:center}.deck-view-card img{width:100%;height:100%;object-fit:cover;display:block}.deck-view-badge{position:absolute;top:6px;right:6px;background:var(--danger);color:var(--white);width:26px;height:26px;border-radius:999px;display:grid;place-items:center;font-weight:700;font-size:12px;box-shadow:var(--shadow-soft)}.deck-view-name{position:absolute;left:6px;right:6px;bottom:6px;background:linear-gradient(180deg,var(--black-a-05),var(--black-a-10));color:var(--text);padding:6px 8px;border-radius:6px;font-weight:700;font-size:12px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}@media (max-width:700px){.modal--deck-view{width:98vw;height:92vh;padding:6px}.modal--deck-view .modal-body,.deck-view-grid{padding:0}}.deck-view-tile{border:none;background:transparent;padding:0;border-radius:0;display:flex;align-items:center;justify-content:center;overflow:visible;box-sizing:border-box;transition:transform .18s cubic-bezier(.2,.9,.3,1),box-shadow .18s ease,filter .18s ease}.deck-view-tile img,.deck-view-card img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;border-radius:0;transition:transform .18s cubic-bezier(.2,.9,.3,1),box-shadow .18s ease,filter .18s ease}.deck-view-card{position:relative;overflow:hidden}.deck-view-badge{position:absolute;top:8px;right:8px;width:36px;height:36px;background:#000!important;color:#fff!important;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;line-height:1;border-radius:4px;box-shadow:0 6px 18px #00000040;z-index:30}.deck-view-name{position:absolute;left:8px;right:8px;bottom:8px;background:linear-gradient(180deg,transparent,var(--black-a-80));color:var(--white);padding:6px 8px;font-size:12px;font-weight:700;border-radius:6px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;z-index:25;text-shadow:0 2px 6px var(--black-a-80)}.deck-view-tile:hover,.deck-view-tile:focus-within{transform:translateY(-8px) scale(1.02);z-index:40;box-shadow:0 18px 40px var(--black-a-08),0 6px 18px var(--primary-a-06)}.deck-view-tile:hover img,.deck-view-tile:focus-within img{transform:translateY(-2px) scale(1.01);filter:drop-shadow(0 8px 20px var(--primary-a-08))}.deck-view-tile:active{transform:translateY(-2px) scale(1)}.facedown-card{display:block;overflow:hidden;border-radius:6px;background:var(--surface-muted)}.facedown-card img{width:100%;height:100%;object-fit:cover;display:block}.deck-view-fallback{color:var(--muted);font-weight:600}@media (prefers-reduced-motion: reduce){.option-card,.option-card *{transition:none!important;animation:none!important}}.bf-row .card-frame{transition:transform .16s cubic-bezier(.2,.9,.2,1)}.bf-row .card-frame:hover{transform:translateY(-6px) scale(1.01)}.zoom-img{max-width:85vw;max-height:85vh}@media (max-width: 900px){:root{--card-width: 120px;--card-height: 160px;--hand-thumb-width: 96px;--hand-thumb-height: 70px }.site-title{font-size:16px}.site-logo{width:40px;height:40px}}.card-pool-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px}@media (max-width:700px){.card-pool-grid{grid-template-columns:repeat(3,1fr)!important;gap:4px}.deckbuilder .card-pool-tile{padding:3px}}.deckbuilder .deckbuilder-grid{grid-template-columns:360px 1fr}@media (max-width: 900px){.deckbuilder .deckbuilder-grid{grid-template-columns:1fr}.deckbuilder .side-panel{display:none}}.deckbuilder .card-thumb{height:156px}@media (max-width:700px){.deckbuilder .card-thumb{height:108px}.deckbuilder .card-pool-tile .card-title{font-size:11.5px}}.pre-game-modal{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;gap:18px;align-items:center;justify-content:center;background:var(--overlay-50);z-index:2000;padding:18px;pointer-events:auto}.pre-game-modal .pre-pane,.pre-game-modal .pre-center{background:var(--surface);padding:16px;border-radius:8px;box-shadow:var(--shadow-medium);display:flex;flex-direction:column;gap:12px;align-items:flex-start;width:340px;min-height:68vh;box-sizing:border-box;pointer-events:auto}.pre-game-modal .pre-center{align-items:center;text-align:center}.pre-game-modal .btn-ghost,.pre-game-modal .btn-primary{padding:12px 16px;font-size:15px}.pre-game-modal .choose-first{display:inline-flex;gap:8px;align-items:center;justify-content:center;min-width:120px}.pre-game-modal .choose-first.full{width:100%}@media (max-width: 900px){.pre-game-modal{padding:12px;gap:12px;flex-direction:column;align-items:stretch;justify-content:flex-start;overflow:auto}.pre-game-modal .pre-pane,.pre-game-modal .pre-center{width:100%;min-height:56vh}.pre-game-modal .pre-center{order:2}.pre-game-modal .pre-pane:first-child{order:1}.pre-game-modal .pre-pane:last-child{order:3}.pre-game-modal .choose-first{width:48%}}.filters-drawer{position:fixed;right:0;left:auto;top:0;bottom:0;width:320px;max-width:92vw;background:var(--surface);box-shadow:var(--shadow-medium);transform:translate(110%);transition:transform .22s cubic-bezier(.2,.9,.2,1);z-index:1300;padding:16px;overflow:auto}.filters-drawer.open{transform:translate(0)}.filters-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--overlay-35);z-index:1290}.filters-drawer .drawer-section+.drawer-section{border-top:1px solid var(--border-alpha-06);padding-top:12px;margin-top:12px}@media (max-height: 750px){.filters-drawer{padding:12px}.filters-drawer .drawer-section{margin-top:8px}.filters-drawer .drawer-section+.drawer-section{padding-top:10px;margin-top:10px}}@media (max-width:420px){.filters-drawer{width:min(88vw,288px);max-width:88vw}}.lightbox-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--overlay);z-index:1320;display:grid;place-items:center}.lightbox-modal{background:var(--surface);border-radius:8px;padding:12px;box-shadow:var(--shadow-medium);z-index:1330;max-width:90vw;max-height:90vh;overflow:auto}@media (max-height: 640px){.modal{max-height:calc(100vh - 12px)}.modal .modal-body{padding-bottom:12px}}.modal{animation:pop .14s cubic-bezier(.2,.9,.2,1)}@keyframes pop{0%{transform:translateY(6px) scale(.995);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}.context-menu{background:var(--surface);border:1px solid var(--border);border-radius:6px;box-shadow:var(--shadow-soft);overflow:hidden;z-index:1000;max-width:calc(100vw - 16px)}.context-menu .menu-item{padding:8px 10px;cursor:pointer}.context-menu .menu-item:hover{background:var(--primary-a-04)}.menu-divider{height:1px;background:var(--border);margin:4px 0}.menu-panel{margin-top:8px;min-width:220px;background:var(--surface);border:1px solid var(--border);border-radius:6px;box-shadow:var(--shadow-soft);overflow:hidden}.menu-panel .menu-header{padding:8px;border-bottom:1px solid var(--border);font-weight:700}.menu-panel .menu-body{padding:8px;display:flex;flex-direction:column;gap:8px}.spectator-banner{background:var(--surface-muted);color:var(--white);padding:8px 12px;border-radius:8px;display:flex;align-items:center;gap:12px;margin-bottom:8px}.spectator-banner .leave-btn{margin-left:auto;background:var(--danger);color:var(--white);border:none;padding:6px 10px;border-radius:6px;cursor:pointer}.practice-panel{margin-top:8px;padding:8px;border:1px dashed var(--border);border-radius:6px;background:var(--surface-muted)}.modal .modal-header .modal-title{font-weight:700}.modal .modal-body{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-start;justify-content:center;background:var(--surface-muted);padding:8px;overflow:auto;flex:1 1 auto}.modal .modal-actions{text-align:right;flex:0 0 auto;padding-top:8px}.form-grid{display:grid;grid-template-columns:130px 1fr;gap:10px 12px;align-items:center;width:100%}@media (max-width:600px){.form-grid{grid-template-columns:1fr}.form-grid .form-label{margin-bottom:-6px}}.form-label{font-weight:700;color:var(--text)}.form-input{width:100%;max-width:100%;box-sizing:border-box;padding:8px 10px;border-radius:8px;border:1px solid var(--border-alpha-06);background:var(--white);color:var(--black)}.modal .form-input{background:#fff;color:#111;-webkit-text-fill-color:#111}.form-input:-webkit-autofill{-webkit-text-fill-color:#111!important;-webkit-box-shadow:0 0 0px 1000px #fff inset!important;box-shadow:0 0 0 1000px #fff inset!important}.form-input:focus{outline:3px solid var(--focus-ring);outline-offset:2px}.form-input::placeholder{color:var(--muted)}.modal--sm{width:480px;max-width:calc(100vw - 40px)}.trash-card{padding:8px}.trash-card .trash-card-img{height:120px;background:var(--surface-muted);display:grid;place-items:center;overflow:hidden}.trash-card .trash-card-title{font-size:12px;margin-top:4px;text-align:center}.trash-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;justify-content:center}.zoom-label{font-size:24px}.zone-header{display:flex;justify-content:space-between;align-items:center;margin-top:8px;font-weight:600}.zone-right{color:var(--muted);font-size:13px}.zone-body{margin-top:6px}.match-chat{position:relative;width:300px;height:100%;max-height:none;background:var(--surface);border:1px solid var(--border-alpha-06);border-radius:8px;display:flex;flex-direction:column;box-shadow:var(--card-elevation)}.match-chat-header{display:flex;align-items:center;gap:8px;padding:8px 10px;border-bottom:1px solid var(--border-alpha-04);font-weight:700}.match-chat-body{padding:8px;overflow:auto;flex:1 1 auto;display:flex;flex-direction:column;gap:6px}.chat-msg{display:flex;gap:8px;align-items:flex-start}.chat-audit{display:flex;gap:8px;align-items:flex-start;opacity:.85;font-size:12px;color:var(--muted)}.chat-from{min-width:44px;font-weight:700;font-size:12px}.chat-text{background:linear-gradient(180deg,var(--white-a-90),var(--white));padding:6px 8px;border-radius:6px;border:1px solid var(--border-alpha-03);white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere}.chat-ts{color:var(--muted);font-size:11px;display:none}.chat-msg.show-ts .chat-ts,.chat-audit.show-ts .chat-ts{display:block}.match-chat-input{display:flex;gap:8px;padding:8px;border-top:1px solid var(--border-alpha-03)}.match-chat-input input{flex:1 1 auto;padding:8px;border:1px solid var(--border-alpha-06);border-radius:6px}.duel-layout{display:flex;gap:12px;align-items:stretch;min-height:calc(100vh - 180px)}.duel-chat-column{flex:0 0 320px;display:flex;flex-direction:column}.duel-main{flex:1 1 auto}@media (max-width:900px){.duel-layout{flex-direction:column}.duel-chat-column{order:0;width:100%}}.chat-toggle-btn{display:none}@media (max-width:900px){.duel-chat-column{display:none}.chat-toggle-btn{display:inline-flex;padding:6px 10px;border-radius:8px;background:var(--surface);border:1px solid var(--border-alpha-06)}}.chat-drawer{position:fixed;left:0;top:0;bottom:0;width:100%;max-width:420px;background:var(--surface);transform:translate(-110%);transition:transform .22s cubic-bezier(.2,.9,.2,1);z-index:1400;box-shadow:var(--shadow-medium);display:flex;flex-direction:column}.chat-drawer.open{transform:translate(0)}.chat-drawer-body{flex:1 1 auto;overflow:auto}.chat-drawer-footer{flex:0 0 auto}.chat-drawer-backdrop{display:none}.chat-drawer-backdrop.open{display:block;position:fixed;top:0;right:0;bottom:0;left:0;background:var(--overlay-45);z-index:1399}.match-chat{position:relative;width:300px;background:var(--surface);border:1px solid var(--border-alpha-06);border-radius:8px;display:flex;flex-direction:column;box-shadow:var(--card-elevation);height:100%}.match-chat .match-chat-body{padding:8px;overflow:auto;flex:1 1 auto;display:flex;flex-direction:column;gap:6px}.btn-primary.pressed{background:var(--color-primary-variant);opacity:.95;box-shadow:var(--shadow-medium);transform:translateY(0)}.btn-ghost.pressed{background:var(--primary-a-08);border-color:var(--primary-a-18)}.btn-primary:active,.btn-ghost:active{transform:translateY(0);opacity:.95}.btn-primary.clicked,.btn-ghost.clicked{box-shadow:0 10px 30px var(--primary-a-12);transform:translateY(-1px)}.turn-chip{display:inline-block;margin-left:8px;padding:0 8px;border-radius:9999px;background:var(--black-a-06);color:var(--muted);font-weight:700;font-size:12px}.turn-chip--active{background:linear-gradient(90deg,var(--color-secondary),var(--color-accent));color:var(--white)}.turn-toast{position:fixed;right:20px;top:80px;z-index:2200}.turn-toast .body{background:linear-gradient(90deg,var(--color-primary),var(--color-accent));color:var(--white);padding:10px 14px;border-radius:8px;box-shadow:var(--shadow-medium);font-weight:700}.zone-desc{font-size:12px;color:var(--muted);margin-bottom:6px}stage-tile{border:1px solid var(--border-alpha-04);padding:8px;width:160px;border-radius:8px;background:linear-gradient(180deg,var(--surface),var(--surface-muted))}stage-title{font-weight:600;margin-bottom:6px}stage-preview{height:90px;display:grid;place-items:center;background:var(--surface-muted);overflow:hidden;border-radius:6px}stage-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}.card-frame--target{box-shadow:none}.card-img--tapped{transform:rotate(90deg);opacity:.86}.trash-preview{height:90px;background:var(--surface-muted);display:grid;place-items:center;overflow:hidden;margin-top:6px;border-radius:6px}.trash-empty{height:90px;background:var(--surface-muted);display:grid;place-items:center;overflow:hidden;margin-top:6px;border:1px dashed var(--border);border-radius:4px}.context-panel{background:var(--surface);border:1px solid var(--border);border-radius:6px;box-shadow:var(--shadow-soft);overflow:hidden;z-index:1200}.context-panel .cp-item{padding:8px 10px;cursor:pointer}.context-panel .cp-item:hover{background:var(--primary-a-04)}.break-stack{position:relative;padding-left:8px}.break-card{position:absolute;left:8px;width:96px;height:128px;border-radius:6px;overflow:hidden;background:var(--surface);border:1px solid var(--border-alpha-04);box-shadow:0 6px 12px var(--shadow-alpha-04)}.break-card img{max-width:100%;max-height:100%;display:block}.card-frame.battlefield{position:relative}.hp-stack{position:absolute;left:calc(100% + 6px);top:0;height:100%;width:auto;pointer-events:none}.hp-card{position:absolute;width:28px;height:40px;background:linear-gradient(180deg,var(--surface-muted),var(--surface));border-radius:4px;box-shadow:var(--shadow-soft);transform:rotate(90deg);transform-origin:center;border:1px solid var(--border);background-image:url(/assets/card-back.png);background-size:cover;background-position:center}.hp-card.hidden{display:none}.phase{padding:6px 8px;border-radius:8px;border:1px solid var(--border-alpha-06);background:transparent;cursor:pointer}.phase.active{background:var(--color-secondary);color:var(--white);box-shadow:var(--shadow-soft)}.practice-panel{margin-top:8px;padding:8px;border:1px dashed var(--border);border-radius:6px;display:flex;gap:8px;align-items:center}.field-title{margin:6px 0}.match-card{position:relative;display:grid;grid-template-columns:1fr auto;grid-template-areas:"info meta";align-items:center;gap:12px;padding:12px;border-radius:8px;background:var(--surface);border:1px solid var(--border-alpha-04);box-shadow:var(--card-elevation)}.match-card__info{display:flex;flex-direction:column;gap:6px;min-width:0;grid-column:1;grid-area:info}.match-card__title{display:flex;align-items:center;gap:8px}.match-card__name{font-weight:800;font-size:1rem;color:var(--text)}.match-card__info-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:2px}.match-card__info-row .badge{position:static;margin:0}.match-card__players{display:flex;gap:8px;flex-wrap:wrap}.player-chip{background:linear-gradient(90deg,var(--primary-a-08),var(--secondary-a-04));padding:6px 8px;border-radius:9999px;font-size:.9rem;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.match-card__meta{display:flex;gap:12px;align-items:center;grid-column:2;grid-area:meta}.match-card__count{color:var(--muted);font-size:.95rem}.match-card__actions{display:flex;gap:8px}.match-card{transition:var(--card-transition)}.match-card:hover{transform:translateY(-3px);box-shadow:var(--card-elevation-hover),0 10px 26px var(--secondary-a-18);border-color:var(--border-alpha-20)}.badge--private{background:var(--black);color:var(--white);box-shadow:0 6px 16px var(--black-a-08)}.badge--legality{background:var(--surface-muted);color:var(--text);border:1px solid var(--border-alpha-06);box-shadow:none}.lobby-grid{display:grid;grid-template-columns:1fr 340px;gap:16px;align-items:start}.lobby-right-card{background:var(--surface);border:1px solid var(--border-alpha-04);border-radius:8px;padding:12px;box-shadow:var(--card-elevation);align-self:stretch}.lobby-grid>*{align-self:stretch}@media (max-width:900px){.lobby-grid{grid-template-columns:1fr;max-width:100%;box-sizing:border-box}.lobby-right-card{order:2;width:100%;box-sizing:border-box}.content-panel{padding-left:12px;padding-right:12px}}.deckbuilder .card-pool-tile{position:relative;overflow:hidden;transition:transform .16s cubic-bezier(.2,.9,.2,1),box-shadow .18s ease}.deckbuilder .card-pool-tile .card-title{display:none}.deckbuilder .card-pool-tile .card-thumb img{width:100%;height:100%;object-fit:contain;display:block;transition:transform .16s cubic-bezier(.2,.9,.2,1),filter .18s ease}.deckbuilder .card-pool-tile:hover{transform:translateY(-6px) scale(1.01);box-shadow:0 14px 34px var(--secondary-a-18)}.deckbuilder .card-pool-tile:hover .card-thumb img{filter:blur(2px) brightness(.96)}.deckbuilder .card-pool-tile>div:nth-child(3){position:absolute;left:2px;right:2px;bottom:6px;display:flex;align-items:center;justify-content:center;gap:6px;background:linear-gradient(180deg,var(--black-a-20),var(--black-a-40));border:1px solid var(--white-a-10);border-radius:8px;padding:6px 8px;opacity:0;transform:translateY(6px);pointer-events:none;transition:opacity .14s ease,transform .14s ease}.deckbuilder .card-pool-tile:hover>div:nth-child(3),.deckbuilder .card-pool-tile:focus-within>div:nth-child(3){opacity:1;transform:translateY(0);pointer-events:auto}.deckbuilder .card-pool-tile>div:nth-child(3) button{padding:6px 10px;font-size:12px;border-radius:6px}.deckbuilder .card-pool-tile>div:nth-child(3) div{min-width:26px;text-align:center;font-weight:700}.deckbuilder .card-pool-grid{grid-template-columns:repeat(7,1fr)!important;gap:2px}.deckbuilder .card-pool-tile{background:transparent!important;border:none!important;padding:0}.deckbuilder .card-pool-tile .card-thumb{background:transparent!important;height:340px!important}@media (max-width: 1100px){.deckbuilder .card-pool-grid{grid-template-columns:repeat(5,1fr)!important}}@media (max-width: 900px){.deckbuilder .card-pool-grid{grid-template-columns:repeat(4,1fr)!important}.deckbuilder .card-pool-tile .card-thumb{height:200px!important}}@media (max-width: 700px){.deckbuilder .card-pool-grid{grid-template-columns:repeat(3,1fr)!important;gap:6px}.deckbuilder .card-pool-tile .card-thumb{height:140px!important}}.filters-compact{display:grid;gap:8px}.filters-compact input,.filters-compact select{padding:6px 8px;border-radius:6px;font-size:13px;height:auto}.filters-compact label>span{font-size:11px;color:var(--muted)}.deckbuilder label:has(>input[placeholder="e.g. 100"]){display:none!important}.deckbuilder .side-panel button{padding:6px 10px;font-size:12px;border-radius:6px}.deckbuilder .side-panel input,.deckbuilder .side-panel select{padding:6px 8px;font-size:13px;height:32px}.filters-drawer input,.filters-drawer select{width:100%;box-sizing:border-box}.deckbuilder .side-panel input[type=range],.filters-drawer input[type=range]{width:100%}:root{--color-primary: #3B82F6;--color-accent: #10B981;--bg: #F8FAFC;--surface: #FFFFFF;--text: #0F172A;--muted: #64748B;--radius: 10px;--shadow-soft: 0 6px 18px rgba(0,0,0,.12);--border: #E5E7EB;--border-alpha-04: rgba(15,23,42,.04);--shadow-alpha-04: rgba(2,6,23,.04);--overlay: rgba(0,0,0,.6);--danger: #e11d48;--white: #ffffff;--surface-muted: #fafafa}.btn-primary{background:var(--color-primary);color:var(--white);border-radius:var(--radius);box-shadow:var(--shadow-soft)}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}.modal{background:var(--surface);border-radius:12px;box-shadow:0 12px 28px #0000002e}.badge{background:var(--color-accent);color:var(--white);border-radius:9999px}:root[data-theme=dark]{--color-bg: #0E1117;--color-surface: #1A1D23;--color-surface-hover: #232730;--color-border: #2D3138;--color-text: #F1F5F9;--color-muted: #9CA3AF;--color-primary: #3B82F6;--color-success: #10B981;--color-warning: #F59E0B;--color-error: #EF4444;--radius: 12px;--shadow-soft: 0 6px 18px rgba(0,0,0,.45);--border: #2D3138;--border-alpha-04: rgba(255,255,255,.03);--shadow-alpha-04: rgba(0,0,0,.6);--overlay: rgba(0,0,0,.6);--danger: #ef4444;--white: #ffffff;--surface-muted: #0f1318;--on-surface: #ffffff;--surface-on: #0F172A}.duel-board{display:grid;grid-template-rows:auto auto auto;gap:2px;margin-top:6px}.field-section{border-top:1px solid var(--border);padding-top:2px}.field-section.top{padding-bottom:2px}.field-section.bottom{padding-top:2px}.field-section.top .col-main{display:flex;flex-direction:column}.field-section.top .col-main>:last-child{margin-top:auto}.field-section.top .col-main{height:100%}.field-title{margin:2px 0}.field-grid{display:grid;grid-template-columns:minmax(100px,10vw) 1fr minmax(100px,10vw);gap:10px;align-items:stretch}.row-slots{display:grid;gap:6px;margin:4px 0}.slot{border:1px solid var(--border);background:var(--surface);padding:4px;width:min(18vw,130px);box-shadow:0 1px 2px var(--shadow-alpha-04);border-radius:4px}.slot.battlefield{width:min(18vw,130px);background:transparent;border:none;box-shadow:none;padding:0}.slot.empty{background:var(--surface-muted);height:min(18vw,140px)}.card-title{font-weight:600;margin-bottom:3px;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card-frame{height:min(18vw,140px);background:transparent;display:grid;place-items:center;position:relative;overflow:visible;border-radius:4px}.card-frame img{width:100%;height:100%;object-fit:contain}.card-frame.battlefield{height:min(18vw,140px);background:transparent;overflow:visible;border:none;border-radius:0}.card-frame.support{height:min(12vw,100px)}.badge{position:absolute;top:4px;right:4px;background:var(--overlay);color:var(--white);padding:2px 6px;border-radius:4px;font-size:11px}.slot-actions{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}.tile{border:1px solid var(--border);background:var(--surface);padding:6px;border-radius:6px;box-shadow:0 1px 2px var(--shadow-alpha-04)}.tile.large{min-height:100px}.tile-header{font-weight:600;margin-bottom:4px}.tile-header:first-child{margin-top:0}.col-stack{display:grid;gap:6px}.col-main{display:grid;grid-template-rows:auto auto auto;gap:4px}.battlefield-cell{display:flex;justify-content:flex-start}.stage-cell{display:flex;justify-content:center}.support-cell{display:block}.bf-row{display:grid;grid-template-columns:minmax(140px,18vw) 1fr;gap:48px;align-items:start}.bf-row .stage-slot .tile{padding:4px}.bf-row .stage-slot .card-frame.support{height:min(14vw,110px)}.bf-row .stage-slot{margin-left:-6px}.stage-inline{display:block}.stage-inline .slot.empty{width:min(12vw,96px);height:min(14vw,110px)}.stage-inline{width:min(18vw,130px)}.stage-inline .card-frame.support{width:min(18vw,130px);height:min(18vw,140px)}.col-side{display:grid;gap:6px;align-content:start}.field-section.top .col-main{display:flex;flex-direction:column;height:100%}.field-section.top .col-main .support-cell{order:1}.field-section.top .col-main .battlefield-cell{order:2;margin-top:auto}.field-section.top .col-main .stage-cell{order:3}.field-section.bottom .col-main .battlefield-cell{order:1}.field-section.bottom .col-main .stage-cell{order:2}.field-section.bottom .col-main .support-cell{order:3}.break-col{border:1px solid var(--border);background:var(--surface);padding:6px}.break-stack{position:relative;height:min(26vw,220px);overflow:auto;background:var(--surface-muted);border:1px dashed var(--border);border-radius:6px;padding:8px}.break-card{position:absolute;width:min(12vw,96px);height:min(18vw,140px);display:grid;place-items:center;background:var(--surface);border:1px solid var(--border);border-radius:4px;box-shadow:0 1px 2px var(--shadow-alpha-04);cursor:pointer}.break-card img{max-width:100%;max-height:100%}.break-count{position:absolute;top:6px;right:8px;background:var(--overlay);color:var(--white);font-size:11px;border-radius:10px;padding:2px 6px}.field-title{font-weight:700}.support-center{display:flex;justify-content:center}.support-cell .tile.large{width:auto;margin:0}.battlefield-cell>.bf-row{width:auto;margin:0}.deck-stack{position:relative;height:min(18vw,130px)}.deck-card{position:absolute;width:min(12vw,96px);height:min(18vw,140px);left:8px;top:4px;border-radius:6px;box-shadow:0 2px 4px var(--shadow-alpha-04);background-image:url(/assets/card-back.png);background-size:cover;background-position:center;border:1px solid var(--black-a-06)}.deck-card:nth-child(1){transform:translate(0)}.deck-card:nth-child(2){transform:translate(4px,4px)}.deck-card:nth-child(3){transform:translate(8px,8px)}.deck-hint{position:absolute;bottom:6px;left:8px;background:var(--overlay);color:var(--white);font-size:11px;border-radius:10px;padding:2px 6px;opacity:0;transition:opacity .15s}.tile.deck:hover .deck-hint{opacity:1}.phase-tracker{display:flex;justify-content:center;gap:6px;margin:0 auto;padding:4px 6px;background:var(--surface);border:1px solid var(--border);border-radius:10px}.phase-tracker .phase{width:32px;height:32px;border-radius:16px;border:1px solid var(--border-alpha-20);background:var(--surface-muted);font-weight:700}.phase-tracker .phase.active{background:var(--color-primary);color:var(--white);border-color:var(--color-primary-variant)}.drop-over{outline:2px dashed var(--color-primary);outline-offset:2px}