/* GENOMA/8: матовая моно-палитра, акцент только для выбранного и текущего (не больше 5–7% экрана). */
:root{
  --ink:#101010;--coal:#181818;--graphite:#242424;--ash:#3A3A3A;--fog:#8A8A8A;
  --bone:#D6D2C8;--paper:#E8E2D2;--accent:#B7A14A;
  --danger:#A84B3F;--danger-text:#D9877A;--success:#6F8F5A;--warning:#B4834D;
  --px:"Press Start 2P",ui-monospace,"SF Mono",Menlo,monospace;
  --mono:"IBM Plex Mono","Geist Mono",ui-monospace,"SF Mono",Menlo,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ink);color:var(--bone);font:14px/1.5 var(--mono);
  padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
button,summary{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--paper);outline-offset:2px}
h2{font:400 11px/1.6 var(--px);color:var(--paper);margin:0 0 12px}
h3{font:600 12px/1.4 var(--mono);color:var(--fog);text-transform:uppercase;letter-spacing:.08em;margin:16px 0 8px}
p{margin:0 0 8px}
.muted{color:var(--fog)}.bad{color:var(--danger-text)}.pad{padding:12px 16px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
kbd{font:600 11px var(--mono);border:1px solid var(--ash);padding:0 5px;color:var(--fog);min-width:20px;text-align:center}

.status{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:8px 16px;background:var(--ink);
  border-bottom:1px solid var(--ash);font-size:12px;color:var(--fog)}
.status.hint{border-top:1px solid var(--ash);border-bottom:0;margin-top:8px}
.brand{font:400 11px var(--px);color:var(--paper)}
.clock{font-weight:600;color:var(--paper);min-width:44px}
.grp{display:inline-flex;gap:4px}
.menu{margin-left:auto;position:relative}
.menu summary{list-style:none;cursor:pointer;display:inline-block}
.menu summary::-webkit-details-marker{display:none}
.pop{position:absolute;right:0;top:calc(100% + 4px);z-index:5;width:270px;display:grid;gap:8px;padding:12px;
  background:var(--coal);border:2px solid var(--bone);box-shadow:4px 4px 0 var(--ink)}

.btn{min-height:36px;padding:6px 12px;background:var(--graphite);color:var(--bone);border:1px solid var(--ash);border-radius:2px;cursor:pointer;font-weight:600;font-size:13px}
.btn:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.btn.danger:hover{background:var(--danger);color:#fff;border-color:var(--danger)}
.btn[aria-pressed="true"]{border-color:var(--paper);color:var(--paper)}
.grp .btn[aria-pressed="true"]{background:var(--accent);color:var(--ink);border-color:var(--accent)}
.btn[data-hud="sound"][aria-pressed="false"],.mode[aria-pressed="false"]{color:var(--fog);border-style:dashed}
.btn.off{opacity:.55;border-style:dashed;cursor:not-allowed}
.btn.off:hover{background:var(--graphite);color:var(--bone);border-color:var(--ash)}
@media (pointer:coarse){.btn,.mi,.lnk{min-height:44px}}

.tabs{display:flex;flex-wrap:wrap;gap:4px;padding:8px 16px}
.mi{display:block;text-align:left;padding:8px 12px;background:var(--coal);color:var(--bone);border:1px solid var(--ash);border-radius:0;cursor:pointer}
.mi small{display:block;color:var(--fog);font-size:12px}
.tabs .mi small{display:inline;margin-left:8px}
.mi:hover{border-color:var(--bone)}
.mi[aria-current="true"],.mi.sel{background:var(--accent);color:var(--ink);border-color:var(--accent)}
.mi[aria-current="true"] small,.mi.sel small,.mi.sel kbd{color:var(--ink);border-color:var(--ink)}
.team{display:grid;gap:4px}
.team .row{display:flex;gap:4px}
.team .row .mi{flex:1;display:flex;gap:10px;align-items:center}
.mode{min-width:76px;padding:6px 8px;font-size:12px}

.layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;grid-template-areas:"scene side" "tasks side";gap:0 16px;padding:8px 16px;align-items:start}
.scene-block{grid-area:scene}.tasks-block{grid-area:tasks;margin-top:16px}.side{grid-area:side}
@media (max-width:1040px){.layout{grid-template-columns:minmax(0,1fr);grid-template-areas:"scene" "side" "tasks"}}
.panel{background:var(--coal);border:1px solid var(--ash);padding:12px 16px;margin-bottom:12px}
.tbl{padding:0;overflow-x:auto}

.scene-wrap{display:flex;justify-content:center;background:var(--ink);border:1px solid var(--ash)}
.scene{position:relative;line-height:0}
#cv{display:block;image-rendering:crisp-edges;image-rendering:pixelated;width:320px;height:180px}
.ov{position:absolute;left:0;top:0;pointer-events:none;overflow:hidden}
.zone{position:absolute;bottom:3px;transform:translateX(-50%);font:400 8px/1 var(--px);color:var(--fog);white-space:nowrap}
.tag{position:absolute;transform:translateX(-50%);pointer-events:auto;display:flex;flex-direction:column;align-items:center;
  padding:1px 5px;font:600 11px/1.2 var(--mono);white-space:nowrap;background:var(--ink);color:var(--bone);border:1px solid var(--ash);cursor:pointer}
.tag .s{font-weight:400;font-size:10px;color:var(--fog)}
.tag.blocked{border-color:var(--danger);color:var(--danger-text)}
.tag.blocked .s{color:var(--danger-text)}
.tag.sel{background:var(--accent);color:var(--ink);border-color:var(--accent)}
.tag.sel .s{color:var(--ink)}
@media (max-width:620px){.tag .s{display:none}.tag{font-size:10px;padding:0 3px}}

table{width:100%;border-collapse:collapse;font-size:13px}
th{padding:8px 12px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--fog);text-align:left;border-bottom:1px solid var(--ash);white-space:nowrap}
td{padding:6px 12px;border-bottom:1px solid var(--ash);vertical-align:middle}
tr.sel td{background:var(--accent);color:var(--ink)}
tr.sel .muted{color:var(--ink);opacity:.75}
.lnk{background:none;border:0;color:var(--paper);text-decoration:underline;cursor:pointer;padding:4px 0;min-height:24px;font-weight:600;white-space:nowrap}
tr.sel .lnk{color:var(--ink)}
.bar{width:84px;height:8px;background:var(--ink);border:1px solid var(--ash)}
.bar i{display:block;height:100%;background:var(--fog);width:0}
tr.sel .bar{border-color:var(--ink)}tr.sel .bar i{background:var(--ink)}
.badge{display:inline-block;padding:0 6px;font-size:11px;font-weight:600;border:1px solid currentColor;border-radius:2px;white-space:nowrap}
.b-triage,.b-idle{color:var(--fog)}.b-backlog{color:var(--bone)}.b-ready{color:var(--paper)}.b-doing{color:var(--accent)}
.b-review{color:var(--warning)}.b-done{color:var(--success)}.b-cancelled{color:var(--ash)}.b-blk{color:var(--danger-text)}
tr.sel .badge{color:var(--ink)}

