:root{font-family:Arial,Helvetica,sans-serif;color:#15263b;background:#f4f0e7;font-synthesis:none}*{box-sizing:border-box}body{margin:0}header,footer{max-width:1440px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:25px 5%;gap:20px}header{border-bottom:1px solid #ccc9be}.brand{text-decoration:none;color:inherit;font-size:26px;font-weight:900;letter-spacing:-2px}.brand span{font-size:10px;letter-spacing:1.6px;margin-left:15px;vertical-align:middle}.stamp{font-size:10px;font-weight:bold;letter-spacing:2px;color:#a53e37;border:1px solid #a53e37;padding:9px;transform:rotate(-3deg)}main{max-width:1440px;margin:auto;padding:58px 5%;min-height:78vh;display:flow-root}.intro{float:left;width:58%;padding-right:35px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:bold;margin:0 0 22px;color:#a33c34}h1{font-size:clamp(50px,5.5vw,82px);letter-spacing:-4px;line-height:1.02;margin:24px 0}h1 em{font-family:Georgia,serif;font-weight:normal;color:#ad3e36}.lede{font-size:21px;line-height:1.5;color:#526071}.facts{display:flex;flex-wrap:wrap;gap:10px;margin:30px 0}.facts span{border:1px solid #d0cbbf;padding:9px 12px;font-size:11px}.panel{border:1px solid #d6d0c3;background:#fbf9f3;padding:30px}.entry{float:right;width:38%}h2{font-size:27px;letter-spacing:-.7px;margin:0 0 20px}h3{margin:0 0 20px}label{font-size:12px;font-weight:bold;display:block}input,select{width:100%;font:inherit;font-size:16px;border:1px solid #c8c5bd;padding:13px;background:#fffdf9;color:#15263b;border-radius:3px;margin:9px 0 18px}button{font:inherit;font-size:13px;font-weight:bold;border:1px solid #b8bebf;background:transparent;color:#15263b;padding:13px 17px;border-radius:3px;cursor:pointer;transition:background .15s,transform .15s}button:hover:not(:disabled){background:#e5e0d4;transform:translateY(-2px)}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #c47838;outline-offset:3px}button:disabled{opacity:.48;cursor:default}.primary{background:#a83b33;color:#fff;border-color:#a83b33}.primary:hover:not(:disabled){background:#872e29}form button{width:100%;display:flex;justify-content:space-between}.divider{text-align:center;margin:22px 0;color:#7f827e;font-size:9px;letter-spacing:2px}.muted{font-size:12px;color:#68717b;line-height:1.6}.how{clear:both;padding-top:55px;display:grid;grid-template-columns:repeat(3,1fr);gap:32px}.how>div{border-top:2px solid #15263b;padding-top:17px}.how b{font-size:10px;letter-spacing:1.5px}.how p{font-family:Georgia,serif;font-size:17px;line-height:1.5;color:#58616a}footer{border-top:1px solid #ccc9be;font-size:9px;letter-spacing:1.3px;color:#636e77}footer span{letter-spacing:.5px}#notice:not(:empty){position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#15263b;color:white;padding:16px 22px;border-radius:4px;max-width:90%;z-index:9;font-size:14px}.roomtop{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.roomtop .eyebrow{margin-bottom:8px}.roomtitle{font-size:34px;letter-spacing:-1px;margin:0}.roomtitle span{letter-spacing:4px}.game-layout{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:28px}.roster{align-self:start;padding:23px}.person{display:flex;align-items:center;gap:10px;border-top:1px solid #ddd7cd;padding:17px 0}.person>div{flex:1;min-width:0;overflow-wrap:anywhere}.person b{font-size:13px}.person small{display:block;font-size:9px;letter-spacing:1px;color:#74808a;margin-top:7px}.person>strong{font-family:Georgia,serif;font-size:24px}.remove{padding:2px 7px}.controls{display:flex;align-items:center;flex-wrap:wrap;gap:15px;margin:25px 0}.controls label{width:110px}.controls select{margin:7px 0}.lobby p{line-height:1.65}.roundbar{display:flex;justify-content:space-between;gap:10px;font-size:10px;letter-spacing:1px;margin-bottom:20px}.table{display:grid;grid-template-columns:240px minmax(0,1fr);gap:26px}.prompt{background:#15263b;color:#fffdf4;padding:25px;border-radius:5px;min-height:320px;display:flex;flex-direction:column;box-shadow:5px 5px 0 #dbd4c5}.prompt .eyebrow{color:#d9b9a0;font-size:9px}.prompt h2{font-size:25px;line-height:1.35}.prompt>span{font-size:10px;margin-top:auto;padding-top:20px}.round-content h2{font-family:Georgia,serif;font-weight:normal;font-size:26px;line-height:1.3}.round-content>p:not(.eyebrow){font-size:13px;line-height:1.6;color:#66717b}.waiting{margin-top:30px;border-top:1px solid #c8c5bd;padding-top:20px;font-size:12px;color:#66717b}.answers{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:20px}.answer{background:#fffdf8;text-align:left;min-height:170px;padding:18px;font-size:16px;line-height:1.4;font-weight:600;border-color:#d5cfc1;box-shadow:0 3px 0 #ded8ca;overflow-wrap:anywhere}.answer:disabled{opacity:1}.answer.winner{border:2px solid #a83b33;background:#f5e5d8}.answer small{display:block;color:#a83b33;font-size:9px;letter-spacing:1px;margin-top:20px}.hand{margin-top:35px}.section-title{display:flex;justify-content:space-between;gap:10px;align-items:center}.section-title span{font-size:9px;letter-spacing:1px}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:12px;margin-bottom:22px}.hand-card{min-height:190px;font-size:14px}.hand-card.selected{border:2px solid #a83b33;background:#f5e5d8;transform:translateY(-5px)}@media(max-width:1000px){.game-layout{grid-template-columns:1fr}.roster{margin-top:10px}.table{grid-template-columns:220px minmax(0,1fr)}.intro{width:54%}.entry{width:44%}.brand span{display:none}}@media(max-width:650px){header,footer{padding:20px 6%}.stamp{font-size:8px}main{padding:32px 6%}.intro,.entry{float:none;width:100%;padding-right:0}.entry{margin-top:30px}h1{font-size:53px;letter-spacing:-2.5px}.lede{font-size:18px}.how{grid-template-columns:1fr;gap:15px;padding-top:35px}.table{grid-template-columns:1fr}.prompt{min-height:240px}.prompt h2{font-size:27px}.roundbar{font-size:9px;flex-wrap:wrap}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.hand-card{min-height:170px}.roomtitle{font-size:26px}.roomtop{gap:12px}footer{align-items:start;flex-direction:column}.panel{padding:23px}}

.check{display:flex;gap:10px;align-items:center;margin:15px 0;line-height:1.5}.check input{width:18px;margin:0}.sealed{border:2px dashed #c5bfb2;padding:25px;text-align:center;color:#737b82;margin:20px 0}.winner-spotlight{background:#e8dfca;border-left:4px solid #a83b33;padding:22px;margin:20px 0}.winner-spotlight>p:not(.eyebrow){font:21px/1.5 Georgia,serif}.winner-spotlight>span{font-size:12px}.feedback{margin-top:40px;clear:both}.feedback h3{margin:0}.feedback .eyebrow{margin-bottom:10px}.feedback-tools{display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:12px;margin-top:20px}textarea{width:100%;background:#fffdf9;border:1px solid #c8c5bd;color:#15263b;font:15px/1.5 Arial;padding:12px;margin-top:8px;resize:vertical}#feedback-body{max-width:850px;margin-top:25px}#feedback-body select{max-width:100%}[hidden]{display:none!important}@media(max-width:650px){.feedback .section-title,.feedback-tools{align-items:start;flex-direction:column}}
main :is(.cards,.answers){display:flex;flex-wrap:nowrap;overflow-x:auto;gap:12px;padding:8px 4px 14px;scroll-snap-type:x proximity;overscroll-behavior-x:contain}
main :is(.cards,.answers)>.answer{flex:0 0 175px;scroll-snap-align:start}

.game-layout>div,.round-content,.hand{min-width:0}
main .cards,main .answers{display:flex;flex-flow:row nowrap;width:100%;max-width:100%;overflow-x:auto}
main .cards>.answer{flex:0 0 clamp(140px,calc((100% - 72px)/7),175px)}

/* Use the space beneath the compact scoreboard for the complete hand. */
.game-layout>.hand{grid-column:1/-1;margin-top:4px}
.roster{padding:18px 20px}.roster .eyebrow{margin-bottom:12px}.roster h3{margin-bottom:12px}.roster .person{padding:10px 0}.roster .muted{margin:10px 0;font-size:11px}.roster>button{padding:10px 12px}
@media(min-width:1001px){main .cards{overflow-x:visible}main .cards>.answer{flex:1 1 0;min-width:0;font-size:14px;padding:16px 12px}}

/* Compact the hand so its action stays close to the cards. */
main .cards>.hand-card{min-height:140px;padding:12px;font-size:13px;line-height:1.35}
.hand .section-title h3{margin-bottom:10px}
main .cards{margin-bottom:10px;padding-top:5px;padding-bottom:8px}
.hand>#submit{padding:11px 16px}

/* Keep the game identity visible throughout every round. */
header .brand{display:flex;flex-direction:column;gap:8px;letter-spacing:-1px}
header .brand strong{font-size:clamp(24px,3vw,38px);line-height:1.1}
header .brand em{font-family:Georgia,serif;color:#a83b33}
header .brand span{display:block;margin:0;font-size:10px;letter-spacing:1.8px}
@media(max-width:650px){header{align-items:flex-start;gap:12px}header .brand strong{font-size:25px}header .brand span{font-size:8px;letter-spacing:1px}header .stamp{font-size:7px;padding:6px;letter-spacing:1px}}

.game-heading{border-bottom:2px solid #15263b;margin-bottom:22px;padding-bottom:18px}.game-heading h1{font-size:clamp(32px,4vw,54px);letter-spacing:-2px;margin:0 0 10px;line-height:1.05}.game-heading p{font-size:13px;color:#65717c;margin:0}.game-heading+.roomtop{margin-bottom:20px}.game-heading+.roomtop .roomtitle{font-size:23px}

/* Compact desktop play surface. Editorial tools remain below the game. */
@media(min-width:1001px){
 body:has(.game-heading) header{padding-top:12px;padding-bottom:12px}
 body:has(.game-heading) main{padding-top:18px;padding-bottom:20px;min-height:0}
 .game-heading{padding-bottom:10px;margin-bottom:12px}
 .game-heading h1{font-size:36px;margin-bottom:5px}
 .game-heading p{font-size:11px}
 .game-heading+.roomtop{margin-bottom:12px}
 .roomtop .eyebrow{margin-bottom:4px;font-size:9px}
 .game-heading+.roomtop .roomtitle{font-size:20px}
 .roomtop>button{padding:8px 12px}
 .game-layout{gap:14px 22px}
 .roundbar{margin-bottom:10px;font-size:9px}
 .prompt{min-height:220px;padding:18px}
 .prompt .eyebrow{margin-bottom:12px}
 .prompt h2{font-size:21px;line-height:1.25;margin-bottom:10px}
 .prompt>span{padding-top:10px}
 .round-content>.eyebrow{margin-bottom:12px}
 .round-content h2{font-size:24px;margin-bottom:12px}
 .waiting{margin-top:16px;padding-top:12px}
 .roster{padding:14px 16px}
 .roster .eyebrow{margin-bottom:8px}
 .roster h3{font-size:16px;margin-bottom:8px}
 .roster .person{padding:7px 0}
 .person small{margin-top:4px;font-size:8px}
 .person>strong{font-size:20px}
 .roster .muted{font-size:10px;line-height:1.35;margin:8px 0}
 .roster>button{font-size:11px;padding:8px}
 .game-layout>.hand{margin-top:0}
 .hand .section-title h3{font-size:16px;margin-bottom:6px}
 main .cards>.hand-card{min-height:116px;padding:10px;font-size:12px;line-height:1.3}
 main .cards{padding-top:5px;padding-bottom:7px;margin-bottom:6px}
 .hand>#submit{padding:9px 14px;font-size:12px}
 main .answers>.answer{min-height:125px;padding:12px;font-size:14px}
 .winner-spotlight{margin:12px 0;padding:14px}
 .winner-spotlight .eyebrow{margin-bottom:8px}
 .winner-spotlight>p:not(.eyebrow){font-size:17px;margin:8px 0}
 .sealed{padding:14px;margin:12px 0}
 .feedback{margin-top:25px}
}
