/* Mongoose OS desktop shell. Dark-only. Tokens mirror the console. */

/* IBM Plex, vendored (SA-000057, WO-B/2, EQUIP-01; OFL 1.1, notices on
   file). The system stack stays as fallback: a missing vendor file or a
   file:// quirk degrades silently, never breaks. */
@font-face{font-family:'IBM Plex Sans';src:url('vendor/fonts/ibm-plex-sans-latin-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url('vendor/fonts/ibm-plex-sans-latin-700-normal.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url('vendor/fonts/ibm-plex-mono-latin-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url('vendor/fonts/ibm-plex-mono-latin-700-normal.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}

:root{
  --bg:#141210; --bg-2:#1c1916; --card:#221d18; --card-2:#2a2420;
  --ink:#e8e3d8; --muted:#9a9082; --red:#e23b30; --red-dark:#b52025;
  --gold:#d9a441; --line:#332e28; --line-strong:#4c453d;
  --ok:#6cbf6c; --warn:#d9a441; --hold:#8f877a;
  --sans:'IBM Plex Sans',system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,"SF Mono","Cascadia Mono",Menlo,Consolas,monospace;
  --tb-w:56px; --win-header:34px;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{font:15px/1.55 var(--sans);color:var(--ink);background:var(--bg);overflow:hidden;
  user-select:none;-webkit-user-select:none}
.ico{width:1em;height:1em;display:inline-block;vertical-align:middle;fill:none;
  stroke:currentColor;stroke-width:2;stroke-linecap:square;stroke-linejoin:miter}
.ico.ico-solid{fill:currentColor;stroke:none}

/* ---- Desktop + wallpaper ---- */
#mg-desktop{position:fixed;inset:0;z-index:0;overflow:hidden;
  background-color:#0d0b09;
  background-image:
    linear-gradient(90deg,rgba(13,11,9,.82) 0%,rgba(13,11,9,.62) 38%,rgba(13,11,9,.18) 100%),
    url("../art/10-hq-building.png");
  background-size:cover,cover;
  background-position:center,center;
  background-repeat:no-repeat,no-repeat;}
#mg-desktop::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(135deg, transparent 0 24px, rgba(255,255,255,.012) 24px 25px);}

/* ---- Taskbar (vertical, side-dockable) ---- */
#mg-taskbar{position:fixed;top:0;bottom:0;left:0;width:var(--tb-w);z-index:900;
  display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 0;
  background:linear-gradient(180deg,#0d0b09,#151210);color:var(--ink);
  border-right:1px solid var(--line-strong);
  transition:transform .18s cubic-bezier(.2,.7,.2,1);will-change:transform}
#mg-taskbar[data-dock="right"]{border-right:0;border-left:1px solid var(--line-strong)}
#mg-taskbar.dragging{box-shadow:0 0 0 100vmax rgba(0,0,0,.05)}
#mg-start{width:40px;height:40px;flex:0 0 auto;display:grid;place-items:center;cursor:pointer;
  background:var(--red);color:#fff;border:1px solid var(--red-dark);font-size:22px}
#mg-start:hover{background:#f04a3e}
#mg-run{display:flex;flex-direction:column;gap:4px;align-items:center;width:100%;
  overflow-y:auto;overflow-x:hidden}
.mg-taskbtn{width:40px;height:40px;display:grid;place-items:center;cursor:pointer;font-size:18px;
  background:var(--bg-2);color:var(--muted);border:1px solid var(--line);border-left:2px solid transparent}
.mg-taskbtn:hover{color:var(--ink);border-color:var(--line-strong)}
.mg-taskbtn.active{color:var(--ink);border-left-color:var(--red);background:var(--card)}
#mg-taskbar[data-dock="right"] .mg-taskbtn{border-left:1px solid var(--line);border-right:2px solid transparent}
#mg-taskbar[data-dock="right"] .mg-taskbtn.active{border-right-color:var(--red)}
.mg-spacer{flex:1 1 auto}
#mg-clock{font:700 15px/1.02 var(--mono);letter-spacing:.02em;color:var(--ink);
  display:flex;flex-direction:column;align-items:center;gap:1px;padding:4px 0}
#mg-clock .mm{color:var(--muted)}
#mg-grip{width:40px;height:26px;display:grid;place-items:center;cursor:grab;color:var(--muted);
  background:transparent;border:0;font-size:16px;touch-action:none}
#mg-grip:hover{color:var(--ink)}
#mg-grip:active{cursor:grabbing}

/* ---- Start menu ---- */
#mg-startmenu{position:fixed;top:8px;left:var(--tb-w);width:250px;z-index:1000;
  max-height:calc(100vh - 16px);overflow-y:auto;
  background:var(--card);border:1px solid var(--line-strong);box-shadow:8px 8px 0 rgba(0,0,0,.35)}
#mg-startmenu[data-dock="right"]{left:auto;right:var(--tb-w)}
.mg-menu-head{font:600 10px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);padding:10px 12px;border-bottom:1px solid var(--line);background:#0d0b09}
.mg-menu-apps,.mg-menu-sys{list-style:none;margin:0;padding:4px}
#mg-startmenu li{display:flex;align-items:center;gap:10px;padding:9px 10px;cursor:pointer;font-size:13px}
#mg-startmenu li .ico{font-size:18px;color:var(--muted)}
#mg-startmenu li:hover{background:var(--red);color:#fff}
#mg-startmenu li:hover .ico{color:#fff}
.mg-menu-sep{height:1px;background:var(--line-strong);margin:2px 0}
.mg-menu-sys li{color:var(--muted);text-transform:uppercase;font:700 11px var(--mono);letter-spacing:.06em}

/* ---- Windows ---- */
.mg-win{position:absolute;display:flex;flex-direction:column;min-width:120px;min-height:80px;
  background:var(--card);border:1px solid var(--line-strong);box-shadow:6px 6px 0 rgba(0,0,0,.32);z-index:100}