.who{margin-bottom:4px}
.act{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;margin-bottom:8px}
.why{font-size:12px;color:var(--fog)}
.big{font:400 18px var(--px);color:var(--paper)}
#log div{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#log .new{color:var(--paper)}#log .bad{color:var(--danger-text)}

code{font:600 12px var(--mono);color:var(--paper)}
.facts{display:inline-flex;gap:3px;vertical-align:middle}
.facts i{display:inline-block;width:9px;height:9px;border:1px solid var(--fog);background:transparent}
.facts i.on{background:var(--paper);border-color:var(--paper)}
tr.sel .facts i{border-color:var(--ink)}tr.sel .facts i.on{background:var(--ink)}
.facts.words{gap:4px;margin:4px 0 8px}
.facts.words i{width:auto;height:auto;padding:1px 6px;font:600 11px var(--mono);font-style:normal;color:var(--fog)}
.facts.words i.on{color:var(--ink)}
.dep{display:inline-block;padding:0 6px;margin:0 2px 2px 0;font-size:11px;font-weight:600;border:1px solid var(--warning);color:var(--warning);border-radius:2px}
.dep.ok{border-color:var(--success);color:var(--success)}
details{margin:6px 0}
summary{cursor:pointer;color:var(--paper);font-weight:600}
details p{color:var(--bone);font-size:13px;margin-top:4px}
#card h3{margin-top:0;color:var(--paper);text-transform:none;letter-spacing:0;font-size:13px}

dialog{padding:0;background:var(--coal);color:var(--bone);border:2px solid var(--bone);box-shadow:4px 4px 0 var(--ink);width:min(640px,94vw);max-height:92vh;overflow:auto}
dialog::backdrop{background:#101010;opacity:.92}
.dlg-head{display:flex;gap:16px;align-items:center;padding:16px;border-bottom:1px solid var(--ash)}
#briefFace{width:60px;height:72px;image-rendering:pixelated;flex:none}
.dlg-head h2{margin:0 0 6px}.dlg-head p{margin:0;color:var(--paper)}
#briefBody{padding:16px}
.dlg-foot{display:flex;gap:8px;justify-content:flex-end;padding:0 16px 16px}
#briefBody .dlg-foot{padding:8px 0 0}
.kinds{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px}
.kind{display:block;text-align:left;padding:10px 12px;background:var(--graphite);border:1px solid var(--ash);cursor:pointer;min-height:44px}
.kind small{display:block;color:var(--fog);font-size:12px;margin-top:2px}
.kind:hover,.kind:focus-visible{background:var(--accent);color:var(--ink);border-color:var(--accent)}
.kind:hover small,.kind:focus-visible small{color:var(--ink)}
.lbl{display:block;margin:0 0 6px;color:var(--paper);font-weight:600}
textarea,select{width:100%;padding:8px 10px;background:var(--graphite);color:var(--bone);border:1px solid var(--ash);border-radius:2px;font:inherit;margin-bottom:12px}
textarea::placeholder{color:var(--fog)}
.btn.primary{background:var(--accent);color:var(--ink);border-color:var(--accent)}