.duel-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px}.duel-tag{font-size:11px;color:#53665c}.duel-lobby{display:grid;grid-template-columns:1fr 1fr;gap:20px}.duel-lobby .panel{margin:0;padding:27px}.duel-lobby h2{font-size:21px;margin:8px 0 14px}.duel-lobby p,.duel-help{line-height:1.9;color:#53665c;font-size:13px}.duel-lobby button{margin-top:12px}.duel-lobby label{display:block;margin-top:20px;font-size:12px}.duel-lobby input{display:block;width:100%;padding:13px;border:1px solid #bacac1;border-radius:6px;margin:14px 0 0;font:inherit}.duel-message{min-height:24px;line-height:1.7;font-size:13px;color:#425e50}.duel-room{background:white;border:1px solid #bdcfc3;border-radius:12px;padding:23px}.duel-room code{display:block;overflow-wrap:anywhere;background:#eff4f1;padding:13px;border-radius:6px;margin:14px 0;font-size:13px}.duel-room button{margin-right:9px}.duel-match{background:white;border:1px solid #bdcfc3;border-radius:12px;overflow:hidden}.duel-score{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:14px 22px;gap:14px}.duel-score>div:last-child{text-align:right}.duel-score b{display:block;font-size:29px;color:#13523b}.duel-score span{font-size:12px;overflow-wrap:anywhere}.duel-score small{font-size:19px;font-weight:700;color:#244c3a;text-align:center;line-height:1.8}.duel-stage{position:relative;background:#203a31}.duel-stage canvas{display:block;width:100%;height:auto;aspect-ratio:1000/620}.duel-stage-label{position:absolute;left:18px;top:15px;background:#172e29dd;color:white;border-radius:5px;padding:7px 12px;font-size:12px;pointer-events:none}.duel-instructions{padding:13px 22px 16px;color:#fff;min-height:113px}.duel-phase{display:flex;justify-content:space-between;align-items:center;gap:12px;font-weight:700;font-size:14px}.duel-timer{font-size:21px;font-variant-numeric:tabular-nums;color:#ffd29a}.duel-sequence{display:flex;justify-content:center;gap:8px;margin:10px 0 0;min-height:46px}.duel-key{height:46px;min-width:46px;border:2px solid #9aada1;border-radius:7px;display:grid;place-items:center;font-size:25px;background:#f6f8f6;color:#365347}.duel-key.done{background:#93d0a9;border-color:#68a77f;color:#154b30}.duel-key.current{border-color:#efad55;box-shadow:0 0 0 3px #e6bc8433}.duel-key.error{background:#ffe1d9;border-color:#b75b48}.duel-hint{display:none}.duel-pad{display:none;gap:10px;justify-content:center;padding:12px 18px;background:#e5eee8}.duel-pad button{height:52px;min-width:60px;background:#214d3a;color:white;border-radius:7px;font-size:25px;touch-action:none}.duel-pad button:active{background:#438362}.duel-pad button:disabled{opacity:.35}.duel-footer{display:flex;justify-content:space-between;gap:12px;padding:10px 20px;border-top:1px solid #e2e8e3;align-items:center}.duel-footer button{font-size:12px}.duel-summary{margin-top:18px;padding:24px;background:#e2eee5;border-radius:10px}.duel-summary h2{margin:0 0 12px}.duel-summary p{line-height:1.8}.duel-input,.duel-input *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.duel-pad{touch-action:none}.duel-badge{font-size:11px;color:#97723d;background:#faf0dd;padding:7px 10px;border-radius:5px}.duel-live-note{font-size:11px;color:#607266;line-height:1.8;margin-top:17px}.duel-playing .duel-heading{display:none}.duel-playing .duel-message{margin:0 0 12px;min-height:18px}.duel-playing{padding-top:22px}
@media(pointer:coarse){.duel-pad{display:flex}}
@media(max-width:850px){#duel-page{padding:22px 12px}.duel-heading{align-items:flex-start}.duel-heading h1{font-size:24px}.duel-lobby{grid-template-columns:1fr}.duel-score{padding:12px 14px;gap:8px}.duel-score b{font-size:25px}.duel-instructions{padding:12px;min-height:105px}.duel-phase{font-size:12px}.duel-sequence{gap:4px}.duel-key{min-width:30px;width:calc((100% - 28px)/8);max-width:43px;height:42px;font-size:23px}.duel-pad{display:flex;gap:8px}.duel-pad button{flex:1;min-width:0;height:52px}.duel-footer{padding:10px 12px}.duel-badge{font-size:10px}.duel-tag{display:none}.sidebar .nav{padding-left:8px;padding-right:8px}.sidebar .nav span{font-size:11px}.duel-playing .duel-message{font-size:11px}body:has(#duel-page.duel-playing)>.sidebar,body:has(#duel-page.duel-playing) main>header{display:none}#duel-page.duel-playing{padding:0}#duel-page.duel-playing .duel-message{padding:8px 12px;margin:0}#duel-page.duel-playing .duel-match{border-radius:0;border-left:0;border-right:0}}
@media(max-width:480px){.sidebar{padding:12px;gap:4px}.sidebar .nav{padding:8px 4px}.sidebar .nav span{font-size:10px;white-space:nowrap}}
@media(min-width:851px){.duel-stage canvas{height:clamp(300px,calc(100svh - 325px),620px)}}

#duel-page{position:relative}.duel-exit{display:none}#duel-page:has(#duel-game:not([hidden]))>.duel-exit{display:block;position:absolute;right:44px;top:24px;font-size:12px}.duel-playing .duel-message{padding-right:110px}.duel-stage{overflow:hidden}.duel-instructions{min-height:100px;padding-top:14px;padding-bottom:14px}.duel-timer{display:none}
@media(max-width:850px){.duel-score small{font-size:16px}#duel-page:has(#duel-game:not([hidden]))>.duel-exit{right:12px;top:8px}.duel-playing .duel-message{padding-right:100px!important}.duel-pad{background:#203a31;border-top:1px solid #496357}}

/* Larger navigation labels and touch targets across every game page. */
.sidebar .nav{min-height:52px;padding:17px 13px}.sidebar .nav span{font-size:16px}.sidebar .nav small{font-size:9px}main>header .breadcrumb b{font-size:16px}
@media(max-width:850px){.sidebar{flex-wrap:wrap;gap:8px}.sidebar .brand{flex-basis:100%;text-align:center;margin:0 0 6px}.sidebar .nav{flex:1 1 auto;justify-content:center;min-height:46px;padding:12px 9px}.sidebar .nav span{font-size:14px}}
@media(max-width:480px){.sidebar{padding:12px;gap:6px}.sidebar .nav{flex:1 1 calc(33.333% - 6px);padding:12px 8px}.sidebar .nav span{font-size:14px;white-space:nowrap}}
