/* Оформление «Карточная комната» для /play и /gm (структура и раскладка — style.css).
   Картинки: /assets/host (стол, карты, фишки, рамки) и /assets/ui (кнопки, панели, поля). Без инлайн-стилей (CSP). */
:root{--ink:#2a1a0c;--paper:#f0e2bf;--gold:#d9b062;--muted:#cdb98e;--line:#7d5f33;--red:#f0a98a;--text:#f3e2b8;--display:Georgia,'Times New Roman',serif;
 color:var(--text);background:#120d0a}
body:not(.host){background:#120d0a url('/assets/host/bg.webp') center top/cover fixed;font-family:PTSerif,Georgia,serif}
body:not(.host):before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(1500px 700px at 50% 0,rgba(255,190,100,.12),transparent 70%),linear-gradient(rgba(14,8,4,.35),rgba(14,8,4,.55));z-index:0}
body:not(.host) #app{position:relative;z-index:1}
h1,h2,h3,.eyebrow,.brand,.paper-tag,button,.button,summary,.header-meta{font-family:var(--display);font-weight:700}
a{color:#f0c978}

/* кнопки: латунь / орех / вино, растяжка 9-slice */
button,.button,.file-button{box-sizing:border-box;min-height:56px;padding:6px 18px;border:14px solid transparent;border-image:url('/assets/ui/btn-brass.webp') 40 fill/14px stretch;background:none;color:#2a1a0c;font-family:var(--display);font-size:19px;font-weight:700;letter-spacing:.2px;text-shadow:0 1px 0 rgba(255,236,190,.55);filter:drop-shadow(0 4px 5px rgba(0,0,0,.45))}
button.secondary,.button.secondary,.file-button{border-image-source:url('/assets/ui/btn-walnut.webp');color:#f3e2b8;text-shadow:0 1px 2px #000}
button:hover,.button:hover,.file-button:hover{filter:drop-shadow(0 4px 5px rgba(0,0,0,.45)) brightness(1.12)}
button:active,.button:active{transform:translateY(2px);filter:drop-shadow(0 1px 2px rgba(0,0,0,.5))}
button:disabled{opacity:.45;filter:grayscale(.7) drop-shadow(0 2px 3px rgba(0,0,0,.4))}
#cancel-confirm,[data-action=reset],[data-action=undo]{border-image-source:url('/assets/ui/btn-wine.webp');color:#f6e3c0}
.icon{filter:invert(88%) sepia(25%) saturate(500%) hue-rotate(5deg)}
button:not(.secondary) .icon{filter:none}
.parchment .icon{filter:none}
.tools button,.device-controls button,.invites button,.camera-settings button,.demo-tools button{min-height:46px;font-size:15px;padding:2px 12px;border-width:12px;border-image-width:12px}

/* поля: утопленная бумажная вставка */
input:not([type=checkbox]):not([type=hidden]):not([type=file]),select,textarea{border:12px solid transparent;border-image:url('/assets/ui/input.webp') 36 fill/12px stretch;background:none;color:#2a1a0c;padding:2px 6px;border-radius:0;min-height:50px;font-family:PTSerif,Georgia,serif}
input[type=checkbox]{accent-color:#d9b062}
input:focus,select:focus{outline:3px solid #f0c978;outline-offset:1px}
label{color:#e8d6aa}
.parchment label,.parchment small{color:#4a3520}

/* бумага: вопросы, ответы, прикидка */
.parchment{background:url('/assets/host/question-card.webp') center/100% 100% no-repeat;filter:drop-shadow(0 12px 14px rgba(0,0,0,.55));color:#2c1c10}
.paper-tag{background:url('/assets/host/nameplate.webp') center/100% 100% no-repeat;color:#2a1a0c;text-shadow:0 1px 0 rgba(255,240,200,.5);filter:drop-shadow(0 4px 5px rgba(0,0,0,.5));padding:10px 22px}
.eyebrow{color:#a0432a;font-family:Arial,sans-serif;font-weight:700;letter-spacing:1.4px;font-size:14px}
.question-panel{padding:46px 62px}
.question-panel h1{font-family:var(--display);letter-spacing:-1px;color:#2c1c10}
.question-panel p{color:#4a3520;font-family:Arial,sans-serif}
.answer>strong,.revealed-total,.estimate>strong,.result-numbers strong,.secret-current>strong,.guesses strong{font-family:var(--display);color:#2c1c10}
.bust{color:#b0301f!important}.table-header .bust,.player .bust{color:#ff8a6b!important}
.guesses>div{border-color:#b69a62}.answer{border-color:#b69a62}

/* шапка */
.table-header{background:linear-gradient(180deg,#2d1c10,#1a100a);border-bottom:2px solid #b88a3e;box-shadow:0 6px 18px rgba(0,0,0,.55);min-height:84px}
.brand{font-size:clamp(26px,2.3vw,40px);letter-spacing:-1px;color:#f1d79a;text-shadow:0 3px 0 rgba(60,30,10,.85)}
.brand>img{width:56px;height:56px;filter:drop-shadow(0 4px 6px rgba(0,0,0,.6))}
.brand em{color:#ffb74d}
.header-meta{color:#d9c08a}.header-meta b{color:#fff1cc}
.header-meta>span{background:rgba(20,12,6,.55);border:1px solid rgba(217,176,98,.45);border-radius:30px;padding:6px 18px}
.phase-label{color:#ffe3a1;font-size:17px}
.status{font-family:Arial,sans-serif;font-size:13px;background:rgba(20,12,6,.6);border:1px solid rgba(217,176,98,.4);border-radius:20px;padding:4px 12px}
.status.online{color:#a8e0a8}
.pause-banner{background:#7a2a1c;border-bottom:2px solid #d9b062;color:#fbe9b8;font-family:var(--display);font-size:20px}

/* панели */
.panel,.my-question,.current-note,.camera-settings[open],dialog{border:16px solid transparent;border-image:url('/assets/ui/panel.webp') 36 fill/16px stretch;background:none;color:var(--text);padding:8px 10px;box-shadow:none}
.panel{margin-bottom:22px;padding:6px 10px}
.panel h2{color:#f1d79a}
dialog{max-width:600px;padding:16px 22px}dialog::backdrop{background:rgba(8,4,2,.8);backdrop-filter:blur(4px)}
dialog h2{font-family:var(--display);color:#f1d79a}
.phase-step{border-bottom-color:rgba(217,176,98,.25);color:#cdb98e;font-family:var(--display)}
.phase-step>span{color:#b08c4c}
.phase-step.current{color:#fff1cc;text-shadow:0 0 14px rgba(255,190,90,.6)}.phase-step.current>span{color:#ffb74d}
.phase-step.done{color:#8e8b6e}
.phase-rail h2{color:#f1d79a}
summary{color:#f1d79a}details[open]>summary{margin-bottom:14px}

/* игроки/соперники */
.opponent{border-bottom:2px solid rgba(217,176,98,.35);background:linear-gradient(180deg,rgba(24,14,8,.7),rgba(24,14,8,.35));border-radius:12px 12px 0 0;padding:8px 14px 10px}
.opponent h2{color:#f6e3b4;font-family:var(--display)}.opponent span{color:#cdb98e}
.opponent.active{border-bottom-color:#ffb74d;box-shadow:0 8px 22px rgba(255,170,70,.28)}
.small-sigil{width:44px;height:44px;object-fit:contain;filter:drop-shadow(0 3px 3px rgba(0,0,0,.6))}
.opponent-chips b,.wallet b,.stake b{font-family:var(--display);color:#fff1cc;text-shadow:0 2px 6px #000}

/* фишки и карты (картинки) */
.chip-pile{display:inline-block;width:auto;height:64px;object-fit:contain;background:none;filter:drop-shadow(0 4px 4px rgba(0,0,0,.5))}
.bank>.chip-pile{height:46px;width:auto}.opponent-chips>.chip-pile{height:44px;width:auto}.stake .chip-pile{height:56px;width:auto}.wallet .chip-pile{height:74px;width:auto}.gm-player-summary .stake>.chip-pile{height:34px;width:auto}
.answer-card{background:none;width:104px;height:auto;aspect-ratio:5/7;object-fit:contain;filter:drop-shadow(0 6px 6px rgba(0,0,0,.55))}
.small-hand .answer-card{width:46px}

/* своя камера */
.local-preview{background:#0d0804;border-radius:6px}
.framed::after{background:url('/assets/host/cam-frame.webp') center/100% 100% no-repeat;filter:drop-shadow(0 8px 12px rgba(0,0,0,.5))}
.camera-off{inset:5% 3.7%;overflow:hidden;border-radius:4px;display:block}
.camera-off img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.9}
.camera-off>span,.camera-off>small{position:absolute;left:0;right:0;text-align:center;text-shadow:0 2px 8px #000;z-index:1}
.camera-off>span{bottom:46px;font-family:var(--display);font-size:30px;color:#fff1cc}
.camera-off>small{bottom:22px;font-family:Arial,sans-serif;font-size:14px;color:#f1d79a}
.local-preview video{inset:5% 3.7%;width:92.6%;height:90%;border-radius:4px}
.local-name{font-size:26px}
.camera-settings summary{font-family:Arial,sans-serif;font-size:14px;color:#f1d79a}
.camera-settings{background:none}
.camera-settings #camera-status{color:#e3cf9d}

/* решения игрока */
.answer-pad,.estimate{padding:34px 36px}
.guess-label{font-family:Arial,sans-serif;color:#a0432a;font-size:16px}
.guess-label>input{font-family:var(--display);font-size:50px;color:#2a1a0c}
.estimate>span{font-family:Arial,sans-serif;text-transform:uppercase;letter-spacing:1px;font-size:15px;color:#a0432a}
.estimate strong small,.revealed-total small{color:#7a5a30}
.estimate p,.save-state,.save-guess{color:#5a4228}
.compact-guess .save-guess,.compact-guess .save-state{color:#e8d6aa}
.personal-hand>small,.empty-hand{color:#d9c9a0}
.turn-message{color:#f3e2b8;font-family:var(--display);text-shadow:0 2px 8px #000}
.draw-actions>button{font-size:30px}
.my-question .eyebrow{color:#ffb74d}
.my-question h3{color:#fff1cc}
.profile{margin-bottom:18px}

/* GM */
.secret-current .eyebrow{color:#a0432a}
.gm-player-summary>article{background:rgba(24,14,8,.55);border:1px solid rgba(217,176,98,.35);border-radius:12px;padding:10px 6px 14px}
.themes button small{color:#4a3520}.themes button.secondary small{color:#cdb98e}
.invites>div{border-top-color:rgba(217,176,98,.3)}
.secret-line,.log-line{border-color:rgba(217,176,98,.25)}
.tools{border-top-color:rgba(217,176,98,.3)}
.player-lower{border-top-color:rgba(217,176,98,.3)}
.welcome h1{font-family:var(--display)}
.loading{color:#f1d79a}

/* уведомление */
#toast{background:#f0e2bf;color:#2a1a0c;border:2px solid #b88a3e;border-radius:12px;font-family:Arial,sans-serif;font-size:16px;box-shadow:0 8px 28px rgba(0,0,0,.6)}

/* кнопка «Сохранить» ответ в тесной колонке */
.save-guess{min-height:42px;width:100%;font-size:15px;padding:0 6px;border-width:10px;border-image-width:10px;color:#f3e2b8!important;white-space:nowrap;gap:6px}
.save-guess>.icon{width:15px;height:15px;filter:invert(88%) sepia(25%) saturate(500%) hue-rotate(5deg)}
.answer-pad,.estimate{padding:30px 26px}
.guess-label{text-align:center}
.guess-label>input{width:100%}

/* GM: компактные служебные кнопки и камера ведущего */
.tools .file-button,.tools button{min-height:46px;font-size:15px;padding:2px 12px;border-width:12px;border-image-width:12px;font-family:var(--display)}
.gm .camera-off img,.camera-off img{width:100%;height:100%}
.gm .local-preview{aspect-ratio:16/10}
.gm .camera-off>span{font-size:22px;bottom:38px}.gm .camera-off>small{bottom:16px}

/* телефон и планшет */
@media(max-width:1150px){.question-panel{padding:38px 46px}.opponent{padding:6px 10px 8px}}
@media(max-width:760px){
 .table-header{padding:10px 14px}.brand{font-size:26px}.brand>img{width:44px;height:44px}
 .header-meta>span{padding:4px 14px}
 .question-panel{padding:30px 34px 34px;min-height:0}
 .question-panel h1{font-size:28px;margin:8px 0 10px}
 .opponent{flex-wrap:nowrap}.small-sigil{display:none}
 .opponents{gap:8px}
 .answer-pad,.estimate{padding:26px 22px 24px;min-height:200px}
 .personal-hand{min-height:0}
 button,.button,.file-button{min-height:54px;font-size:18px}
 .draw-actions>button{font-size:24px;min-height:64px}
 .local-preview{height:auto;aspect-ratio:16/10;min-height:0}
 .camera-off>span{font-size:24px;bottom:34px}.camera-off>small{bottom:14px;font-size:12px}
 .panel,.my-question,.current-note{padding:4px 6px}
}