:root{font-size:16px}html,body{height:100%;overflow:hidden}body{background:#eaf7ff}.play-shell{height:100vh;height:100dvh;max-width:1400px;margin:auto;padding:12px;display:flex;flex-direction:column;gap:6px}.join-panel{max-width:520px;margin:auto;width:100%;padding:24px;border:3px solid #009fe4;border-radius:24px;background:#fff}.join-panel h1{font-size:30px}.join-panel button{margin-top:16px}#lobby{display:flex;flex:1;min-height:0;flex-direction:column;gap:8px}.play-header{background:#083b72;border-radius:14px;color:white;padding:10px 16px;display:flex;align-items:center;gap:14px}.play-header>div{flex:1;min-width:0}.play-header strong{display:block;font-size:19px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.play-header #identity{display:block;font-size:13px}.play-header #connection{font-size:13px}.play-header button{padding:10px;min-height:44px}.play-status{display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-height:44px}.play-status p{margin:0;font-size:14px}.play-status #progress{flex:1}.play-status .phase-clock{padding:8px 14px;font-size:17px;margin:0;min-width:180px;text-align:center}.play-status #gameClock{flex-basis:100%;font-size:12px}#playTabs{display:flex;gap:6px}#playTabs button{flex:1;min-height:44px;padding:10px 8px;white-space:normal;background:#d6ecfb;color:#083b72;font-size:14px}#playTabs button[aria-pressed=true]{background:#086faa;color:white}#gameplay{flex:1;min-height:0;display:flex;flex-direction:column;border:3px solid #03a7e4;border-radius:22px;background:#fff;padding:18px;overflow:hidden;position:relative}#boardAction{display:flex;flex-direction:column;gap:10px;flex:1;min-height:0}#boardAction h2{font-size:clamp(20px,2.3vw,28px);line-height:1.2;margin:0}#boardAction h3{font-size:18px;margin:0}#boardAction p{margin:0;line-height:1.35}.readable{overflow-wrap:anywhere}.read-more{padding:4px 10px;min-height:36px;font-size:13px;margin-left:6px}.task-footer{margin-top:auto;display:flex;gap:10px;align-items:center;flex-wrap:wrap}.task-footer>button{min-height:46px}.subtle{font-size:14px;color:#426181}.answer-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}#answerForm{display:flex;flex:1;min-height:0;flex-direction:column;gap:12px}#answerForm fieldset{border:0;margin:0;padding:0;min-width:0}#answerForm legend{font-size:14px;margin-bottom:8px}#answerForm .choice{margin:0;padding:14px;min-height:65px;display:flex;align-items:center;border:2px solid #9fd4ef;border-radius:12px;font-size:17px;font-weight:500;background:#f4fbff}#answerForm .choice input{width:22px;height:22px;flex:none;margin-right:12px}#answerForm textarea{width:100%;height:110px;min-height:60px;max-height:25vh;resize:none;border:2px solid #9fd4ef;border-radius:12px;padding:12px;font:inherit}#answerForm>label{margin:0}#answerForm .submit-row{margin-top:auto;display:flex;gap:12px;align-items:center}#answerForm .submit-row button{min-height:48px}.choice-readers{display:flex;gap:10px;flex-wrap:wrap}.jury-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.jury-grid>section{padding:14px;border-radius:14px;background:#edf8ff;min-width:0}.jury-grid h3{margin-bottom:8px!important}.rating-buttons{display:flex;gap:10px;margin:0}.rating-buttons button{min-height:48px;white-space:normal}.turn-options{display:flex;gap:12px}.turn-options button{white-space:normal;flex:1;min-height:64px}.dice-result{font-size:48px;margin:0;align-self:center;padding:10px 26px}.board-screen{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(180px,260px);align-items:center;gap:12px!important}.board-screen .board-wrap{height:100%;min-height:0;display:flex;align-items:center;justify-content:center}.board-screen svg{width:auto;max-width:100%;height:100%;max-height:100%}.board-screen .category-legend{display:grid;grid-template-columns:1fr;gap:8px;padding:0;margin:0}.board-screen .category-legend li{padding:10px;font-size:14px}.board-screen .board-players{display:none}.rank-list{padding:0;list-style:none;margin:0;display:grid;gap:8px}.rank-list li{padding:12px 16px;background:#edf7ff;border-radius:12px;display:flex;justify-content:space-between;gap:12px;font-size:18px}.rank-list li:first-child{background:#fff0b3}.rank-list .own{outline:2px solid #088cd3}.celebration{text-align:center;background:radial-gradient(ellipse at top,#fff1ac,#eaf8ff 70%)}.trophy{font-size:60px;line-height:1;animation:trophy-arrive .7s ease-out}.winner-names{font-size:23px;font-weight:800;color:#075283}.pin-burst{font-size:24px;letter-spacing:8px;color:#d88c00}dialog{width:min(960px,94vw);max-height:94dvh;border:3px solid #039be1;border-radius:22px;padding:24px;color:#082454;background:#f5fcff}dialog::backdrop{background:#062347b3}dialog h2{font-size:26px}.learn-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.learn-grid article{padding:16px;border-radius:16px;background:#dff3ff}.learn-grid article:nth-child(2){background:#e2f8de}.learn-grid article:nth-child(3){background:#fff0cb}.learn-icon{font-size:44px}.learn-grid h3{margin:8px 0}.learn-grid p{font-size:15px;line-height:1.4}.goal-line{font-weight:700}#readerText{white-space:pre-wrap;overflow-wrap:anywhere;font-size:18px;line-height:1.5;min-height:200px}.reader-controls{display:flex;gap:12px;align-items:center;justify-content:space-between}#error{margin:0;font-size:14px;max-height:42px;overflow:auto}#error:empty{display:none}@keyframes trophy-arrive{from{transform:scale(.5) rotate(-12deg);opacity:0}to{transform:scale(1);opacity:1}}@media(prefers-reduced-motion:reduce){.trophy{animation:none}}@media(max-height:700px){.play-shell{padding:8px}.play-header{padding:6px 12px}#gameplay{padding:12px}#boardAction{gap:8px}#answerForm .choice{padding:10px;min-height:54px}.trophy{font-size:44px}dialog{padding:16px}.learn-icon{font-size:30px}.learn-grid article{padding:10px}.learn-grid p{font-size:14px}}@media(max-width:600px){.play-header #connection{display:none}#playTabs button{font-size:12px;padding:6px}#gameplay{padding:12px}.play-status .phase-clock{min-width:140px;font-size:15px}#boardAction h2{font-size:20px}.answer-grid{gap:8px}#answerForm .choice{font-size:14px;padding:8px}.jury-grid{gap:8px}.jury-grid>section{padding:8px}.rating-buttons{gap:5px}.rating-buttons button{font-size:13px;padding:8px}.board-screen{grid-template-columns:1fr!important;grid-template-rows:minmax(0,1fr) auto}.board-screen .category-legend{grid-template-columns:repeat(3,1fr)}.board-screen .category-legend li{font-size:11px;padding:5px}.learn-grid{gap:6px}.learn-grid article{padding:8px}.learn-grid h3{font-size:15px}.learn-grid p{font-size:12px}.learn-icon{font-size:28px}dialog{padding:14px}dialog p{font-size:13px}#readerText{font-size:15px;min-height:120px}.reader-controls{flex-wrap:wrap}.rank-list li{font-size:15px;padding:10px}.turn-options button{font-size:14px;padding:10px}}
.play-header{margin:0;border:0;box-shadow:none}.play-header strong{color:white}#lobby .badge{margin:0}.rating-buttons{flex-direction:row}#boardAction>.eyebrow{letter-spacing:.8px}#boardAction .read-more{vertical-align:middle}.play-header #identity{color:#dfedff}.rank-list span{overflow-wrap:anywhere}.turn-options{margin-top:auto}#welcomeDialog h2{margin-top:0}#boardAction .task-footer{flex-shrink:0}

.move-task .move-board{flex:1;min-height:0;display:flex;justify-content:center;overflow:hidden}.move-board .board-wrap{height:100%;width:100%;min-height:0;margin:0;display:flex;justify-content:center}.move-board svg{height:100%;width:auto;max-width:100%;max-height:100%}.move-task .turn-options{flex-shrink:0;margin-top:0}.move-task .turn-options button{min-width:0;overflow-wrap:anywhere}.move-task h2{flex-shrink:0}

/* Give SVG a definite containing box. Avoid auto width with percentage heights in flex/grid. */
.board-screen{grid-template-rows:minmax(0,1fr);align-items:stretch}
.board-screen .board-wrap{position:relative;align-self:stretch;width:100%;height:auto;min-width:0;min-height:0;max-width:none;margin:0}
.board-screen .board-wrap svg{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;max-height:none}
.move-task .move-board{position:relative;min-width:0}
.move-board .board-wrap{position:absolute;inset:0;width:100%;height:100%;max-width:none;margin:0}
.move-board .board-wrap svg{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;max-height:none}
@media(max-width:600px){.board-screen{grid-template-rows:minmax(0,1fr) auto}}