:root{--color-bg: #f4f2ee;--color-surface: #ffffff;--color-surface-muted: #eceae4;--color-ink: #201f1c;--color-muted: #6b675f;--color-border: #d9d5cc;--color-accent: #2f6fd1;--color-danger: #c23b3b;--color-gold: #b8901f;--color-mp: #b851af;--color-hp-safe: #7c8f80;--color-hp-danger: #f59e0b;--color-hp-safe-run: #4c9a4a;--color-water: #2f7fd1;--color-fire: #cf4a30;--color-wood: #4c9a4a;--color-stone: #54837f;--color-light: #a0b635;--color-dark: #4a3f6b;--color-seat-mine-shade: #16406e;--color-seat-foe-shade: #6e2214;--color-chain-tier2: #c9930a;--color-chain-tier3: #b8342a;--color-monster-fire-start: #f0793a;--color-monster-wood-start: #7fb95a;--color-monster-wood-end: #3f7a36;--color-monster-water-start: #4fa3d1;--color-yuki-black: #141519;--color-yuki-charcoal: #2E3138;--color-yuki-teal: #5B8C93;--color-yuki-gray: #8A8F96;--color-yuki-silver: #C3C7CC;--color-yuki-bone: #E6E4DF;--color-overlay-black: #000000;--color-battle-dark-bg: #131009;--color-battle-dark-surface: #1c1811;--color-battle-dark-surface-alt: #262016;--color-battle-dark-border: #3a352c;--color-battle-dark-ink: #e8e2d6;--color-battle-dark-muted: #a39d8f;--color-battle-dark-rim: #4a4438;--color-battle-dark-glow: #d1a35c;--color-graffiti-magenta: #ff2fb0;--color-graffiti-cyan: #25e0ff;--color-graffiti-yellow: #f4ff3d;--color-graffiti-spray: #f2f0e6;--color-judgement-perfect: #ffd76a;--color-judgement-good: #8fd18f;--color-judgement-miss: #c96a6a;--color-tint-accent-15: rgba(47, 111, 209, .15);--color-tint-accent-20: rgba(47, 111, 209, .2);--color-tint-accent-30: rgba(47, 111, 209, .3);--color-tint-accent-50: rgba(47, 111, 209, .5);--color-tint-accent-55: rgba(47, 111, 209, .55);--color-tint-accent-60: rgba(47, 111, 209, .6);--color-tint-water-25: rgba(47, 127, 209, .25);--color-tint-danger-35: rgba(194, 59, 59, .35);--color-tint-ink-15: rgba(32, 31, 28, .15);--color-tint-ink-18: rgba(32, 31, 28, .18);--color-tint-ink-30: rgba(32, 31, 28, .3);--color-tint-ink-40: rgba(32, 31, 28, .4);--color-tint-ink-55: rgba(32, 31, 28, .55);--color-tint-white-20: rgba(255, 255, 255, .2);--color-tint-white-22: rgba(255, 255, 255, .22);--color-tint-white-75: rgba(255, 255, 255, .75);--color-tint-gold-60: rgba(184, 144, 31, .6);--color-tint-gold-65: rgba(184, 144, 31, .65);--color-tint-black-15: rgba(0, 0, 0, .15);--color-tint-black-16: rgba(0, 0, 0, .16);--color-tint-black-18: rgba(0, 0, 0, .18);--color-tint-black-25: rgba(0, 0, 0, .25);--color-tint-black-35: rgba(0, 0, 0, .35);--color-tint-bg-94: rgba(244, 242, 238, .94);--radius-sm: .4rem;--radius-md: .75rem;--radius-lg: 1.25rem;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.5rem}:root{color-scheme:light;--color-mine: var(--color-water);--color-foe: var(--color-fire);--color-hp: var(--color-hp-safe)}*{box-sizing:border-box}html,body{margin:0;padding:0;width:100%;height:100%;overflow-x:hidden}body{background:var(--color-bg);color:var(--color-ink);font-family:-apple-system,BlinkMacSystemFont,Hiragino Sans,Yu Gothic,Noto Sans JP,sans-serif;line-height:1.5;-webkit-tap-highlight-color:transparent}button{font-family:inherit;color:inherit}.app{display:grid;height:100dvh;width:100%;gap:var(--space-2);padding:var(--space-2);grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto auto;grid-template-areas:"arena" "hand" "prompt" "log";min-height:0}.hand-section{grid-area:hand;min-width:0}.arena{grid-area:arena;min-width:0;min-height:0;overflow-y:auto}.arena-grid{display:flex;flex-direction:column;gap:var(--space-2);min-width:0}.arena-info{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);padding:var(--space-1) 0;min-width:0}.arena-vs{font-size:.75rem;font-weight:700;color:var(--color-muted);letter-spacing:.15em}.arena-turn{font-size:.82rem;font-weight:600;color:var(--color-ink)}.arena-turn-actor{color:var(--color-accent)}.arena-affinity{width:100%;max-width:30rem;text-align:center}.arena-affinity-label{margin:0 0 .4em;font-size:.7rem;color:var(--color-muted)}.affinity-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-1) var(--space-2)}.affinity-chip{display:inline-flex;align-items:center;gap:.35em;font-size:.72rem;font-weight:600;padding:.2em .6em;border-radius:999px;border:1px solid color-mix(in srgb,var(--card-glow, var(--color-border)) 55%,transparent);color:var(--color-ink);background:color-mix(in srgb,var(--card-glow, var(--color-border)) 10%,white)}.affinity-chip-dot{width:.55em;height:.55em;border-radius:999px;background:var(--card-glow, var(--color-muted));flex:0 0 auto}.arena-log-summary{list-style:none;margin:0;padding:0;display:none;flex-direction:column;gap:.2em;font-size:.74rem;color:var(--color-muted);text-align:center}.monster-stage{display:flex;flex-direction:row;align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-md);background:var(--color-surface);border:2px solid transparent;transition:border-color .2s ease,box-shadow .2s ease;min-width:0;width:100%}.monster-stage.is-active{border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-tint-accent-15, rgba(47, 111, 209, .15))}.monster-portrait{position:relative;flex:0 0 auto;width:clamp(3.5rem,12vw,5.5rem);aspect-ratio:1 / 1;border-radius:var(--radius-sm);overflow:hidden}.monster-portrait-mine .monster-silhouette{background:repeating-radial-gradient(circle at 50% 42%,var(--color-tint-white-22, rgba(255, 255, 255, .22)) 0 6%,transparent 6% 14%),linear-gradient(160deg,var(--color-mine),var(--color-seat-mine-shade, #16406e))}.monster-portrait-foe .monster-silhouette{background:repeating-linear-gradient(135deg,var(--color-tint-white-20, rgba(255, 255, 255, .2)) 0 6px,transparent 6px 15px),linear-gradient(160deg,var(--color-foe),var(--color-seat-foe-shade, #6e2214))}.monster-silhouette{position:absolute;inset:0;border-radius:var(--radius-sm);clip-path:polygon(50% 4%,80% 16%,94% 46%,82% 84%,50% 98%,18% 84%,6% 46%,20% 16%)}.monster-art{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;image-rendering:pixelated;display:none}.monster-art:not([src]){display:none}.monster-art[src]{display:block}.monster-art[src]~.monster-silhouette{display:none}.g-portrait-img{image-rendering:pixelated}.g-portrait:has(.g-portrait-img[src]) .g-portrait-glyph{display:none}@keyframes monster-hit-shake{0%,to{transform:translate(0)}20%{transform:translate(-4px)}40%{transform:translate(3px)}60%{transform:translate(-3px)}80%{transform:translate(2px)}}.monster-stage.is-hit .monster-portrait{animation:monster-hit-shake .4s ease-in-out}.monster-stage.is-hit .monster-silhouette{box-shadow:inset 0 0 0 999px var(--color-tint-danger-35, rgba(194, 59, 59, .35))}@keyframes dmg-pop{0%{opacity:0;transform:translate(-50%) scale(.8)}15%{opacity:1;transform:translate(-50%,-8px) scale(1.15)}35%{transform:translate(-50%,-12px) scale(1)}75%{opacity:1;transform:translate(-50%,-22px) scale(1)}to{opacity:0;transform:translate(-50%,-30px) scale(.95)}}.dmg-pop{position:absolute;left:50%;top:-.3rem;transform:translate(-50%);font-weight:800;font-size:.95rem;color:var(--color-hp-danger);text-shadow:0 1px 2px var(--color-tint-white-75, rgba(255, 255, 255, .75));animation:dmg-pop .52s ease-out forwards;pointer-events:none;z-index:3;white-space:nowrap}.monster-status{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:.2em}.monster-name-label{font-size:.92rem;font-weight:700;color:var(--color-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.monster-bars{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:0 var(--space-2)}.stat-bar{display:grid;grid-template-columns:1.6em minmax(2.5rem,1fr) auto;align-items:center;gap:.3em;font-size:.72rem;flex:1 1 6rem;min-width:0}.stat-bar-label{font-weight:700;color:var(--color-muted)}.stat-bar-track{height:.55rem;background:var(--color-surface-muted);border-radius:999px;overflow:hidden}.stat-bar-fill{height:100%;border-radius:999px}.stat-bar-hp .stat-bar-fill{background:var(--color-hp-safe);transition:background-color .2s ease}.stat-bar-hp .stat-bar-fill.is-danger{background:var(--color-hp-danger)}.stat-bar-mp .stat-bar-fill{background:var(--color-mp)}.stat-bar-value{font-variant-numeric:tabular-nums;white-space:nowrap}.stat-money{font-size:.78rem;font-weight:700;color:var(--color-muted);text-align:left;white-space:nowrap;flex:0 0 auto}.log-section{grid-area:log;background:var(--color-surface);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);display:flex;flex-direction:column;min-height:0;max-height:6.5rem;overflow:hidden}.log-section.is-expanded{max-height:45dvh}.log-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);margin-bottom:var(--space-1);flex:0 0 auto}.log-toggle-btn{min-height:32px;padding:0 var(--space-2);font-size:.78rem}.log-title{margin:0;font-size:.8rem;color:var(--color-muted)}.log-actions{display:flex;align-items:center;gap:var(--space-2)}.copy-status{font-size:.72rem;color:var(--color-muted)}.log-list{list-style:none;margin:0;padding:0;flex:1 1 auto;min-height:0;overflow-y:auto;font-size:.78rem;display:flex;flex-direction:column;gap:.2em}.prompt-section{grid-area:prompt;background:var(--color-surface);border-radius:var(--radius-md);padding:var(--space-3);min-height:0;max-height:30dvh;overflow-y:auto}.prompt-panel{display:flex;flex-direction:column;gap:var(--space-3)}.prompt-title{margin:0;font-weight:700}.prompt-hint{margin:0;font-size:.82rem;color:var(--color-muted)}.defend-attack-banner{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-2);padding:.5em .8em;border-radius:var(--radius-sm);border:2px solid var(--card-glow, var(--color-border));background:color-mix(in srgb,var(--card-glow, var(--color-border)) 12%,white)}.defend-attack-element{font-size:1.05rem;font-weight:800;color:var(--color-ink)}.defend-attack-power{font-size:.95rem;font-weight:700;font-variant-numeric:tabular-nums;color:var(--color-ink)}.defend-preview-line{margin:0;font-size:.85rem;font-weight:700;color:var(--color-muted)}.defend-preview-line.is-guard-ok{color:var(--color-accent)}.defend-preview-line.is-guard-ng{color:var(--color-danger)}.attack-summary{margin:0;font-size:.85rem;font-weight:700;color:var(--color-ink)}.card-rule.is-guard-ok{color:var(--color-accent);font-weight:800}.card-rule.is-guard-ng{color:var(--color-muted);font-weight:700}.card.card-defense-ok{box-shadow:0 0 0 3px var(--color-tint-accent-30, rgba(47, 111, 209, .3))}.card.card-defense-ng{opacity:.65}.prompt-message{margin:0;font-size:.9rem;color:var(--color-muted);text-align:center;padding:var(--space-4) 0}.prompt-body{display:flex;flex-direction:column;gap:var(--space-3)}.stepper{display:flex;align-items:center;gap:var(--space-2)}.stepper-label{font-size:.82rem;color:var(--color-muted);flex:1 1 auto}.stepper-value{min-width:2ch;text-align:center;font-variant-numeric:tabular-nums;font-weight:700}.btn{min-height:44px;min-width:44px;padding:0 var(--space-4);border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-surface);cursor:pointer;font-size:.9rem}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-step{min-width:44px;padding:0;font-size:1.1rem}.btn-primary{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-surface, #fff);width:100%}.btn-ghost{background:transparent}.pass-btn{align-self:flex-end}.sell-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-2);max-height:28vh;overflow-y:auto}.sell-btn{width:100%;text-align:left}.card-preview-root:empty{display:none}.card-preview-root{margin-bottom:var(--space-2)}@keyframes card-preview-in{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}.card-preview{display:flex;flex-direction:column;gap:.3em;position:relative;width:min(75vw,20rem);max-width:100%;margin:0 auto;padding:var(--space-3);border-radius:var(--radius-md);border:3px solid var(--color-border);background:var(--color-surface);text-align:left;transform-origin:center;animation:card-preview-in .18s ease-out;animation-fill-mode:both}@keyframes card-preview-out{0%,55%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.94)}}.card-preview-linger-out{animation:card-preview-out .9s ease-in both;pointer-events:none}.card-preview-top{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-2)}.card-preview-kind{font-size:.85rem;font-weight:800;color:var(--color-ink)}.card-preview-tier{font-size:.7rem;color:var(--color-muted);letter-spacing:.05em}.card-preview-element{font-size:.75rem;font-weight:700}.card-preview-badge{position:absolute;top:-.5rem;right:var(--space-3);display:inline-flex;align-items:center;gap:.25em;background:var(--color-surface);border:2px solid var(--card-glow, var(--color-border));border-radius:999px;padding:.15em .6em;font-size:.85rem;font-weight:800;font-variant-numeric:tabular-nums;box-shadow:0 1px 3px var(--color-tint-black-18, rgba(0, 0, 0, .18))}.card-preview-art{height:5.5rem;border-radius:var(--radius-sm);border:1px solid color-mix(in srgb,var(--card-glow, var(--color-border)) 70%,transparent);background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--card-glow, var(--color-border)) 62%,white) 0 18px,#fff 18px 32px)}.card-preview-name{font-size:1.25rem;font-weight:800;line-height:1.25}.card-preview-effect{min-height:1.4em;padding-top:.4em;border-top:1px solid var(--color-border);font-size:.85rem;line-height:1.4;color:var(--color-muted)}.hand-tray{display:flex;gap:var(--space-2);overflow-x:auto;padding:var(--space-2) var(--space-1) var(--space-3);scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}.hand-empty{color:var(--color-muted);font-size:.85rem;padding:var(--space-3)}.card{position:relative;flex:0 0 auto;scroll-snap-align:start;width:clamp(5rem,calc((100% - 3 * var(--space-2)) / 4),7.5rem);min-height:10.8rem;padding:.5rem .4rem .4rem;border-radius:var(--radius-sm);border:2px solid var(--color-border);background:var(--color-surface);display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:.35em;text-align:center;cursor:pointer;font-size:.72rem;touch-action:manipulation}.card.is-selected{border-color:var(--color-accent);box-shadow:0 0 0 2px var(--color-tint-accent-20, rgba(47, 111, 209, .2))}.card.is-disabled{opacity:.8;cursor:not-allowed}.card.is-waiting{cursor:default}.card-top{display:flex;align-items:center;justify-content:space-between;gap:.3em}.card-kind{font-size:.85rem;font-weight:800;color:var(--color-ink);text-align:left;white-space:nowrap;letter-spacing:.01em}.card-tier-marks,.card-preview-tier{font-size:.62rem;color:var(--color-muted);letter-spacing:.06em;white-space:nowrap}.card-badge{position:absolute;top:-.5rem;right:-.35rem;display:inline-flex;align-items:center;gap:.2em;background:var(--color-surface);border:1.5px solid var(--card-glow, var(--color-border));border-radius:999px;padding:.08rem .45rem;font-size:.7rem;font-weight:800;font-variant-numeric:tabular-nums;box-shadow:0 1px 2px var(--color-tint-black-16, rgba(0, 0, 0, .16));z-index:2}.card-badge-icon{font-size:.72rem;line-height:1}.card-art{flex:1 1 auto;min-height:2.2rem;border-radius:.3rem;border:1px solid color-mix(in srgb,var(--card-glow, var(--color-border)) 70%,transparent);background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--card-glow, var(--color-border)) 62%,white) 0 18px,#fff 18px 32px)}.card-name{font-weight:700;line-height:1.25;letter-spacing:.01em;font-size:.95rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card-rule{flex:0 0 auto;min-height:2.6rem;margin-top:.1em;padding-top:.3em;border-top:1px solid var(--color-border);font-size:.68rem;line-height:1.35;color:var(--color-muted);text-align:left;overflow:hidden}.card-el-water{border-color:var(--color-water);--card-glow: var(--color-water)}.card-el-fire{border-color:var(--color-fire);--card-glow: var(--color-fire)}.card-el-wood{border-color:var(--color-wood);--card-glow: var(--color-wood)}.card-el-stone{border-color:var(--color-stone);--card-glow: var(--color-stone)}.card-el-light{border-color:var(--color-light);--card-glow: var(--color-light)}.card-el-dark{border-color:var(--color-dark);--card-glow: var(--color-dark)}.card-el-none{border-color:var(--color-border);--card-glow: var(--color-border)}@keyframes card-play-move{0%{transform:translate(0) scale(1);opacity:1}to{transform:translate(var(--play-dx, 0),var(--play-dy, 0)) scale(.55);opacity:0}}.card.card-playing{animation:card-play-move .28s ease-out forwards;pointer-events:none;z-index:5}.card-ghost{position:fixed;pointer-events:none;z-index:50}@keyframes card-draw-in{0%{opacity:0;transform:translateY(10px) scale(.92)}to{opacity:1;transform:translateY(0) scale(1)}}.card-draw-in{animation:card-draw-in .18s ease-out both;animation-delay:var(--draw-delay, 0ms)}.card.is-selected.card-el-water{box-shadow:0 0 0 2px var(--color-tint-water-25, rgba(47, 127, 209, .25))}.card-tier-1 .card-tier-marks,.card-preview.card-tier-1 .card-preview-tier{opacity:1}.card-tier-2 .card-tier-marks,.card-preview.card-tier-2 .card-preview-tier{color:var(--color-ink)}.card-tier-3 .card-tier-marks,.card-preview.card-tier-3 .card-preview-tier{color:var(--color-ink);font-weight:700}.card.card-tier-1{border-width:1px}.card.card-tier-2{border-width:3px;box-shadow:0 0 .28rem color-mix(in srgb,var(--card-glow, var(--color-border)) 40%,transparent)}.card.card-tier-3{border-width:5px;box-shadow:0 0 .55rem color-mix(in srgb,var(--card-glow, var(--color-border)) 55%,transparent)}.card-preview.card-tier-1{border-width:2px}.card-preview.card-tier-2{border-width:4px}.card-preview.card-tier-3{border-width:6px;box-shadow:0 0 .75rem color-mix(in srgb,var(--card-glow, var(--color-border)) 55%,transparent)}.end-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:var(--color-tint-ink-55, rgba(32, 31, 28, .55));padding:var(--space-4);z-index:10}.end-overlay.hidden{display:none}.end-card{background:var(--color-surface);border-radius:var(--radius-lg);padding:var(--space-5);max-width:90vw;width:22rem;text-align:center;display:flex;flex-direction:column;gap:var(--space-3)}.end-card h2{margin:0}.end-card p{margin:0;color:var(--color-muted)}@media(min-width:640px){.card{width:7rem}}@media(prefers-reduced-motion:reduce){.card,.card-preview,.card-preview-linger-out,.card-playing,.card-draw-in,.monster-stage,.monster-portrait,.stat-bar-fill{animation:none!important;transition:none!important}.dmg-pop{display:none!important}}.log-toggle-btn{display:inline-flex}@media(max-width:899px){.card-preview-root:not(:empty){position:fixed;inset:0;display:flex;align-items:center;justify-content:center;margin-bottom:0;padding:var(--space-4);background:var(--color-tint-ink-40, rgba(32, 31, 28, .4));z-index:20;pointer-events:none}.card-preview{box-shadow:0 14px 32px var(--color-tint-ink-30, rgba(32, 31, 28, .3));padding:var(--space-3);gap:.35em}.card-preview-art{height:4.5rem}}@media(min-width:900px){.app{padding:var(--space-4);grid-template-columns:300px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;grid-template-areas:"prompt arena" "log arena" "hand hand"}.monster-portrait{width:clamp(13rem,24vh,20rem)}.monster-stage{padding:var(--space-4);gap:var(--space-4)}.monster-name-label{font-size:1.15rem}.hand-tray{justify-content:center}.arena{display:flex;flex-direction:column;height:100%}.arena-grid{flex:1 1 auto;justify-content:center;gap:var(--space-3)}.arena-info{flex:0 1 auto;justify-content:center;gap:var(--space-2);padding:var(--space-1) 0}.arena-turn{font-size:1rem}.arena-affinity-label{font-size:.78rem}.affinity-chip{font-size:.8rem;padding:.3em .8em}.arena-log-summary{display:flex;font-size:.82rem;max-width:32rem}.log-section{max-height:none;flex:1 1 auto;min-height:0}.log-toggle-btn{display:none}}