:root{--c-bg: #1c1916;--c-bg-2: #262019;--c-paper: #f3ead9;--c-ink: #2a2620;--c-ink-soft: #6b6256;--c-paper-ink: #2a2620;--c-on-dark: #efe6d4;--c-on-dark-soft: #b3a892;--c-accent: #c0492f;--c-accent-soft: #d9785f;--c-gold: #c9a227;--c-jade: #4e7a5e;--c-slate: #4a5a6a;--c-win: var(--c-jade);--c-lose: var(--c-accent);--c-draw: var(--c-slate);--c-line: rgba(239, 230, 212, .16);--c-line-strong: rgba(239, 230, 212, .34);--c-card-back: #3a2f25;--c-surface: rgba(255, 248, 235, .06);--font-base: "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", serif;--font-ui: "Hiragino Sans", "Yu Gothic", "Noto Sans JP", system-ui, sans-serif;--fw-bold: 700;--space-1: 6px;--space-2: 12px;--space-3: 20px;--space-4: 32px;--space-5: 48px;--radius: 14px;--radius-lg: 22px;--shadow: 0 10px 30px rgba(0, 0, 0, .35);--shadow-soft: 0 4px 16px rgba(0, 0, 0, .25);--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}body{font-family:var(--font-ui);color:var(--c-on-dark);background:radial-gradient(120% 80% at 50% -10%,var(--c-bg-2),var(--c-bg) 70%);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overscroll-behavior:none}#root{display:flex;justify-content:center}.app-frame{width:100%;max-width:460px;min-height:100%;display:flex;flex-direction:column;padding:calc(var(--safe-top) + var(--space-2)) var(--space-3) calc(var(--safe-bottom) + var(--space-3));position:relative}.app-frame.battle{height:100dvh;min-height:0;overflow-y:auto;overflow-x:hidden}@media(max-height:720px){.app-frame.battle{gap:var(--space-1);padding-top:calc(var(--safe-top) + 6px);padding-bottom:calc(var(--safe-bottom) + 8px)}.app-frame.battle .me__hand .card:not(.card--sm){width:clamp(52px,11.5vh,92px);height:clamp(70px,15.5vh,124px)}.app-frame.battle .stage__big{font-size:clamp(1.6rem,6.5vh,3.2rem)}}h1,h2,h3{font-family:var(--font-base);font-weight:var(--fw-bold);letter-spacing:.04em;margin:0}button{font-family:var(--font-ui);cursor:pointer;border:none;background:none;color:inherit}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-1);padding:14px 20px;border-radius:var(--radius);font-size:1rem;font-weight:var(--fw-bold);background:var(--c-accent);color:#fff7ec;box-shadow:var(--shadow-soft);transition:transform .08s ease,opacity .15s ease,background .15s ease;min-height:52px}.btn:active{transform:translateY(1px) scale(.99)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn--ghost{background:transparent;color:var(--c-on-dark);border:1px solid var(--c-line-strong);box-shadow:none}.btn--gold{background:var(--c-gold);color:#2a2008}.btn--block{width:100%}.muted{color:var(--c-on-dark-soft)}.center{text-align:center}input.field{width:100%;padding:14px 16px;border-radius:var(--radius);border:1px solid var(--c-line-strong);background:var(--c-surface);color:var(--c-on-dark);font-size:1.05rem;font-family:var(--font-ui)}input.field::placeholder{color:var(--c-on-dark-soft)}.tag{display:inline-flex;align-items:center;gap:6px;font-size:.78rem;padding:5px 10px;border-radius:999px;border:1px solid var(--c-line);color:var(--c-on-dark-soft)}.dot{width:8px;height:8px;border-radius:50%;background:var(--c-jade);box-shadow:0 0 8px var(--c-jade)}@keyframes fadeUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes popIn{0%{opacity:0;transform:scale(.6)}60%{transform:scale(1.06)}to{opacity:1;transform:scale(1)}}.fade-up{animation:fadeUp .35s ease both}.menu{gap:var(--space-3)}.menu__bar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2)}.langtoggle{display:inline-flex;border:1px solid var(--c-line-strong);border-radius:999px;overflow:hidden}.langtoggle__btn{padding:7px 14px;font-size:.82rem;color:var(--c-on-dark-soft);font-weight:700}.langtoggle__btn.is-active{background:var(--c-accent);color:#fff7ec}.iconbtn{width:40px;height:40px;border-radius:50%;border:1px solid var(--c-line-strong);font-size:1.1rem;display:inline-flex;align-items:center;justify-content:center}.menu__hero{text-align:center;margin-top:var(--space-4)}.menu__kicker{font-size:.8rem;letter-spacing:.4em;color:var(--c-on-dark-soft);margin-bottom:var(--space-2)}.menu__title{font-size:clamp(2.2rem,8.5vw,3.2rem);letter-spacing:.1em;overflow-wrap:break-word;color:var(--c-on-dark);text-shadow:0 2px 18px rgba(0,0,0,.4)}.menu__title:after{content:"";display:block;width:56px;height:2px;margin:var(--space-2) auto 0;background:var(--c-accent)}.menu__lead{margin-top:var(--space-3);line-height:1.9;font-family:var(--font-base)}.menu__presence{display:flex;align-items:center;gap:8px;justify-content:center;font-size:.9rem;padding:10px;border-radius:var(--radius);background:var(--c-surface);border:1px solid var(--c-line)}.menu__field{display:block}.menu__field-label{display:block;font-size:.82rem;color:var(--c-on-dark-soft);margin-bottom:8px}.menu__modes{display:flex;flex-direction:column;gap:var(--space-2)}.menu__room{margin-top:var(--space-2);padding:var(--space-2) var(--space-3);border:1px solid rgba(201,162,39,.3);border-radius:var(--radius);background:#c9a2270f}.menu__room-label{display:block;font-size:.82rem;color:var(--c-on-dark-soft);margin-bottom:8px}.menu__room-row{display:flex;flex-direction:column;gap:var(--space-2)}.menu__room-input{width:100%;text-align:center;letter-spacing:.5em;text-indent:.5em;font-size:1.3rem}.menu__room-row .btn{width:100%;white-space:nowrap}.menu__room-wait{font-family:var(--font-base);font-size:1.3rem;color:var(--c-gold)}.menu__howto{align-self:center;color:var(--c-on-dark-soft);font-size:.9rem;padding:8px}.menu__rules{background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--radius);padding:var(--space-2) var(--space-3);font-size:.9rem;line-height:1.7}.menu__rules ul{margin:0;padding-left:1.1em}.menu__foot{margin-top:auto;padding-top:var(--space-4);font-family:var(--font-base);letter-spacing:.1em}.small{font-size:.8rem}.menu__streak{display:flex;align-items:center;gap:8px;justify-content:center;font-size:.95rem;padding:10px 14px;border-radius:var(--radius);background:#c9a2271a;border:1px solid rgba(201,162,39,.34);color:var(--c-gold)}.menu__streak b{font-size:1.25rem}.menu__streak-flame{font-size:1.1rem}.btn--x{background:#000;color:#fff;border:1px solid #2f2f2f}.btn--x:hover{background:#1a1a1a;border-color:#4a4a4a}.menu__streak-share{margin-left:auto;font-size:.78rem;padding:6px 12px;white-space:nowrap}.result__share{margin-top:10px;font-size:.85rem;padding:8px 16px}.menu__streak-reset{margin-left:auto;font-size:.76rem;color:var(--c-on-dark-soft);border:1px solid var(--c-line);border-radius:999px;padding:4px 10px}.field--error{border-color:var(--c-accent)}.menu__field-error{display:block;margin-top:6px;font-size:.8rem;color:var(--c-accent-soft)}.menu__abilities{margin-top:var(--space-2);display:flex;flex-direction:column;gap:8px}.menu__abilities-title{font-size:.82rem;color:var(--c-on-dark-soft);margin-bottom:2px}.ability-card{border:1px solid var(--c-line);border-radius:var(--radius);padding:10px 12px;background:#fff8eb08}.ability-card--mine{border-color:var(--c-gold);background:#c9a2271a}.ability-card__head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px}.ability-card__name{font-family:var(--font-base);font-size:1.05rem;font-weight:700;color:var(--c-gold);display:flex;align-items:center;gap:8px}.ability-card__you{font-family:var(--font-ui);font-size:.66rem;color:#2a2008;background:var(--c-gold);border-radius:999px;padding:2px 8px}.ability-card__timing{font-size:.72rem;color:var(--c-on-dark-soft);white-space:nowrap}.ability-card__detail{margin:0;font-size:.84rem;line-height:1.6;color:var(--c-on-dark)}.help-list{display:flex;flex-direction:column;gap:8px;max-height:56vh;overflow-y:auto;margin-bottom:var(--space-2)}.menu__howto-btn{margin-top:var(--space-1)}.rules-body{max-height:64vh;overflow-y:auto;display:flex;flex-direction:column;gap:var(--space-3);margin:var(--space-2) 0;padding-right:4px}.rules-sec__head{font-family:var(--font-base);font-size:1.05rem;color:var(--c-gold);margin-bottom:4px}.rules-sec__body{margin:0;font-size:.92rem;line-height:1.75;color:var(--c-on-dark)}.ranking{background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--radius);padding:var(--space-2) var(--space-3)}.ranking__title{font-family:var(--font-base);font-size:.95rem;color:var(--c-gold);margin-bottom:8px}.rank-tabs{display:flex;gap:6px;margin-bottom:12px}.rank-tab{flex:1;padding:8px 0;font:inherit;font-size:.85rem;color:var(--c-on-dark-soft);background:transparent;border:1px solid var(--c-line);border-radius:var(--radius);cursor:pointer;transition:background .15s,color .15s,border-color .15s}.rank-tab.is-active{color:#0a0a0a;background:var(--c-gold);border-color:var(--c-gold);font-weight:700}.ranking__empty{padding:16px 0}.ranking__list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:4px}.ranking__row{display:flex;align-items:center;gap:10px;font-size:.9rem;padding:4px 0;border-bottom:1px solid var(--c-line)}.ranking__row:last-child{border-bottom:none}.ranking__rank{width:22px;text-align:center;font-family:var(--font-base);color:var(--c-on-dark-soft)}.ranking__row:nth-child(1) .ranking__rank{color:var(--c-gold);font-weight:700}.ranking__name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ranking__streak{color:var(--c-gold);font-weight:700}.draft{flex:1;display:flex;flex-direction:column;justify-content:center;gap:var(--space-3)}.draft__cards{display:flex;flex-direction:column;gap:var(--space-2)}.draft__card{text-align:left;display:flex;flex-direction:column;gap:6px;padding:var(--space-3);border-radius:var(--radius-lg);border:1px solid rgba(201,162,39,.34);background:#c9a22714;transition:transform .08s ease,border-color .15s ease}.draft__card:active{transform:scale(.99)}.draft__card.is-chosen{border-color:var(--c-gold);background:#c9a2272e}.draft__card:disabled{opacity:.5}.draft__name{font-family:var(--font-base);font-size:1.5rem;font-weight:700;color:var(--c-gold)}.draft__detail{font-size:.9rem;line-height:1.6}.draft__timing{font-size:.76rem;color:var(--c-on-dark-soft)}.draft__waiting{margin-top:var(--space-2)}.waiting{margin:auto 0;display:flex;flex-direction:column;align-items:center;gap:var(--space-2)}.waiting__spinner{width:46px;height:46px;border-radius:50%;border:3px solid var(--c-line);border-top-color:var(--c-accent);animation:spin .9s linear infinite;margin-bottom:var(--space-2)}@keyframes spin{to{transform:rotate(360deg)}}.battle{gap:var(--space-2)}.battle__top{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2)}.battle__quit{width:36px;height:36px;border-radius:50%;border:1px solid var(--c-line);color:var(--c-on-dark-soft);font-size:1rem}.battle__turn{font-size:.95rem;letter-spacing:.08em}.battle__turn b{font-size:1.3rem;color:var(--c-accent-soft)}.battle__top-right{display:flex;align-items:center;gap:8px}.battle__help{width:36px;height:36px;border-radius:50%;border:1px solid var(--c-line-strong);color:var(--c-on-dark);font-size:1rem;font-weight:700}.battle__match{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:.76rem;color:var(--c-on-dark-soft);padding:0 4px}.battle__round{font-family:var(--font-base);color:var(--c-on-dark)}.battle__pips{display:flex;align-items:center;gap:8px}.battle__pips-side{letter-spacing:1px;color:var(--c-gold)}.opp,.me{background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--radius-lg);padding:var(--space-2) var(--space-3)}.opp__head{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-2)}.opp__name{font-family:var(--font-base);font-size:1.05rem}.opp__tags{display:flex;gap:6px}.tag--gold{color:var(--c-gold);border-color:var(--c-gold)}.opp__cards{display:flex;gap:8px;justify-content:center}.stage-area{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;position:relative}.stage{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;pointer-events:none}.stage__card{text-align:center;animation:popIn .35s ease both;padding:var(--space-3) var(--space-4)}.stage__big{font-family:var(--font-base);font-size:2.4rem;font-weight:var(--fw-bold);letter-spacing:.08em}.stage__big--muted{color:var(--c-on-dark-soft)}.stage__sub{margin-top:8px;color:var(--c-on-dark-soft);font-size:.9rem}.stage__card--ability .stage__big{color:var(--c-gold)}.stage__card--win .stage__big{color:var(--c-win)}.stage__card--lose .stage__big{color:var(--c-accent-soft)}.stage__card--draw .stage__big{color:var(--c-on-dark)}.stage__card--gold .stage__big{color:var(--c-gold)}.me{display:flex;flex-direction:column;gap:var(--space-2)}.me__head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2)}.me__name{font-family:var(--font-base);font-size:1.05rem}.me__name .muted{font-size:.8rem}.me__hand{display:flex;gap:var(--space-2);justify-content:center}.me__hand .card:not(.card--sm){width:clamp(64px,13vh,92px);height:clamp(86px,17.3vh,124px)}.me__set{margin-top:2px}.card{width:92px;height:124px;border-radius:12px;background:linear-gradient(160deg,#fbf4e6,#efe2c9);color:var(--c-paper-ink);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-soft);border:2px solid transparent;transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease;-webkit-user-select:none;user-select:none;overflow:hidden}.card--sm{width:72px;height:96px}.cardwrap{display:flex;flex-direction:column;align-items:center;gap:6px}.cardwrap__label{font-family:var(--font-base);font-size:.84rem;font-weight:700;color:var(--c-on-dark);white-space:nowrap}.cardwrap:has(.card--sm) .cardwrap__label{font-size:.74rem;color:var(--c-on-dark-soft)}.card:not(.card--back) .card__img{transform:scale(1.16)}.card--sm:not(.card--back) .card__img{transform:scale(1.34)}.card--interactive{cursor:pointer}.card--interactive:active{transform:scale(.97)}.card--selected{border-color:var(--c-accent);transform:translateY(-8px);box-shadow:0 12px 26px #c0492f66}.card--disabled{opacity:.55;cursor:default}.card--back{background:repeating-linear-gradient(45deg,#3a2f25,#3a2f25 6px,#443830 6px,#443830 12px);color:var(--c-on-dark-soft);border-color:#0000004d}.card__back-mark{font-family:var(--font-base);font-size:1.4rem;opacity:.5}.card__img{width:100%;height:100%;object-fit:cover}.card__placeholder{display:flex;flex-direction:column;align-items:center;gap:2px}.card__emoji{font-size:1.9rem;line-height:1}.card--sm .card__emoji{font-size:1.4rem}.card__kanji{font-family:var(--font-base);font-size:1.1rem;font-weight:700}.card--sm .card__kanji{font-size:.85rem}.card__label{font-size:.72rem;color:var(--c-ink-soft)}.card--sm .card__label{display:none}.timer{position:relative;width:64px;height:64px}.timer__track{fill:none;stroke:var(--c-line);stroke-width:5}.timer__bar{fill:none;stroke:var(--c-accent);stroke-width:5;stroke-linecap:round;transition:stroke-dashoffset .2s linear}.timer--urgent .timer__bar{stroke:var(--c-gold);animation:pulse .6s ease-in-out infinite}.timer__num{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.2rem}.timer--urgent .timer__num{color:var(--c-gold)}@keyframes pulse{50%{opacity:.4}}.ability-bar{display:flex;align-items:center;gap:var(--space-2);justify-content:space-between;padding:var(--space-2);border-radius:var(--radius);background:#c9a22714;border:1px solid rgba(201,162,39,.3)}.ability-bar__info{display:flex;flex-direction:column;gap:2px;font-size:.8rem;min-width:0}.ability-bar__info .muted{font-size:.76rem}.ability-bar__name{font-family:var(--font-base);font-size:1.05rem;color:var(--c-gold);font-weight:700}.ability-bar__name--auto{color:var(--c-on-dark-soft)}.ability-bar .btn{min-height:44px;padding:10px 16px;white-space:nowrap}.settings__mute,.settings__row{margin-bottom:var(--space-3)}.settings__row--off{opacity:.45}.settings__label{display:flex;justify-content:space-between;font-size:.9rem;margin-bottom:8px}.settings__val{color:var(--c-gold);font-weight:700}.settings__slider{width:100%;accent-color:var(--c-accent);height:28px}.modal__overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#080604b3;display:flex;align-items:flex-end;justify-content:center;z-index:50;padding:var(--space-3);padding-bottom:calc(var(--safe-bottom) + var(--space-3))}.modal{width:100%;max-width:420px;background:var(--c-bg-2);border:1px solid var(--c-line-strong);border-radius:var(--radius-lg);padding:var(--space-3);box-shadow:var(--shadow);animation:fadeUp .25s ease both}.modal__title{color:var(--c-gold);font-size:1.3rem}.modal__desc{margin:6px 0 var(--space-2);font-size:.85rem}.modal__q{margin:var(--space-2) 0 var(--space-1);font-size:.95rem}.modal__faces{display:flex;gap:var(--space-2)}.modal__faces .btn{flex:1}.modal__faces--col{flex-direction:column}.modal__cancel{margin-top:var(--space-3)}.result{display:flex;flex-direction:column;gap:var(--space-3)}.result__verdict{text-align:center;padding:var(--space-3);border-radius:var(--radius-lg);border:1px solid var(--c-line)}.result__verdict--win{background:#4e7a5e2e;border-color:var(--c-win)}.result__verdict--lose{background:#c0492f29;border-color:var(--c-accent)}.result__verdict--draw{background:var(--c-surface)}.result__verdict-title{font-family:var(--font-base);font-size:2.6rem;letter-spacing:.1em}.result__score{font-size:1.8rem;margin-top:6px;font-weight:700}.result__streak{margin-top:8px;font-size:1rem;color:var(--c-gold);font-weight:700}.result__round-label{font-family:var(--font-base);font-size:1rem;color:var(--c-on-dark-soft);margin-bottom:4px}.result__verdict-title--sm{font-size:1.9rem}.result__progress{margin-top:6px;font-size:1.05rem;font-weight:700}.result__abilities{display:flex;gap:var(--space-2);justify-content:center;flex-wrap:wrap}.result__turns{display:flex;flex-direction:column;gap:var(--space-2)}.reveal-row{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2);border-radius:var(--radius);background:var(--c-surface);border:1px solid var(--c-line)}.reveal-row__turn{font-family:var(--font-base);font-size:1.4rem;width:24px;text-align:center;color:var(--c-on-dark-soft)}.reveal-row__cards{display:flex;align-items:center;gap:6px}.reveal-row__vs{font-size:.8rem;color:var(--c-on-dark-soft)}.reveal-row__meta{display:flex;flex-direction:column;gap:3px;margin-left:auto;align-items:flex-end;font-size:.78rem}.reveal-row__res{font-family:var(--font-base);font-size:1.1rem}.reveal-row__res--win{color:var(--c-win)}.reveal-row__res--lose{color:var(--c-accent-soft)}.reveal-row__res--draw{color:var(--c-on-dark-soft)}.reveal-row__note.gold{color:var(--c-gold)}.reveal-row__note.win{color:var(--c-win)}.reveal-row__note.lose{color:var(--c-accent-soft)}.result__actions{display:flex;flex-direction:column;gap:var(--space-2);margin-top:auto}.walkover{margin:auto 0;text-align:center;display:flex;flex-direction:column;gap:var(--space-2)}.loading{margin:auto;color:var(--c-on-dark-soft)}.toast{position:fixed;left:50%;bottom:calc(var(--safe-bottom) + 24px);transform:translate(-50%);background:var(--c-ink);color:var(--c-on-dark);border:1px solid var(--c-line-strong);padding:12px 18px;border-radius:999px;font-size:.9rem;box-shadow:var(--shadow);z-index:80;animation:fadeUp .25s ease both}