/* Единая визуальная система. Экран кода остаётся самостоятельным исключением. */
:root{
 --echo-surface-graphite:#25292d;--echo-surface-coal:#1c2024;--echo-surface-metal:#343a40;
 --echo-color-ink:#c2c6c9;--echo-color-muted:#a1a8ad;--echo-color-line:#596168;--echo-color-focus:#b8c0c5;
 --echo-color-paper:#bcb3a0;--echo-color-paper-ink:#302f2b;--echo-color-paper-line:#7d776b;
 --echo-accent-contour:#8cabb9;--echo-accent-vector:#9ca78e;--echo-accent-sigma:#a895b3;--echo-accent-echo:#a49bad;
 --echo-grain:url('assets/design/grain.svg');--echo-font-heading:var(--echo-font-ui);
 --echo-font-caption:.6875rem;--echo-font-body:.875rem;--echo-font-large:1.375rem;
 --echo-surface:var(--echo-surface-graphite);--echo-panel:var(--echo-surface-coal);
 --echo-shadow:0 2px 5px #0003;--echo-page-width:640px;
}
html{color-scheme:dark;background:var(--echo-surface-coal)}
body{font:var(--echo-font-body)/1.65 var(--echo-font-ui);color:var(--echo-color-ink);background:var(--echo-surface-graphite) var(--echo-grain);min-height:100dvh}
button,input,select,textarea{font:inherit;accent-color:var(--echo-color-muted)}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
a{color:var(--echo-accent-contour);text-underline-offset:4px;overflow-wrap:anywhere}
button:focus-visible,a:focus-visible,input:not(.access-hidden-input):focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--echo-color-focus);outline-offset:3px}
button:disabled{cursor:not-allowed;opacity:.45}
.shell{max-width:var(--echo-page-width);padding:76px var(--echo-space-4) var(--echo-space-8)}
.shell>div:first-child{display:none}
.top{padding:var(--echo-space-3) 0;border-top:var(--echo-border);border-bottom:var(--echo-border);margin:0 0 var(--echo-space-6);align-items:center}
.brand{display:flex;align-items:center;gap:10px;font-size:var(--echo-font-body);letter-spacing:.08em}
.brand small{display:none}
.brand .protocol-symbol{width:34px;height:34px}
.stamp{font-size:9px;letter-spacing:.08em;color:var(--echo-color-muted);max-width:95px;text-align:right}
#hero,#globalStatus{display:none!important}
.steps{gap:0;padding:0;margin:0 0 var(--echo-space-6);border-bottom:var(--echo-border);color:var(--echo-color-muted)}
.step{font-size:9px;padding:8px 2px;letter-spacing:.03em;text-align:center;line-height:1.5}
.step.active{text-decoration:none;color:var(--echo-color-ink);border-bottom:2px solid var(--echo-color-ink)}
.kicker{font-size:var(--echo-font-caption);letter-spacing:.1em;color:var(--echo-color-muted);text-transform:uppercase;margin-bottom:var(--echo-space-3)}
h1,h2,h3{font-family:var(--echo-font-heading);font-weight:400;line-height:1.4;overflow-wrap:anywhere}
h1,h2{font-size:var(--echo-font-large);letter-spacing:.045em;margin:0 0 var(--echo-space-6)}
h3{font-size:1rem;letter-spacing:.05em;margin:var(--echo-space-6) 0 var(--echo-space-3)}
p{margin:var(--echo-space-3) 0 var(--echo-space-4)}
.panel{border:0;border-top:var(--echo-border);padding:var(--echo-space-6) 0;margin:var(--echo-space-4) 0;background:transparent}
body.has-proto .panel{border-left:0;border-top-color:var(--proto)}
.note,small{font-size:.75rem;line-height:1.65;color:var(--echo-color-muted)}
.label{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;margin:var(--echo-space-6) 0 var(--echo-space-2)}
.rule{border-color:var(--echo-color-line);margin:var(--echo-space-6) 0}
.status{background:#ffffff04;border:var(--echo-border);border-left-width:2px;padding:var(--echo-space-3);margin:var(--echo-space-4) 0;line-height:1.6;font-size:.8125rem;color:var(--echo-color-ink)}
.status.bad{border-left-color:var(--echo-color-muted)}
.status.good{border-left-color:var(--echo-color-ink)}
body .btn,body .role{border:var(--echo-border);border-radius:var(--echo-radius);background:var(--echo-surface-metal) var(--echo-grain);color:var(--echo-color-ink);min-height:48px;padding:12px;font-size:.75rem;letter-spacing:.05em;text-align:center;line-height:1.6;box-shadow:var(--echo-shadow);white-space:normal;overflow-wrap:anywhere}
body .btn.secondary{background:var(--echo-panel) var(--echo-grain)}
body .btn.danger{background:var(--echo-panel);border-color:var(--echo-color-muted);color:var(--echo-color-ink)}
body .btn:enabled:hover,body .role:enabled:hover{border-color:var(--echo-color-focus);background-color:#3b4248}
body .btn:active{transform:translateY(1px)}
.row{gap:var(--echo-space-2);flex-wrap:wrap;align-items:stretch}.row>.btn{flex:1 1 100px}
.row>div:not(.row),.row>input{max-width:100%}
body input:not([type=checkbox]):not([type=radio]):not(.access-hidden-input),body select,body textarea{color-scheme:dark;border:var(--echo-border);border-radius:var(--echo-radius);background:var(--echo-panel);color:var(--echo-color-ink);padding:12px;min-height:48px;width:100%;box-shadow:inset 0 1px 3px #0002}
input::placeholder,textarea::placeholder{color:#9ba2a8;opacity:1}
input[type=checkbox],input[type=radio]{width:20px;height:20px;flex:0 0 20px}
body input[type=datetime-local],body input[type=date],body input[type=time]{color-scheme:dark;background:var(--echo-panel);color:var(--echo-color-ink)}
.choice{border:var(--echo-border);padding:var(--echo-space-3);gap:var(--echo-space-3);background:var(--echo-panel);font-size:.8125rem;min-height:48px;align-items:center}
.choice:has(input:checked){border-color:var(--echo-color-ink);background:var(--echo-surface-metal)}
.question{border-color:var(--echo-color-line);padding-bottom:var(--echo-space-4)}
.role{text-align:left!important}.role small{margin-top:8px}.role.selected{outline:1px solid var(--echo-color-ink);outline-offset:2px}
.roles{gap:var(--echo-space-3)}
#navBack{top:16px!important;left:max(16px,calc((100vw - var(--echo-page-width))/2 + 16px))!important;background:var(--echo-panel)!important;color:var(--echo-color-ink)!important;border:var(--echo-border)!important;min-height:44px!important;padding:8px 14px!important;z-index:45}
#navBack:disabled{opacity:.45}
footer{font-size:10px;letter-spacing:.08em;border-top:var(--echo-border);padding-top:var(--echo-space-4);color:var(--echo-color-muted);margin-top:var(--echo-space-8)}
/* 01–03: реальные снимки и поля; декоративных иллюстраций нет. */
.camera-box{border:var(--echo-border);background:var(--echo-panel);max-height:230px;aspect-ratio:16/9}.camera-overlay{border-color:var(--echo-color-muted)}
#cameraPanel>h2{font-size:1.3rem}.capture-grid{gap:8px;margin:var(--echo-space-6) 0}
.capture-card{border:0;padding:0;text-align:center}.capture-card>strong{display:block;font-size:9px;line-height:1.6;font-weight:400;min-height:32px;margin-top:8px}
.thumb{height:140px;background:var(--echo-panel);border:var(--echo-border);font-size:9px;color:var(--echo-color-muted);position:relative}
.thumb:after{content:'';position:absolute;inset:4px;border:1px solid #b1b6b840;pointer-events:none}
.capture-card .btn{font-size:10px;padding:8px 2px;min-height:44px}
#cameraPlaceholder{font-size:11px}#consent{margin-top:4px}.capture-grid img{filter:grayscale(1)}
#processingPanel{min-height:55vh}.processing-line{display:flex;justify-content:space-between;gap:16px;font-size:12px;padding:12px 0;border-bottom:1px dotted var(--echo-color-line)}
.processing-meter{height:12px;border:var(--echo-border);margin:24px 0 32px;overflow:hidden;background:var(--echo-panel)}
.processing-meter span{display:block;height:100%;width:var(--progress,0%);background:#a2a8ac var(--echo-grain)}
#processingText{border:0;padding:0;background:none;min-height:52px;font-size:12px;line-height:1.9;text-align:center}
#processingPanel .processing-lines{margin:32px 0 0}
.wheel{border:var(--echo-border);background:var(--echo-panel);scrollbar-color:var(--echo-color-line) var(--echo-panel)}
.wopt{background:transparent;color:var(--echo-color-muted);border-bottom:1px solid #525b6138;height:40px}.wopt.sel{background:var(--echo-surface-metal);color:var(--echo-color-ink);font-weight:400}
.wheel-head{font-size:10px;margin:12px 0;color:var(--echo-color-muted)}.birth-shown{font-size:18px;margin:24px 0}.identity-fact{display:flex;justify-content:space-between;border-bottom:var(--echo-border);padding:12px 0;font-size:12px;color:var(--echo-color-muted)}
/* Папка и бумага — отдельные материалы, не ещё одна графитовая панель. */
.dossier-cover{position:relative;min-height:420px;max-width:380px;margin:24px auto;padding:64px 22px;background:linear-gradient(105deg,#080a0c66 0 7%,transparent 8%),var(--echo-grain),linear-gradient(85deg,#1b1e20,#292d2f 50%,#1c1f22);border:1px solid #6a6d69;border-left:8px solid #131619;box-shadow:4px 3px 0 #948b76,8px 6px 0 #4c4b43,0 14px 30px #0004;color:var(--echo-color-ink);border-radius:2px 7px 5px 2px;font-family:var(--echo-font-ui)}
.dossier-cover:before{content:'МЕЖВЕДОМСТВЕННЫЙ АРХИВ / СЕКТОР 7';position:absolute;top:22px;left:24px;right:20px;font-size:8px;letter-spacing:.1em;text-align:left;color:var(--echo-color-muted)}
.dossier-cover:after{content:'СЕКРЕТНО / НАЖМИТЕ, ЧТОБЫ ОТКРЫТЬ';position:absolute;bottom:38px;left:18px;right:18px;font-size:9px;letter-spacing:.08em}
.cover-symbol{display:block;width:100px;height:100px;margin:0 auto 24px;color:#a3a5a2}.cover-title{display:block;font-size:23px;letter-spacing:.09em}.cover-id{display:block;font-size:12px;margin-top:16px;color:#a9adae}
.dossier-cover-hint{font-size:10px;margin:24px 0;color:var(--echo-color-muted)}
.dossier-book{padding:6px;background:#504e45;border:1px solid #716e62;box-shadow:0 8px 24px #0005}
.dossier-page{position:relative;min-height:530px;padding:22px 18px;background:var(--echo-grain),linear-gradient(100deg,#ada591 0,#c0b9a8 12%,#bcb3a0 76%,#aba28d);color:var(--echo-color-paper-ink);border:1px solid #77715f;box-shadow:inset 0 0 30px #4b443b28;font:12px/1.65 var(--echo-font-ui)}
.dossier-page h3{font-size:14px;font-weight:600;margin:24px 0 16px;border-top:1px solid var(--echo-color-paper-line);padding-top:12px}
.paper-kicker{font-size:14px;border-bottom:1px solid var(--echo-color-paper-line);padding-bottom:16px;letter-spacing:.04em;line-height:1.6}
.paper-kicker .protocol-symbol{float:left;width:38px;height:38px;margin-right:10px}
.paper-line{font-size:11px;gap:8px;padding:6px 0;line-height:1.6}.paper-line span{width:43%;max-width:150px;font-weight:400}.paper-line strong{font-weight:500;overflow-wrap:anywhere}
.paper-copy{font-size:12px}.paper-photos{margin:18px 0}.paper-photos figure{max-width:135px;flex:0 0 44%;}.paper-photos img{height:178px;filter:grayscale(1) contrast(.9);border:1px solid #56574c;padding:4px}.paper-photos figcaption{font-size:9px;margin-top:4px}
.paper-foot{border-top:1px solid var(--echo-color-paper-line);display:flex;justify-content:space-between;gap:10px;font-size:8px;margin-top:32px;padding-top:14px}
.paper-stamp{display:inline-block;border:2px solid #625e50;color:#625e50;padding:5px 12px;margin-top:24px;letter-spacing:.16em;transform:rotate(-4deg);font-size:13px}.paper-item{border-width:1px!important}
.paper-code{background:none;border:0;border-bottom:1px dotted currentColor;color:inherit;font:inherit;text-align:left;padding:0;cursor:copy;min-height:28px}
.dossier-controls .btn{border-color:#777466}#dossierPanel>.status{font-size:11px}.flip-hint{font-size:9px;color:var(--echo-color-muted);padding:12px 4px}
/* Команды и журнал: приглушённый акцент обозначает протокол, не заливает экран. */
.card,.listitem{background:var(--echo-panel) var(--echo-grain);border:var(--echo-border);padding:var(--echo-space-4);margin:var(--echo-space-3) 0}
.card.mine{border-width:1px}.card strong{font-size:14px;font-weight:400;letter-spacing:.04em}.card small{margin-top:10px}
.protocol-symbol{display:inline-block;width:28px;height:28px;vertical-align:middle;flex-shrink:0;color:inherit;fill:none}
#lobbyProtocols>.card{border-left-width:2px!important;position:relative;padding:20px 16px}
#lobbyProtocols>.card>strong{display:flex;align-items:center;gap:14px;line-height:1.6}#lobbyProtocols .protocol-symbol{width:54px;height:64px;flex:0 0 54px}
#lobbyProtocols .status .btn{display:inline-block;min-height:36px;width:36px;padding:4px;margin:0 0 0 8px}
#roomTitle{font-size:18px;display:flex;align-items:center;gap:10px}#roomTitle .protocol-symbol{width:40px;height:44px}
.mrow{gap:12px;border-bottom:1px solid #59616877;padding:14px 0;flex-wrap:wrap}.mrow>div{min-width:0;max-width:100%}.mrow strong{font-size:12px;font-weight:500}.mrow small{font-size:10px}.mrow .btn{font-size:10px;min-height:44px;padding:8px}
.face{width:48px;height:58px;border:1px solid #777b7c;filter:grayscale(1);padding:2px;background:#333a40}
#roomBaski{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}#roomBaski .btn{width:auto;min-height:40px;padding:8px}
#roomJournalRow{align-items:stretch}#roomJournalRow .btn{flex-basis:45%}.gap{margin-top:var(--echo-space-6)}
#journalPanel>.row{flex-wrap:nowrap;border-bottom:var(--echo-border);padding-bottom:12px}#journalPanel>.row .btn{flex:1 1 0;min-width:0;padding:10px 3px;font-size:10px;letter-spacing:0}
#journalView{margin-top:var(--echo-space-6)}#journalView>.btn{text-align:left}#journalView h3{font-size:16px!important;border-left-width:2px!important;padding-left:10px}
#choiceOpts .btn,#testView .btn{margin-top:12px;text-align:left}.test-question{border-bottom:var(--echo-border)}
/* Общие окна, опросы и сообщения. */
.modal-bg{background:#0c0f12dc;padding:16px;backdrop-filter:none;overflow-y:auto}
body .modal-box{border:var(--echo-border);background:var(--echo-panel) var(--echo-grain);color:var(--echo-color-ink);padding:24px;max-height:calc(100dvh - 32px);overflow:auto;box-shadow:0 8px 40px #0005}
.modal-box h2{font-size:18px;line-height:1.5}.corner-badge{animation:none;background:var(--echo-panel)}
.chatlog{background:var(--echo-panel);border:var(--echo-border);padding:12px;margin:16px 0;min-height:180px;max-height:52dvh;overflow:auto;scrollbar-color:var(--echo-color-line) var(--echo-panel)}
.msg{position:relative;background:#343a40;border:1px solid #66707866;padding:12px;margin:12px 0;overflow-wrap:anywhere;text-align:left;box-shadow:none}
.msg.mine{background:#3d444a;border-color:#89919888}.msg>small{display:block;min-height:20px;font-size:10px;margin-bottom:8px;line-height:1.7}
.msg .message-portrait{float:left;width:32px;height:40px;margin-right:8px;filter:grayscale(1);object-fit:cover;border:1px solid #747e84;cursor:default}
.msg>div:not(:last-child){font-size:13px}.msg button{min-height:44px!important}.msg img:not(.message-portrait){display:block;max-height:330px;width:auto;margin:12px 0;border:var(--echo-border)}
.msg audio,.msg video{display:block;width:100%;max-height:330px;margin:12px 0}.msg>div[style]{flex-wrap:wrap}
#chatComposer{border-top:var(--echo-border);padding-top:16px}#chatComposer textarea{min-height:76px}#chatComposer .row{margin-top:8px}
#chatPanel>p.note{font-size:11px}
/* Карта/схема: текущий провайдер и правила геолокации не меняются. */
#geoView>svg,#adminGeoBox>svg{background:var(--echo-surface-metal) var(--echo-grain);border:var(--echo-border);color:var(--echo-accent-contour);width:100%;max-height:360px}
#geoView .mrow a{min-height:44px;display:inline-flex;align-items:center}
.map-overlay{background:var(--echo-surface-graphite);color:var(--echo-color-ink)}.map-bar{background:var(--echo-panel);border-bottom:var(--echo-border)}.map-bar a.btn{color:var(--echo-color-ink)}.map-picks .btn{font-size:10px;letter-spacing:0}
/* Видео и финал — та же система, без выдуманного видеоролика. */
.intro-screen{background:var(--echo-surface-coal) var(--echo-grain);color:var(--echo-color-ink)}
.intro-stage{position:relative;background:var(--echo-surface-graphite) var(--echo-grain);border-top:var(--echo-border);border-bottom:var(--echo-border);padding:24px;flex-direction:column;gap:16px}
.intro-stage .protocol-symbol{width:90px;height:90px;color:var(--echo-accent-echo)}.intro-stage p{margin:0;font-size:12px}.intro-rotate{font-size:11px;letter-spacing:.04em}.intro-skip.btn{font-size:10px;min-height:40px;max-width:180px;padding:8px;right:12px;top:12px}
.conseq{background:var(--echo-surface-coal) var(--echo-grain);color:var(--echo-color-ink);font-family:var(--echo-font-ui);font-size:clamp(18px,5vw,28px);font-weight:400;line-height:1.6;flex-direction:column;gap:28px}
.conseq .protocol-symbol{width:110px;height:110px;color:var(--echo-accent-echo)}.final-system{font-size:11px;letter-spacing:.1em;color:var(--echo-color-muted)}
/* Организатор тоже часть системы; все инструменты остаются. */
.admin-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.admin-nav .btn{font-size:10px;min-width:0;padding:8px 2px}.admin-nav .btn:last-child{grid-column:span 3}
.adm-bar,.adm-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.adm-bar .btn{flex:1 1 130px}.adm-row>div{flex:1;min-width:0}.listitem strong{font-size:12px}.listitem small{display:block}.listitem .status{white-space:pre-line}
#adminPanel h2{font-size:19px}
@media(min-width:760px){.shell{padding-top:82px}.top{margin-bottom:32px}.panel{padding-top:32px}.capture-grid{gap:16px}.thumb{height:220px}.card{padding:24px}.dossier-page{padding:32px}.dossier-cover{min-height:470px}}
@media(max-width:360px){.shell{padding-left:12px;padding-right:12px}.roles{grid-template-columns:1fr}.capture-card strong{font-size:8px}.thumb{height:110px}h2{font-size:20px}.paper-line{font-size:10px}.dossier-page{padding:18px 12px}.mrow .btn{font-size:9px}.admin-nav{gap:5px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}.conseq{transition:opacity .01s linear}}
/* Не менять утверждённый первый экран, включая цвета, шрифт и невидимое поле. */
.access-screen{font-size:16px}.access-center>div:first-child{font-size:18px}.access-hidden-input{font-size:16px!important}
body:has(#accessScreen:not(.hidden)){background:#000}
.dossier-page[data-page="0"] .paper-photos{float:left;width:40%;margin:0 14px 10px 0}
.dossier-page[data-page="0"] .paper-photos figure{max-width:none;flex:1}
.dossier-page[data-page="0"] .paper-photos img{width:100%;height:172px}
.dossier-page[data-page="0"]>h3:not(:first-of-type){clear:both}
.capture-help{border-bottom:var(--echo-border);padding:0 0 16px;margin-bottom:20px}
.capture-help summary{font-size:11px;letter-spacing:.06em;cursor:pointer;min-height:28px;color:var(--echo-color-muted)}
.camera-box:has(#video.hidden){display:none}
body:has(#cameraPanel:not(.hidden)) .steps,body:has(#processingPanel:not(.hidden)) .steps{display:none}
.dossier-page[data-page="0"] .paper-line{display:block;margin-left:44%;padding:4px 0}
.dossier-page[data-page="0"] .paper-line span{display:block;width:auto;max-width:none;font-size:9px;letter-spacing:.02em}
.dossier-page[data-page="0"] .paper-line strong{display:block;font-size:11px}
#geoView>svg,#adminGeoBox>svg{color:var(--echo-accent-contour)!important}
.geo-controls{max-width:320px}.geo-controls .btn{flex:1 1 0;margin:8px 0 0;font-size:13px}
.geo-coordinates{font-size:12px;color:var(--echo-accent-contour);overflow-wrap:anywhere}
#roomMembers small[style]{color:var(--echo-color-ink)!important}
body:has(.conseq) #navBack{visibility:hidden!important}
.conseq>strong{font-size:20px;font-weight:400;letter-spacing:.08em}
.mrow small .protocol-symbol{width:18px;height:20px;margin-right:5px}
.mrow[style*="border-left"],#roomCard{border-left-width:2px!important;padding-left:10px}
.intro-stage:has(video){padding:0}
.intro-stage:has(video)>.protocol-symbol{display:none}

span.message-portrait{display:inline-flex;align-items:center;justify-content:center;color:var(--echo-color-muted);background:var(--echo-panel);font-size:12px}

.consequence-caption{font-size:18px;line-height:1.65;max-width:320px;margin-top:32px;color:var(--echo-color-muted)}