.mg-win.focus{border-color:#5c534a;box-shadow:8px 8px 0 rgba(0,0,0,.45)}
.mg-win.mg-moving{transition:none}
.mg-win.mg-min{display:none}
.mg-titlebar{height:var(--win-header);flex:0 0 auto;display:flex;align-items:center;gap:8px;
  padding:0 6px 0 10px;background:#0d0b09;border-bottom:1px solid var(--line-strong);
  cursor:default;touch-action:none}
.mg-win.focus .mg-titlebar{border-bottom-color:var(--red)}
.mg-ico{display:flex;align-items:center;color:var(--muted);font-size:16px}
.mg-win.focus .mg-ico{color:var(--red)}
.mg-title{flex:1 1 auto;font:700 12px/1 var(--sans);letter-spacing:.04em;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;color:var(--ink)}
.mg-controls{display:flex;gap:2px}
.mg-ctl{width:26px;height:24px;display:grid;place-items:center;background:transparent;
  border:1px solid transparent;color:var(--muted);cursor:pointer;font-size:15px}
.mg-ctl:hover{color:var(--ink);border-color:var(--line-strong);background:var(--bg-2)}
.mg-close:hover{background:var(--red);color:#fff;border-color:var(--red-dark)}
.mg-body{flex:1 1 auto;overflow:auto;background:var(--card);position:relative}
.mg-pad{padding:16px 18px}
.mg-pad h2{margin:0 0 .4em;font-weight:800;letter-spacing:.01em;text-transform:uppercase}

/* resize edges */
.mg-e{position:absolute;z-index:2}
.mg-n{top:-3px;left:6px;right:6px;height:8px;cursor:ns-resize}
.mg-s{bottom:-3px;left:6px;right:6px;height:8px;cursor:ns-resize}
.mg-east{right:-3px;top:6px;bottom:6px;width:8px;cursor:ew-resize}
.mg-west{left:-3px;top:6px;bottom:6px;width:8px;cursor:ew-resize}
.mg-ne{top:-3px;right:-3px;width:12px;height:12px;cursor:nesw-resize}
.mg-nw{top:-3px;left:-3px;width:12px;height:12px;cursor:nwse-resize}
.mg-se{bottom:-3px;right:-3px;width:12px;height:12px;cursor:nwse-resize}
.mg-sw{bottom:-3px;left:-3px;width:12px;height:12px;cursor:nesw-resize}
.mg-win.mg-max .mg-e{display:none}

/* modal (knock) windows */
.mg-win.mg-modal{border-color:var(--red);box-shadow:0 0 0 1px var(--red),10px 10px 0 rgba(0,0,0,.5)}

/* while dragging/resizing: stop window bodies from capturing the pointer */
body.mg-nointeract .mg-body{pointer-events:none}

/* plain skin (Strip the Soviet), proves the theme is removable */
body[data-skin="plain"]{--red:#3a6ea5;--red-dark:#2c5580;--gold:#8a8578}
body[data-skin="plain"] #mg-desktop{background:linear-gradient(160deg,#1b1b1e,#151517 60%,#101012)}
body[data-skin="plain"] #mg-desktop::after{display:none}

/* ===========================================================================
   P1 (SA-000008): the three lifted console views, re-homed from the flat
   console (console/index.html:16-134) and scoped under .mg-body so they paint
   only inside app windows. Tokens reused from the :root above (they mirror the
   console). Copy scrubbed of em dashes per house rule. New pieces: gp-view,
   the windowed board scroll, the greeting portrait slot, the dossier layout.
   =========================================================================== */

/* App windows hold live text and forms, so re-enable the selection the shell
   body switches off for the desktop chrome. */
.mg-body{user-select:text;-webkit-user-select:text}
.mg-body .gp-view{padding:16px 18px}
.mg-body .gp-view--board{height:100%;display:flex;flex-direction:column;padding:16px 18px}

/* Greeting / clerk banner (index.html:61-69) */
.mg-body .greeting{display:flex;gap:14px;align-items:flex-start;background:var(--card);
  border:1px solid var(--line);border-left:5px solid var(--red);padding:14px 16px;margin-bottom:22px;flex:0 0 auto}
.mg-body .greeting .avatar{width:52px;height:52px;flex:none;background:var(--card-2);
  border:1px solid var(--line-strong);display:grid;place-items:center;font:800 20px var(--mono);color:var(--muted)}
.mg-body .greeting .who{font-weight:800}
.mg-body .greeting .who small{font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:10px}
.mg-body .greeting p{margin:4px 0 0}

/* Section head (index.html:71-73) */
.mg-body .section-head{display:flex;align-items:baseline;gap:12px;border-bottom:2px solid var(--line-strong);
  padding-bottom:6px;margin-bottom:16px;flex:0 0 auto}
.mg-body .section-head h2{text-transform:uppercase;letter-spacing:.06em;font-weight:800;margin:0 0 .4em}
.mg-body .section-head .count{font:700 12px var(--mono);color:#fff;background:var(--red);padding:2px 8px}

/* Kanban board (index.html:74-88) + windowed scroll and per-column scroll (spec 6.1) */
.mg-body .gp-board{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;flex:1 1 auto;min-height:0}
.mg-body .gp-board--scroll{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:200px;overflow-x:auto}
.mg-body .col{background:var(--bg-2);border:1px solid var(--line);display:flex;flex-direction:column;min-height:0}
.mg-body .col>.col-head{font:700 11px/1 var(--sans);text-transform:uppercase;letter-spacing:.1em;padding:9px 10px;
  border-bottom:1px solid var(--line);display:flex;justify-content:space-between;color:var(--muted);flex:0 0 auto}
.mg-body .col>.col-body{padding:8px;display:flex;flex-direction:column;gap:8px;min-height:40px;overflow-y:auto;flex:1 1 auto}
.mg-body .card{background:var(--card);border:1px solid var(--line-strong);padding:10px}
.mg-body .card .id{font:700 12px var(--mono);color:var(--gold)}
.mg-body .card .t{font-weight:700;margin:3px 0}
.mg-body .card .g{color:var(--muted);font-size:12.5px}
.mg-body .card .prog{font:11px var(--mono);color:var(--muted);margin-top:6px}
.mg-body .badge{font:700 10px var(--mono);text-transform:uppercase;letter-spacing:.06em;padding:2px 6px;border:1px solid}
.mg-body .st-done{color:var(--ok);border-color:var(--ok)}
.mg-body .st-in-progress{color:var(--red);border-color:var(--red)}
.mg-body .st-in-review,.mg-body .st-approved{color:var(--warn);border-color:var(--warn)}
.mg-body .st-draft,.mg-body .st-on-hold,.mg-body .st-superseded,.mg-body .st-abandoned{color:var(--hold);border-color:var(--hold)}

/* Roster + person card (index.html:90-100); the card is now a clickable dossier link */
.mg-body .roster{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.mg-body .person{background:var(--card);border:1px solid var(--line-strong);display:flex;flex-direction:column;cursor:pointer}
.mg-body .person:hover{box-shadow:4px 4px 0 rgba(0,0,0,.28)}
.mg-body .person .pbar,.mg-body .gp-dossier .pbar{background:#0d0b09;color:var(--ink);padding:6px 10px;display:flex;
  justify-content:space-between;align-items:center;border-bottom:1px solid var(--red-dark)}
.mg-body .person .pbar .role,.mg-body .gp-dossier .pbar .role{font:700 10px var(--sans);text-transform:uppercase;letter-spacing:.12em;color:var(--red)}
.mg-body .person .body{display:flex;gap:12px;padding:12px}
.mg-body .persona{font-size:12.5px;margin:6px 0}
.mg-body .voice{font-size:12px;color:var(--muted);border-left:3px solid var(--red);padding-left:8px;font-style:italic;margin:4px 0}
.mg-body .svc{font:11px var(--mono);color:var(--muted);margin-top:6px}

/* Casting strip (index.html:102-104) */
.mg-body .casting{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 20px}
.mg-body .casting .scene{border:1px solid var(--line);background:var(--bg-2);padding:6px 9px;font-size:12px}
.mg-body .casting .scene b{font:700 11px var(--mono);text-transform:uppercase;color:var(--red)}

/* Portrait tiles: weave placeholder + monogram fallback (index.html:95-97) */
.mg-body .gp-por{border:1px solid var(--line-strong);
  background:repeating-linear-gradient(45deg,var(--card-2) 0 6px,var(--card) 6px 12px);
  display:grid;place-items:center;text-align:center;flex:none;overflow:hidden}
.mg-body .gp-por img{width:100%;height:100%;object-fit:cover;object-position:center 30%}
.mg-body .gp-por span{font:9px var(--mono);color:var(--muted)}
.mg-body .gp-por .gp-mono{font:800 18px var(--mono);color:var(--muted)}
.mg-body .gp-por--card{width:88px;height:108px}
.mg-body .gp-por--greet{width:64px;height:80px}
.mg-body .gp-por--greet .gp-mono{font-size:20px}
.mg-body .gp-por--dossier{width:96px;height:128px}
.mg-body .gp-por--dossier .gp-mono{font-size:32px}

/* Dossier detail (spec 6.3) */
.mg-body .gp-back{margin-bottom:14px}
.mg-body .gp-dossier{display:flex;gap:16px;align-items:flex-start}
.mg-body .gp-dossier-body{flex:1 1 auto;min-width:0}
.mg-body .gp-dossier .persona{font-size:13px}

/* Intake form (index.html:106-133) */
.mg-body form.intake{max-width:720px}
.mg-body .field{margin-bottom:14px}
.mg-body .field>label{display:block;font-weight:700;margin-bottom:4px}
.mg-body .field .hint{color:var(--muted);font-size:12px;margin-bottom:5px}
.mg-body .field input[type=text],.mg-body .field input[type=number],.mg-body .field textarea,.mg-body .field select{
  width:100%;font:14px var(--sans);color:var(--ink);background:#0f0d0b;border:1px solid var(--line-strong);padding:9px 10px}
.mg-body .field textarea{min-height:96px;resize:vertical}
.mg-body .field input:focus,.mg-body .field textarea:focus,.mg-body .field select:focus{outline:2px solid var(--red);outline-offset:0}
.mg-body fieldset{border:1px solid var(--line-strong);margin:0 0 14px;padding:12px}
.mg-body fieldset>legend{font-weight:800;text-transform:uppercase;font-size:12px;letter-spacing:.08em;padding:0 6px;color:var(--muted)}
.mg-body .btn{font:700 13px var(--sans);text-transform:uppercase;letter-spacing:.06em;padding:10px 16px;
  border:1px solid var(--line-strong);background:var(--card);color:var(--ink);cursor:pointer}
.mg-body .btn:hover{border-color:var(--red)}
.mg-body .btn.primary{background:var(--red);border-color:var(--red-dark);color:#fff}
.mg-body .btn.primary:hover{background:var(--red-dark)}
.mg-body .btn.ghost{background:transparent}
.mg-body .actions{display:flex;gap:10px;margin-top:16px}
.mg-body .attachments .thumb{display:inline-flex;flex-direction:column;align-items:center;border:1px solid var(--line);padding:6px;margin:6px 6px 0 0;width:96px}
.mg-body .attachments .thumb img{width:82px;height:82px;object-fit:cover;border:1px solid var(--line-strong)}
.mg-body .attachments .thumb small{font:10px var(--mono);color:var(--muted);margin-top:3px}

/* Shared note / empty / preview (index.html:130-133) */
.mg-body .note{background:var(--bg-2);border:1px solid var(--line);border-left:4px solid var(--gold);padding:10px 12px;font-size:13px;margin:14px 0}
.mg-body .note--error{border-left-color:var(--red)}
.mg-body .empty{color:var(--muted);font-style:italic;padding:10px}
.mg-body pre.out{background:#0d0b09;color:#cfc8bb;font:12px var(--mono);padding:12px;overflow:auto;border-left:4px solid var(--red)}

/* ---- SA-000010 step 3: Start-menu groups and taskbar pins (D11) ---- */
/* 見出しは章のラベルであって押すもんやない。触れんように殺しとく。 */
#mg-startmenu .mg-menu-group {
  padding: 8px 12px 4px;
  font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  color: var(--muted); pointer-events: none;
}
#mg-pins { display: flex; flex-direction: column; gap: 4px; margin-top: 8px; }
#mg-pins .mg-pin { border-left: 2px solid var(--red); }

/* ---- SA-000010 step 7: the shared game frame (A7) ---- */
.mgg-frame { display: flex; flex-direction: column; gap: 8px; height: 100%; }
.mgg-bar { display: flex; align-items: center; gap: 12px; padding: 6px 10px;
  border: 1px solid #332e28; background: var(--card); }
.mgg-title { font-weight: 800; letter-spacing: .04em; text-transform: uppercase; font-size: 12px; }
.mgg-score { margin-left: auto; font-family: var(--mono); color: var(--gold); }
.mgg-btn { border: 1px solid #4c453d; background: var(--card-2); color: var(--ink);
  font-size: 11px; font-weight: 800; letter-spacing: .06em; padding: 4px 10px; cursor: pointer; }
.mgg-start { border-color: var(--red); }
.mgg-canvas { flex: 1; background: var(--black); border: 1px solid #332e28; }

/* ==== The suite and the shelf (Phase C wiring) ==== */
/* ---- Dom Kultury (C0): the House of Culture games gallery ---- */
.dk-view { display: flex; flex-direction: column; gap: 12px; height: 100%; padding: 14px; overflow: auto; }
.dk-head { font-weight: 800; letter-spacing: .1em; text-transform: uppercase; font-size: 13px; color: var(--gold); }
.dk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.dk-tile { border: 1px solid #4c453d; background: var(--card); color: var(--ink); font-family: var(--sans); font-weight: 700; text-transform: uppercase; letter-spacing: .05em; font-size: 12px; padding: 20px 10px; text-align: center; cursor: pointer; }
.dk-tile:hover { border-color: var(--red); background: var(--red-tint); }
.dk-empty { color: var(--muted); padding: 18px 2px; }
.dk-playing { display: flex; flex-direction: column; gap: 8px; padding: 10px; }
.dk-playing .mgg-frame { flex: 1; min-height: 0; }
.dk-back { align-self: flex-start; border: 1px solid #332e28; background: var(--card-2); color: var(--muted); font-family: var(--mono); font-size: 11px; letter-spacing: .06em; padding: 4px 10px; cursor: pointer; }
.dk-back:hover { color: var(--ink); border-color: #4c453d; }

/* ---------------- Arifmometr (unit C1) ---------------- */
.arf { display: flex; flex-direction: column; gap: 10px; height: 100%; padding: 12px; font-family: var(--sans); }
.arf-head { display: flex; align-items: center; gap: 8px; border: 1px solid #4c453d; background: var(--field-fill); padding: 8px 10px; }
.arf-memflag { font-family: var(--mono); font-size: 11px; color: var(--gold); }
.arf-readout { flex: 1; text-align: right; font-family: var(--mono); font-size: 22px; color: var(--ink); overflow: hidden; white-space: nowrap; }
.arf-pad { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.arf-key { font-family: var(--mono); font-size: 15px; padding: 10px 0; background: var(--card); color: var(--ink); border: 1px solid #332e28; border-radius: 0; cursor: pointer; }
.arf-key:hover { background: var(--card-2); }
.arf-op { color: var(--gold); }
.arf-eq { background: var(--red-dark); color: var(--ink); border-color: #4c453d; }
.arf-eq:hover { background: var(--red-hover); }
.arf-tape-head { font-family: var(--mono); font-size: 11px; color: var(--muted); letter-spacing: 2px; }
.arf-tape { flex: 1; overflow: auto; border: 1px solid #332e28; background: var(--bg-2); padding: 8px 10px; font-family: var(--mono); font-size: 13px; }
.arf-line { display: flex; justify-content: space-between; gap: 12px; padding: 2px 0; }
.arf-line-expr { color: var(--muted); }
.arf-line-res { color: var(--ink); }
.arf-empty { color: var(--muted); font-family: var(--sans); font-size: 13px; }

/* ---- Vremya (C2): the clock ---- */
.mg-body .vremya{padding:16px 18px;display:flex;flex-direction:column;gap:14px}
.mg-body .vremya-main{background:var(--bg-2);border:1px solid #4c453d;padding:18px 16px;text-align:center}
.mg-body .vremya-big{font:700 44px/1.05 var(--mono);letter-spacing:.06em;color:var(--ink)}
.mg-body .vremya-label{margin-top:6px;font:700 11px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.mg-body .vremya-zones{display:flex;flex-direction:column;border:1px solid #332e28}
.mg-body .vremya-row{display:flex;align-items:center;gap:10px;padding:7px 10px;border-bottom:1px solid #332e28;background:var(--card-2)}
.mg-body .vremya-row:last-child{border-bottom:0}
.mg-body .vremya-name{flex:1 1 auto;font-weight:700}
.mg-body .vremya-off{font:700 11px var(--mono);letter-spacing:.06em;color:var(--muted)}
.mg-body .vremya-time{font:700 15px var(--mono);color:var(--gold)}
.mg-body .vremya-drop{width:22px;height:22px;display:grid;place-items:center;background:transparent;border:1px solid #332e28;border-radius:0;color:var(--muted);cursor:pointer;font:700 12px var(--mono)}
.mg-body .vremya-drop:hover{color:#fff;background:var(--red);border-color:var(--red-dark)}
.mg-body .vremya-empty{padding:12px 10px;color:var(--muted);font-size:12.5px;background:var(--card-2)}
.mg-body .vremya-bar{display:flex;gap:8px}
.mg-body .vremya-pick{flex:1 1 auto;background:var(--field-fill);color:var(--ink);border:1px solid #4c453d;border-radius:0;padding:6px 8px;font:inherit}
.mg-body .vremya-add{background:var(--red);color:#fff;border:1px solid var(--red-dark);border-radius:0;padding:6px 12px;font:700 12px var(--sans);letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
.mg-body .vremya-add:hover{background:var(--red-hover)}
.mg-body .vremya-add[disabled]{background:var(--hold);border-color:#4c453d;cursor:default}

/* GOST, the unit converter (unit C3) */
.gost{padding:16px;font:14px var(--sans);color:var(--ink)}
.gost-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.gost-tab{font:700 12px var(--sans);text-transform:uppercase;letter-spacing:.06em;padding:7px 12px;border:1px solid #332e28;background:var(--card);color:var(--muted);cursor:pointer;border-radius:0}
.gost-tab:hover{border-color:var(--red)}
.gost-tab.on{background:var(--red-tint,#2a1714);border-color:#4c453d;color:var(--ink)}
.gost-row{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.gost-value{flex:1 1 120px;min-width:0;font:16px var(--mono);color:var(--ink);background:var(--field-fill,#0f0d0b);border:1px solid #4c453d;padding:9px 10px;border-radius:0}
.gost-value:focus,.gost-from:focus,.gost-to:focus{outline:2px solid var(--red);outline-offset:0}
.gost-from,.gost-to{flex:0 1 140px;font:14px var(--sans);color:var(--ink);background:var(--field-fill,#0f0d0b);border:1px solid #4c453d;padding:9px 8px;border-radius:0}
.gost-arrow{flex:none;color:var(--muted);font:16px var(--mono)}
.gost-result{font:700 18px var(--mono);color:var(--gold);background:var(--bg-2);border:1px solid #332e28;border-left:4px solid var(--gold);padding:12px 14px}
.gost-result.gost-idle{font:13px var(--sans);color:var(--muted);border-left-color:#4c453d}

/* ---------- Samizdat (C4): the private notebook ---------- */
.smz{display:flex;height:100%;min-height:0}
.smz-list{flex:0 0 210px;display:flex;flex-direction:column;overflow:auto;background:var(--bg-2);border-right:1px solid #332e28}
.smz-new{margin:10px}
.smz-item{padding:8px 12px;border-bottom:1px solid #332e28;border-left:2px solid transparent;cursor:pointer;color:var(--muted)}
.smz-item:hover{color:var(--ink);background:var(--card)}
.smz-item.current{background:var(--red-tint);border-left-color:var(--red);color:var(--ink)}
.smz-item-title{font:600 13px/1.3 var(--sans);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.smz-item-date{font:11px var(--mono);color:var(--muted)}
.smz-editor{flex:1 1 auto;display:flex;flex-direction:column;min-width:0}
.smz-tools{display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--card-2);border-bottom:1px solid #332e28}
.mg-body .btn.smz-toggle{padding:6px 10px;font-size:11px}
.mg-body .btn.smz-toggle.on{background:var(--red);border-color:var(--red-dark);color:var(--ink)}
.smz-date{margin-left:auto;font:11px var(--mono);color:var(--muted)}
.smz-text{flex:1 1 auto;border:0;resize:none;padding:12px 14px;background:var(--field-fill);color:var(--ink);font:14px/1.6 var(--mono)}
.smz-text:focus{outline:2px solid var(--red);outline-offset:-2px}
.smz-preview{flex:1 1 auto;overflow:auto;padding:12px 16px;background:var(--card)}
.smz-preview h1,.smz-preview h2,.smz-preview h3{margin:12px 0 6px;color:var(--ink);line-height:1.25}
.smz-preview h1{font:800 20px var(--sans)}
.smz-preview h2{font:700 17px var(--sans)}
.smz-preview h3{font:700 13px var(--sans);text-transform:uppercase;letter-spacing:.08em}
.smz-preview p{margin:6px 0}
.smz-preview ul{margin:6px 0;padding-left:20px}
.smz-preview li{margin:2px 0}
.smz-preview code{font:13px var(--mono);color:var(--gold);background:var(--black);border:1px solid #332e28;padding:1px 5px}
.smz-preview a{color:var(--gold)}
.smz-empty{margin:auto;max-width:340px;padding:24px;text-align:center;color:var(--muted)}

/* ---------- Kniga Zhalob (C5): the suggestion book ---------- */
.kz { display: flex; flex-direction: column; height: 100%; font-family: var(--sans); }
.kz-head { padding: 10px 14px; font: 700 13px var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--gold); background: var(--card); border-bottom: 1px solid #4c453d; }
.kz-ledger { flex: 1; overflow: auto; background: var(--bg-2); }
.kz-empty { padding: 24px; color: var(--muted); }
.kz-row { display: flex; gap: 12px; padding: 10px 14px; border-bottom: 1px solid #332e28; }
.kz-num { min-width: 2.2em; text-align: right; font: 700 12px var(--mono); color: var(--muted); }
.kz-text { flex: 1; }
.kz-body { color: var(--ink); white-space: pre-wrap; }
.kz-sig { margin-top: 4px; display: flex; gap: 10px; font: 12px var(--mono); color: var(--muted); }
.kz-anon { font-style: italic; }
.kz-agent-mark { color: var(--muted); }
.kz-form { display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; background: var(--card); border-top: 1px solid #4c453d; }
.kz-form textarea, .kz-form input { background: var(--field-fill); color: var(--ink); border: 1px solid #332e28; border-radius: 0; padding: 8px 10px; font: 13px var(--sans); }
.kz-form textarea { min-height: 56px; resize: vertical; }
.kz-actions { display: flex; justify-content: flex-end; }

/* ---- Doska Pochyota, the board of honour (unit C6) ---- */
.mg-body .dp-board{height:100%;overflow:auto;padding:18px;background:var(--red-dark);color:var(--ink)}
.mg-body .dp-head{font:800 20px/1.2 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--gold);text-align:center;border-bottom:1px solid #4c453d;padding:0 0 12px;margin:0 0 16px}
.mg-body .dp-row{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;align-items:stretch}
.mg-body .dp-tile{width:186px;padding:12px;background:var(--card);border:1px solid #4c453d;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.mg-body .dp-first{border-width:2px}
.mg-body .dp-month{font:700 10px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--bg);background:var(--gold);padding:3px 8px}
.mg-body .dp-por{width:96px;height:120px;border:1px solid #4c453d;background:var(--card-2);display:flex;align-items:center;justify-content:center;overflow:hidden}
.mg-body .dp-por img{width:100%;height:100%;object-fit:cover;object-position:center 30%}
.mg-body .dp-weave{width:100%;height:100%;background:repeating-linear-gradient(45deg,var(--card),var(--card) 4px,var(--card-2) 4px,var(--card-2) 8px)}
.mg-body .dp-mono{font:800 26px var(--mono);color:var(--muted)}
.mg-body .dp-name{font:700 13px/1.3 var(--sans);color:var(--ink)}
.mg-body .dp-role{font:700 10px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.mg-body .dp-line{font:11px/1.5 var(--mono);color:var(--muted);max-height:50px;overflow:hidden}
.mg-body .dp-empty{font:12px var(--mono);color:var(--muted);text-align:center;padding:28px 12px}

/* ---------- Calendar (C7) ---------- */
.cal{display:flex;flex-direction:column;height:100%;padding:12px 14px;gap:10px}
.cal-head{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.cal-label{flex:1;text-align:center;font:800 15px var(--sans);text-transform:uppercase;letter-spacing:.08em;color:var(--ink)}
.cal-nav{padding:6px 12px}
.cal-dow{display:grid;grid-template-columns:repeat(7,1fr);flex:0 0 auto}
.cal-dow span{font:700 10px var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--muted);padding:4px 6px;border-bottom:1px solid #4c453d}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);grid-auto-rows:minmax(72px,1fr);flex:1 1 auto;overflow:auto;border-left:1px solid #332e28;border-top:1px solid #332e28;background:var(--bg)}
.cal-cell{border-right:1px solid #332e28;border-bottom:1px solid #332e28;background:var(--card);padding:3px 4px;display:flex;flex-direction:column;gap:2px;min-width:0}
.cal-cell.cal-out{background:var(--bg-2)}
.cal-cell.cal-out .cal-n{color:var(--muted)}
.cal-cell.cal-today{outline:2px solid var(--red);outline-offset:-2px}
.cal-n{font:700 11px var(--mono);color:var(--ink);flex:0 0 auto}
.cal-event{background:var(--red-tint);border-left:3px solid var(--red);color:var(--ink);font:12px var(--sans);padding:2px 5px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.cal-form{display:flex;gap:8px;align-items:center;flex:0 0 auto}
.cal-form .cal-date{flex:0 0 auto}
.cal-form .cal-title{flex:1 1 auto}
.cal-form input{background:var(--field-fill);color:var(--ink);border:1px solid #4c453d;padding:8px 10px;font:13px var(--sans)}
.cal-form input:focus{outline:2px solid var(--red);outline-offset:0}

/* ---------- Ochered', the queue (C9) ---------- */
.ochered-canvas{display:block;margin:0 auto;background:var(--bg);border:1px solid #332e28;outline:none}
.ochered-canvas:focus{border-color:#4c453d}

/* ---- Sapyor (C11): the sapper's minefield ---- */
.sap { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; overflow: auto; }
.sap-head { display: flex; align-items: center; gap: 10px; }
.sap-face { width: 28px; height: 28px; display: flex; align-items: center; justify-content: center;
  font: 800 11px var(--mono); color: var(--muted); background: var(--card-2); border: 1px solid #4c453d; }
.sap-face.sap-won { color: var(--ok); }
.sap-face.sap-lost { color: var(--red); }
.sap-count { font-family: var(--mono); font-size: 13px; color: var(--gold); min-width: 3ch; }
.sap-flagbtn { border: 1px solid #4c453d; background: var(--card-2); color: var(--ink);
  font-family: var(--mono); font-size: 11px; letter-spacing: .06em; padding: 5px 12px; cursor: pointer; }
.sap-flagbtn.sap-on { border-color: var(--gold); color: var(--gold); background: var(--red-tint); }
.sap-grid { display: grid; grid-template-columns: repeat(16, 24px); gap: 1px;
  padding: 1px; background: var(--black); border: 1px solid #332e28; }
.sap-cell { width: 24px; height: 24px; padding: 0; border: 1px solid #332e28; background: var(--card-2);
  color: var(--ink); font: 700 12px var(--mono); line-height: 22px; text-align: center; cursor: pointer; }
.sap-cell.sap-open { background: var(--bg-2); cursor: default; }
.sap-cell.sap-flagged { color: var(--gold); }
.sap-cell.sap-mine { color: var(--red); }
.sap-cell.sap-boom { background: var(--red-tint); color: var(--red); }
.sap-cell[data-n="1"] { color: var(--ok); }
.sap-cell[data-n="2"] { color: var(--warn); }
.sap-cell[data-n="3"] { color: var(--red); }
.sap-cell[data-n="4"] { color: var(--hold); }
.sap-cell[data-n="5"] { color: var(--red-hover); }
.sap-cell[data-n="6"] { color: var(--gold); }
.sap-cell[data-n="7"] { color: var(--muted); }
.sap-cell[data-n="8"] { color: var(--ink); }

/* ---------- Kosynka (C12): the Klondike patience ---------- */
.ksn-board { flex: 1; display: flex; flex-direction: column; gap: 12px; padding: 10px; overflow: auto; background: var(--black); border: 1px solid #332e28; }
.ksn-row { display: flex; gap: 8px; align-items: flex-start; }
.ksn-spacer { flex: 1; }
.ksn-card { width: 52px; height: 66px; box-sizing: border-box; border: 1px solid #4c453d; background: var(--card); color: var(--ink); font-family: var(--mono); font-size: 13px; line-height: 1; padding: 4px; cursor: pointer; user-select: none; }
.ksn-card.ksn-red { color: var(--red); }
.ksn-card.ksn-down { background: var(--card-2); color: transparent; }
.ksn-card.ksn-sel { border-color: var(--gold); background: var(--red-tint); }
.ksn-slot { width: 52px; height: 66px; box-sizing: border-box; border: 1px solid #332e28; background: var(--field-fill); color: var(--muted); font-family: var(--mono); font-size: 13px; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.ksn-cols { flex: 1; display: flex; gap: 8px; align-items: flex-start; }
.ksn-col { flex: 1; min-width: 52px; min-height: 66px; display: flex; flex-direction: column; border: 1px solid #332e28; padding: 2px; }
.ksn-col .ksn-card { width: 100%; }
.ksn-col .ksn-card + .ksn-card { margin-top: -44px; }
.ksn-won { font-family: var(--mono); color: var(--gold); letter-spacing: .3em; text-align: center; padding: 4px 0; }

/* ---------- Luna, the lander (C15) ---------- */
.luna-hud { display: flex; align-items: center; gap: 12px; padding: 5px 10px;
  background: var(--card); border: 1px solid #332e28;
  font-family: var(--mono); font-size: 12px; color: var(--muted); }
.luna-gauge { flex: 1; height: 10px; background: var(--field-fill); border: 1px solid #4c453d; }
.luna-gauge-bar { height: 100%; background: var(--gold); }
.luna-read { letter-spacing: .04em; white-space: nowrap; }
.luna-safe { color: var(--gold); }
.luna-hot { color: var(--red); }

/* ---- C16a: Su-27, the overpowered shmup (A7) ---- */
.su27-canvas { cursor: crosshair; outline: none; }

/* ---- Morskoy Boy (C16b): periscope fire controls ---- */
.morskoy-boy-controls { display: flex; align-items: center; gap: 12px; padding: 6px 10px;
  background: var(--card); border: 1px solid #332e28; }
.morskoy-boy-fire { border: 1px solid var(--red); background: var(--red-tint); color: var(--ink);
  font-family: var(--mono); font-weight: 800; letter-spacing: .06em; padding: 6px 14px; cursor: pointer; }
.morskoy-boy-fire:hover { background: var(--red-hover); color: var(--ink); }
.morskoy-boy-hint { margin-left: auto; color: var(--muted); font-family: var(--mono); font-size: 11px; }

/* outbox (C17): held replies tray in the Selektor messenger */
.outbox-tray { border: 1px solid #4c453d; background: var(--card); padding: 8px 10px; margin: 0 0 2px 0; border-radius: 0; }
.outbox-head { font-family: var(--mono); font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .08em; margin-bottom: 4px; }
.outbox-row { display: flex; align-items: baseline; gap: 8px; padding: 4px 0; border-top: 1px solid #332e28; }
.outbox-thread { font-family: var(--mono); font-size: 11px; color: var(--gold); white-space: nowrap; }
.outbox-text { flex: 1; color: var(--ink); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.outbox-remove { background: var(--card-2); border: 1px solid #332e28; color: var(--muted); cursor: pointer; font-size: 11px; line-height: 1; padding: 2px 6px; border-radius: 0; }
.outbox-remove:hover { color: var(--red-hover); border-color: #4c453d; }
.outbox-sendall { margin-top: 8px; }
.outbox-hold { margin-left: 6px; }



/* ---- Dispatch (SA-000016, the dispatch desk; plain label until named) ---- */
.dsp-view{padding:14px;display:flex;flex-direction:column;gap:12px;overflow:auto;height:100%}
.dsp-clerk{color:var(--muted);border-left:3px solid var(--gold);padding:4px 10px}
.dsp-form{display:flex;flex-direction:column;gap:10px}
.dsp-field{display:flex;flex-direction:column;gap:4px}
.dsp-label{color:var(--muted);font-size:13px}
.dsp-input{background:var(--card);color:var(--ink);border:1px solid var(--line-strong);padding:6px 8px;font:inherit}
.dsp-agents{display:flex;gap:12px;flex-wrap:wrap}
.dsp-agent{flex:1 1 240px;border:1px solid var(--line);padding:8px 12px 12px;display:flex;flex-direction:column;gap:8px}
.dsp-agent legend{color:var(--ink);padding:0 6px}
.dsp-role{color:var(--muted);font-size:13px}
.dsp-generate{align-self:flex-start;background:var(--red);color:#fff;border:1px solid var(--red-dark);padding:8px 16px;cursor:pointer;font:inherit}
.dsp-generate:hover{background:#f04a3e}
.dsp-orders{display:flex;flex-direction:column;gap:12px}
.dsp-order{border:1px solid var(--line-strong);background:var(--card);padding:10px;position:relative}
.dsp-order-head{color:var(--gold);margin-bottom:6px}
.dsp-order-text{white-space:pre-wrap;user-select:text;-webkit-user-select:text;color:var(--ink);background:var(--bg-2);padding:10px;margin:0;max-height:260px;overflow:auto}
.dsp-copy{position:absolute;top:8px;right:10px;background:var(--card-2);color:var(--ink);border:1px solid var(--line-strong);padding:4px 10px;cursor:pointer;font:inherit}
.dsp-copy:disabled{color:var(--muted);cursor:default}
.dsp-taken{border-color:var(--hold)}
.dsp-done{color:var(--muted);border-left:3px solid var(--ok);padding:4px 10px}
.dsp-empty{color:var(--muted);padding:10px}


/* ---- The form kit (SA-000018, Third Plan C1; labels, inline errors, drafts) ---- */
.mgf-field{display:flex;flex-direction:column;gap:4px;margin:0 0 10px}
.mgf-label{color:var(--muted);font-size:13px}
.mgf-req{color:var(--gold)}
.mgf-field input,.mgf-field textarea,.mgf-field select{background:var(--card);color:var(--ink);border:1px solid var(--line-strong);padding:6px 8px;font:inherit}
.mgf-invalid input,.mgf-invalid textarea,.mgf-invalid select{border-color:var(--red)}
.mgf-error{color:var(--red);font-size:13px;min-height:1em}


/* ---- The plan review desk (SA-000020, Third Plan J2, D27) ---- */
.pr-view{padding:14px;display:flex;flex-direction:column;gap:10px;overflow:auto;height:100%}
.pr-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pr-back{background:var(--card-2);color:var(--ink);border:1px solid var(--line-strong);padding:5px 12px;cursor:pointer;font:inherit}
.pr-title{color:var(--ink);font-weight:600}
.pr-notecount{color:var(--gold);margin-left:auto}
.pr-wrap{display:flex;flex-direction:column;gap:8px;overflow:auto;flex:1}
.pr-v1{color:var(--muted);border-left:3px solid var(--hold);padding:4px 10px}
.pr-phase{border:1px solid var(--line-strong);background:var(--card);padding:8px}
.pr-phase-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pr-ph-toggle,.pr-st-toggle{background:none;color:var(--ink);border:0;cursor:pointer;font:inherit;text-align:left;padding:2px 4px}
.pr-ph-toggle{font-weight:600}
.pr-ph-meta{color:var(--muted);font-size:13px}
.pr-chip{color:var(--ok);border:1px solid var(--ok);padding:1px 8px;font-size:12px}
.pr-step{margin:6px 0 0 26px;display:flex;flex-direction:column;gap:4px}
.pr-impl{border-left:3px solid var(--gold);background:var(--bg-2);padding:8px 12px;margin-left:18px;display:flex;flex-direction:column;gap:4px}
.pr-impl-row{color:var(--ink);font-size:14px}
.pr-notebtn{background:var(--card-2);color:var(--muted);border:1px solid var(--line);padding:2px 8px;cursor:pointer;font-size:12px;align-self:flex-start}
.pr-note{margin:4px 0 0 18px;max-width:520px}
.pr-note-in{min-height:56px}
.pr-footer{position:sticky;bottom:0;background:var(--bg-2);border-top:1px solid var(--line-strong);padding:10px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.pr-sendback{background:var(--card-2);color:var(--ink);border:1px solid var(--line-strong);padding:7px 14px;cursor:pointer;font:inherit}
.pr-approve-checked,.pr-approve-all{background:var(--red);color:#fff;border:1px solid var(--red-dark);padding:7px 14px;cursor:pointer;font:inherit}
.pr-result{color:var(--muted);flex:1 1 100%}
.card-open{cursor:pointer}


/* ---- Execute (SA-000021, Third Plan J3) ---- */
.pr-exec{display:flex;flex-direction:column;gap:8px}
.pr-exec-head{color:var(--gold);border-top:1px solid var(--line-strong);padding-top:8px}
.pr-exec-order{border:1px solid var(--line-strong);background:var(--card);padding:10px;position:relative}
.pr-exec-label{color:var(--ink);margin-bottom:6px;font-weight:600}
.pr-exec-text{white-space:pre-wrap;user-select:text;-webkit-user-select:text;color:var(--ink);background:var(--bg-2);padding:10px;margin:0;max-height:220px;overflow:auto}
.pr-exec-copy{position:absolute;top:8px;right:10px;background:var(--card-2);color:var(--ink);border:1px solid var(--line-strong);padding:4px 10px;cursor:pointer;font:inherit}
.pr-exec-copy:disabled{color:var(--muted);cursor:default}
.pr-exec-note{color:var(--muted)}


/* ---- Settings (SA-000022, Third Plan I3; the local server panel) ---- */
.set-view{padding:16px;display:flex;flex-direction:column;gap:10px;overflow:auto;height:100%}
.set-head{color:var(--gold);font-weight:600}
.set-save,.set-stop,.set-restart,.set-update-check{align-self:flex-start;background:var(--card-2);color:var(--ink);border:1px solid var(--line-strong);padding:6px 14px;cursor:pointer;font:inherit}
.set-save:hover,.set-update-check:hover{border-color:var(--gold)}
.set-stop{border-color:var(--red)}
.set-life{display:flex;gap:10px}
.set-note{color:var(--muted);min-height:1em}
.set-empty{color:var(--muted);padding:12px}


/* ---- The update badge (SA-000023, Third Plan I6, D28) ---- */
#mg-start.mg-upd{box-shadow:inset 0 0 0 2px var(--gold)}
.set-update-now{align-self:flex-start;background:var(--red);color:#fff;border:1px solid var(--red-dark);padding:6px 14px;cursor:pointer;font:inherit}
.set-update-now:disabled{background:var(--hold);cursor:default}


/* ---- The context menu (SA-000024, Third Plan D1; one surface for the desktop) ---- */
.mg-ctx{position:fixed;z-index:4000;min-width:160px;display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line-strong);box-shadow:0 8px 24px rgba(0,0,0,.5);padding:4px}
.mg-ctx-item{background:none;border:0;color:var(--ink);text-align:left;padding:7px 14px;cursor:pointer;font:inherit}
.mg-ctx-item:hover{background:var(--card-2)}
.mg-ctx-item:focus{outline:1px solid var(--gold)}
.mg-ctx-item:disabled{color:var(--hold);cursor:default}


/* ---- The desktop icons layer (SA-000026, Third Plan D2, D10) ---- */
.mg-icons{position:absolute;inset:0;z-index:1}
.di-icon{position:absolute;width:84px;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;padding:6px;user-select:none}
.di-icon:hover{background:rgba(255,255,255,.04)}
.di-glyph{width:34px;height:34px;color:var(--gold)}
.di-name{color:var(--ink);font-size:13px;text-align:center;word-break:break-word;max-width:84px;text-shadow:0 1px 2px rgba(0,0,0,.8)}
.di-in-folder{position:static}
.di-rename{margin-top:4px;max-width:200px}
.df-head{display:flex;justify-content:flex-end;padding:6px 10px;border-bottom:1px solid var(--line)}
.df-rename{background:var(--card-2);color:var(--ink);border:1px solid var(--line-strong);padding:3px 10px;cursor:pointer;font:inherit}
.df-grid{display:flex;flex-wrap:wrap;gap:10px;padding:12px;overflow:auto}
.df-empty{color:var(--muted);padding:10px}


/* ---- Repo folders and the explorer (SA-000027, Third Plan D3, D10/D13) ---- */
.mg-repos{position:absolute;left:12px;top:12px;display:flex;flex-direction:column;gap:14px;z-index:2}
.di-repo{position:static;border:1px dashed var(--line-strong);background:rgba(0,0,0,.25)}
.di-repo-glyph{color:var(--red)}
.di-tag{color:var(--muted);font-size:11px;text-align:center;max-width:84px;word-break:break-word}
.fx-view{padding:12px;display:flex;flex-direction:column;gap:8px;overflow:hidden;height:100%}
.fx-head{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.fx-tag{color:var(--gold);font-weight:600}
.fx-truth{color:var(--muted);font-size:13px}
.fx-refusal{color:var(--red);min-height:1em;font-size:13px}
.fx-crumbs{display:flex;gap:4px;flex-wrap:wrap}
.fx-crumb{background:var(--card-2);color:var(--ink);border:1px solid var(--line);padding:2px 8px;cursor:pointer;font:inherit;font-size:13px}
.fx-list{display:flex;flex-direction:column;gap:2px;overflow:auto;flex:1}
.fx-row{display:flex;gap:8px;align-items:center;padding:4px 8px;cursor:default}
.fx-row:hover{background:var(--card)}
.fx-dir{color:var(--gold)}
.fx-name{color:var(--ink);flex:1}
.fx-size{color:var(--muted);font-size:12px}
.fx-empty{color:var(--muted);padding:10px}


/* ---- Spravochnik, the fictional Fact Book ---- */
.fb-view{height:100%;display:flex;flex-direction:column;background:#151412;color:var(--ink);overflow:hidden}
.fb-toolbar{flex:0 0 auto;display:flex;align-items:center;gap:8px;padding:8px 10px;border-bottom:1px solid var(--line-strong);background:var(--bg-2)}
.fb-titlebar{display:flex;flex-direction:column;min-width:150px;margin-right:auto;line-height:1.1}
.fb-titlebar strong{color:var(--gold);font-size:14px;text-transform:uppercase;letter-spacing:.08em}
.fb-titlebar span{color:var(--muted);font-size:12px}
.fb-tab,.fb-nav,.fb-link,.fb-entry-link{background:var(--card-2);color:var(--ink);border:1px solid var(--line-strong);cursor:pointer;font:inherit}
.fb-tab,.fb-nav{padding:5px 10px}
.fb-tab.active{border-color:var(--gold);color:var(--gold);background:var(--red-tint)}
.fb-nav:disabled{color:var(--hold);cursor:default;border-color:var(--line)}
.fb-page-count{font:12px var(--mono);color:var(--muted);min-width:68px;text-align:center}
.fb-spread{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:18px;overflow:auto;background:radial-gradient(circle at center,#24211d 0,#151412 70%)}
.fb-page{min-height:520px;background:#d8c5a1;color:#241b13;border:1px solid #4f3826;box-shadow:0 10px 28px rgba(0,0,0,.45);padding:22px;overflow:auto;position:relative}
.fb-page h1,.fb-page h2{margin:0 0 10px;color:#21170f;line-height:1.12}
.fb-page h1{font-size:30px;text-transform:uppercase;letter-spacing:.06em}
.fb-page h2{font-size:22px}
.fb-page p{font-size:14px;line-height:1.55;margin:8px 0}
.fb-sub{font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.fb-edition,.fb-note,.fb-caption,.fb-kicker{font:12px var(--mono);color:#6c4d31}
.fb-kicker{text-transform:uppercase;letter-spacing:.12em;margin-bottom:6px}
.fb-plate-button{display:block;border:1px solid #6e5336;background:#1d1a16;padding:0;cursor:pointer;overflow:hidden}
.fb-plate-button img{display:block;width:100%;height:100%;object-fit:cover}
.fb-cover-art{width:56%;max-width:260px;aspect-ratio:1122/1402;margin:0 auto 18px}
.fb-banner-art{width:100%;height:96px;margin:0 0 14px}
.fb-entry-art{width:100%;height:210px;margin:8px 0 6px}
.fb-cover-page{text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}
.fb-contents{margin:12px 0 0;padding-left:24px}
.fb-contents li{margin:5px 0}
.fb-link{background:transparent;border:0;color:#241b13;text-align:left;padding:2px 0;text-decoration:underline}
.fb-section-list{display:flex;flex-direction:column;gap:6px;margin-top:12px}
.fb-entry-link{background:rgba(78,56,36,.12);color:#241b13;border-color:#8a6842;text-align:left;padding:7px 9px}
.fb-figures{margin-top:12px;border:1px solid #8a6842;background:rgba(74,52,34,.12);padding:8px 10px}
.fb-fig-title{font:700 12px var(--mono);text-transform:uppercase;letter-spacing:.1em;color:#5a3e27;margin-bottom:4px}
.fb-fig{font:12px/1.45 var(--mono);color:#2a1d13;border-top:1px solid rgba(90,62,39,.25);padding:4px 0}
.fb-timeline{display:flex;flex-direction:column;gap:8px}
.fb-time-row{display:grid;grid-template-columns:68px 1fr;gap:10px;border-top:1px solid rgba(90,62,39,.3);padding-top:8px}
.fb-year{font:800 13px var(--mono);color:#5a3e27}
.fb-gallery{flex:1;overflow:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(142px,1fr));gap:10px;padding:12px;background:var(--bg)}
.fb-card{display:flex;flex-direction:column;gap:5px;background:var(--card);border:1px solid var(--line-strong);padding:7px;color:var(--ink);cursor:pointer;text-align:left;min-width:0}
.fb-card:hover{border-color:var(--gold)}
.fb-card img{width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--bg-2);border:1px solid var(--line)}
.fb-card-id{font:700 11px var(--mono);color:var(--gold)}
.fb-card-title{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fb-about,.fb-empty{padding:20px;overflow:auto;color:var(--ink)}
.fb-about h2{margin:0 0 10px;color:var(--gold)}
.fb-about p,.fb-empty{color:var(--muted);line-height:1.55}
.fb-lightbox{position:fixed;inset:0;z-index:5000;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.82);padding:24px}
.fb-lightbox-frame{max-width:min(96vw,1500px);max-height:96vh;display:flex;flex-direction:column;gap:8px}
.fb-lightbox-frame img{max-width:100%;max-height:calc(96vh - 72px);object-fit:contain;border:1px solid var(--line-strong);background:var(--black)}
.fb-lightbox-close{align-self:flex-end;background:var(--card-2);color:var(--ink);border:1px solid var(--line-strong);padding:6px 12px;cursor:pointer;font:inherit}
.fb-lightbox-cap{font:12px var(--mono);color:var(--muted);text-align:center}
@media (max-width:760px){
  .fb-spread{grid-template-columns:1fr;padding:10px}
  .fb-page-right{display:none}
  .fb-toolbar{flex-wrap:wrap}
  .fb-titlebar{flex:1 1 100%}
  .fb-page{min-height:420px}
}

/* ---- About Mongoose (SA-000035): the system card ---- */
.mga h2 { margin: 0 0 2px; letter-spacing: .06em; }
.mga-tag { margin: 0 0 14px; color: var(--muted); font-size: 13px; }
.mga-rows { display: flex; flex-direction: column; gap: 7px;
  border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 12px 0; margin: 0 0 12px; }
.mga-row { display: flex; gap: 12px; font-size: 13px; align-items: baseline; }
.mga-row span { width: 84px; flex: none; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; font-size: 10px; }
.mga-row b { color: var(--ink); font-weight: 600; }
.mga-row .mga-ver { font-family: var(--mono); font-size: 12px; }
.mga-hint { color: var(--muted); font-size: 12px; margin: 0; }

/* Selektor, the messenger desk app (SA-000048, WO-A). Tokens only. */
.selektor{display:flex;flex-direction:column;height:100%;background:var(--bg)}
.sk-titlebar{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--card);border-bottom:1px solid var(--line-strong)}
.sk-titlebar .bell .ico{width:16px;height:16px}
.sk-titlebar .name{font:700 13px var(--sans);letter-spacing:.04em;color:var(--ink)}
.sk-titlebar .sub{font:12px var(--mono);color:var(--muted)}
.sk-tabs{margin-left:auto;display:flex;gap:4px}
.sk-tab{font:12px var(--mono);color:var(--muted);background:var(--card-2);border:1px solid var(--line);padding:3px 10px;cursor:pointer}
.sk-tab.active{color:#fff;background:var(--red);border-color:var(--red)}
.sk-body{display:flex;flex:1;min-height:0}
.sk-rail{width:150px;border-right:1px solid var(--line);overflow-y:auto;padding:8px 0;background:var(--card)}
.sk-rail .rail-head{font:600 10px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:0 10px 6px}
.sk-comrade{display:flex;align-items:center;gap:7px;padding:4px 10px}
.sk-comrade .dot{width:8px;height:8px;border-radius:50%;background:var(--muted);flex:none}
.sk-comrade.st-online .dot,.sk-comrade.st-working .dot{background:var(--ok)}
.sk-comrade.st-typing .dot{background:var(--gold)}
.sk-comrade .nm{font:600 12px var(--sans);color:var(--ink)}
.sk-comrade .rl{font:10px var(--mono);color:var(--muted)}
.sk-thread{flex:1;overflow-y:auto;padding:12px}
.sk-sys{font:11px var(--mono);color:var(--muted);text-align:center;padding:4px 0}
.sk-row{display:flex;gap:8px;margin:8px 0;max-width:82%}
.sk-row.dir{margin-left:auto;justify-content:flex-end}
.sk-avatars{display:flex;gap:4px;align-items:flex-start}
.sk-card{width:40px;height:40px;border:1px solid var(--line-strong);background:var(--card-2);overflow:hidden;flex:none}
.sk-card img{width:100%;height:100%;object-fit:cover;display:block}
.sk-card .mono{font:800 16px var(--mono);color:var(--muted);display:flex;align-items:center;justify-content:center;height:100%}
.sk-card .emo{font:9px var(--mono);color:var(--muted);display:flex;align-items:center;justify-content:center;height:100%;text-align:center}
.sk-head{display:flex;gap:8px;align-items:baseline;font:600 12px var(--sans);color:var(--ink)}
.sk-head .role{font:10px var(--mono);color:var(--muted)}
.sk-head .time{font:10px var(--mono);color:var(--muted)}
.sk-bubble{font:13px/1.5 var(--sans);color:var(--ink);background:var(--card-2);border:1px solid var(--line);padding:6px 10px;margin-top:2px}
.sk-row.dir .sk-bubble{background:var(--card);border-color:var(--line-strong)}
.sk-ticks{font:10px var(--mono);color:var(--muted);margin-top:2px;text-align:right}
.sk-ticks.read{color:var(--ok)}
.sk-composer{display:flex;gap:6px;padding:10px 12px;border-top:1px solid var(--line-strong);background:var(--card)}
.sk-composer input{flex:1;font:13px var(--sans);color:var(--ink);background:var(--card-2);border:1px solid var(--line);padding:7px 10px}
.sk-status{font:11px var(--mono);color:var(--gold);padding:0 12px}
.sk-status:empty{display:none}
.sk-note{font:11px var(--mono);color:var(--muted);padding:6px 12px 10px}

/* Quick Open (SA-000051, WO-J). Tokens only, square. */
.qo-overlay{position:fixed;inset:0;z-index:1200;background:rgba(0,0,0,.45);display:flex;align-items:flex-start;justify-content:center;padding-top:12vh}
.qo-box{width:420px;max-width:92vw;background:var(--card);border:1px solid var(--line-strong);box-shadow:8px 8px 0 rgba(0,0,0,.35)}
.qo-input{width:100%;box-sizing:border-box;font:14px var(--sans);color:var(--ink);background:var(--card-2);border:0;border-bottom:1px solid var(--line-strong);padding:10px 12px;outline:none}
.qo-list{max-height:40vh;overflow-y:auto}
.qo-row{display:flex;align-items:center;gap:9px;padding:7px 12px;cursor:pointer;font:13px var(--sans);color:var(--ink)}
.qo-row .ico{width:16px;height:16px}
.qo-row.active,.qo-row:hover{background:var(--red);color:#fff}
.qo-none{font:12px var(--mono);color:var(--muted);padding:10px 12px}

/* The User Palette additions (SA-000052, WO-B): the honest strip line,
   the recycle bin window, the download shelf windows, the icon browser.
   Tokens only, square. */
.di-unserved{max-width:200px;font:11px/1.5 var(--mono);color:var(--muted);border:1px dashed var(--line-strong);padding:8px 10px}
.bin-none{font:12px var(--mono);color:var(--muted)}
.bin-row{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid var(--line)}
.bin-row .ico{width:16px;height:16px;flex:0 0 auto}
.bin-name{flex:1 1 auto;font:13px var(--sans);color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bin-when{font:11px var(--mono);color:var(--muted)}
.bin-restore,.bin-empty,.shelf-act{font:12px var(--sans);color:var(--ink);background:var(--card-2);border:1px solid var(--line-strong);padding:5px 10px;cursor:pointer}
.bin-restore:hover,.shelf-act:hover{border-color:var(--red)}
.bin-empty{margin-top:12px}
.bin-empty-armed{background:var(--red);color:#fff;border-color:var(--red-dark)}
.shelf-name{margin:0 0 8px;font:700 15px var(--sans);color:var(--ink)}
.shelf-text{margin:0 0 14px;font:13px/1.6 var(--sans);color:var(--ink)}
.shelf-act{display:inline-block;text-decoration:none}
.ib-overlay{position:fixed;inset:0;z-index:1200;background:rgba(0,0,0,.45);display:flex;align-items:flex-start;justify-content:center;padding-top:10vh}
.ib-panel{width:440px;max-width:92vw;background:var(--card);border:1px solid var(--line-strong);box-shadow:8px 8px 0 rgba(0,0,0,.35)}
.ib-head{font:600 10px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:10px 12px;border-bottom:1px solid var(--line);background:#0d0b09}
.ib-search{width:100%;box-sizing:border-box;font:14px var(--sans);color:var(--ink);background:var(--card-2);border:0;border-bottom:1px solid var(--line-strong);padding:9px 12px;outline:none}
.ib-body{max-height:46vh;overflow-y:auto;padding:6px 12px 12px}
.ib-group{font:700 10px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:10px 0 6px}
.ib-grid{display:flex;flex-wrap:wrap;gap:6px}
.ib-cell{display:flex;flex-direction:column;align-items:center;gap:4px;width:72px;padding:8px 4px;background:var(--card-2);border:1px solid var(--line);color:var(--ink);cursor:pointer}
.ib-cell:hover{border-color:var(--line-strong)}
.ib-cell.ib-current{border-color:var(--red)}
.ib-cell .ico{width:20px;height:20px}
.ib-name{font:10px var(--mono);color:var(--muted)}
.ib-none{font:12px var(--mono);color:var(--muted);padding:10px 0}

/* The project selector (SA-000055, WO-F). Tokens only. */
.di-strip-note{font:11px var(--mono);color:var(--gold);padding:4px 8px;max-width:200px}
.set-projects{margin:4px 0 10px}
.set-project-row{display:flex;align-items:center;gap:10px;padding:5px 0;border-bottom:1px solid var(--line)}
.set-project-code{font:700 13px var(--mono);color:var(--ink)}
.set-project-state{font:11px var(--mono);color:var(--muted);flex:1}
.set-note{font:11px var(--mono);color:var(--gold);padding:4px 0}

/* Movable icons (SA-000057): the drag ghost. */
.mg-icon-ghost{opacity:.4}