/* Postal Apostles: watercolor correspondence and coastal colors. */
.theme-letters{--teal:#17646a;--blue:#783a50;--paper:#fff6df;--ink:#342c40;--gold:#d39835;color:var(--ink)}
.host.theme-letters{background:linear-gradient(#ffedcf12,#28394b12),url('/assets/postal-study-v4.png') center/cover fixed}.phone.theme-letters{background:#f1e4c5}.theme-letters .character-art,.theme-letters .portrait{filter:none}
.theme-letters button{background:#17646a;color:#fff7e4;border:2px solid #124950;border-radius:16px;box-shadow:0 3px 0 #124950}.theme-letters button.secondary,.theme-letters .letters-solve-toggle{background:#783a50;border-color:#582839;box-shadow:0 3px 0 #582839}.theme-letters button:disabled{opacity:.38}.theme-letters .player-card{background:transparent}.theme-letters .badge{background:#fff6df;color:#17646a}
.letters-playing #room{height:100%;display:flex;flex-direction:column;min-height:0}.letters-playing .layout{display:flex;flex-direction:column;flex:1;min-height:0;gap:8px}.letters-playing #gameplay{flex:1;display:flex;min-height:0}.letters-playing #controls{flex:none}.letters-playing #status:empty{display:none}.letters-playing .room-heading{flex:none;min-height:60px;margin-bottom:6px}.letters-playing .room-heading .solomon-logo{height:65px;width:220px}.letters-panel{width:100%;height:100%;min-height:0;box-sizing:border-box;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(6px,1vh,14px);background:#fff6e7f5;border:3px solid #be9862;border-radius:28px;padding:20px 28px;box-shadow:0 9px 0 #684d3833,0 16px 36px #33233530;text-align:center}
.letters-panel>p{margin:0}.letters-category,.letters-panel>.eyebrow{font-weight:900;font-size:clamp(13px,1.3vw,24px);letter-spacing:.15em;text-transform:uppercase;color:#783a50}.letters-clue{font-size:clamp(22px,2.1vw,38px);font-weight:700;line-height:1.2;max-width:1100px;text-wrap:balance}.letters-word{display:flex;gap:.8em;flex-wrap:wrap;justify-content:center;width:100%;flex:none}.letters-word-group{display:flex;gap:5px;max-width:100%}.letters-tile{line-height:1;box-sizing:border-box;display:grid;place-items:center;flex:0 1 auto;width:clamp(30px,4.2vw,70px);height:clamp(42px,5.4vw,88px);font-size:clamp(28px,3.5vw,58px);font-weight:900;border:2px solid #b89a76;border-radius:10px;background:#fffdf7;color:#17646a;box-shadow:0 4px 0 #c7af87}.hidden-letter{background:#eadbc1;border-bottom:5px solid #8d7254}.letters-route{display:flex;gap:12px;align-items:center;justify-content:center;flex:none}.route-stop{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;border:2px dashed #9b8060;font-weight:900;color:#9b8060}.route-stop.current{background:#d79932;color:#342c40;border:2px solid #a36915;transform:scale(1.12)}.route-stop.delivered{background:#17646a;color:white;border-color:#17646a}.letters-lock-count{font-size:20px;font-weight:800}.letters-roster{display:grid!important;grid-template-columns:repeat(var(--courier-columns),minmax(0,1fr));grid-template-rows:repeat(var(--courier-rows),minmax(0,1fr));gap:10px;width:100%;flex:1;min-height:0;align-items:stretch;justify-content:center}.letters-roster .character-spotlight{min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px;padding:0;background:transparent}.letters-roster .character-art{flex:0 1 auto;min-height:0;height:100%;max-height:min(42vh,340px);width:auto;max-width:100%}.letters-roster .character-name{font-size:clamp(16px,1.8vw,30px);flex:none;overflow-wrap:anywhere;line-height:1.05}.letters-roster .character-points{font-size:clamp(15px,1.6vw,28px);flex:none;line-height:1.1}.letters-answer{padding:5px 12px;border-radius:12px;font-weight:800;white-space:normal;overflow-wrap:anywhere;max-width:100%;font-size:clamp(14px,1.3vw,23px);line-height:1.2}.letters-answer.correct{background:#dceee0;color:#205e3b;border:1px solid #7bb291}.letters-answer.incorrect{background:#f4dbd5;color:#923b36;border:1px solid #d59386}.letters-earned .character-art{max-height:min(45vh,360px)}.letters-reference{color:#783a50;font-weight:800;font-size:20px}.letters-flavour{font-size:20px}.letters-stop-panel h2,.letters-results h2{font-size:clamp(32px,4vw,62px);margin:0}.letters-results .letters-roster .character-art{max-height:60vh}.letters-results .letters-runner-up .character-art{max-height:43vh}.letters-congratulations{font-size:clamp(22px,2vw,36px);font-weight:800}
.letters-theatre{display:grid;grid-template-columns:1fr 1.2fr 1fr;align-items:center;justify-items:center;width:100%;height:100%;min-height:0;gap:20px}.letters-paul{max-width:100%;width:auto;height:100%;max-height:65vh;object-fit:contain}.letters-theatre>.character-art{height:62vh;max-width:100%}.letters-tutorial-card{width:100%;height:85%;max-height:600px;min-height:0;box-sizing:border-box;display:grid;place-items:center;border:8px solid #e5c49a;outline:3px dashed #a17353;outline-offset:-14px;border-radius:24px;background:#fffcf0;box-shadow:8px 10px 0 #54314530;padding:26px}.letters-demo{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:22px}.letters-demo[hidden]{display:none}.letters-demo h2{font-size:clamp(25px,3vw,46px);margin:0}.letters-demo p{font-size:24px;margin:0}.letters-demo-keys{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:90%}.letters-demo-keys span{padding:8px;border:2px solid #c3ab82;border-radius:10px;font-size:28px;font-weight:900}.letters-demo-keys .selected,.letters-demo-lock{background:#17646a;color:#fff6df;border-radius:14px;padding:15px;font-size:22px}.letters-demo-supplies{font-size:60px;color:#d39835}.letters-tutorial-card .letters-tile{width:clamp(26px,3.4vw,56px);height:70px;font-size:clamp(26px,3vw,46px)}
.phone.letters-playing main{height:100dvh;padding:8px;max-width:720px;margin:auto}.phone.letters-playing .room-heading{min-height:34px;margin-bottom:4px}.phone.letters-playing .solomon-logo{height:34px;width:160px}.phone.letters-playing .code-box{padding:3px 7px}.phone.letters-playing .code-box small{display:none}.phone.letters-playing .code-box strong{font-size:19px}.phone.letters-playing .letters-panel{padding:12px 10px;gap:8px;justify-content:center;border-radius:22px;border-width:2px}.phone .letters-category{font-size:12px}.phone .letters-clue{font-size:clamp(16px,4.5vw,24px);line-height:1.2}.phone .letters-word{gap:10px}.phone .letters-word-group{gap:3px}.phone .letters-tile{width:min(6.9vw,38px);height:40px;font-size:25px;flex-shrink:1;border-radius:6px}.letters-supplies{color:#c4892a;font-size:21px;font-weight:900;line-height:1}.letters-keyboard{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;width:100%;max-width:420px;flex:none}.letters-keyboard button{padding:0;min-height:40px;font-size:21px;line-height:1;border-radius:9px;box-shadow:0 2px 0 #124950}.letters-keyboard .selected{background:#dc9b32;color:#342c40;border-color:#a77324;box-shadow:0 0 0 2px #dc9b3266}.phone .letters-lock,.phone .letters-solve-toggle{width:100%;max-width:420px;min-height:43px;font-size:17px;padding:8px}.letters-solve-form{display:flex;flex-direction:column;gap:10px;width:100%;max-width:420px}.letters-solve-form[hidden],.letters-keyboard[hidden],.letters-lock[hidden],.letters-solve-toggle[hidden]{display:none}.letters-solve-form label{font-size:16px}.letters-solve-form input{width:100%;box-sizing:border-box;min-height:48px;text-transform:uppercase;border:2px solid #a17e56;border-radius:12px;font-size:22px}.letters-solve-form button{min-height:43px;font-size:16px}.letters-locked>.character-art{height:30dvh;max-height:230px;min-height:0}.letters-wait-message{font-size:22px;line-height:1.2}.phone .letters-roster .character-art{max-height:45dvh}.phone .letters-roster .character-name{font-size:clamp(14px,4vw,24px)}.phone .letters-roster .character-points{font-size:clamp(14px,3.8vw,23px)}.phone .letters-waiting .character-art{height:45dvh;max-height:45dvh}.phone .letters-waiting .character-points{font-size:24px;line-height:1.3;white-space:normal}.phone .letters-results h2{font-size:25px}.phone .letters-results .letters-congratulations{font-size:18px}.phone .letters-results .letters-roster .character-art{max-height:35dvh}.phone .letters-results .letters-runner-up .character-art{max-height:25dvh}.phone .letters-reference,.phone .letters-flavour{font-size:14px}.phone .letters-answer{font-size:16px}.phone .letters-results .letters-roster{gap:6px}
.time-bar.letters-timer{width:100%;background:#e5dac8;border:2px solid #d4b272;border-radius:99px;flex:none;min-height:12px}.time-bar.letters-timer::before{background:linear-gradient(90deg,#17646a,#328b89,#d3ad57)}
@media(max-height:650px){.host .letters-panel{padding:12px 20px;gap:7px}.host .letters-clue{font-size:24px}.host .letters-tile{height:54px;width:42px;font-size:34px}.host .letters-reference,.host .letters-flavour{font-size:16px}.host .letters-roster .character-art{max-height:33vh}.host .letters-demo{gap:12px}.host .letters-demo p{font-size:18px}.host .letters-demo-lock{font-size:17px;padding:12px}}
@media(orientation:landscape) and (max-height:500px){.phone.letters-playing .room-heading{display:none}.phone.letters-playing .letters-panel{gap:5px;padding:8px}.phone .letters-clue{font-size:16px;max-width:90%}.phone .letters-tile{height:28px;width:25px;font-size:20px}.phone .letters-keyboard{grid-template-columns:repeat(13,minmax(0,1fr));max-width:620px;gap:4px}.phone .letters-keyboard button{min-height:34px;font-size:18px}.phone .letters-lock,.phone .letters-solve-toggle{min-height:35px;padding:4px;font-size:15px}.phone .letters-supplies{font-size:15px}.phone .letters-locked>.character-art{height:29dvh}.phone .letters-waiting .character-art{height:40dvh}.phone .letters-results .letters-roster .character-art{max-height:26dvh}.phone .letters-results .letters-runner-up .character-art{max-height:20dvh}.phone .letters-results h2{font-size:21px}.phone .letters-results .letters-congratulations{font-size:15px}}
@media(orientation:portrait){.phone .letters-results .letters-roster[data-count="3"]{--courier-columns:2!important;--courier-rows:2!important}.phone .letters-results .letters-roster[data-count="3"].one-champion>.character-spotlight:first-child{grid-column:1 / -1}.phone .letters-results .letters-roster[data-count="3"]:not(.one-champion)>.character-spotlight:last-child{grid-column:1 / -1}}

.host .letters-panel[data-crowded="true"]{gap:6px}.host .letters-panel[data-crowded="true"] .letters-route{display:none}.host .letters-panel[data-crowded="true"] .letters-clue{font-size:clamp(18px,1.7vw,28px);line-height:1.12}.host .letters-panel[data-crowded="true"] .letters-lock-count{font-size:16px}.host .letters-panel[data-crowded="true"] .letters-tile{height:44px;width:34px;font-size:28px}.host .letters-panel[data-crowded="true"] .character-name{font-size:clamp(14px,1.4vw,24px)}.host .letters-panel[data-crowded="true"] .character-points{font-size:clamp(14px,1.3vw,23px)}.host .letters-panel[data-crowded="true"] .letters-flavour,.host .letters-panel[data-crowded="true"] .letters-reference{font-size:14px}.host .letters-panel[data-crowded="true"] .letters-roster{gap:6px}

.letters-tip-controls{display:flex;gap:8px;justify-content:center}.letters-tip-controls button{border-radius:50%;width:36px;height:36px;min-height:36px;padding:0;font-size:16px}

.host .letters-panel[data-crowded="true"].letters-reveal-panel .letters-category,.host .letters-panel[data-crowded="true"].letters-reveal-panel .letters-flavour{display:none}.host .letters-panel[data-crowded="true"] .letters-answer{padding:3px 8px;font-size:13px}

.phone .letters-results[data-crowded="true"] h2{font-size:21px}.phone .letters-results[data-crowded="true"] .letters-congratulations{font-size:15px}.phone .letters-results[data-crowded="true"] .character-points{font-size:18px;white-space:nowrap}

@media(orientation:landscape) and (max-height:500px){.phone .letters-results[data-crowded="true"] .letters-roster{--courier-columns:6!important;--courier-rows:2!important}}

.phone .letters-results[data-crowded="true"] .character-name{font-size:clamp(12px,2.7vw,18px);line-height:1.08}

@media(orientation:landscape) and (max-height:500px){.phone .letters-results[data-crowded="true"] .character-name{font-size:12px!important;line-height:1.05}.phone .letters-results[data-crowded="true"] .character-points{font-size:16px}.phone .letters-results[data-crowded="true"] h2{font-size:18px}.phone .letters-results[data-crowded="true"] .letters-congratulations{font-size:13px}.phone .letters-results[data-crowded="true"]>.eyebrow{font-size:11px}}
/* Postal Apostles, translucent watercolor paper and coastal ink. */
.theme-letters{--teal:#376d7c;--blue:#6286ae;--paper:#fffaf0;--ink:#294b57;--gold:#d7a360;color:var(--ink)}
.phone.theme-letters{background:radial-gradient(ellipse at 0 0,#d4e5ed80,transparent 55%),radial-gradient(ellipse at 100% 100%,#e7d1ba50,transparent 65%),#f8f6ed}
.theme-letters button{background:#376d7c;border-color:#2d5b69;box-shadow:0 3px 0 #2d5b6929;color:#fffaf0}.theme-letters button.secondary,.theme-letters .letters-solve-toggle{background:#ac6959;border-color:#965749;box-shadow:0 3px 0 #96574929}
.theme-letters .code-box{background:#f9fcf4e8;border-color:#a7bac2;color:#294b57}.letters-panel{background:radial-gradient(ellipse at 0 0,#cfe3e933,transparent 50%),radial-gradient(ellipse at 100% 100%,#edd4bd33,transparent 50%),#fffaf2f5;border-color:#a4bbc0;box-shadow:0 7px 20px #274b5720}
.letters-category,.letters-panel>.eyebrow,.letters-reference{color:#6486a6}.letters-tile{border-color:#b2c3c4;color:#376d7c;box-shadow:0 3px 0 #b2c3c450}.hidden-letter{background:#e5edf0;border-bottom-color:#749ca7}.letters-keyboard .selected{background:#dea68a;color:#294b57;border-color:#c1876b;box-shadow:0 0 0 2px #dea68a55}
.letters-theatre{container-type:size}.letters-tutorial-card{height:auto;width:min(100%,calc(100cqh * 2 / 3));aspect-ratio:2/3;max-height:100%;background:url('/assets/postal-letter-v2.png') center/100% 100% no-repeat;border:0;outline:0;border-radius:0;box-shadow:none;padding:14% 10% 23%;grid-template-rows:1fr auto;filter:drop-shadow(0 8px 8px #28434f15)}
.letters-demo{width:100%;min-height:0;gap:clamp(8px,2cqh,20px)}.letters-demo h2{font-size:clamp(20px,3cqw,40px)}.letters-demo p{font-size:clamp(16px,2cqw,26px)}.letters-demo-supplies{font-size:clamp(20px,3cqw,40px);white-space:nowrap}.letters-demo-lock{font-size:clamp(16px,2cqw,24px);background:#376d7c;padding:10px}.letters-tutorial-card .letters-tile{height:clamp(32px,8cqh,65px);width:clamp(20px,4cqw,45px);font-size:clamp(22px,3cqw,38px)}.letters-demo-keys span{font-size:clamp(18px,2.5cqw,30px);padding:5px}
.letters-theatre>.character-art{height:min(85cqh,520px);width:auto;max-height:100%;aspect-ratio:var(--character-ratio);flex:none}.letters-paul{max-height:100%}
/* Fit assigns both dimensions together. CSS caps must never distort a pose. */
.letters-playing .letters-roster .character-art{flex:none;max-height:none;max-width:none;min-height:0;object-fit:contain;image-rendering:auto}
.letters-scripture{flex:none;width:100%;border-top:1px solid #a6bec080;padding-top:8px;text-align:center}.letters-verse{margin:0 auto 4px;max-width:1100px;font-family:Georgia,serif;font-size:clamp(17px,1.55vw,27px);line-height:1.25;text-wrap:balance}.letters-scripture .letters-reference{margin:0;font-size:15px}.letters-copyright{font-size:10px;opacity:.65}.phone .letters-verse{font-size:15px;line-height:1.2}.phone .letters-scripture{padding-top:5px}.phone .letters-scripture .letters-reference{font-size:12px}
.letters-roster .letters-winner{position:relative}.letters-results .winner-confetti{z-index:3;pointer-events:none}
@media(max-height:650px){.host .letters-verse{font-size:18px}.host .letters-scripture{padding-top:5px}}
@media(orientation:landscape) and (max-height:500px){.phone .letters-verse{font-size:12px}.phone .letters-scripture .letters-reference{font-size:10px}.phone .letters-copyright{font-size:8px}}
@media(orientation:landscape) and (max-height:500px){
 .phone .letters-reveal-panel{display:grid;grid-template-columns:minmax(100px,.75fr) minmax(0,2fr);grid-template-rows:auto auto minmax(0,1fr) auto;gap:5px 12px;align-content:stretch;justify-items:center}
 .phone .letters-reveal-panel>.time-bar{grid-column:1/-1;grid-row:1}
 .phone .letters-reveal-panel>.letters-category{display:none}
 .phone .letters-reveal-panel>.letters-clue{grid-column:2;grid-row:2;font-size:15px;max-width:100%}
 .phone .letters-reveal-panel>.letters-word{grid-column:2;grid-row:3;align-self:center}
 .phone .letters-reveal-panel>.letters-roster{grid-column:1;grid-row:2/4;height:100%;min-height:0;align-self:stretch}
 .phone .letters-reveal-panel .character-name{font-size:15px}.phone .letters-reveal-panel .character-points{font-size:15px}.phone .letters-reveal-panel .letters-answer{font-size:13px;padding:3px 7px}
 .phone .letters-reveal-panel>.letters-scripture{grid-column:1/-1;grid-row:4}
}
.host .letters-reveal-panel>.letters-category{display:none}.host .letters-reveal-panel>.letters-clue{font-size:clamp(18px,1.65vw,30px)}
@media(max-height:650px){.host .letters-reveal-panel{gap:6px;padding:10px 20px}.host .letters-reveal-panel .letters-tile{height:40px;width:32px;font-size:26px}.host .letters-reveal-panel .character-name,.host .letters-reveal-panel .character-points{font-size:18px}.host .letters-reveal-panel .letters-answer{font-size:14px;padding:3px 9px}.host .letters-reveal-panel .letters-verse{font-size:16px}.host .letters-reveal-panel .letters-reference{font-size:12px}}
.host .letters-panel[data-crowded="true"].letters-reveal-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr) auto;justify-items:center;gap:7px 18px}
.host .letters-panel[data-crowded="true"].letters-reveal-panel>.time-bar{grid-column:1/-1;grid-row:1}
.host .letters-panel[data-crowded="true"].letters-reveal-panel>.letters-clue{grid-column:1;grid-row:2}
.host .letters-panel[data-crowded="true"].letters-reveal-panel>.letters-word{grid-column:2;grid-row:2;align-self:center}
.host .letters-panel[data-crowded="true"].letters-reveal-panel>.letters-roster{grid-column:1/-1;grid-row:3;height:100%}
.host .letters-panel[data-crowded="true"].letters-reveal-panel>.letters-scripture{grid-column:1/-1;grid-row:4}
@media(max-height:650px){.host .letters-panel[data-crowded="true"].letters-reveal-panel>.letters-roster{--courier-columns:var(--courier-count)!important;--courier-rows:1!important;gap:4px}.host .letters-panel[data-crowded="true"].letters-reveal-panel .character-spotlight{gap:2px}.host .letters-panel[data-crowded="true"].letters-reveal-panel .character-name,.host .letters-panel[data-crowded="true"].letters-reveal-panel .character-points{font-size:12px}.host .letters-panel[data-crowded="true"].letters-reveal-panel .letters-answer{font-size:11px;padding:3px 4px}}
body.letters-playing .letters-panel .letters-roster .character-art{flex:none;max-height:none;max-width:none;min-height:0;image-rendering:auto}
.postal-speaker{height:100%;max-height:100%;min-height:0;width:100%;display:flex;justify-content:center;align-items:flex-end;transform-origin:50% 100%;filter:drop-shadow(0 5px 4px #294b5720)}.postal-speaker img{width:100%;height:100%;object-fit:contain;object-position:center bottom;min-height:0}.postal-speaker.speaking{animation:postal-talking .55s ease-in-out infinite alternate;filter:drop-shadow(0 0 12px #dcb56855)}@keyframes postal-talking{from{transform:translateY(0) rotate(-.5deg)}to{transform:translateY(-5px) rotate(.5deg)}}
.letters-letter-idle{height:100%;display:grid;place-items:center}.letters-letter-idle img{width:100%;height:auto;object-fit:contain}.letters-letter-idle[hidden]{display:none}
.postal-postbag{display:flex;align-items:center;justify-content:center;gap:4px;width:min(100%,250px);height:clamp(26px,3vw,46px);flex:none}.postal-postbag img{width:min(calc((100% - 16px)/5),46px);height:100%;object-fit:contain;flex:none}.postal-player-postbag{width:100%;display:flex;flex-direction:column;align-items:center;gap:0;flex:none}.postal-satchel-name{font-size:15px;line-height:1.05}.phone .postal-postbag{height:29px;width:170px}.letters-demo .postal-postbag{height:clamp(34px,6cqh,70px);width:100%}.letters-demo .postal-postbag img{width:calc((100% - 16px)/5);max-width:65px}.phone.letters-playing .letters-keyboard button{min-height:38px}
@media(orientation:landscape) and (max-height:500px){.phone .postal-player-postbag{flex-direction:row;justify-content:center;gap:8px}.phone .postal-postbag{height:22px;width:140px}.phone .postal-satchel-name{font-size:12px}}
@media(prefers-reduced-motion:reduce){.postal-speaker.speaking{animation:none}}

/* Center the waiting courier during each delivery introduction. */
.phone.letters-playing .letters-waiting{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.phone.letters-playing .letters-waiting .letters-roster{width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex:1}
.phone.letters-playing .letters-waiting .character-spotlight{width:100%;max-width:100%;height:100%;align-items:center;justify-content:center;margin:auto}
