/* ============================================================
   MAC DESKTOP — living desktop styles: draggables, mac windows,
   Quick Look, the dock, and the LIST app demo. See mac-desktop.js
   ============================================================ */

.mac-desktop .glass-card, .mac-desktop .mac-file{ cursor:default; touch-action:none; }
.mac-dragging{ cursor:default !important; opacity:.92; }
.mac-file.sel b{ background:#2f6fed; border-radius:3px; padding:0 3px; }
.mac-file{ user-select:none; }
.mac-file:focus-visible{ outline:2px solid #8ec8ff; outline-offset:5px; border-radius:4px; }
.mac-system-recordings-file small{ margin-top:-2px; color:#d5e7ff; font:700 8px ui-monospace,Menlo,monospace; text-shadow:0 1px 2px #000; }
.mac-file .th.mov{ position:relative; display:grid; place-items:center; overflow:hidden; border:2px solid #ccd8e6; border-radius:5px; background:linear-gradient(145deg,#182a3f,#080b11); color:#fff; box-shadow:inset 0 0 0 4px #0e1824,0 4px 12px rgba(0,0,0,.45); }
.mac-file .th.mov::before,.mac-file .th.mov::after{ content:''; position:absolute; left:2px; right:2px; height:4px; background:repeating-linear-gradient(90deg,#95a9bc 0 4px,transparent 4px 8px); }
.mac-file .th.mov::before{ top:2px; }.mac-file .th.mov::after{ bottom:2px; }.mac-file .th.mov span{ position:relative; z-index:1; font-size:14px; }
.mac-file .th.doc{ position:relative; display:grid; place-items:center; overflow:hidden; border:1px solid rgba(255,255,255,.72); background:#f8fafc; color:#172033; box-shadow:0 5px 13px rgba(0,0,0,.43),inset 0 -8px 0 rgba(0,0,0,.05); }
.mac-file .th.doc::before{ content:''; position:absolute; top:0; right:0; width:13px; height:13px; background:linear-gradient(135deg,rgba(255,255,255,.15) 0 49%,rgba(0,0,0,.2) 50%),#dbe3ec; border-left:1px solid rgba(0,0,0,.16); border-bottom:1px solid rgba(0,0,0,.16); }
.mac-file .th.doc::after{ content:''; position:absolute; left:6px; right:8px; bottom:5px; height:10px; background:repeating-linear-gradient(180deg,currentColor 0 1px,transparent 1px 3px); opacity:.42; }
.mac-file .th.doc span,.mac-file .th.doc em{ position:relative; z-index:1; display:block; font-style:normal; line-height:1; text-align:center; }
.mac-file .th.doc span{ align-self:end; margin-top:5px; padding:2px 4px; border-radius:3px; background:rgba(255,255,255,.72); font:900 6px ui-monospace,Menlo,monospace; letter-spacing:-.04em; }
.mac-file .th.doc em{ align-self:start; margin-top:1px; font:900 12px ui-monospace,Menlo,monospace; }
.mac-file .doc-proof{ background:linear-gradient(145deg,#ffffff 0 36%,#dff8e9 37% 100%); color:#168550; }
.mac-file .doc-screen{ background:linear-gradient(145deg,#fafdff 0 36%,#dce8ff 37% 100%); color:#255cce; }
.mac-file .doc-bridge{ background:linear-gradient(145deg,#fff 0 34%,#f1e2ff 35% 100%); color:#7c2ec8; }
.mac-file .doc-tester{ background:linear-gradient(145deg,#fff 0 34%,#e4edf7 35% 100%); color:#2c425c; }
.mac-file .doc-field{ background:linear-gradient(145deg,#fff 0 34%,#ffe7d2 35% 100%); color:#d95b18; }

/* Visible VoiceOver-style caption panel + actual aria-live region. */
.mac-vo-overlay{ position:absolute; left:50%; bottom:68px; width:min(680px,calc(100% - 32px)); min-height:62px; display:grid; grid-template-columns:42px minmax(0,1fr) auto; gap:11px; align-items:center; padding:10px 12px; border:2px solid rgba(255,255,255,.96); border-radius:13px; background:rgba(4,6,9,.94); box-shadow:0 16px 42px rgba(0,0,0,.62),0 0 0 2px rgba(0,122,255,.35); color:#fff; opacity:0; pointer-events:none; transform:translate(-50%,12px) scale(.985); transition:opacity .16s ease,transform .16s ease; }.mac-vo-overlay.show{ opacity:1; transform:translate(-50%,0) scale(1); }.mac-vo-overlay>span{ width:40px; height:40px; display:grid; place-items:center; border-radius:10px; background:linear-gradient(145deg,#128cff,#005bc4); box-shadow:inset 0 0 0 1px rgba(255,255,255,.36); color:#fff; font:900 12px ui-monospace,Menlo,monospace; }.mac-vo-overlay>div{ min-width:0; display:grid; gap:2px; }.mac-vo-overlay small{ color:#71baff; font:800 7px ui-monospace,Menlo,monospace; letter-spacing:.1em; }.mac-vo-overlay b{ overflow:hidden; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }.mac-vo-overlay p{ margin:0; overflow:hidden; color:#d0d6de; font-size:9px; line-height:1.4; text-overflow:ellipsis; white-space:nowrap; }.mac-vo-overlay kbd{ padding:6px 8px; border:1px solid #596675; border-radius:7px; background:#171c24; color:#dce5ef; font:700 7px ui-monospace,Menlo,monospace; white-space:nowrap; }
.modern.mac-hide-vo-captions .mac-vo-overlay{ display:none!important; }

/* dock: size-based magnification — neighbors displace, like the real one */
.modern-dock{ align-items:flex-end; }
.modern-dock .d{
  transition:font-size .12s ease-out;
  line-height:1; display:flex; align-items:flex-end;
}
.modern-dock .dock-cobol-rpg{
  width:1.18em; height:1.18em; align-self:flex-end; display:grid; place-items:center;
  overflow:hidden; border-radius:.23em; border:.035em solid rgba(178,232,66,.72);
  background:#030503; box-shadow:0 .12em .25em rgba(0,0,0,.5),0 0 .14em rgba(164,233,57,.28);
}
.modern-dock .dock-cobol-rpg img{ width:100%; height:100%; display:block; object-fit:cover; user-select:none; pointer-events:none; }

/* The COBOL Room — original campaign launcher. */
.mac-cobol-launcher{ background:#080b08; border-color:#75542b; }
.mac-cobol-launcher .mac-win-bar{ background:linear-gradient(#3e3528,#211d18); border-color:#78582f; color:#e9d7aa; }
.mac-cobol-launcher .mac-win-body{ background:#050705; }
.mcr-shell{ --mcr-green:#a9e45d; --mcr-rust:#c78236; position:relative; flex:1; min-height:0; display:grid; grid-template-columns:minmax(0,1.45fr) minmax(300px,.78fr); overflow:hidden; color:#e7e2d2; background:#080b08; }
.mcr-noise{ position:absolute; inset:0; z-index:3; opacity:.16; pointer-events:none; background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,255,255,.035) 3px 4px); mix-blend-mode:screen; }
.mcr-hero{ position:relative; z-index:1; display:flex; flex-direction:column; justify-content:flex-end; padding:clamp(28px,5vw,66px); overflow:hidden; border-right:1px solid #4e3c23; background:linear-gradient(90deg,rgba(5,8,5,.96) 0,rgba(5,8,5,.55) 57%,rgba(5,8,5,.88)),radial-gradient(circle at 68% 38%,rgba(137,189,75,.35),transparent 27%),url('../assets/cobol-executive-briefing.png?v=1') center/cover; }
.mcr-hero::before{ content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(0deg,#060806 2%,transparent 48%),radial-gradient(circle at 70% 38%,transparent 0 15%,rgba(0,0,0,.55) 52%); }
.mcr-kicker{ margin-bottom:auto; color:#bd9a62; font:800 9px/1.2 ui-monospace,Menlo,monospace; letter-spacing:.18em; }
.mcr-terminal-mark{ position:absolute; right:8%; top:12%; width:138px; height:100px; display:grid; grid-template-columns:1fr 50px; align-items:center; padding:14px; transform:rotate(-2deg); border:4px solid #333128; border-radius:16px; background:#131711; box-shadow:0 22px 45px rgba(0,0,0,.68),inset 0 0 25px #000; }
.mcr-terminal-mark::after{ content:''; position:absolute; inset:10px 58px 10px 10px; border-radius:8px; background:radial-gradient(circle,#a6eb59 0 2%,transparent 3%),#14220e; box-shadow:inset 0 0 19px #000,0 0 14px rgba(137,210,75,.35); }
.mcr-terminal-mark i{ position:relative; z-index:1; width:8px; height:8px; border-radius:50%; background:#b8f36f; box-shadow:0 0 11px #8be33f; }
.mcr-terminal-mark b{ position:absolute; right:14px; top:14px; color:#c58a42; font:900 12px ui-monospace,Menlo,monospace; }
.mcr-terminal-mark span{ grid-column:2; align-self:end; color:#80755d; font:700 7px/1.45 ui-monospace,Menlo,monospace; }
.mcr-hero h1{ margin:0; color:#e8e2ca; font:900 clamp(48px,7vw,88px)/.76 Impact,"Arial Black",sans-serif; letter-spacing:-.04em; text-shadow:0 5px 0 #171710,0 10px 25px #000; }
.mcr-hero h1 em{ color:var(--mcr-rust); font-style:normal; }
.mcr-hero p{ max-width:590px; margin:24px 0 19px; color:#c7c4b4; font:500 13px/1.65 -apple-system,"SF Pro Text",sans-serif; text-shadow:0 2px 5px #000; }
.mcr-facts{ display:flex; flex-wrap:wrap; gap:7px; }
.mcr-facts span{ padding:5px 7px; border:1px solid rgba(192,139,68,.6); background:rgba(10,12,8,.68); color:#d5b77b; font:800 7px ui-monospace,Menlo,monospace; letter-spacing:.09em; }
.mcr-menu{ position:relative; z-index:4; min-width:0; display:flex; flex-direction:column; gap:12px; padding:28px 24px 20px; background:linear-gradient(145deg,#151711,#080a07 62%); box-shadow:-20px 0 45px rgba(0,0,0,.45); }
.mcr-menu header{ display:grid; gap:4px; padding-bottom:14px; border-bottom:1px solid #443a26; }
.mcr-menu header small{ color:#8f825e; font:700 7px ui-monospace,Menlo,monospace; letter-spacing:.16em; }
.mcr-menu header b{ color:#e5dcbf; font:900 16px ui-monospace,Menlo,monospace; letter-spacing:.04em; }
.mcr-save{ display:grid; gap:5px; padding:15px; border:1px solid #3a3e2d; background:#0c110a; box-shadow:inset 0 0 20px #050704; }
.mcr-save.has-save{ border-color:#67843d; box-shadow:inset 0 0 25px rgba(105,155,55,.1),0 0 14px rgba(102,159,46,.08); }
.mcr-save>small{ color:#8b936e; font:800 7px ui-monospace,Menlo,monospace; letter-spacing:.13em; }
.mcr-save>strong{ overflow:hidden; color:var(--mcr-green); font:900 17px ui-monospace,Menlo,monospace; text-overflow:ellipsis; white-space:nowrap; text-shadow:0 0 9px rgba(169,228,93,.25); }
.mcr-save>span{ color:#777a68; font:600 8px ui-monospace,Menlo,monospace; }
.mcr-save dl{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:8px 0 0; }
.mcr-save dl div{ display:flex; justify-content:space-between; padding-top:7px; border-top:1px solid #2b2f22; }
.mcr-save dt,.mcr-save dd{ margin:0; font:700 8px ui-monospace,Menlo,monospace; }.mcr-save dt{ color:#777d68; }.mcr-save dd{ color:#d3dabd; }
.mcr-action{ width:100%; display:grid; gap:2px; padding:11px 13px; border:1px solid #675338; border-radius:2px; background:linear-gradient(#29271f,#191914); color:#ded5ba; text-align:left; cursor:pointer; }
.mcr-action:hover,.mcr-action:focus-visible{ border-color:#bc8b4c; background:linear-gradient(#3a3326,#201d16); outline:none; }
.mcr-action.primary{ border-color:#719446; background:linear-gradient(#3a5127,#1a2814); color:#e9ffd2; }
.mcr-action:disabled{ opacity:.38; cursor:not-allowed; }
.mcr-action span{ font:900 13px ui-monospace,Menlo,monospace; letter-spacing:.06em; }.mcr-action small{ color:#8e907e; font:600 8px ui-monospace,Menlo,monospace; }
.mcr-confirm{ position:absolute; inset:auto 18px 55px; z-index:5; display:grid; gap:9px; padding:17px; border:1px solid #ad7136; background:#18130e; box-shadow:0 18px 45px #000; }
.mcr-confirm[hidden]{ display:none; }.mcr-confirm b{ color:#e9b15c; font:900 10px ui-monospace,Menlo,monospace; }.mcr-confirm span{ color:#a89b81; font-size:9px; }.mcr-confirm button{ padding:8px; border:1px solid #76532e; background:#2c2116; color:#ebd4ac; font:800 8px ui-monospace,Menlo,monospace; }
.mcr-menu footer{ margin-top:auto; color:#777b69; font:700 7px/2 ui-monospace,Menlo,monospace; }.mcr-menu footer kbd{ padding:2px 4px; border:1px solid #4e513f; background:#171a13; color:#b9c59e; }
@media (max-width:760px){ .mcr-shell{ grid-template-columns:1fr; }.mcr-hero{ min-height:34%; padding:22px; border-right:0; border-bottom:1px solid #4e3c23; }.mcr-hero h1{ font-size:42px; }.mcr-hero p{ margin:12px 0; font-size:10px; }.mcr-terminal-mark{ display:none; }.mcr-menu{ min-height:0; padding:16px; gap:8px; overflow:auto; }.mcr-save{ padding:10px; }.mcr-menu footer{ margin-top:4px; } }

/* ---- mac windows ---- */
.mac-win{
  position:absolute; display:flex; flex-direction:column;
  border-radius:12px; overflow:hidden;
  background:rgba(28,28,32,.92);
  -webkit-backdrop-filter:blur(22px); backdrop-filter:blur(22px);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 24px 60px rgba(0,0,0,.55);
  font-family:-apple-system,"SF Pro Text","Segoe UI",sans-serif;
  color:#e8e8ec;
}
.mac-win-bar{
  flex:0 0 34px; display:flex; align-items:center; gap:10px; padding:0 12px;
  background:rgba(255,255,255,.06); border-bottom:1px solid rgba(255,255,255,.08);
  cursor:default; user-select:none;
}
.mac-win-lights{ display:flex; gap:7px; }
.mac-win-lights i{ width:12px; height:12px; border-radius:50%; cursor:pointer; }
.mac-win-lights .r{ background:#ff5f57; } .mac-win-lights .y{ background:#febc2e; }
.mac-win-lights .g{ background:#28c840; }
.mac-win-title{ font-size:13px; opacity:.85; }
.mac-win-body{ flex:1; min-height:0; display:flex; flex-direction:column; overflow:hidden; }

/* Finder windows opened by the project folders on Luke's desktop. */
.mac-folder-win{ max-width:calc(100vw - 44px); max-height:calc(100vh - 90px); background:rgba(26,29,36,.97); }
.mac-finder-shell{ flex:1; min-height:0; display:flex; }
.mac-finder-shell aside{
  flex:0 0 150px; padding:13px 10px; background:rgba(255,255,255,.055);
  border-right:1px solid rgba(255,255,255,.08); display:flex; flex-direction:column; gap:3px;
}
.mac-finder-shell aside b{ margin:8px 8px 3px; color:#8993a3; font-size:10px; }
.mac-finder-shell aside span{ padding:6px 8px; border-radius:6px; font-size:12px; }
.mac-finder-shell aside span.on{ background:#2167c9; color:#fff; }
.mac-finder-shell main{ flex:1; min-width:0; display:flex; flex-direction:column; background:#171a20; }
.mac-finder-toolbar{ height:42px; display:flex; align-items:center; gap:7px; padding:0 12px; border-bottom:1px solid rgba(255,255,255,.08); }
.mac-finder-toolbar button{ width:26px; height:24px; border:0; border-radius:6px; background:#2b2f37; color:#dce3ec; font-size:18px; }
.mac-finder-toolbar button:disabled{ opacity:.28; }
.mac-finder-toolbar strong{ flex:1; margin-left:5px; font-size:13px; }
.mac-folder-grid{ padding:24px; display:grid; grid-template-columns:repeat(3,minmax(90px,1fr)); gap:28px 18px; }
.mac-folder-grid > div{ display:grid; justify-items:center; gap:5px; text-align:center; }
.mac-folder-grid i{ position:relative; width:66px; height:45px; border-radius:7px; background:linear-gradient(#7fd5ff,#258fdf); box-shadow:0 5px 12px rgba(0,0,0,.35); }
.mac-folder-grid i::before{ content:''; position:absolute; left:4px; top:-7px; width:29px; height:11px; border-radius:6px 6px 0 0; background:#75d0ff; }
.mac-folder-grid b{ font-size:12px; }
.mac-folder-grid small{ color:#7f8997; font-size:9px; }

/* Complete product packages inside the Finder folders. */
.mac-folder-win{ border-color:rgba(255,255,255,.22); }
.mac-folder-win .mac-win-body{ background:#14171d; }
.mac-folder-win .mac-finder-shell aside{ flex-basis:176px; padding:10px; }
.mac-folder-win .mac-finder-shell aside>span{ padding:5px 8px; font-size:10px; }
.mac-folder-brand{ display:grid; grid-template-columns:40px 1fr; gap:3px 9px; align-items:center; padding:8px; margin-bottom:7px; }
.mac-folder-brand>span{ grid-row:1/3; width:38px; height:38px; display:grid; place-items:center; border-radius:10px; background:linear-gradient(135deg,var(--mp-accent),var(--mp-accent-2)); color:#fff; box-shadow:0 8px 18px rgba(0,0,0,.35); font:900 11px ui-monospace,Menlo,monospace; }
.mac-folder-brand>b{ align-self:end; color:#fff; font-size:12px; }.mac-folder-brand>small{ align-self:start; overflow:hidden; color:var(--mp-accent); font:700 7px ui-monospace,Menlo,monospace; text-overflow:ellipsis; white-space:nowrap; }
.mac-folder-side-status{ margin-top:auto; display:grid; grid-template-columns:8px 1fr; gap:2px 7px; align-items:center; padding:9px; border:1px solid rgba(255,255,255,.08); border-radius:8px; background:rgba(0,0,0,.16); }
.mac-folder-side-status>i{ grid-row:1/3; width:7px; height:7px; border-radius:50%; background:#33df91; box-shadow:0 0 9px #33df91; }
.mac-folder-side-status>b{ font:700 7px ui-monospace,Menlo,monospace; }.mac-folder-side-status>small{ color:#768193; font-size:8px; }
.mac-folder-win .mac-finder-shell main{ overflow:hidden; }
.mac-folder-hero{ flex:0 0 auto; display:grid; grid-template-columns:52px 1fr auto; gap:12px; align-items:center; padding:14px 18px 12px; border-bottom:1px solid rgba(255,255,255,.07); background:radial-gradient(circle at 6% 20%,rgba(255,255,255,.07),transparent 27%),linear-gradient(115deg,rgba(255,255,255,.025),transparent); }
.mac-folder-hero>span{ width:50px; height:50px; display:grid; place-items:center; border-radius:13px; background:linear-gradient(135deg,var(--mp-accent),var(--mp-accent-2)); color:#fff; box-shadow:0 11px 25px rgba(0,0,0,.35); font:900 14px ui-monospace,Menlo,monospace; }
.mac-folder-hero>div{ min-width:0; }.mac-folder-hero small{ color:var(--mp-accent); font:700 7px ui-monospace,Menlo,monospace; letter-spacing:.08em; }.mac-folder-hero h2{ margin:3px 0 2px; overflow:hidden; color:#fff; font-size:16px; line-height:1.12; text-overflow:ellipsis; white-space:nowrap; }.mac-folder-hero p{ margin:0; display:-webkit-box; overflow:hidden; color:#919cac; font-size:8px; line-height:1.35; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.mac-folder-hero>b{ padding:5px 8px; border:1px solid var(--mp-accent); border-radius:12px; color:var(--mp-accent); font:700 7px ui-monospace,Menlo,monospace; white-space:nowrap; }
.mac-folder-win .mac-folder-grid{ flex:1; min-height:0; overflow:auto; padding:18px 20px; grid-template-columns:repeat(4,minmax(100px,1fr)); gap:16px 10px; align-content:start; }
.mac-artifact{ min-width:0; display:grid; justify-items:center; gap:4px; padding:7px 4px; border:1px solid transparent; border-radius:9px; background:transparent; color:#edf1f7; text-align:center; cursor:default; }
.mac-artifact:hover,.mac-artifact:focus-visible{ background:rgba(255,255,255,.055); outline:none; }.mac-artifact.selected{ border-color:rgba(255,255,255,.12); background:#1c5eb8; }
.mac-artifact>i{ position:relative; width:58px; height:52px; display:grid; place-items:center; border-radius:12px; background:#282d37; box-shadow:0 8px 18px rgba(0,0,0,.35); font-style:normal; }
.mac-artifact>i>span{ position:relative; z-index:2; font:900 10px ui-monospace,Menlo,monospace; }
.mac-artifact>b{ width:100%; overflow:hidden; font-size:10px; font-weight:600; text-overflow:ellipsis; white-space:nowrap; }.mac-artifact>strong{ max-width:100%; overflow:hidden; color:var(--artifact-accent); font:800 6px ui-monospace,Menlo,monospace; letter-spacing:.04em; text-overflow:ellipsis; white-space:nowrap; }.mac-artifact>small{ width:100%; overflow:hidden; color:#778293; font-size:7px; text-overflow:ellipsis; white-space:nowrap; }.mac-artifact.selected>strong,.mac-artifact.selected>small{ color:#d9ebff; }
.mac-artifact-guide>i{ overflow:hidden; border:1px solid rgba(255,255,255,.2); background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.2),transparent 42%),linear-gradient(145deg,var(--artifact-accent),var(--artifact-accent-2)); color:#fff; }.mac-artifact-guide>i::before,.mac-artifact-guide>i::after{ content:''; position:absolute; border:1px solid rgba(255,255,255,.42); border-radius:50%; }.mac-artifact-guide>i::before{ inset:7px; }.mac-artifact-guide>i::after{ inset:15px; }.mac-artifact-guide>i>span{ font-size:7px; letter-spacing:.06em; }
.mac-artifact-app>i{ background:linear-gradient(145deg,var(--artifact-accent),var(--artifact-accent-2)); color:#fff; }.mac-artifact-app>i::before{ content:''; position:absolute; inset:5px; border:1px solid rgba(255,255,255,.32); border-radius:9px; }
.mac-artifact-spec>i{ width:45px; border-radius:4px; background:#f5f1e8; color:#28313f; }.mac-artifact-spec>i::before{ content:''; position:absolute; right:0; top:0; border-style:solid; border-width:0 0 13px 13px; border-color:transparent transparent #c9d3df transparent; }
.mac-artifact-docs>i{ height:42px; margin-top:10px; border-radius:6px; background:linear-gradient(#85d9ff,#2799e9); }.mac-artifact-docs>i::before{ content:''; position:absolute; left:4px; top:-8px; width:26px; height:11px; border-radius:6px 6px 0 0; background:#82d7ff; }
.mac-artifact-ux>i{ background:linear-gradient(145deg,#242937,#12151d); }.mac-artifact-ux>i::before,.mac-artifact-ux>i::after{ content:''; position:absolute; width:18px; height:18px; border-radius:50%; border:4px solid var(--artifact-accent); }.mac-artifact-ux>i::before{ left:9px; top:7px; }.mac-artifact-ux>i::after{ right:9px; bottom:7px; border-color:var(--artifact-accent-2); }
.mac-artifact-screens>i{ overflow:visible; border:1px solid rgba(255,255,255,.15); background:linear-gradient(145deg,#202735,#11151d); color:#fff; }.mac-artifact-screens>i::before,.mac-artifact-screens>i::after{ content:''; position:absolute; width:38px; height:29px; border:2px solid rgba(255,255,255,.9); border-radius:4px; background:linear-gradient(145deg,var(--artifact-accent),var(--artifact-accent-2)); box-shadow:0 5px 9px rgba(0,0,0,.28); }.mac-artifact-screens>i::before{ left:7px; top:8px; transform:rotate(-6deg); }.mac-artifact-screens>i::after{ right:6px; bottom:6px; transform:rotate(5deg); }.mac-artifact-screens>i>span{ font-size:7px; text-shadow:0 1px 2px #000; }
.mac-artifact-video>i{ overflow:hidden; border:1px solid rgba(255,255,255,.19); background:linear-gradient(145deg,#1b2532,#080b10); color:#fff; }.mac-artifact-video>i::before,.mac-artifact-video>i::after{ content:''; position:absolute; left:4px; right:4px; height:6px; background:repeating-linear-gradient(90deg,var(--artifact-accent) 0 6px,transparent 6px 11px); }.mac-artifact-video>i::before{ top:4px; }.mac-artifact-video>i::after{ bottom:4px; }.mac-artifact-video>i>span{ padding-left:2px; font-size:8px; letter-spacing:-.05em; }
.mac-artifact-paper>i{ width:45px; border-radius:4px; background:#f7f3eb; color:#1c2734; }.mac-artifact-paper>i::before{ content:''; position:absolute; left:8px; right:8px; top:13px; height:3px; background:var(--artifact-accent); box-shadow:0 8px 0 #aab2bd,0 14px 0 #aab2bd,0 20px 0 #aab2bd; }.mac-artifact-paper>i>span{ margin-top:-27px; color:var(--artifact-accent); font-size:6px; }
.mac-artifact-scheme>i{ border:1px solid rgba(72,170,255,.45); background-color:#10273d; background-image:linear-gradient(rgba(72,170,255,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(72,170,255,.16) 1px,transparent 1px); background-size:9px 9px; color:#8bc9ff; }
.mac-artifact-sprint>i{ background:#262c37; color:#fff; }.mac-artifact-sprint>i::before{ content:''; position:absolute; left:7px; right:7px; top:12px; height:7px; border-radius:2px; background:linear-gradient(90deg,var(--artifact-accent) 0 30%,#3b4351 30% 64%,var(--artifact-accent-2) 64%); box-shadow:0 12px 0 #3b4351,0 24px 0 #3b4351; }
.mac-artifact-evidence>i{ width:45px; border-radius:4px; background:#eff5f2; color:#12945b; }.mac-artifact-evidence>i::before{ content:''; position:absolute; inset:8px 7px; border:1px dashed #69aa89; }
.mac-folder-inspector{ flex:0 0 52px; display:flex; align-items:center; gap:11px; padding:7px 10px 7px 13px; border-top:1px solid rgba(255,255,255,.08); background:#101319; color:#798392; }.mac-folder-inspector>div{ flex:1; min-width:0; display:grid; gap:3px; }.mac-folder-inspector span,.mac-folder-inspector small{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.mac-folder-inspector span{ color:#dce4ee; font-size:9px; font-weight:700; }.mac-folder-inspector small{ color:#788496; font-size:7px; }.mac-folder-inspector>strong{ max-width:130px; overflow:hidden; padding:4px 7px; border:1px solid var(--mp-accent); border-radius:10px; color:var(--mp-accent); font:800 6px ui-monospace,Menlo,monospace; text-overflow:ellipsis; white-space:nowrap; }.mac-folder-inspector>button{ flex:0 0 auto; padding:7px 10px; border:0; border-radius:7px; background:var(--mp-accent); color:#071015; font:900 7px ui-monospace,Menlo,monospace; cursor:pointer; }.mac-folder-inspector>button:disabled{ opacity:.35; cursor:default; }.mac-folder-inspector>button:focus-visible{ outline:2px solid #fff; outline-offset:2px; }

/* Branded artifact viewer: application, spec, docs, UX, schematic, tickets. */
.mac-project-artifact-win{ max-width:calc(100vw - 24px); max-height:calc(100vh - 70px); background:#0c0f14; }
.mac-project-artifact-win .mac-win-body{ background:#0c0f14; }
.mp-shell{ flex:1; min-height:0; display:flex; color:#e9eef5; background:#0c0f14; }
.mp-sidebar{ flex:0 0 210px; min-width:0; display:flex; flex-direction:column; padding:15px 11px 12px; border-right:1px solid #232a34; background:linear-gradient(165deg,#161b24,#0e1218); }
.mp-brand{ display:flex; align-items:center; gap:10px; padding:5px 5px 7px; }.mp-brand>span{ width:42px; height:42px; display:grid; place-items:center; border-radius:12px; background:linear-gradient(135deg,var(--mp-accent),var(--mp-accent-2)); box-shadow:0 10px 24px rgba(0,0,0,.38); color:#fff; font:900 11px ui-monospace,Menlo,monospace; }.mp-brand>div{ min-width:0; display:grid; gap:3px; }.mp-brand b{ overflow:hidden; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }.mp-brand small{ color:var(--mp-accent); font:700 7px ui-monospace,Menlo,monospace; }
.mp-sidebar>p{ margin:3px 6px 14px; color:#838e9d; font-size:9px; line-height:1.4; }.mp-sidebar nav{ display:grid; gap:2px; }.mp-sidebar nav button{ width:100%; display:flex; align-items:center; gap:9px; padding:8px 9px; border:0; border-radius:7px; background:transparent; color:#aeb7c4; text-align:left; font-size:10px; cursor:pointer; }.mp-sidebar nav button i{ width:17px; color:#667385; font-style:normal; text-align:center; }.mp-sidebar nav button:hover,.mp-sidebar nav button:focus-visible{ background:#202732; color:#fff; outline:none; }.mp-sidebar nav button.on{ background:var(--mp-accent); color:#071015; font-weight:800; }.mp-sidebar nav button.on i{ color:inherit; }
.mp-sidebar>footer{ margin-top:auto; display:grid; gap:2px; padding:10px 7px 3px; border-top:1px solid #242b35; }.mp-sidebar>footer span{ color:#5f6b7a; font:700 7px ui-monospace,Menlo,monospace; letter-spacing:.08em; }.mp-sidebar>footer b{ font-size:10px; }.mp-sidebar>footer small{ color:#758091; font-size:8px; }
.mp-main{ flex:1; min-width:0; display:flex; flex-direction:column; background:radial-gradient(circle at 87% 0,rgba(255,255,255,.035),transparent 32%),#0d1117; }.mp-main>header{ flex:0 0 42px; display:flex; align-items:center; gap:10px; padding:0 17px; border-bottom:1px solid #242a33; background:rgba(17,21,28,.88); }.mp-main>header>div{ flex:1; min-width:0; display:grid; gap:1px; }.mp-main>header small{ color:#5f6b7b; font:700 7px ui-monospace,Menlo,monospace; letter-spacing:.05em; }.mp-main>header b{ font-size:11px; }.mp-main>header>span{ color:#778292; font-size:8px; }
.mp-content{ flex:1; min-height:0; overflow:auto; scrollbar-color:#394454 transparent; }.mp-page{ padding:24px 27px 36px; }.mp-page-hero{ max-width:760px; margin-bottom:20px; }.mp-page-hero>span{ color:var(--mp-accent); font:800 8px ui-monospace,Menlo,monospace; letter-spacing:.13em; }.mp-page-hero h1{ margin:5px 0 6px; color:#fff; font-size:27px; line-height:1.04; letter-spacing:-.035em; }.mp-page-hero p{ margin:0; color:#8d98a8; font-size:11px; line-height:1.55; }
.mp-guide-hero{ position:relative; overflow:hidden; padding:26px 28px; border:1px solid #303947; border-radius:16px; background:radial-gradient(circle at 88% 10%,var(--mp-accent-2),transparent 35%),linear-gradient(135deg,#1a2532,#090c11 70%); box-shadow:0 22px 42px rgba(0,0,0,.32); }.mp-guide-hero::after{ content:''; position:absolute; right:-54px; bottom:-92px; width:240px; height:240px; border:1px solid var(--mp-accent); border-radius:50%; box-shadow:0 0 0 28px rgba(255,255,255,.025),0 0 0 56px rgba(255,255,255,.018); }.mp-guide-hero>span{ color:var(--mp-accent); font:900 8px ui-monospace,Menlo,monospace; letter-spacing:.13em; }.mp-guide-hero h1{ position:relative; z-index:1; margin:8px 0 9px; color:#fff; font-size:34px; line-height:.96; letter-spacing:-.045em; }.mp-guide-hero p{ position:relative; z-index:1; max-width:690px; margin:0; color:#b0bbc8; font-size:10px; line-height:1.55; }.mp-guide-hero>div{ position:relative; z-index:1; display:flex; gap:9px; align-items:center; margin-top:18px; }.mp-guide-hero>div>b{ padding:5px 8px; border-radius:10px; background:var(--mp-accent); color:#071015; font:900 7px ui-monospace,Menlo,monospace; }.mp-guide-hero>div>small{ color:#8e9aa8; font-size:8px; }
.mp-guide-context{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin:12px 0 18px; }.mp-guide-context article{ min-height:128px; padding:14px; border:1px solid #29333e; border-radius:10px; background:#12171e; }.mp-guide-context small{ color:var(--mp-accent); font:800 7px ui-monospace,Menlo,monospace; letter-spacing:.09em; }.mp-guide-context h2{ margin:7px 0 6px; color:#fff; font-size:12px; }.mp-guide-context p{ margin:0; color:#8995a5; font-size:8px; line-height:1.5; }
.mp-guide-truth{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }.mp-guide-truth article{ padding:12px 13px; border:1px solid #2a3440; border-radius:9px; background:#11171e; }.mp-guide-truth span{ display:block; margin-bottom:5px; color:#697687; font:800 7px ui-monospace,Menlo,monospace; }.mp-guide-truth b{ color:var(--mp-accent); font:900 8px ui-monospace,Menlo,monospace; }.mp-guide-truth p{ margin:6px 0 0; color:#8793a3; font-size:8px; line-height:1.45; }
.mp-guide-route{ display:grid; gap:6px; }.mp-guide-route button{ width:100%; display:grid; grid-template-columns:32px 1fr auto; gap:10px; align-items:center; padding:11px 12px; border:1px solid #2c3642; border-radius:9px; background:#121820; color:#e8edf4; text-align:left; cursor:pointer; }.mp-guide-route button:hover,.mp-guide-route button:focus-visible{ border-color:var(--mp-accent); background:#18212b; outline:none; }.mp-guide-route i{ width:30px; height:30px; display:grid; place-items:center; border-radius:8px; background:var(--mp-accent); color:#071015; font:900 8px ui-monospace,Menlo,monospace; font-style:normal; }.mp-guide-route span{ min-width:0; display:grid; gap:3px; }.mp-guide-route b{ font-size:9px; }.mp-guide-route small{ color:#7f8b9b; font-size:8px; }.mp-guide-route em{ color:var(--mp-accent); font:800 7px ui-monospace,Menlo,monospace; font-style:normal; white-space:nowrap; }
.mp-guide-legend{ display:flex; flex-wrap:wrap; gap:10px 16px; align-items:center; margin-top:14px; padding:12px 14px; border:1px dashed #384452; border-radius:9px; }.mp-guide-legend>b{ margin-right:auto; color:#778496; font:800 7px ui-monospace,Menlo,monospace; }.mp-guide-legend>span{ display:flex; gap:5px; align-items:center; color:#8e9aa9; font:700 6px ui-monospace,Menlo,monospace; }.mp-guide-legend i{ width:7px; height:7px; border-radius:50%; background:#748194; }.mp-guide-legend i.live{ background:#35dd94; box-shadow:0 0 7px #35dd94; }.mp-guide-legend i.capture{ background:#ed4854; }.mp-guide-legend i.pdf{ border-radius:1px; background:#f4f0e8; }.mp-guide-legend i.surface{ border:1px solid var(--mp-accent); background:transparent; }
.mp-app-stage{ min-height:280px; overflow:hidden; border:1px solid #303947; border-radius:16px; background:radial-gradient(circle at 80% 0,var(--mp-accent-2),transparent 38%),linear-gradient(140deg,#182230,#070a0f 70%); box-shadow:0 24px 45px rgba(0,0,0,.35); }.mp-app-chrome{ height:38px; display:flex; align-items:center; gap:9px; padding:0 13px; border-bottom:1px solid rgba(255,255,255,.1); background:rgba(9,12,17,.55); }.mp-app-chrome>span{ width:24px; height:24px; display:grid; place-items:center; border-radius:7px; background:linear-gradient(135deg,var(--mp-accent),var(--mp-accent-2)); font:900 7px ui-monospace,Menlo,monospace; }.mp-app-chrome>b{ font-size:10px; }.mp-app-chrome>i{ flex:1; }.mp-app-chrome>small{ color:var(--mp-accent); font:700 7px ui-monospace,Menlo,monospace; }.mp-app-inner{ min-height:242px; display:flex; flex-direction:column; justify-content:center; padding:25px 28px; }.mp-app-inner>em{ color:var(--mp-accent); font:700 8px ui-monospace,Menlo,monospace; letter-spacing:.12em; }.mp-app-inner>h2{ margin:7px 0 18px; max-width:600px; color:#fff; font-size:25px; line-height:1.05; }.mp-preview-cards{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }.mp-preview-cards>span{ min-height:48px; display:flex; align-items:center; padding:10px; border:1px solid rgba(255,255,255,.11); border-radius:9px; background:rgba(8,12,17,.58); color:#dfe7ef; font:700 8px ui-monospace,Menlo,monospace; }.mp-app-inner>strong{ margin-top:15px; color:var(--mp-accent); font:800 8px ui-monospace,Menlo,monospace; letter-spacing:.08em; }
.mp-brand-tinkyspeak .mp-app-stage{ background:radial-gradient(circle at 83% 0,rgba(113,87,255,.7),transparent 38%),linear-gradient(145deg,#41235f,#171125 65%); }.mp-brand-tinkytown .mp-app-stage{ background:radial-gradient(circle at 90% 0,rgba(255,212,92,.55),transparent 35%),linear-gradient(145deg,#532008,#18100a 67%); }.mp-brand-ghostbridge .mp-app-stage{ background:radial-gradient(circle at 85% 0,rgba(123,97,255,.58),transparent 38%),linear-gradient(145deg,#12343d,#0a0d13 67%); }.mp-brand-perslis .mp-app-stage{ background:radial-gradient(circle at 82% 0,rgba(59,130,246,.62),transparent 39%),linear-gradient(145deg,#11313b,#070a0e 68%); }.mp-brand-kist .mp-app-stage{ background:radial-gradient(circle at 85% 0,rgba(22,161,255,.45),transparent 38%),linear-gradient(145deg,#092718,#030a06 68%); }.mp-brand-list .mp-app-stage{ background:radial-gradient(circle at 85% 0,rgba(139,92,246,.55),transparent 38%),linear-gradient(145deg,#10284a,#080c14 68%); }.mp-brand-financial-ops .mp-app-stage{ background:radial-gradient(circle at 85% 0,rgba(163,111,245,.52),transparent 38%),linear-gradient(145deg,#102b50,#070b12 68%); }
.mp-launch-row{ display:flex; align-items:center; gap:16px; margin:14px 0; padding:12px 14px; border:1px solid #26303b; border-radius:11px; background:#141a22; }.mp-launch-row>div{ flex:1; min-width:0; display:grid; gap:2px; }.mp-launch-row b{ color:var(--mp-accent); font:800 8px ui-monospace,Menlo,monospace; }.mp-launch-row span{ font-size:10px; }.mp-launch-row small{ color:#687485; font-size:8px; }.mp-launch-row button{ border:0; border-radius:8px; padding:9px 13px; background:var(--mp-accent); color:#071015; font:900 8px ui-monospace,Menlo,monospace; cursor:pointer; }.mp-launch-row button:hover,.mp-launch-row button:focus-visible{ filter:brightness(1.16); outline:2px solid #fff; outline-offset:2px; }
.mp-facts{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin:16px 0; border:1px solid #28313c; border-radius:11px; background:#12171e; }.mp-facts>span{ display:grid; gap:3px; padding:13px; border-left:1px solid #28313c; }.mp-facts>span:first-child{ border-left:0; }.mp-facts b{ color:#fff; font-size:18px; }.mp-facts small{ color:#738092; font-size:8px; }.mp-page blockquote{ margin:17px 0 0; padding:15px 18px; border-left:3px solid var(--mp-accent); background:#141a22; color:#d5dce5; font-size:12px; font-weight:650; line-height:1.5; }
.mp-meta-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-bottom:13px; }.mp-meta-grid>span{ display:grid; gap:4px; padding:11px 12px; border:1px solid #28313c; border-radius:9px; background:#131820; }.mp-meta-grid small{ color:#677487; font:700 7px ui-monospace,Menlo,monospace; }.mp-meta-grid b{ color:#e7ecf2; font-size:9px; }
.mp-three,.mp-two{ display:grid; gap:10px; margin:10px 0; }.mp-three{ grid-template-columns:repeat(3,minmax(0,1fr)); }.mp-two{ grid-template-columns:repeat(2,minmax(0,1fr)); }.mp-three article,.mp-two article,.mp-ux-top article{ padding:14px; border:1px solid #28313c; border-radius:10px; background:#12171e; }.mp-three em,.mp-ux-top em{ color:var(--mp-accent); font:800 8px ui-monospace,Menlo,monospace; }.mp-three p{ margin:8px 0 0; color:#a1abb9; font-size:10px; line-height:1.55; }.mp-two h3{ margin:0 0 7px; color:#fff; font-size:11px; }.mp-page ul{ margin:0; padding:0; display:grid; gap:5px; list-style:none; }.mp-page li{ position:relative; padding-left:13px; color:#929dac; font-size:9px; line-height:1.45; }.mp-page li::before{ content:'›'; position:absolute; left:0; color:var(--mp-accent); font-weight:900; }
.mp-doc-grid{ display:grid; gap:9px; }.mp-doc-grid>article{ display:grid; grid-template-columns:35px 1fr; gap:12px; padding:15px; border:1px solid #29323d; border-radius:11px; background:#12171e; }.mp-doc-grid>article>span{ width:30px; height:30px; display:grid; place-items:center; border-radius:8px; background:var(--mp-accent); color:#071015; font:900 8px ui-monospace,Menlo,monospace; }.mp-doc-grid h2{ margin:0 0 5px; font-size:13px; }.mp-doc-grid p{ margin:0 0 9px; color:#929cac; font-size:9px; line-height:1.5; }
.mp-doctrine{ display:flex; gap:15px; align-items:flex-start; margin-top:13px; padding:13px 15px; border:1px solid var(--mp-accent); border-radius:10px; background:#111920; }.mp-doctrine b{ color:var(--mp-accent); font:800 8px ui-monospace,Menlo,monospace; white-space:nowrap; }.mp-doctrine p{ margin:0; color:#aab3bf; font-size:9px; line-height:1.5; }
.mp-ux-top{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }.mp-chips{ display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }.mp-chips>span{ padding:5px 8px; border:1px solid #34404d; border-radius:14px; background:#19202a; color:#c5ccd5; font-size:8px; }.mp-chips.states>span{ border-color:var(--mp-accent); color:var(--mp-accent); }.mp-section-title{ margin:20px 0 9px; color:#fff; font-size:12px; }.mp-flow{ display:flex; gap:4px; overflow:auto; padding-bottom:4px; }.mp-flow>span{ position:relative; flex:1 0 92px; min-height:70px; display:grid; align-content:center; gap:7px; padding:10px; border:1px solid #2c3541; border-radius:9px; background:#131820; }.mp-flow>span:not(:last-child)::after{ content:'→'; position:absolute; z-index:2; right:-8px; top:28px; color:var(--mp-accent); }.mp-flow i{ color:var(--mp-accent); font:800 7px ui-monospace,Menlo,monospace; }.mp-flow b{ font-size:9px; line-height:1.35; }.mp-wire-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }.mp-wire-grid>article{ padding:9px; border:1px solid #29323c; border-radius:9px; background:#12171e; }.mp-wire{ height:92px; position:relative; overflow:hidden; border:1px solid #3a4654; border-radius:6px; background:#0b0f14; }.mp-wire>i{ position:absolute; top:7px; width:5px; height:5px; border-radius:50%; background:#596778; }.mp-wire>i:nth-child(1){ left:7px; }.mp-wire>i:nth-child(2){ left:15px; }.mp-wire>i:nth-child(3){ left:23px; }.mp-wire>span{ position:absolute; left:7px; top:21px; bottom:7px; width:25%; border-radius:3px; background:#1e2732; }.mp-wire>b{ position:absolute; left:37%; right:7px; height:14px; border-radius:3px; background:#252f3b; }.mp-wire>b:nth-of-type(1){ top:21px; background:var(--mp-accent); opacity:.55; }.mp-wire>b:nth-of-type(2){ top:41px; }.mp-wire>b:nth-of-type(3){ top:61px; }.mp-wire-grid h4{ margin:8px 0 3px; font-size:10px; }.mp-wire-grid p{ margin:0; color:#788496; font-size:8px; line-height:1.4; }
.mp-system-map{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }.mp-system-map>article{ position:relative; min-height:86px; display:grid; align-content:center; gap:4px; padding:13px; border:1px solid #34404c; border-radius:10px; background:linear-gradient(145deg,#17202a,#10151c); }.mp-system-map i{ color:var(--mp-accent); font:800 7px ui-monospace,Menlo,monospace; }.mp-system-map b{ font:800 9px ui-monospace,Menlo,monospace; }.mp-system-map span{ color:#8490a1; font-size:8px; line-height:1.4; }.mp-contracts{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }.mp-contracts>article{ display:grid; grid-template-columns:115px 1fr; gap:10px; padding:10px 12px; border:1px solid #29323d; border-radius:8px; background:#12171e; }.mp-contracts b{ color:var(--mp-accent); font-size:8px; }.mp-contracts span{ color:#8d98a8; font-size:8px; line-height:1.4; }.mp-trust{ display:flex; gap:13px; margin-top:13px; padding:12px 14px; border:1px dashed var(--mp-accent); border-radius:9px; }.mp-trust b{ color:var(--mp-accent); font:800 8px ui-monospace,Menlo,monospace; white-space:nowrap; }.mp-trust span{ color:#909baa; font-size:8px; line-height:1.5; }
.mp-sprint-grid{ display:grid; gap:10px; }.mp-sprint{ overflow:hidden; border:1px solid #2b3541; border-radius:11px; background:#11161d; }.mp-sprint>header{ display:flex; gap:11px; align-items:center; padding:12px 14px; border-bottom:1px solid #29323d; background:#171e27; }.mp-sprint>header>span{ width:32px; height:32px; display:grid; place-items:center; border-radius:8px; background:var(--mp-accent); color:#071015; font:900 8px ui-monospace,Menlo,monospace; }.mp-sprint h2{ margin:0 0 2px; font-size:12px; }.mp-sprint p{ margin:0; color:#7f8a9a; font-size:8px; }.mp-ticket{ display:grid; grid-template-columns:58px 1fr auto; gap:10px; align-items:center; padding:10px 14px; border-top:1px solid #232b35; }.mp-ticket:first-of-type{ border-top:0; }.mp-ticket>b{ color:var(--mp-accent); font:800 8px ui-monospace,Menlo,monospace; }.mp-ticket>span{ display:grid; gap:3px; }.mp-ticket strong{ font-size:9px; }.mp-ticket small{ color:#748091; font-size:7px; line-height:1.35; }.mp-ticket>i{ padding:4px 6px; border-radius:10px; background:#1c3030; color:#36d49a; font:700 7px ui-monospace,Menlo,monospace; font-style:normal; }
.mp-evidence{ display:grid; gap:7px; }.mp-evidence>article{ display:flex; align-items:center; gap:11px; padding:12px 13px; border:1px solid #2a333e; border-radius:9px; background:#12171e; }.mp-evidence>article>span{ width:25px; height:25px; display:grid; place-items:center; border-radius:50%; background:#15372e; color:#39dc9b; font-weight:900; }.mp-evidence>article>div{ flex:1; min-width:0; display:grid; gap:3px; }.mp-evidence b{ font-size:10px; }.mp-evidence small{ overflow:hidden; color:#778394; font-size:8px; text-overflow:ellipsis; white-space:nowrap; }.mp-evidence strong{ color:var(--mp-accent); font:800 7px ui-monospace,Menlo,monospace; }

/* Real recordings and source PDFs replace reconstructed gallery imagery. */
.mp-recording-tabs{ display:flex; gap:7px; margin-bottom:9px; overflow:auto; padding:2px 1px 6px; }.mp-recording-tabs button{ flex:1 0 190px; display:grid; grid-template-columns:8px 1fr auto; gap:3px 8px; align-items:center; min-width:0; padding:9px 10px; border:1px solid #2b3541; border-radius:8px; background:#121820; color:#a9b3c0; text-align:left; cursor:pointer; }.mp-recording-tabs button>i{ grid-row:1/3; width:7px; height:7px; border-radius:50%; background:#556170; }.mp-recording-tabs button>span{ overflow:hidden; font-size:9px; font-weight:750; text-overflow:ellipsis; white-space:nowrap; }.mp-recording-tabs button>small{ color:#667487; font:700 7px ui-monospace,Menlo,monospace; }.mp-recording-tabs button.on{ border-color:var(--mp-accent); background:#18212b; color:#fff; }.mp-recording-tabs button.on>i{ background:#ff4f57; box-shadow:0 0 9px #ff4f57; }.mp-recording-tabs button:focus-visible{ outline:2px solid #fff; outline-offset:2px; }
.mp-recording-stage{ overflow:hidden; border:1px solid #303947; border-radius:12px; background:#030507; box-shadow:0 20px 38px rgba(0,0,0,.32); }.mp-recording-stage>article{ display:none; }.mp-recording-stage>article.on{ display:block; }.mp-recording-stage video{ display:block; width:100%; aspect-ratio:16/9; max-height:430px; background:#000; object-fit:contain; }.mp-recording-stage footer{ display:grid; grid-template-columns:auto 1fr auto; gap:10px; align-items:center; padding:10px 12px; background:#11171f; }.mp-recording-stage footer>span{ padding:4px 6px; border-radius:4px; background:#a8202a; color:#fff; font:900 7px ui-monospace,Menlo,monospace; }.mp-recording-stage footer>div{ min-width:0; }.mp-recording-stage footer b{ font-size:9px; }.mp-recording-stage footer p{ margin:3px 0 0; color:#7f8b9b; font-size:8px; line-height:1.35; }.mp-recording-stage footer>small{ color:var(--mp-accent); font:800 7px ui-monospace,Menlo,monospace; white-space:nowrap; }
.mp-recording-actions{ display:flex; flex-wrap:wrap; gap:7px; margin-top:10px; }.mp-recording-actions button,.mp-open-deck,.mp-real-surface button{ border:1px solid #354150; border-radius:7px; padding:9px 11px; background:#18212b; color:#dbe5ef; font:800 7px ui-monospace,Menlo,monospace; cursor:pointer; }.mp-recording-actions button:first-child,.mp-open-deck{ border-color:var(--mp-accent); background:var(--mp-accent); color:#071015; }.mp-recording-actions button:hover,.mp-open-deck:hover,.mp-real-surface button:hover{ filter:brightness(1.14); }.mp-recording-actions button:focus-visible,.mp-open-deck:focus-visible,.mp-real-surface button:focus-visible{ outline:2px solid #fff; outline-offset:2px; }
.mp-real-surface{ min-height:210px; display:grid; grid-template-columns:85px 1fr auto; gap:20px; align-items:center; padding:24px; border:1px solid #303947; border-radius:14px; background:radial-gradient(circle at 0 0,var(--mp-accent-2),transparent 39%),linear-gradient(135deg,#18222e,#090c11 70%); }.mp-real-surface>span{ width:76px; height:76px; display:grid; place-items:center; border-radius:20px; background:linear-gradient(135deg,var(--mp-accent),var(--mp-accent-2)); box-shadow:0 16px 30px rgba(0,0,0,.38); font:900 16px ui-monospace,Menlo,monospace; }.mp-real-surface small{ color:var(--mp-accent); font:800 7px ui-monospace,Menlo,monospace; }.mp-real-surface h2{ margin:5px 0; font-size:20px; }.mp-real-surface p{ max-width:560px; margin:0; color:#8c98a8; font-size:9px; line-height:1.5; }.mp-open-deck{ margin-top:10px; }
.mp-pdf-page{ min-height:100%; display:flex; flex-direction:column; background:#34363b; }.mp-pdf-toolbar{ flex:0 0 49px; display:flex; align-items:center; gap:10px; padding:0 12px; border-bottom:1px solid #555960; background:#26282d; }.mp-pdf-toolbar>span{ width:30px; height:30px; display:grid; place-items:center; border-radius:7px; background:linear-gradient(135deg,var(--mp-accent),var(--mp-accent-2)); font:900 7px ui-monospace,Menlo,monospace; }.mp-pdf-toolbar>div{ flex:1; min-width:0; display:grid; gap:2px; }.mp-pdf-toolbar small{ color:#8e98a6; font:700 6px ui-monospace,Menlo,monospace; }.mp-pdf-toolbar b{ overflow:hidden; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }.mp-pdf-toolbar a,.mac-pdf-bar a{ border:1px solid #59616d; border-radius:6px; padding:6px 8px; color:#e9edf2; font:700 7px ui-monospace,Menlo,monospace; text-decoration:none; }.mp-pdf-frame{ flex:1; min-height:540px; width:100%; border:0; background:#e4e4e4; }
.mac-pdf-viewer{ max-width:calc(100vw - 24px); max-height:calc(100vh - 70px); background:#2e3034; }.mac-pdf-shell{ flex:1; min-height:0; display:flex; flex-direction:column; }.mac-pdf-bar{ flex:0 0 45px; display:flex; align-items:center; gap:10px; padding:0 12px; border-bottom:1px solid #51545a; background:#292b2f; }.mac-pdf-bar>span{ width:28px; height:28px; display:grid; place-items:center; border-radius:6px; background:#df4d53; }.mac-pdf-bar>div{ flex:1; min-width:0; display:grid; gap:1px; }.mac-pdf-bar small{ color:#9ca4ae; font:700 6px ui-monospace,Menlo,monospace; }.mac-pdf-bar b{ overflow:hidden; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }.mac-pdf-bar>em{ color:#aeb5be; font:700 8px ui-monospace,Menlo,monospace; font-style:normal; }.mac-pdf-shell>iframe{ flex:1; min-height:0; width:100%; border:0; background:#e7e7e7; }

/* A live recording deck: normal tabs preserve state; parallel mode runs all
   verified captures concurrently and muted, like a multi-monitor desktop. */
.mac-system-deck{ max-width:calc(100vw - 18px); max-height:calc(100vh - 65px); background:#080b10; }.mac-system-deck .mac-win-body{ background:#080b10; }.msd-shell{ flex:1; min-height:0; display:grid; grid-template-rows:52px 61px minmax(0,1fr) 27px; color:#eaf0f6; background:radial-gradient(circle at 82% 0,rgba(32,111,190,.21),transparent 35%),#080b10; }.msd-head{ display:flex; align-items:center; gap:9px; padding:0 12px; border-bottom:1px solid #222b35; }.msd-rec{ display:flex; align-items:center; gap:6px; padding:5px 7px; border:1px solid #71313a; border-radius:5px; background:#251015; color:#ff6973; font:900 7px ui-monospace,Menlo,monospace; }.msd-rec i,.msd-status i{ width:6px; height:6px; border-radius:50%; background:#ff4b57; box-shadow:0 0 8px #ff4b57; }.msd-head>div{ flex:1; min-width:0; display:grid; gap:2px; }.msd-head small{ color:#667588; font:700 6px ui-monospace,Menlo,monospace; letter-spacing:.08em; }.msd-head b{ overflow:hidden; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }.msd-head>time{ color:#8190a2; font:700 9px ui-monospace,Menlo,monospace; }.msd-head>button{ border:1px solid #354150; border-radius:5px; padding:6px 8px; background:#141b23; color:#8895a5; font:800 7px ui-monospace,Menlo,monospace; cursor:pointer; }.msd-head>button.on{ border-color:#51b8ff; background:#16344b; color:#9ed7ff; }
.msd-tabs{ display:flex; min-width:0; overflow:auto; border-bottom:1px solid #222b35; background:#0d1117; }.msd-tabs>button{ position:relative; flex:1 0 160px; min-width:0; display:grid; grid-template-columns:29px 1fr; gap:7px; align-items:center; padding:8px 10px; border:0; border-right:1px solid #202731; background:transparent; color:#7f8b9a; text-align:left; cursor:pointer; }.msd-tabs>button>span{ width:27px; height:27px; display:grid; place-items:center; border-radius:7px; background:linear-gradient(135deg,var(--deck-accent),var(--deck-accent-2)); color:#fff; font:900 6px ui-monospace,Menlo,monospace; }.msd-tabs>button>div{ min-width:0; display:grid; gap:2px; }.msd-tabs b,.msd-tabs small{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.msd-tabs b{ font-size:8px; }.msd-tabs small{ font-size:6px; }.msd-tabs>button>i{ position:absolute; left:0; right:0; bottom:0; height:2px; background:transparent; }.msd-tabs>button.on{ background:#151d27; color:#f4f7fb; }.msd-tabs>button.on>i{ background:var(--deck-accent); box-shadow:0 0 8px var(--deck-accent); }.msd-tabs>button:focus-visible{ z-index:1; outline:2px solid #fff; outline-offset:-2px; }
.msd-main{ min-height:0; overflow:hidden; }.msd-single,.msd-wall{ height:100%; min-height:0; }.msd-single>article{ height:100%; min-height:0; display:none; flex-direction:column; }.msd-single>article.on{ display:flex; }.msd-single video{ flex:1; min-height:0; width:100%; background:#000; object-fit:contain; }.msd-single footer{ flex:0 0 45px; display:grid; grid-template-columns:auto 1fr auto; gap:10px; align-items:center; padding:0 12px; border-top:1px solid #222a34; background:#0d1218; }.msd-single footer>span{ padding:4px 6px; border-radius:4px; background:#a8202a; font:900 7px ui-monospace,Menlo,monospace; }.msd-single footer>div{ min-width:0; display:grid; gap:2px; }.msd-single footer b,.msd-single footer small{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.msd-single footer b{ font-size:9px; }.msd-single footer small{ color:#7a8798; font-size:7px; }.msd-single footer time{ color:var(--deck-accent); font:800 8px ui-monospace,Menlo,monospace; }
.msd-wall{ display:none; grid-template-columns:repeat(3,minmax(0,1fr)); grid-auto-rows:minmax(0,1fr); gap:5px; padding:5px; background:#030507; }.msd-wall>article{ min-width:0; min-height:0; display:flex; flex-direction:column; overflow:hidden; border:1px solid #26303b; border-radius:5px; background:#090d12; }.msd-wall video{ flex:1; min-height:0; width:100%; background:#000; object-fit:contain; }.msd-wall footer{ flex:0 0 30px; display:grid; grid-template-columns:6px auto 1fr auto; gap:6px; align-items:center; padding:0 7px; background:#10161d; }.msd-wall footer>i{ width:5px; height:5px; border-radius:50%; background:#ff4b57; box-shadow:0 0 6px #ff4b57; }.msd-wall b{ color:var(--deck-accent); font:800 7px ui-monospace,Menlo,monospace; }.msd-wall span{ overflow:hidden; color:#8b97a7; font-size:6px; text-overflow:ellipsis; white-space:nowrap; }.msd-wall time{ color:#718094; font:700 6px ui-monospace,Menlo,monospace; }.mac-system-deck.parallel .msd-single{ display:none; }.mac-system-deck.parallel .msd-wall{ display:grid; }.mac-system-deck.parallel .msd-tabs{ opacity:.6; }.msd-status{ display:flex; align-items:center; gap:10px; padding:0 10px; border-top:1px solid #202933; background:#0b1016; color:#6f7e90; font:700 6px ui-monospace,Menlo,monospace; }.msd-status>span{ display:flex; align-items:center; gap:6px; color:#8fa0b2; }.msd-status>b{ margin-left:auto; color:#526174; font-size:6px; }
.mp-recording-stage footer em{ display:block; margin-top:5px; color:var(--mp-accent); font:700 7px/1.4 ui-monospace,Menlo,monospace; font-style:normal; }
.msd-single footer{ flex-basis:58px; }.msd-single footer b,.msd-single footer small,.msd-single footer em{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.msd-single footer em{ color:var(--deck-accent); font:700 6px ui-monospace,Menlo,monospace; font-style:normal; }

/* Presentation captures: product-specific surfaces with an explicit
   reconstruction label so private apps are never misrepresented. */
.mp-capture-note{ display:flex; align-items:center; gap:14px; margin-bottom:13px; padding:10px 12px; border:1px solid var(--mp-accent); border-radius:9px; background:#121820; }.mp-capture-note b{ flex:0 0 auto; color:var(--mp-accent); font:800 7px ui-monospace,Menlo,monospace; }.mp-capture-note span{ color:#8793a3; font-size:8px; line-height:1.45; }
.mp-shot-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.mp-shot-card{ min-width:0; margin:0; overflow:hidden; border:1px solid #303a47; border-radius:12px; background:#11161d; box-shadow:0 15px 28px rgba(0,0,0,.22); }
.mp-shot-frame{ aspect-ratio:16/10; min-height:215px; display:flex; flex-direction:column; overflow:hidden; background:radial-gradient(circle at 90% 0,var(--mp-accent-2),transparent 42%),linear-gradient(145deg,#182332,#090c11 68%); }
.mp-shot-frame>header{ height:27px; display:flex; align-items:center; gap:5px; padding:0 8px; border-bottom:1px solid rgba(255,255,255,.1); background:rgba(5,8,12,.72); }.mp-shot-frame>header>i{ width:6px; height:6px; border-radius:50%; background:#ff5f57; }.mp-shot-frame>header>i:nth-child(2){ background:#febc2e; }.mp-shot-frame>header>i:nth-child(3){ background:#28c840; }.mp-shot-frame>header>span{ flex:1; overflow:hidden; color:#8997a8; font:600 6px ui-monospace,Menlo,monospace; text-align:center; text-overflow:ellipsis; white-space:nowrap; }.mp-shot-frame>header>b{ width:19px; height:19px; display:grid; place-items:center; border-radius:5px; background:linear-gradient(135deg,var(--mp-accent),var(--mp-accent-2)); font:900 5px ui-monospace,Menlo,monospace; }
.mp-shot-ui{ flex:1; min-height:0; display:flex; }.mp-shot-ui>aside{ flex:0 0 75px; display:flex; flex-direction:column; gap:4px; padding:10px 6px; border-right:1px solid rgba(255,255,255,.08); background:rgba(5,9,13,.62); }.mp-shot-ui>aside>strong{ width:27px; height:27px; display:grid; place-items:center; margin:1px 4px 7px; border-radius:8px; background:linear-gradient(135deg,var(--mp-accent),var(--mp-accent-2)); font:900 7px ui-monospace,Menlo,monospace; }.mp-shot-ui>aside>span{ overflow:hidden; padding:4px 5px; border-radius:4px; color:#778596; font-size:6px; text-overflow:ellipsis; white-space:nowrap; }.mp-shot-ui>aside>span.on{ background:var(--mp-accent); color:#071015; font-weight:800; }
.mp-shot-ui>main{ flex:1; min-width:0; display:flex; flex-direction:column; padding:14px; }.mp-shot-ui>main>small{ color:var(--mp-accent); font:800 6px ui-monospace,Menlo,monospace; letter-spacing:.1em; }.mp-shot-ui h3{ margin:4px 0 3px; overflow:hidden; color:#fff; font-size:17px; line-height:1; text-overflow:ellipsis; white-space:nowrap; }.mp-shot-ui p{ height:26px; margin:0 0 10px; overflow:hidden; color:#8b97a7; font-size:7px; line-height:1.4; }.mp-shot-ui main>div{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }.mp-shot-ui main>div>span{ min-height:38px; display:grid; place-items:center; overflow:hidden; padding:5px; border:1px solid rgba(255,255,255,.11); border-radius:6px; background:rgba(5,9,13,.52); color:#e8edf4; font:700 6px ui-monospace,Menlo,monospace; text-align:center; }.mp-shot-ui footer{ display:flex; align-items:center; gap:7px; margin-top:auto; padding-top:8px; }.mp-shot-ui footer>b{ padding:3px 5px; border-radius:8px; background:#172330; color:var(--mp-accent); font:800 5px ui-monospace,Menlo,monospace; }.mp-shot-ui footer>em{ margin-left:auto; color:#687688; font:500 5px ui-monospace,Menlo,monospace; font-style:normal; }
.mp-shot-layout-1 .mp-shot-ui{ flex-direction:column; }.mp-shot-layout-1 .mp-shot-ui>aside{ flex:0 0 28px; flex-direction:row; align-items:center; padding:4px 8px; border-right:0; border-bottom:1px solid rgba(255,255,255,.08); }.mp-shot-layout-1 .mp-shot-ui>aside>strong{ width:21px; height:21px; margin:0 5px 0 0; border-radius:6px; font-size:5px; }.mp-shot-layout-1 .mp-shot-ui>aside>span{ flex:0 1 58px; text-align:center; }.mp-shot-layout-1 .mp-shot-ui>main{ padding:11px 14px; }.mp-shot-layout-2 .mp-shot-ui>aside{ order:2; border-right:0; border-left:1px solid rgba(255,255,255,.08); }
.mp-shot-card figcaption{ display:grid; grid-template-columns:28px 1fr auto; gap:9px; align-items:start; padding:10px 11px 11px; }.mp-shot-card figcaption>span{ color:var(--mp-accent); font:900 8px ui-monospace,Menlo,monospace; }.mp-shot-card figcaption>div{ min-width:0; }.mp-shot-card figcaption b{ color:#f1f4f8; font-size:9px; }.mp-shot-card figcaption p{ margin:3px 0 0; color:#788596; font-size:7px; line-height:1.4; }.mp-shot-card figcaption>small{ color:#576373; font:700 5px ui-monospace,Menlo,monospace; white-space:nowrap; }

/* A complete, readable product white paper rendered as a designed document. */
.mp-paper-page{ max-width:900px; margin:0 auto; padding:30px; color:#17202b; background:#eef1f4; }
.mp-paper-cover{ min-height:390px; position:relative; display:flex; flex-direction:column; padding:42px 45px 32px; overflow:hidden; border-radius:16px; background:radial-gradient(circle at 90% 0,var(--mp-accent-2),transparent 42%),linear-gradient(145deg,#192737,#070a0f 72%); box-shadow:0 20px 40px rgba(12,18,26,.24); color:#fff; }.mp-paper-cover::after{ content:''; position:absolute; right:-70px; bottom:-95px; width:280px; height:280px; border:1px solid var(--mp-accent); border-radius:50%; box-shadow:0 0 0 35px rgba(255,255,255,.025),0 0 0 70px rgba(255,255,255,.018); }.mp-paper-cover>span{ width:53px; height:53px; display:grid; place-items:center; margin-bottom:44px; border-radius:14px; background:linear-gradient(135deg,var(--mp-accent),var(--mp-accent-2)); box-shadow:0 12px 24px rgba(0,0,0,.3); font:900 13px ui-monospace,Menlo,monospace; }.mp-paper-cover>small{ color:var(--mp-accent); font:800 7px ui-monospace,Menlo,monospace; letter-spacing:.13em; }.mp-paper-cover h1{ position:relative; z-index:1; margin:8px 0 2px; font-size:43px; line-height:.95; letter-spacing:-.045em; }.mp-paper-cover h2{ position:relative; z-index:1; margin:5px 0 17px; color:#aeb8c5; font-size:16px; font-weight:500; }.mp-paper-cover>p{ position:relative; z-index:1; max-width:590px; margin:0; color:#d6dde5; font-size:12px; font-weight:650; line-height:1.55; }.mp-paper-cover>footer{ position:relative; z-index:1; display:grid; grid-template-columns:1fr auto; gap:2px 20px; align-items:end; margin-top:auto; padding-top:25px; border-top:1px solid rgba(255,255,255,.13); }.mp-paper-cover footer>b{ font-size:11px; }.mp-paper-cover footer>span{ color:#8996a6; font-size:8px; }.mp-paper-cover footer>em{ grid-column:2; grid-row:1/3; align-self:center; padding:5px 8px; border:1px solid var(--mp-accent); border-radius:10px; color:var(--mp-accent); font:800 6px ui-monospace,Menlo,monospace; font-style:normal; }
.mp-paper-abstract{ margin:22px 0; padding:24px 27px; border-left:4px solid var(--mp-accent); background:#fff; box-shadow:0 8px 18px rgba(20,30,42,.07); }.mp-paper-abstract>b,.mp-paper-toc>b,.mp-paper-references>b{ color:var(--mp-accent); font:900 8px ui-monospace,Menlo,monospace; letter-spacing:.12em; }.mp-paper-abstract p{ margin:9px 0 15px; color:#3f4b5a; font:11px/1.65 Georgia,serif; }.mp-paper-abstract>div{ display:grid; grid-template-columns:1fr 1fr; gap:7px; }.mp-paper-abstract span{ padding:8px 9px; border:1px solid #dfe4e9; border-radius:5px; color:#677382; font-size:7px; line-height:1.35; }
.mp-paper-toc{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 24px; margin:0 0 22px; padding:21px 25px; background:#111923; color:#dbe1e8; }.mp-paper-toc>b{ grid-column:1/-1; margin-bottom:10px; }.mp-paper-toc>span{ display:flex; gap:9px; padding:7px 0; border-top:1px solid rgba(255,255,255,.08); font-size:8px; }.mp-paper-toc i{ color:var(--mp-accent); font:800 7px ui-monospace,Menlo,monospace; font-style:normal; }
.mp-paper-sections{ display:grid; gap:11px; }.mp-paper-sections>section{ display:grid; grid-template-columns:45px 1fr; gap:10px; padding:22px 25px; background:#fff; box-shadow:0 7px 16px rgba(20,30,42,.055); }.mp-paper-sections>section>span{ color:var(--mp-accent); font:900 16px ui-monospace,Menlo,monospace; }.mp-paper-sections h2{ margin:0 0 8px; color:#15202c; font-size:17px; }.mp-paper-sections p{ margin:0 0 12px; color:#465362; font:10px/1.65 Georgia,serif; }.mp-paper-sections ul{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px 20px; }.mp-paper-sections li{ color:#5a6674; font-size:8px; line-height:1.5; }.mp-paper-references{ margin-top:11px; padding:22px 25px; border:1px solid #d4dbe2; background:#e4e8ec; }.mp-paper-references p{ margin:8px 0 0; color:#576371; font:8px/1.55 ui-monospace,Menlo,monospace; }
@media(max-width:760px){
  .mac-folder-win .mac-finder-shell aside,.mp-sidebar{ flex-basis:158px; }.mac-folder-win .mac-folder-grid{ grid-template-columns:repeat(3,minmax(90px,1fr)); }
  .mp-page{ padding:19px 18px 30px; }.mp-three,.mp-wire-grid,.mp-guide-context{ grid-template-columns:repeat(2,minmax(0,1fr)); }.mp-preview-cards,.mp-system-map{ grid-template-columns:repeat(2,minmax(0,1fr)); }.mp-main>header>span{ display:none; }.mp-shot-grid{ grid-template-columns:1fr; }.mp-paper-page{ padding:18px; }.msd-wall{ grid-template-columns:repeat(2,minmax(0,1fr)); }.msd-head>div{ display:none; }
}
@media(max-width:560px){
  .mac-folder-win .mac-finder-shell aside{ display:none; }.mac-folder-hero{ grid-template-columns:44px 1fr; }.mac-folder-hero>span{ width:42px; height:42px; }.mac-folder-hero>b{ display:none; }.mac-folder-win .mac-folder-grid{ grid-template-columns:repeat(2,minmax(90px,1fr)); }
  .mp-sidebar{ flex-basis:55px; padding:9px 6px; }.mp-brand>div,.mp-sidebar>p,.mp-sidebar nav button:not(.on){ font-size:0; }.mp-brand{ padding:3px 0 10px; }.mp-brand>span{ width:40px; }.mp-sidebar nav button{ justify-content:center; padding:8px; font-size:0; }.mp-sidebar nav button i{ font-size:11px; }.mp-sidebar>footer{ display:none; }
  .mp-page-hero h1{ font-size:22px; }.mp-three,.mp-two,.mp-ux-top,.mp-wire-grid,.mp-system-map,.mp-contracts,.mp-guide-context,.mp-guide-truth{ grid-template-columns:1fr; }.mp-guide-hero{ padding:22px 20px; }.mp-guide-hero h1{ font-size:29px; }.mp-guide-route button{ grid-template-columns:30px 1fr; }.mp-guide-route em{ grid-column:2; }.mp-guide-legend>b{ flex-basis:100%; }.mp-facts{ grid-template-columns:repeat(2,1fr); }.mp-facts>span:nth-child(3){ border-left:0; border-top:1px solid #28313c; }.mp-facts>span:nth-child(4){ border-top:1px solid #28313c; }.mp-preview-cards{ grid-template-columns:1fr 1fr; }.mp-launch-row{ align-items:stretch; flex-direction:column; }.mp-contracts>article{ grid-template-columns:1fr; }.mp-paper-cover{ min-height:330px; padding:28px 25px 24px; }.mp-paper-cover>span{ margin-bottom:27px; }.mp-paper-cover h1{ font-size:34px; }.mp-paper-abstract>div,.mp-paper-toc,.mp-paper-sections ul{ grid-template-columns:1fr; }.mp-paper-sections>section{ grid-template-columns:31px 1fr; padding:18px 16px; }.mp-capture-note{ align-items:flex-start; flex-direction:column; }.mp-shot-card figcaption{ grid-template-columns:24px 1fr; }.mp-shot-card figcaption>small{ grid-column:2; }.mp-real-surface{ grid-template-columns:58px 1fr; padding:17px; }.mp-real-surface>span{ width:54px; height:54px; border-radius:14px; }.mp-real-surface>button{ grid-column:1/-1; }.mp-recording-stage footer{ grid-template-columns:auto 1fr; }.mp-recording-stage footer>small{ grid-column:2; }.mp-pdf-toolbar>span,.mp-pdf-toolbar small,.mp-pdf-toolbar a,.mac-pdf-bar>span,.mac-pdf-bar>em{ display:none; }.msd-shell{ grid-template-rows:45px 52px minmax(0,1fr) 25px; }.msd-rec,.msd-head>time,.msd-status>b{ display:none; }.msd-wall{ grid-template-columns:1fr; }.msd-wall>article:nth-child(n+4){ display:none; }.mac-folder-inspector>strong{ display:none; }.mac-vo-overlay{ bottom:58px; grid-template-columns:34px 1fr; }.mac-vo-overlay>span{ width:32px; height:32px; border-radius:8px; font-size:9px; }.mac-vo-overlay kbd{ display:none; }
}

/* A contained, native-feeling browser for live web apps and normal URLs. */
.mac-browser{
  max-width:calc(100vw - 20px); max-height:calc(100vh - 72px);
  background:#f7f7fb; border-color:rgba(174,190,218,.5);
  -webkit-backdrop-filter:none; backdrop-filter:none;
}
.mac-browser .mac-win-bar{ background:#202034; color:#fff; }
.mac-browser .mac-win-title{ font-weight:600; opacity:.92; }
.mac-browser .mac-win-body{ background:#f7f7fb; }
.microbrowser{ flex:1; min-height:0; display:flex; flex-direction:column; background:#f7f7fb; color:#24243a; }
.microbrowser-bar{ flex:0 0 46px; display:flex; align-items:center; gap:9px; padding:0 11px; background:#ececf2; border-bottom:1px solid #d2d3dd; }
.microbrowser-nav{ display:flex; gap:5px; }
.microbrowser-nav button,.microbrowser-go{
  width:30px; height:28px; border:1px solid #c7c8d2; border-radius:7px;
  background:#fafafd; color:#313145; font:600 18px/1 -apple-system,"SF Pro Text",sans-serif; cursor:pointer;
}
.microbrowser-nav button:hover:not(:disabled),.microbrowser-go:hover{ background:#fff; border-color:#a7a9b8; }
.microbrowser-nav button:disabled{ opacity:.35; cursor:default; }
.microbrowser-address{ flex:1; min-width:0; height:30px; display:flex; align-items:center; gap:7px; padding:0 10px; background:#fff; border:1px solid #cfd0d9; border-radius:9px; box-shadow:inset 0 1px 2px rgba(20,20,35,.05); }
.microbrowser-address span{ flex:0 0 auto; font-size:11px; }
.microbrowser-address input{ flex:1; min-width:0; padding:0; border:0; outline:0; background:transparent; color:#303042; font:12px -apple-system,"SF Pro Text","Segoe UI",sans-serif; }
.microbrowser-address input.invalid{ color:#c43e4d; }
.microbrowser-go{ width:auto; padding:0 11px; font-size:10px; font-weight:800; letter-spacing:.06em; }
.microbrowser-meta{ flex:0 0 22px; display:flex; align-items:center; gap:10px; padding:0 12px; background:#f7f7fb; border-bottom:1px solid #e3e4ea; color:#77798c; font-size:9px; }
.microbrowser-meta span{ flex:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.microbrowser-meta b{ color:#8a6a19; font:700 8px ui-monospace,Menlo,monospace; letter-spacing:.06em; }
.microbrowser-frame{ flex:1; min-height:0; display:block; width:100%; border:0; background:#f7f7fb; }
@media(max-width:680px){
  .microbrowser-bar{ gap:5px; padding:0 6px }.microbrowser-nav button{ width:26px }
  .microbrowser-meta b{ display:none }
}

/* TinkySpeak runs in its own Mac app surface. The iframe keeps a fixed 16:9
   layout viewport while JavaScript scales it into whatever desktop space is
   available, so the app never mistakes a narrow container for portrait. */
.mac-tinkyspeak-app{
  max-width:calc(100vw - 20px); max-height:calc(100vh - 72px);
  background:#171027; border-color:rgba(255,164,84,.5);
  -webkit-backdrop-filter:none; backdrop-filter:none;
}
.mac-tinkyspeak-app .mac-win-bar{ background:#24143a; color:#fff; }
.mac-tinkyspeak-app .mac-win-title{ font-weight:700; opacity:.94; }
.mac-tinkyspeak-app .mac-win-body{ background:#120d20; }
.tsapp-shell{ flex:1; min-height:0; display:flex; flex-direction:column; background:#120d20; color:#fff; }
.tsapp-head{
  flex:0 0 50px; display:flex; align-items:center; gap:10px; padding:0 12px;
  border-bottom:1px solid rgba(255,255,255,.1);
  background:linear-gradient(100deg,#311748,#21132f 58%,#402034);
}
.tsapp-mark{
  width:31px; height:31px; display:grid; place-items:center; border-radius:9px;
  background:linear-gradient(135deg,#ff943d,#7856ff); color:#fff;
  box-shadow:0 7px 18px rgba(0,0,0,.3); font:900 9px ui-monospace,Menlo,monospace;
}
.tsapp-head>div{ flex:1; min-width:0; display:grid; gap:2px; }
.tsapp-head small{ color:#ffad68; font:800 7px ui-monospace,Menlo,monospace; letter-spacing:.1em; }
.tsapp-head b{ overflow:hidden; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.tsapp-landscape{ padding:5px 8px; border:1px solid rgba(255,173,104,.5); border-radius:12px; color:#ffc18e; font:800 7px ui-monospace,Menlo,monospace; letter-spacing:.06em; }
.tsapp-head button{
  height:29px; padding:0 10px; border:1px solid rgba(255,255,255,.2); border-radius:7px;
  background:rgba(255,255,255,.08); color:#fff; font:800 8px ui-monospace,Menlo,monospace; cursor:pointer;
}
.tsapp-head button:hover,.tsapp-head button:focus-visible{ background:#ff943d; color:#24102e; outline:2px solid #fff; outline-offset:2px; }
.tsapp-viewport{
  position:relative; flex:1; min-height:0; overflow:hidden;
  background:radial-gradient(circle at 50% 20%,#39204e,#0b0812 72%);
}
.tsapp-frame{
  position:absolute; left:0; top:0; display:block; width:1280px; height:720px;
  border:0; background:#fff; transform-origin:top left;
}
.tsapp-loading{
  position:absolute; z-index:2; inset:0; display:grid; place-items:center; pointer-events:none;
  color:#ffc18e; background:linear-gradient(135deg,#21112f,#120d20);
  font:800 10px ui-monospace,Menlo,monospace; letter-spacing:.08em;
}
.tsapp-loading[hidden]{ display:none; }
.tsapp-status{
  flex:0 0 22px; display:flex; align-items:center; gap:10px; padding:0 11px;
  border-top:1px solid rgba(255,255,255,.09); background:#191020;
  color:#ffb273; font:700 7px ui-monospace,Menlo,monospace; letter-spacing:.06em;
}
.tsapp-status span{ flex:1; }.tsapp-status b{ color:#8f829c; font-size:7px; }
@media(max-width:620px){
  .tsapp-landscape,.tsapp-status b{ display:none; }
  .tsapp-head button{ padding:0 7px; font-size:7px; }
}

/* ---- Quick Look ---- */
.mac-ql .mac-win-body{ padding:10px; gap:8px; }
.mac-ql-img{ flex:1; border-radius:8px; }
.mac-ql-img.orange{ background:linear-gradient(135deg,#f59e0b,#b45309); }
.mac-ql-img.teal{ background:linear-gradient(135deg,#14b8a6,#0f766e); }
.mac-ql-img.grid{ background:repeating-linear-gradient(90deg,#334155 0 26px,#1e293b 26px 52px); }
.mac-ql-mov{
  flex:1; border-radius:8px; background:#0c1018;
  display:flex; align-items:center; justify-content:center;
}
.mac-ql-mov .play{
  width:56px; height:56px; border-radius:50%; background:rgba(255,255,255,.15);
  display:flex; align-items:center; justify-content:center; font-size:22px; cursor:pointer;
}
.mac-ql-text{
  flex:1; margin:0; padding:12px; overflow:auto; border-radius:8px;
  background:#101014; color:#c8e6c9; font:12px ui-monospace,Menlo,monospace; line-height:1.6;
}
.mac-ql-note{ flex:0 0 auto; font-size:12px; opacity:.65; padding:2px 4px; }

/* ---- LIST ---- */
.mac-list .mac-win-body{ flex-direction:row; background:#0b0e14; }
.list-shell{ flex:1; display:flex; min-height:0; }
.list-side{
  flex:0 0 218px; display:flex; flex-direction:column; padding:12px 10px;
  background:#0e1219; border-right:1px solid rgba(255,255,255,.07); font-size:12px;
}
.list-logo{ font-weight:800; font-size:16px; letter-spacing:2px; margin:2px 4px 12px; }
.list-logo .mark{ color:#3b82f6; margin-right:8px; }
.list-nav{ flex:1; display:flex; flex-direction:column; gap:2px; overflow:auto; min-height:0; }
.list-nav span{ padding:5px 8px; border-radius:7px; cursor:default; opacity:.85; }
.list-nav span.on{ background:#1d4ed8; opacity:1; }
.list-nav em{ font-style:normal; font-size:10px; letter-spacing:1px; opacity:.45; margin:10px 8px 3px; }
.list-nav .proj{ display:flex; align-items:center; gap:7px; }
.list-nav .proj i{ width:8px; height:8px; border-radius:50%; }
.list-nav .proj b{ margin-left:auto; font-weight:500; opacity:.6; }
.list-status{
  flex:0 0 auto; display:flex; flex-direction:column; gap:5px; padding:10px 8px 2px;
  border-top:1px solid rgba(255,255,255,.07); font-size:11px;
}
.list-status b{ font-size:10px; letter-spacing:1px; opacity:.5; }
.list-status .ok{ color:#34d399; }
.list-status .bar{
  display:inline-block; width:80px; height:5px; margin:0 6px; border-radius:3px;
  background:rgba(255,255,255,.12); vertical-align:middle; overflow:hidden;
}
.list-status .bar i{ display:block; height:100%; background:#3b82f6; }
.list-main{ flex:1; min-width:0; padding:16px 18px; overflow:auto; }
.list-head{ display:flex; align-items:baseline; gap:12px; }
.list-head h2{ margin:0; font-size:22px; }
.list-head .live{ color:#34d399; font-size:11px; }
.list-stats{ display:flex; gap:26px; margin:14px 0; }
.list-stats span{ display:flex; flex-direction:column; font-size:11px; opacity:.85; }
.list-stats b{ font-size:19px; font-weight:700; }
.list-stats .c1{ color:#60a5fa; } .list-stats .c2{ color:#34d399; }
.list-stats .c3{ color:#a78bfa; } .list-stats .c4{ color:#f59e0b; }
.list-sum{
  background:#10141d; border:1px solid rgba(255,255,255,.07); border-radius:10px;
  padding:12px 14px; font-size:13px; line-height:1.6;
}
.list-sum em{ display:block; font-style:normal; font-size:10px; letter-spacing:1px; color:#60a5fa; margin-bottom:6px; }
.list-sum p{ margin:0; opacity:.9; }
.list-cards{ display:flex; gap:10px; margin:12px 0; }
.list-cards .lc{
  flex:1; background:#10141d; border:1px solid rgba(255,255,255,.07); border-radius:10px;
  padding:8px; font-size:11px; display:flex; flex-direction:column; gap:5px;
}
.list-cards .th{ height:64px; border-radius:6px; }
.list-cards .th.grid{ background:repeating-linear-gradient(90deg,#334155 0 16px,#1e293b 16px 32px); }
.list-cards .th.dark{ background:#151a26; }
.list-cards .th.green{ background:linear-gradient(135deg,#0c2c17,#124a25); }
.list-cards span{ opacity:.55; }
.list-ask{
  background:#10141d; border:1px solid rgba(255,255,255,.07); border-radius:10px;
  padding:12px 14px;
}
.list-ask em{ display:block; font-style:normal; font-size:10px; letter-spacing:1px; color:#60a5fa; margin-bottom:8px; }
.list-qa{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:10px; }
.list-q{
  border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.06); color:#e8e8ec;
  border-radius:16px; padding:5px 12px; font-size:12px; cursor:pointer;
}
.list-q.on, .list-q:hover{ background:#1d4ed8; border-color:#1d4ed8; }
.list-a{ font-size:13px; line-height:1.6; opacity:.9; }

/* The Journal mirrors the real LIST temporal filesystem and reads the real
   local Core when it is available. The deployed snapshot uses the same UI. */
.mac-list{ max-width:calc(100vw - 56px); max-height:calc(100vh - 86px); }
.mac-list .list-side{ flex-basis:206px; }
.list-day-list{ display:grid; gap:3px; padding:0 2px 8px; }
.list-day-row{
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:8px;
  border:1px solid transparent; border-radius:8px; padding:7px 8px;
  color:#dbe5f0; background:transparent; text-align:left; cursor:pointer;
}
.list-day-row:hover{ background:#151e2a; }
.list-day-row.on{ border-color:#2b77d6; background:rgba(43,119,214,.14); }
.list-day-row span{ display:grid; gap:1px; padding:0; opacity:1; }
.list-day-row b{ font-size:11px; }
.list-day-row small,.list-day-row em{ color:#748398; font-size:9px; font-style:normal; }
.list-day-row.on b{ color:#56aaff; }
.list-side-loading{ padding:8px; color:#718095; font-size:10px; }
.list-loading{
  min-height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:8px; color:#8391a4; text-align:center;
}
.list-loading i{
  width:24px; height:24px; border:2px solid #233247; border-top-color:#429bff;
  border-radius:50%; animation:listSpin .8s linear infinite;
}
.list-loading b{ color:#dbe6f2; font-size:14px; }
.list-loading span{ max-width:390px; font-size:11px; }
.list-loading.error i{ display:none; }
@keyframes listSpin{ to{ transform:rotate(360deg); } }
.list-real-head{ align-items:flex-start; justify-content:space-between; gap:18px; }
.list-real-head > div:first-child{ display:grid; gap:4px; }
.list-real-head em,.list-real-section em,.list-insights > em{
  color:#718197; font-size:9px; font-style:normal; letter-spacing:1.2px; font-weight:700;
}
.list-real-head h2{ font-size:25px; letter-spacing:-.7px; }
.list-sync{ display:flex; align-items:center; gap:8px; flex:0 0 auto; color:#42dc96; font-size:9px; letter-spacing:.5px; }
.list-sync > i{ width:7px; height:7px; border-radius:50%; background:currentColor; box-shadow:0 0 10px currentColor; }
.list-sync > span{ display:grid; gap:2px; }
.list-sync small{ color:#728196; font-size:8px; letter-spacing:0; }
.list-sync.snapshot{ color:#68aaff; }
.list-real-stats{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:0; margin:18px 0 11px; }
.list-real-stats span{ gap:2px; padding:0 12px; border-left:1px solid #223043; }
.list-real-stats span:first-child{ padding-left:0; border-left:0; }
.list-real-stats b{ font-size:21px; }
.list-real-stats .c5{ color:#fb6674; }
.list-proof{
  display:flex; align-items:center; gap:16px; padding:7px 0; margin-bottom:13px;
  border-top:1px solid #1e2b3b; border-bottom:1px solid #1e2b3b;
  color:#77879a; font-size:9px;
}
.list-proof span:first-child{ flex:1; color:#a7b4c4; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.list-proof i{ display:inline-block; width:6px; height:6px; margin-right:6px; border-radius:50%; background:#39d98a; }
.list-proof.warn i{ background:#f2ad3d; }
.list-day-grid{ display:grid; grid-template-columns:minmax(0,1fr) 170px; gap:24px; }
.list-real-sum{ padding:0 0 18px; border:0; border-radius:0; background:transparent; }
.list-real-sum p{ margin-top:9px; color:#d4deea; font-size:12px; line-height:1.55; }
.list-insights{ padding-left:15px; border-left:1px solid #213044; }
.list-insights > em{ display:block; margin-bottom:7px; }
.list-topic-pills{ display:flex; flex-wrap:wrap; gap:5px; margin-bottom:13px; }
.list-topic-pills span{ padding:3px 7px; border-radius:999px; color:#b8d9ff; background:#11243b; font-size:8px; }
.list-topic-pills small,.list-apps > small{ color:#728196; font-size:9px; }
.list-apps{ display:grid; gap:5px; }
.list-apps span{ display:flex; justify-content:space-between; gap:8px; }
.list-apps b{ overflow:hidden; color:#cbd6e3; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.list-apps small{ color:#748399; font-size:8px; white-space:nowrap; }
.list-real-section{ margin-top:6px; }
.list-section-title{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.list-section-title span{ color:#6f7e92; font-size:8px; }
.list-real-cards{ margin:0; }
.list-real-cards .lc{ min-width:0; padding:7px; }
.list-real-cards .th{ position:relative; display:grid; place-items:center; height:48px; color:#6f8baa; font-size:21px; font-style:normal; }
.list-real-cards .th.blue{ background:linear-gradient(135deg,#102a4c,#16477d); }
.list-real-cards .lc strong{ overflow:hidden; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.list-real-cards .lc p{ height:26px; margin:0; overflow:hidden; color:#748399; font-size:8px; line-height:1.4; }
.list-empty-day{ width:100%; padding:20px; border:1px dashed #26384d; border-radius:10px; color:#718197; font-size:10px; text-align:center; }
.list-timeline-section{ margin-top:14px; }
.list-timeline{ display:flex; min-height:68px; overflow-x:auto; padding:9px 0 2px; border-top:1px solid #1f2d3e; }
.list-timeline > div{ display:grid; grid-template-columns:34px 12px minmax(86px,1fr); gap:5px; min-width:150px; padding:3px 10px; border-right:1px solid #1f2d3e; }
.list-timeline > div:first-child{ padding-left:0; }
.list-timeline time{ color:#748399; font-size:8px; }
.list-timeline > div > i{ color:#409cff; font-size:8px; font-style:normal; }
.list-timeline > div > span{ display:grid; align-content:start; gap:2px; min-width:0; }
.list-timeline b,.list-timeline small{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.list-timeline b{ color:#cbd6e3; font-size:9px; }
.list-timeline small{ color:#708095; font-size:8px; }

/* ---- About + System Settings, opened from the real menu bar ---- */
.mac-system-info .mac-win-body{ background:linear-gradient(160deg,#171b24,#0c0f15); }
.mac-about{ flex:1; display:flex; flex-direction:column; align-items:center; padding:24px 34px; text-align:center; }
.mac-about-icon{
  width:64px; height:64px; display:grid; place-items:center; border-radius:17px;
  background:conic-gradient(from 20deg,#ff5f57,#febc2e,#28c840,#0a84ff,#bf5af2,#ff5f57);
  box-shadow:0 12px 30px rgba(0,0,0,.35); color:#fff; font-size:30px; font-weight:800;
}
.mac-about h2{ margin:12px 0 3px; font-size:21px; }
.mac-about p{ max-width:350px; margin:0 0 14px; color:#9eabbc; font-size:11px; line-height:1.5; }
.mac-about dl{ width:100%; margin:0; border-top:1px solid rgba(255,255,255,.1); }
.mac-about dl div{ display:flex; justify-content:space-between; gap:20px; padding:5px 0; border-bottom:1px solid rgba(255,255,255,.07); font-size:10px; }
.mac-about dt{ color:#748398; }.mac-about dd{ margin:0; text-align:right; }
.mac-about > small{ margin-top:9px; color:#647186; font-size:9px; }
.mac-settings .mac-win-body{ background:#15171d; }
.mac-settings-shell{ flex:1; display:flex; min-height:0; }
.mac-settings-shell aside{ flex:0 0 155px; display:flex; flex-direction:column; gap:4px; padding:14px 10px; background:#111319; border-right:1px solid rgba(255,255,255,.08); }
.mac-settings-shell aside b{ margin:2px 7px 12px; font-size:13px; }
.mac-settings-shell aside span{ padding:7px 9px; border-radius:7px; color:#adb7c5; font-size:10px; }
.mac-settings-shell aside span.on{ background:#0a84ff; color:#fff; }
.mac-settings-shell main{ flex:1; min-width:0; padding:22px 25px; overflow:auto; }
.mac-settings-shell main h2{ margin:0; font-size:22px; }
.mac-settings-shell main > p{ margin:3px 0 20px; color:#7f8b9d; font-size:10px; }
.mac-setting-row,.mac-toggle-row{ padding:13px 0; border-top:1px solid rgba(255,255,255,.08); }
.mac-setting-row label{ display:flex; justify-content:space-between; margin-bottom:10px; font-size:11px; font-weight:600; }
.mac-setting-row output{ color:#7e8b9e; font-weight:400; }
.mac-setting-row input[type="range"]{ width:100%; accent-color:#0a84ff; }
.mac-wallpapers{ display:flex; gap:11px; }
.mac-wallpapers button{ width:78px; height:48px; border:2px solid transparent; border-radius:8px; cursor:pointer; }
.mac-wallpapers button.on{ border-color:#0a84ff; box-shadow:0 0 0 2px #15171d,0 0 0 4px #0a84ff; }
.mac-wallpapers .night{ background:linear-gradient(155deg,#0b1026,#4a3550); }
.mac-wallpapers .aurora{ background:linear-gradient(145deg,#0e453c,#334c8d,#402c6e); }
.mac-wallpapers .graphite{ background:linear-gradient(145deg,#090b0f,#4a5360); }
.mac-wallpapers .cobol{ background:url('../assets/mac-cobol-monkey-wallpaper.jpg') center/cover no-repeat; }
.mac-toggle-row{ display:flex; align-items:center; justify-content:space-between; gap:20px; }
.mac-toggle-row > span{ display:grid; gap:2px; }
.mac-toggle-row b{ font-size:11px; }.mac-toggle-row small{ color:#7e8a9b; font-size:9px; }
.mac-toggle-row input{ width:34px; height:18px; accent-color:#0a84ff; }
.mac-settings-foot{ margin-top:16px; color:#657286; font-size:9px; }
.mac-menu-toast{
  position:absolute; z-index:9000; left:50%; bottom:72px; transform:translate(-50%,10px);
  padding:9px 15px; border:1px solid rgba(255,255,255,.16); border-radius:9px;
  background:rgba(24,25,31,.82); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px);
  box-shadow:0 12px 30px rgba(0,0,0,.4); color:#fff; font-size:11px; opacity:0; transition:.2s ease;
}
.mac-menu-toast.show{ opacity:1; transform:translate(-50%,0); }

/* ---- GhostBridge slide-out ---- */
.mb-bridge{ cursor:pointer; }
.mb-bridge:hover{ opacity:1; color:#c9b6ff; }
.gb-overlay{
  position:absolute; inset:0; z-index:4000; display:flex; flex-direction:column;
  background:#05060a; transform:translateX(100%); transition:transform .55s cubic-bezier(.2,.8,.25,1);
  font-family:-apple-system,"SF Pro Text","Segoe UI",sans-serif; color:#e8e8ec;
}
.gb-overlay.open{ transform:translateX(0); }
.gb-head{
  flex:0 0 40px; display:flex; align-items:center; gap:12px; padding:0 16px;
  border-bottom:1px solid rgba(255,255,255,.1); font-size:13px;
}
.gb-head b{ color:#c9b6ff; }
.gb-head .sub{ opacity:.6; }
.gb-close{ margin-left:auto; cursor:pointer; opacity:.7; padding:4px 8px; }
.gb-close:hover{ opacity:1; }
.gb-panes{ flex:1; display:flex; min-height:0; }
.gb-pane{ flex:1; position:relative; overflow:hidden; }
.gb-tag{
  position:absolute; left:12px; top:10px; z-index:5; font-size:11px;
  background:rgba(0,0,0,.55); border:1px solid rgba(255,255,255,.14);
  border-radius:6px; padding:3px 9px; opacity:.9;
}
.gb-seam{ flex:0 0 2px; background:linear-gradient(180deg,#7c5cff,#22d3ee); }
.gb-mirror-host{ position:absolute; inset:0; background:#0b1026; }
/* right: calibration test pattern, per the real rig */
.gb-test{ position:absolute; inset:0; background:#04060a; border:3px solid #22d3ee; }
.gb-test .bars{ display:flex; height:26%; }
.gb-test .bars i{ flex:1; }
.gb-test .b1{ background:#e5322d; } .gb-test .b2{ background:#f59e0b; }
.gb-test .b3{ background:#3eb548; } .gb-test .b4{ background:#2196c9; }
.gb-test .b5{ background:#6d5ce5; } .gb-test .b6{ background:#d84ad8; }
.gb-test .grid{
  position:absolute; inset:26% 0 0 0;
  background:
    repeating-linear-gradient(0deg, rgba(34,211,238,.18) 0 1px, transparent 1px 64px),
    repeating-linear-gradient(90deg, rgba(34,211,238,.18) 0 1px, transparent 1px 64px);
}
.gb-test .chip{
  position:absolute; left:44%; top:46%; width:9%; height:12%;
  background:#2ee4a5; animation:gbChip 1.2s ease-in-out infinite alternate;
}
@keyframes gbChip{ from{ opacity:.7; } to{ opacity:1; } }
.gb-test .cal{
  position:absolute; left:0; right:0; bottom:8%; text-align:center;
  font:12px ui-monospace,Menlo,monospace; color:#22d3ee; letter-spacing:2px;
}
/* right: the bridged Win11 desktop */
.gb-win11{
  position:absolute; inset:0;
  background:radial-gradient(120% 90% at 30% 20%, #2f6fed 0%, #1b3f8f 45%, #101c3f 100%);
}
.w11-window{
  position:absolute; left:8%; right:8%; top:12%; height:62%;
  display:flex; flex-direction:column; border-radius:10px; overflow:hidden;
  background:#f3f3f7; color:#111; box-shadow:0 20px 50px rgba(0,0,0,.45);
}
.w11-bar{
  flex:0 0 34px; display:flex; align-items:center; gap:2px; padding:0 4px 0 14px;
  background:#fff; border-bottom:1px solid #e4e4ea; font-size:12px;
}
.w11-bar .t{ flex:1; }
.w11-bar .c{ width:40px; text-align:center; padding:8px 0; font-size:11px; color:#333; }
.w11-bar .c.x:hover{ background:#e81123; color:#fff; }
.w11-body{ flex:1; min-height:0; display:flex; flex-direction:column; padding:10px 14px; }
.w11-body table{ width:100%; border-collapse:collapse; font-size:12px; }
.w11-body th{ text-align:left; font-size:10px; letter-spacing:.6px; color:#666; border-bottom:1px solid #e4e4ea; padding:4px 8px; }
.w11-body td{ padding:5px 8px; border-bottom:1px solid #f0f0f4; }
.w11-body td.num{ text-align:right; font-variant-numeric:tabular-nums; }
.w11-foot{ margin-top:auto; padding-top:8px; font-size:12px; color:#0b7a3b; font-weight:600; }
.w11-taskbar{
  position:absolute; left:50%; bottom:10px; transform:translateX(-50%);
  display:flex; gap:16px; align-items:center; padding:8px 18px; border-radius:12px;
  background:rgba(255,255,255,.16);
  -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px);
  border:1px solid rgba(255,255,255,.2); font-size:18px;
}
.w11-taskbar .wlogo{ color:#8ab4ff; font-weight:700; }

/* ---- GhostBridge Workspace Control Center (mirrors the native product) ---- */
.gb-overlay{ background:#0b0d17; color:#eef1f8; overflow:hidden; }
.gbc-titlebar{
  flex:0 0 30px; display:flex; align-items:center; gap:10px; padding:0 10px;
  background:#22292d; border-bottom:1px solid #343b42; color:#b7bcc5; font-size:12px;
}
.gbc-titlebar>button{ margin-left:auto; width:26px; border:0; background:transparent; color:#aeb3bc; font-size:17px; cursor:pointer; }
.gbc-lights{ display:flex; gap:7px; }.gbc-lights i{ width:12px; height:12px; border-radius:50%; }
.gbc-lights i:nth-child(1){ background:#ff5f57 }.gbc-lights i:nth-child(2){ background:#febc2e }.gbc-lights i:nth-child(3){ background:#28c840 }
.gbc-app{ flex:1; min-height:0; display:flex; background:#0b0d17; }
.gbc-rail{
  flex:0 0 285px; min-width:0; padding:18px 18px 14px; overflow:auto;
  background:#20242e; border-right:1px solid #353b48; color:#f1f3f8; font-size:11px;
  scrollbar-color:#596171 transparent;
}
.gbc-brand{ display:flex; align-items:center; gap:11px; margin:1px 2px 16px; }
.gbc-brand>span{ color:#9b6cff; font-size:27px; line-height:1; }
.gbc-brand>b{ font-size:17px; }.gbc-brand small{ display:block; margin-top:5px; color:#9399a7; font-size:9px; font-weight:500; }
.gbc-ready,.gbc-session{ padding:14px; border:1px solid #626a79; border-radius:14px; background:#282d38; }
.gbc-ready{ display:flex; flex-direction:column; gap:9px; margin-bottom:17px; }
.gbc-ready b{ font-size:12px; }.gbc-ready b i{ display:inline-grid; place-items:center; width:14px; height:14px; margin-right:7px; border-radius:50%; background:#18d8c2; color:#132324; font-style:normal; font-size:9px; }
.gbc-ready span,.gbc-session>span{ color:#9ca3b1; font-size:9px; line-height:1.4; }
.gbc-rail section{ margin:0 0 17px; }.gbc-rail h3{ display:flex; margin:0 0 8px; font-size:11px; }.gbc-rail h3 i{ margin-left:auto; color:#2ee4d0; font-size:9px; font-style:normal; font-weight:500; }
.gbc-rail-item{
  width:100%; min-height:48px; display:flex; align-items:center; gap:10px; margin:0 0 7px; padding:8px 10px;
  border:1px solid #5b6372; border-radius:11px; background:#272c37; color:#edf0f6; text-align:left; cursor:pointer;
}
.gbc-rail-item:hover:not(:disabled){ border-color:#8792a5; background:#2d3340; }.gbc-rail-item>span{ width:21px; color:#36a2ff; font-size:18px; text-align:center; }
.gbc-rail-item>b{ flex:1; font-size:10px; }.gbc-rail-item small{ display:block; margin-top:2px; color:#9ca3b1; font-size:8px; font-weight:500; }
.gbc-rail-item>i{ color:#778091; font-style:normal; font-size:18px; }.gbc-rail-item.disabled{ opacity:.32; cursor:default; }
.gbc-search{ display:flex; align-items:center; gap:8px; margin:8px 10px 0; color:#949baa; font-size:9px; }
.gbc-search i,.gbc-spinner{ width:13px; height:13px; border:2px dotted #8e96a5; border-radius:50%; animation:gbcSpin 1.2s linear infinite; }
@keyframes gbcSpin{ to{ transform:rotate(360deg) } }
.gbc-session{ position:sticky; z-index:12; bottom:31px; display:flex; flex-direction:column; gap:7px; margin-top:8px; }.gbc-session>div{ display:flex; gap:7px; }.gbc-session button,.gbc-prefs{ border:0; border-radius:6px; padding:6px 9px; background:#454b59; color:#e3e6ed; font-size:9px; cursor:pointer; }
.gbc-prefs{ position:sticky; z-index:13; bottom:0; width:100%; margin-top:8px; padding:8px 1px; background:#20242e; color:#aeb5c1; text-align:left; }
.gbc-main{ flex:1; min-width:0; padding:20px 22px 28px; overflow:auto; background:radial-gradient(circle at 85% 0,#14162d 0,#0b0d17 45%); scrollbar-color:#4a5262 transparent; }
.gbc-main-head{ margin:0 0 15px; }.gbc-main-head h1{ margin:0 0 5px; color:#f3f4f8; font-size:25px; letter-spacing:-.035em; }.gbc-main-head p{ margin:0; color:#a5aab6; font-size:11px; }
.gbc-builder{ padding:14px; border:1px solid #717888; border-radius:16px; background:#1b1f2a; box-shadow:0 18px 50px rgba(0,0,0,.25); }
.gbc-builder-head{ display:flex; align-items:flex-start; gap:11px; margin-bottom:10px; }.gbc-builder-head>div:first-child{ flex:1; }.gbc-builder-head h2{ margin:0 0 3px; font-size:16px; }.gbc-builder-head p{ margin:0; color:#9ca3b0; font-size:9px; }.gbc-builder-head>button,.gbc-add-wrap>button{ border:0; border-radius:7px; padding:7px 10px; background:transparent; color:#e8eaf0; font-size:10px; cursor:pointer; }
.gbc-builder-head .gbc-hide{ background:#0b3740; color:#22dfcd; }.gbc-builder-head>b{ padding-top:7px; color:#9ca3b0; font-size:9px; }.gbc-add-wrap{ position:relative; }
.gbc-add-menu,.gbc-pane-menu{ position:absolute; z-index:50; display:flex; flex-direction:column; min-width:132px; padding:5px; border:1px solid #3c4250; border-radius:10px; background:#242833; box-shadow:0 16px 35px rgba(0,0,0,.5); }
.gbc-add-menu{ top:34px; right:0; }.gbc-add-menu[hidden],.gbc-pane-menu[hidden]{ display:none; }.gbc-add-menu button,.gbc-pane-menu button{ border:0; border-radius:6px; padding:7px 9px; background:transparent; color:#eceef4; text-align:left; font-size:9px; cursor:pointer; }.gbc-add-menu button:hover,.gbc-pane-menu button:hover:not(:disabled){ background:#3e67c7; }
.gbc-pane-grid{ position:relative; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; min-height:285px; padding:5px; border:1px solid #596171; border-radius:14px; background:#080a0f; overflow:hidden; }
.gbc-pane-grid.below{ grid-template-columns:1fr; }.gbc-pane-grid[data-count="3"],.gbc-pane-grid[data-count="4"]{ grid-template-columns:repeat(2,minmax(0,1fr)); }.gbc-pane-grid[data-count="5"],.gbc-pane-grid[data-count="6"],.gbc-pane-grid[data-count="7"],.gbc-pane-grid[data-count="8"]{ grid-template-columns:repeat(4,minmax(0,1fr)); }
.gbc-pane-grid.view-mac .gbc-pane:not([data-gb-pane-type="mac"]),.gbc-pane-grid.view-windows .gbc-pane[data-gb-pane-type="mac"]{ display:none; }.gbc-pane-grid.view-mac,.gbc-pane-grid.view-windows{ grid-template-columns:1fr; }
.gbc-pane{ position:relative; min-width:0; min-height:275px; display:flex; flex-direction:column; overflow:hidden; border:1px solid #343b45; border-radius:12px; background:#020304; }.gbc-pane.selected{ border-color:#17decc; box-shadow:0 0 0 2px rgba(23,222,204,.18); }
.gbc-pane-top{ position:absolute; z-index:8; left:8px; right:7px; top:7px; display:flex; align-items:center; gap:7px; pointer-events:none; }.gbc-pane-top>span{ max-width:70%; padding:5px 8px; border-radius:10px; background:#22262d; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:8px; font-weight:700; }.gbc-pane-top>button{ margin-left:auto; border:0; padding:5px 7px; border-radius:7px; background:rgba(25,28,34,.85); color:#fff; font-size:9px; cursor:pointer; pointer-events:auto; }
.gbc-pane-menu{ right:0; top:30px; pointer-events:auto; }.gbc-pane-menu button:disabled{ opacity:.35; }
.gbc-pane-body{ flex:1; min-height:0; position:relative; overflow:hidden; }.gbc-pane-foot{ flex:0 0 29px; display:flex; align-items:center; padding:0 10px; background:#181c1d; color:#e5e8ed; font-size:8px; }.gbc-pane-foot span{ flex:1; }.gbc-pane-foot b{ color:#9ba1ab; font-size:8px; letter-spacing:.08em; }
.gbc-pane-empty{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:#9097a4; text-align:center; }.gbc-pane-empty p{ margin:0; max-width:85%; font-size:9px; }.gbc-pane-empty small{ font-size:8px; }.gbc-pane-empty button{ border:0; border-radius:7px; padding:6px 10px; background:#1677ff; color:#fff; font-size:9px; cursor:pointer; }.gbc-monitor{ position:relative; font-size:24px; color:#fff; }.gbc-monitor i{ position:absolute; right:-5px; bottom:2px; font-size:8px; font-style:normal; }
.gbc-mac-live,.gbc-win-live,.gbc-retro-live,.gbc-win7-live,.gbc-win8-live,.gbc-win10-live{ position:absolute; inset:0; }.gbc-mac-live{ background:linear-gradient(145deg,#566b9d,#151d37 55%,#342844); }.gbc-mac-replica{ overflow:hidden; background:#6b9493 url('../assets/mac-cobol-monkey-wallpaper.jpg') center/contain no-repeat; font-family:-apple-system,"SF Pro Text","Segoe UI",sans-serif; }.gbc-mac-replica::after{ content:''; position:absolute; inset:0; background:rgba(71,113,118,.26); pointer-events:none; }.gbc-mac-menu{ position:relative; z-index:3; height:20px; display:flex; align-items:center; gap:8px; padding:0 8px; background:rgba(15,17,24,.68); font-size:7px; color:#fff; }.gbc-mac-menu b{ color:#28c840; }.gbc-mac-menu i{ flex:1; }.gbc-mac-weather{ position:absolute; z-index:2; left:7%; top:22%; width:70px; padding:8px; border-radius:10px; background:rgba(28,30,38,.56); color:#fff; box-shadow:0 8px 16px rgba(0,0,0,.35); }.gbc-mac-weather b{ display:block; font-size:22px; font-weight:300; line-height:1; }.gbc-mac-weather small,.gbc-mac-card small,.gbc-mac-file small,.gbc-mac-icons small{ display:block; font-size:5.5px; line-height:1.15; }.gbc-mac-icons{ position:absolute; z-index:2; left:31%; right:9%; top:23%; display:grid; grid-template-columns:repeat(7,26px); justify-content:space-between; gap:7px; }.gbc-mac-icons span{ display:grid; place-items:center; gap:3px; color:#fff; text-align:center; font-size:6px; text-shadow:0 1px 3px #000; }.gbc-mac-icons span::before{ content:attr(data-mark); width:24px; height:19px; display:grid; place-items:center; border-radius:5px; background:linear-gradient(180deg,#72d6ff,#1688df); box-shadow:inset 0 1px rgba(255,255,255,.6),0 4px 8px rgba(0,0,0,.38); color:#fff; font:900 7px ui-monospace,Menlo,monospace; }.gbc-mac-card{ position:absolute; z-index:2; left:7%; bottom:23%; width:92px; height:58px; display:flex; flex-direction:column; justify-content:end; padding:6px; border-radius:10px; background:linear-gradient(90deg,rgba(8,12,18,.4),rgba(8,12,18,.08)),url('../assets/memories-mom.webp') center/cover no-repeat; color:#fff; box-shadow:0 8px 18px rgba(0,0,0,.4); font-size:7px; text-shadow:0 1px 3px #000; }.gbc-mac-file{ position:absolute; z-index:2; display:grid; place-items:center; width:26px; height:34px; border-radius:4px; background:#f7fbff; color:#1f2937; box-shadow:0 4px 10px rgba(0,0,0,.38); font:800 5.5px ui-monospace,Menlo,monospace; text-align:center; }.gbc-mac-file::after{ content:''; position:absolute; left:5px; right:5px; bottom:5px; height:7px; background:repeating-linear-gradient(180deg,currentColor 0 1px,transparent 1px 3px); opacity:.42; }.gbc-mac-file small{ position:absolute; top:38px; width:60px; color:#fff; text-shadow:0 1px 3px #000; font-family:-apple-system,"SF Pro Text",sans-serif; font-weight:600; }.gbc-mac-file.f1{ right:22%; top:54%; }.gbc-mac-file.f2{ right:11%; top:47%; }.gbc-mac-live>.gbc-surface-kist{ position:absolute; z-index:5; left:50%; bottom:31px; transform:translateX(-50%); }.gbc-mini-dock{ position:absolute; z-index:4; left:50%; bottom:7px; transform:translateX(-50%); padding:5px 11px; border-radius:8px; background:rgba(28,38,52,.72); box-shadow:0 6px 16px rgba(0,0,0,.38); font-size:10px; white-space:nowrap; }
.gbc-win-live{ background:radial-gradient(circle at 25% 25%,#2863d4,#132e72 55%,#0b173b); }.gbc-win-ledger{ position:absolute; left:10%; right:10%; top:17%; bottom:16%; overflow:hidden; border-radius:8px; background:#f4f5f8; color:#1d2230; box-shadow:0 14px 35px rgba(0,0,0,.42); }.gbc-win-ledger header{ display:flex; padding:8px 9px; background:#fff; border-bottom:1px solid #dddfe7; font-size:8px; }.gbc-win-ledger header span{ margin-left:auto; }.gbc-win-ledger table{ width:100%; border-collapse:collapse; font-size:7px; }.gbc-win-ledger th,.gbc-win-ledger td{ padding:4px 7px; border-bottom:1px solid #e5e7ec; text-align:left; }.gbc-win-ledger>b{ position:absolute; left:8px; bottom:7px; color:#087b43; font-size:7px; }.gbc-win-live>footer{ position:absolute; left:50%; bottom:7px; transform:translateX(-50%); padding:5px 12px; border-radius:8px; background:rgba(255,255,255,.16); font-size:9px; white-space:nowrap; }
.gbc-retro-live{ background:#008787; color:#fff; }.gbc-retro-live.win95{ background:#0a6f6f; }.gbc-retro-live.win2000{ background:linear-gradient(135deg,#0b4a91,#1d8fa3); }.gbc-retro-icons{ padding:36px 12px; font-size:14px; line-height:2.2; }.gbc-retro-icons span{ margin-left:5px; font-size:7px; }.gbc-retro-win{ position:absolute; left:24%; right:10%; top:22%; bottom:17%; border:2px outset #ddd; background:#c0c0c0; }.gbc-retro-win header{ display:flex; padding:4px 6px; background:#000080; color:#fff; font-size:7px; }.gbc-retro-live.win2000 .gbc-retro-win header{ background:#2458a5; }.gbc-retro-win header b{ margin-left:auto; }.gbc-retro-win pre{ margin:3px; height:calc(100% - 28px); padding:7px; background:#000; color:#21ff57; font:7px/1.5 ui-monospace,monospace; }.gbc-retro-live>footer{ position:absolute; left:0; right:0; bottom:0; height:22px; padding:5px; background:#c0c0c0; color:#000; font-size:7px; }.gbc-retro-live>footer span{ float:right; }
.gbc-legacy-port{ position:absolute; right:7px; top:45%; display:flex; align-items:center; gap:4px; padding:4px 6px; border:1px solid rgba(255,255,255,.4); background:rgba(0,0,0,.36); font:6px ui-monospace,monospace; letter-spacing:.08em; }.gbc-legacy-port i{ width:7px; height:7px; border-radius:50%; background:#19e0d0; box-shadow:0 0 10px #19e0d0; }
.gbc-win7-live{ background:linear-gradient(135deg,#17264f,#2868a8 58%,#11305a); }.gbc-win7-app{ position:absolute; left:12%; right:12%; top:18%; bottom:16%; overflow:hidden; border:1px solid rgba(255,255,255,.55); border-radius:7px; background:rgba(228,238,255,.82); color:#172033; box-shadow:0 16px 36px rgba(0,0,0,.38); }.gbc-win7-app header{ display:flex; padding:7px 9px; background:linear-gradient(#eaf5ff,#b6d4f2); font-size:8px; }.gbc-win7-app header span{ margin-left:auto; }.gbc-win7-app main{ padding:10px; }.gbc-win7-app b,.gbc-win8-app b,.gbc-win10-app b{ display:block; margin-bottom:7px; font-size:10px; }.gbc-win7-app ul,.gbc-win8-app ul{ list-style:none; margin:0; padding:0; }.gbc-win7-app li,.gbc-win8-app li{ display:grid; grid-template-columns:32px 1fr auto; gap:5px; padding:4px 0; border-bottom:1px solid rgba(0,0,0,.13); font-size:7px; animation:gbcRowFlash 1.8s ease-in-out infinite; animation-delay:calc(var(--row) * .18s); }.gbc-win7-app em,.gbc-win8-app em,.gbc-win10-app em{ display:block; margin-top:8px; color:#087b43; font-size:8px; font-weight:800; }.gbc-win7-live footer{ position:absolute; left:0; right:0; bottom:0; height:24px; display:flex; align-items:center; gap:9px; padding:0 8px; background:linear-gradient(#1d5aa2,#0b3670); font-size:8px; }.gbc-win7-live footer i{ margin-left:auto; width:40px; height:12px; border-radius:2px; background:rgba(255,255,255,.18); }
.gbc-win8-live{ background:#181a40; color:#fff; }.gbc-win8-live>header{ position:absolute; left:18px; top:34px; font-size:17px; font-weight:700; }.gbc-tiles{ position:absolute; left:18px; right:45%; top:66px; display:grid; grid-template-columns:1fr 1fr; gap:7px; }.gbc-tiles span{ min-height:44px; display:grid; place-items:center; background:#0aa4a8; font-size:8px; }.gbc-tiles span:nth-child(2){ background:#7c3aed; }.gbc-tiles span:nth-child(3){ background:#d97706; }.gbc-tiles span:nth-child(4){ background:#1d4ed8; }.gbc-win8-app{ position:absolute; right:8%; top:24%; bottom:13%; width:36%; min-width:110px; padding:10px; background:#f5f7fb; color:#151923; box-shadow:0 14px 32px rgba(0,0,0,.4); }
.gbc-win10-live{ background:linear-gradient(135deg,#143650,#0f5f88 50%,#103045); color:#fff; }.gbc-win10-app{ position:absolute; left:11%; right:11%; top:17%; bottom:15%; overflow:hidden; background:#f7f8fb; color:#111827; box-shadow:0 15px 34px rgba(0,0,0,.42); }.gbc-win10-app header{ display:flex; padding:8px 10px; background:#101827; color:#fff; font-size:8px; }.gbc-win10-app header span{ margin-left:auto; }.gbc-win10-app main{ padding:10px; }.gbc-win10-app table{ width:100%; border-collapse:collapse; font-size:7px; }.gbc-win10-app td{ padding:4px 6px; border-bottom:1px solid #e4e7ee; animation:gbcRowFlash 1.8s ease-in-out infinite; animation-delay:calc(var(--row) * .16s); }.gbc-win10-live footer{ position:absolute; left:0; right:0; bottom:0; height:24px; padding:6px 9px; background:#101827; font-size:8px; }
.gbc-data-bus{ position:absolute; z-index:7; left:10%; right:10%; top:47%; height:24px; pointer-events:none; }
.gbc-data-bus b,.gbc-data-bus strong{ position:absolute; top:-14px; padding:2px 5px; border-radius:4px; background:rgba(0,0,0,.62); color:#92f4e9; font:6px ui-monospace,monospace; letter-spacing:.08em; }.gbc-data-bus b{ left:0; }.gbc-data-bus strong{ right:0; color:#b7c8ff; }
.gbc-data-bus::before{ content:""; position:absolute; left:3%; right:3%; top:11px; height:2px; background:linear-gradient(90deg,rgba(25,224,208,.25),rgba(25,224,208,.95),rgba(99,146,255,.95),rgba(99,146,255,.25)); box-shadow:0 0 14px rgba(25,224,208,.45); }
.gbc-data-glob{ position:absolute; left:0; top:3px; width:17px; height:17px; border-radius:50%; background:#19e0d0; box-shadow:0 0 0 2px rgba(10,16,24,.8),0 0 16px rgba(25,224,208,.85); animation:gbcDataMove 2.1s cubic-bezier(.45,0,.2,1) infinite; animation-delay:calc(var(--i) * .22s); }
.gbc-data-glob span{ position:absolute; left:50%; top:22px; transform:translateX(-50%); color:#e8fffb; font:5.5px ui-monospace,monospace; white-space:nowrap; text-shadow:0 1px 3px #000; }
@keyframes gbcDataMove{ 0%{ transform:translateX(0) scale(.72); opacity:0; } 14%{ opacity:1; } 76%{ opacity:1; } 100%{ transform:translateX(calc(80vw - 190px)) scale(1.05); opacity:0; } }
@keyframes gbcRowFlash{ 0%,100%{ background:transparent; } 44%,58%{ background:rgba(25,224,208,.18); } }
.gbc-vcards{ margin-top:12px; padding:12px 14px; border:1px solid #5f6778; border-radius:14px; background:linear-gradient(135deg,#242a38,#1b2030); }.gbc-builder.cards-hidden .gbc-vcards{ display:none; }.gbc-v-title,.gbc-perslis{ display:flex; align-items:flex-start; gap:10px; }.gbc-v-title>span{ color:#a86cff; font-size:17px; }.gbc-v-title>div,.gbc-perslis>div{ flex:1; }.gbc-v-title h3,.gbc-perslis h3{ margin:0 0 2px; font-size:11px; }.gbc-v-title p,.gbc-perslis p{ margin:0; color:#9ca3b1; font-size:8px; line-height:1.35; }.gbc-v-title>b{ padding:5px 9px; border-radius:14px; background:#075f62; color:#19e0d0; font-size:8px; }.gbc-vchips{ display:grid; grid-template-columns:1fr 2fr; gap:10px; margin:12px 0; }.gbc-vchips b{ color:#9ca3b1; font-size:8px; }.gbc-vchips span{ display:flex; align-items:center; justify-content:center; min-height:50px; border-radius:9px; background:#242b3d; color:#aeb4c0; font-size:8px; }.gbc-vcards hr{ border:0; border-top:1px solid #596171; margin:10px 0; }.gbc-perslis>span{ color:#36a2ff; font-size:18px; }.gbc-perslis>button{ align-self:center; border:0; border-radius:6px; padding:6px 10px; background:#4a5060; color:#eef0f5; font-size:8px; cursor:pointer; }
.gbc-extract{ display:grid; grid-template-columns:1fr auto auto; gap:8px; align-items:center; margin-top:10px; padding:9px; border:1px solid #687181; border-radius:11px; }.gbc-extract>b{ color:#21e0cd; font:700 8px ui-monospace,monospace; }.gbc-extract>b small,.gbc-extract>span small{ display:block; margin-top:3px; color:#9ca3b1; font:8px -apple-system,sans-serif; }.gbc-extract button,.gbc-extract select{ border:0; border-radius:6px; padding:6px 9px; background:#4a5060; color:#f2f3f7; font-size:8px; }.gbc-extract button{ cursor:pointer; }.gbc-extract button.primary{ background:#1ed8c7; color:#071a1a; font-weight:800; }.gbc-extract select{ grid-column:1; min-width:180px; }.gbc-extract>span{ grid-column:2/4; display:flex; flex-direction:column; }.gbc-extract>span>b{ font-size:8px; }
.gbc-actions{ display:flex; gap:8px; margin-top:11px; }.gbc-actions button,.gbc-quick button{ border:0; border-radius:6px; padding:6px 10px; background:#444a59; color:#eceef3; font-size:9px; cursor:pointer; }.gbc-actions button:disabled{ opacity:.3; }.gbc-actions i{ flex:1; }.gbc-actions button.start{ background:linear-gradient(90deg,#6392ff,#f33ba1); font-weight:800; }.gbc-actions button.deploy{ background:#12d8c6; color:#07191a; font-weight:900; box-shadow:0 0 0 1px rgba(255,255,255,.14) inset,0 0 16px rgba(18,216,198,.28); }.gbc-message{ margin:9px 0; padding-bottom:9px; border-bottom:1px solid #474e5d; color:#a2a9b6; font-size:8px; }.gbc-quick{ display:grid; grid-template-columns:auto repeat(3,1fr); align-items:center; gap:8px; }.gbc-quick>b{ color:#9da4b1; font-size:8px; }.gbc-quick button.on{ background:#4f5667; color:#fff; }
.gbc-lights i:first-child{ cursor:pointer; }.gbc-builder.live-active{ padding:10px; }.gbc-builder.live-active .gbc-builder-head,.gbc-builder.live-active .gbc-vcards{ display:none; }.gbc-builder.live-active .gbc-pane-grid{ min-height:520px; gap:8px; background:#02040a; }.gbc-builder.live-active .gbc-pane{ min-height:510px; }.gbc-builder.live-active .gbc-actions{ margin-top:8px; }.gbc-mac-icons button{ display:grid; place-items:center; gap:3px; padding:0; border:0; background:transparent; color:#fff; text-align:center; font-size:6px; text-shadow:0 1px 3px #000; cursor:pointer; }.gbc-mac-icons button::before{ content:attr(data-mark); width:24px; height:19px; display:grid; place-items:center; border-radius:5px; background:linear-gradient(180deg,#72d6ff,#1688df); box-shadow:inset 0 1px rgba(255,255,255,.6),0 4px 8px rgba(0,0,0,.38); color:#fff; font:900 7px ui-monospace,Menlo,monospace; }.gbc-mac-card,.gbc-mac-file{ border:0; cursor:pointer; }
.mac-bridge-live-window{ min-width:720px; border-radius:10px; border-color:rgba(23,220,202,.42); background:#02040a; }.mac-bridge-live-window .mac-win-bar{ display:none; }.mac-bridge-live-window .mac-win-body{ background:#02040a; overflow:hidden; }.gb-detached{ position:relative; height:100%; display:grid; padding:8px; background:#02040a; color:#f4f7fb; }.gb-detached-grid{ position:relative; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; min-height:0; overflow:hidden; }.gb-detached-pane{ min-height:0; overflow:hidden; border:1px solid #17dcca; border-radius:8px; background:#02040a; box-shadow:0 0 0 1px rgba(23,220,202,.15) inset,0 12px 34px rgba(0,0,0,.38); }.gb-detached-screen{ height:100%; min-height:0; position:relative; overflow:hidden; }.gb-detached-screen>.gbc-mac-live,.gb-detached-screen>.gbc-win-live,.gb-detached-screen>.gbc-retro-live,.gb-detached-screen>.gbc-win7-live,.gb-detached-screen>.gbc-win8-live,.gb-detached-screen>.gbc-win10-live{ height:100%; min-height:0; }.gb-detached-controls{ position:absolute; z-index:20; left:50%; bottom:15px; transform:translateX(-50%); display:flex; align-items:center; gap:8px; padding:7px 9px; border:1px solid rgba(255,255,255,.18); border-radius:13px; background:rgba(27,35,49,.78); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); box-shadow:0 10px 26px rgba(0,0,0,.45); }.gb-detached-controls span{ padding:5px 8px; border-radius:999px; background:#10323d; color:#8bf5eb; font-size:9px; white-space:nowrap; }.gb-detached-controls button{ border:0; border-radius:7px; padding:7px 10px; background:#42495a; color:#f3f5f9; font-size:10px; cursor:pointer; white-space:nowrap; }.gb-detached-controls button:first-of-type{ background:#18e4cf; color:#061817; font-weight:900; }
.mac-bridge-summary{ min-width:360px; }.gb-summary{ height:100%; display:flex; flex-direction:column; gap:12px; padding:16px; background:linear-gradient(135deg,#18202e,#222838); color:#eff3fa; }.gb-summary header{ display:flex; align-items:flex-start; gap:10px; }.gb-summary header div{ flex:1; }.gb-summary small{ display:block; color:#22dfcd; font:700 9px ui-monospace,monospace; letter-spacing:.08em; }.gb-summary b{ display:block; margin-top:3px; font-size:19px; }.gb-summary em{ padding:5px 9px; border-radius:999px; background:#0e4a54; color:#7df8ec; font-style:normal; font-size:10px; }.gb-summary-panes{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }.gb-summary-panes span{ min-height:58px; display:grid; grid-template-columns:auto 1fr; gap:4px 8px; align-content:center; padding:10px; border:1px solid #4d5668; border-radius:8px; background:#151a24; }.gb-summary-panes span.live{ border-color:#22dfcd; box-shadow:inset 0 0 0 1px rgba(34,223,205,.18); }.gb-summary-panes span b{ grid-row:1/3; width:24px; height:24px; display:grid; place-items:center; margin:0; border-radius:50%; background:#2f3848; font-size:10px; }.gb-summary-panes span i{ font-style:normal; font:800 10px ui-monospace,monospace; }.gb-summary-panes span small{ color:#aeb6c4; font:9px -apple-system,sans-serif; letter-spacing:0; }.gb-summary-flow{ display:grid; grid-template-columns:1fr 2fr 1fr; align-items:center; gap:8px; }.gb-summary-flow span,.gb-summary-flow strong{ display:grid; place-items:center; min-height:30px; border-radius:7px; background:#101620; color:#eff3fa; font:800 10px ui-monospace,monospace; }.gb-summary-flow i{ height:2px; background:linear-gradient(90deg,#22dfcd,#6392ff,#f33ba1); box-shadow:0 0 14px rgba(34,223,205,.45); }.gb-summary p{ flex:1; margin:0; color:#bbc2cf; font-size:11px; line-height:1.45; }.gb-summary button{ align-self:flex-start; border:0; border-radius:7px; padding:8px 12px; background:#1ed8c7; color:#071a1a; font-size:11px; font-weight:800; cursor:pointer; }
@media(max-width:850px){
  .gbc-rail{ flex-basis:225px; padding:14px 12px }.gbc-main{ padding:16px 12px }.gbc-main-head h1{ font-size:21px }
  .gbc-builder-head>b{ display:none }.gbc-pane-grid[data-count]{ grid-template-columns:repeat(2,minmax(0,1fr)) }
}
@media(max-width:640px){
  .gbc-rail{ flex-basis:170px; padding:10px 8px }.gbc-brand small,.gbc-ready span,.gbc-search,.gbc-session>span{ display:none }
  .gbc-main{ padding:10px 7px }.gbc-main-head p,.gbc-builder-head p,.gbc-hide{ display:none!important }
  .gbc-pane-grid{ grid-template-columns:1fr; }.gbc-extract{ grid-template-columns:1fr }.gbc-extract>*{ grid-column:1!important }.gbc-quick{ grid-template-columns:1fr 1fr }
}

/* ---- Perslis · Software Preservation ---- */
.modern-dock .d-perslis{ color:#22d3ee; font-weight:700; }
.mac-perslis .mac-win-body{ background:#0a0c10; }
.pl-shell{ flex:1; display:flex; min-height:0; font-size:12px; }
.pl-rail{
  flex:0 0 52px; display:flex; flex-direction:column; align-items:center; gap:14px;
  padding:14px 0; background:#0d0f14; border-right:1px solid rgba(255,255,255,.06); font-size:16px;
}
.pl-rail span{ width:32px; height:32px; display:flex; align-items:center; justify-content:center;
  border-radius:8px; opacity:.7; }
.pl-rail span.on{ background:#16324a; outline:1px solid #22d3ee; opacity:1; }
.pl-rail .gap{ flex:1; opacity:0; }
.pl-main{ flex:1; min-width:0; display:flex; flex-direction:column; gap:10px; padding:12px; overflow:auto; }
.pl-head{
  display:flex; align-items:center; gap:12px; padding:12px 14px;
  background:#11141a; border:1px solid rgba(255,255,255,.07); border-radius:10px;
}
.pl-head-copy{ flex:1; display:flex; flex-direction:column; gap:2px; }
.pl-head-copy b{ font-size:15px; }
.pl-head-copy span{ opacity:.55; }
.pl-chip{ padding:4px 12px; border-radius:14px; background:rgba(255,255,255,.08); font-size:11px; }
.pl-system-workspace{
  border:1px solid rgba(108,125,157,.56); border-radius:12px; padding:12px;
  background:linear-gradient(145deg,#161c28,#10141c 60%,#0b0e13); box-shadow:0 16px 36px rgba(0,0,0,.24);
}
.pl-system-toolbar{ display:flex; align-items:flex-start; gap:10px; margin-bottom:10px; }
.pl-system-toolbar>div:first-child{ flex:1; min-width:0; }
.pl-system-toolbar small{ color:#21dccb; font:700 9px ui-monospace,Menlo,monospace; letter-spacing:.11em; }
.pl-system-toolbar h2{ margin:3px 0 2px; font-size:17px; line-height:1.15; }
.pl-system-toolbar p{ margin:0; color:#9aa4b4; font-size:10px; }
.pl-system-count{ margin-top:5px; color:#8f99aa; font:700 9px ui-monospace,Menlo,monospace; white-space:nowrap; }
.pl-add-wrap{ position:relative; }
.pl-add-windows{
  border:1px solid rgba(55,235,215,.36); border-radius:8px; padding:8px 11px; cursor:pointer;
  background:#123a40; color:#39e5d3; font:800 10px -apple-system,BlinkMacSystemFont,sans-serif; white-space:nowrap;
}
.pl-add-windows:hover:not(:disabled),.pl-add-windows:focus-visible{ background:#18535b; outline:none; }
.pl-add-windows:disabled{ border-color:rgba(255,255,255,.08); background:rgba(255,255,255,.04); color:#687180; cursor:default; }
.pl-add-menu{
  position:absolute; z-index:60; top:38px; right:0; width:155px; display:flex; flex-direction:column; gap:2px;
  padding:5px; border:1px solid #495365; border-radius:10px; background:#242a35; box-shadow:0 18px 38px rgba(0,0,0,.52);
}
.pl-add-menu[hidden]{ display:none; }
.pl-add-menu button{ display:flex; flex-direction:column; gap:1px; border:0; border-radius:6px; padding:7px 9px; background:transparent; color:#eef1f6; text-align:left; cursor:pointer; }
.pl-add-menu button:hover,.pl-add-menu button:focus-visible{ background:#315fb8; outline:none; }
.pl-add-menu b{ font-size:10px; }.pl-add-menu small{ color:inherit; font:8px -apple-system,BlinkMacSystemFont,sans-serif; opacity:.66; letter-spacing:0; }
.pl-system-grid{ position:relative; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.pl-system-grid[data-count="3"]{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.pl-system-grid[data-count="4"]{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.pl-system-grid[data-count="2"]::after{
  content:'↔'; position:absolute; z-index:12; left:50%; top:50%; width:26px; height:26px; display:grid; place-items:center;
  transform:translate(-50%,-50%); border:1px solid rgba(58,229,211,.52); border-radius:50%; background:#142d33; color:#42e1d0;
  box-shadow:0 4px 15px rgba(0,0,0,.55); font-size:12px; pointer-events:none;
}
.pl-system-pane{ min-width:0; overflow:hidden; border:1px solid #353e4d; border-radius:10px; background:#05070a; transition:border-color .14s,box-shadow .14s; }
.pl-system-pane.selected{ border-color:#29decf; box-shadow:0 0 0 2px rgba(41,222,207,.15); }
.pl-system-pane:focus-visible{ outline:2px solid #65ecdf; outline-offset:2px; }
.pl-system-pane-head{ height:42px; display:flex; align-items:center; gap:8px; padding:0 9px; background:#1a1f28; }
.pl-system-badge{ padding:4px 6px; border-radius:5px; color:#ffd082; background:#573c18; font:800 7px ui-monospace,Menlo,monospace; letter-spacing:.08em; }
.pl-system-badge.modern{ color:#77efff; background:#153e54; }
.pl-system-pane-head>div{ flex:1; min-width:0; display:flex; flex-direction:column; }
.pl-system-pane-head b{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:10px; }
.pl-system-pane-head small{ color:#828c9d; font:7px ui-monospace,Menlo,monospace; letter-spacing:.06em; }
.pl-system-pane-head>button{ width:22px; height:22px; border:0; border-radius:6px; background:rgba(255,255,255,.07); color:#aab1be; cursor:pointer; }
.pl-system-pane-head>button[hidden]{ display:none; }
.pl-system-pane-head>button:hover,.pl-system-pane-head>button:focus-visible{ background:#6e2d39; color:#fff; outline:none; }
.pl-system-screen{ position:relative; height:195px; overflow:hidden; background:#020304; }
.pl-system-pane>footer{ height:27px; display:flex; align-items:center; gap:8px; padding:0 9px; background:#171b22; color:#9ba4b3; font-size:8px; }
.pl-system-pane>footer span{ flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pl-system-pane>footer b{ color:#24d9c7; font-size:7px; letter-spacing:.08em; }
.pl-system-note{ display:flex; align-items:center; gap:7px; margin-top:9px; color:#a4adbc; font-size:9px; }
.pl-system-note>span{ color:#32dfce; font-size:13px; }.pl-system-note>b{ color:#dbe0e8; }.pl-system-note>small{ margin-left:auto; color:#737e8f; font-size:8px; }
.pl-lab-label{ display:flex; align-items:baseline; gap:9px; padding:4px 2px 0; }
.pl-lab-label b{ font-size:12px; }.pl-lab-label span{ color:#7e8795; font-size:9px; }
.pl-row{ display:flex; gap:10px; min-height:250px; }
.pl-canvas{
  flex:1; display:flex; flex-direction:column; background:#11141a;
  border:1px solid rgba(255,255,255,.07); border-radius:10px; padding:10px 12px;
}
.pl-canvas-head{ display:flex; align-items:center; gap:8px; margin-bottom:8px; }
.pl-canvas-head b{ flex:1; }
.pl-tag{ padding:2px 10px; border-radius:11px; background:rgba(255,255,255,.08); font-size:10px; }
.pl-drop{
  flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px;
  background:#0a0c10; border-radius:8px; text-align:center;
}
.pl-drop b{ font-size:16px; }
.pl-drop > span{ opacity:.5; font-size:11px; }
.pl-logo{ display:grid; grid-template-columns:22px 22px; gap:3px; padding:12px;
  background:#101822; border-radius:12px; box-shadow:0 0 18px rgba(34,211,238,.25); margin-bottom:6px; }
.pl-logo i{ height:22px; border-radius:2px; }
.pl-logo i:nth-child(1){ background:#2f7cdb; } .pl-logo i:nth-child(2){ background:#22d3ee; }
.pl-logo i:nth-child(3){ background:#1b9ab4; } .pl-logo i:nth-child(4){ background:#2ee4a5; }
.pl-media{ display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; justify-content:center; }
.pl-m{
  display:flex; flex-direction:column; gap:2px; align-items:flex-start;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); color:#e8e8ec;
  border-radius:8px; padding:7px 12px; cursor:pointer; font-size:12px;
}
.pl-m:hover{ border-color:#22d3ee; }
.pl-m em{ font-style:normal; font-size:10px; opacity:.55; }
.pl-screen{ flex:1; background:#04140b; border-radius:8px; padding:10px 12px; overflow:auto; }
.pl-screen pre{ margin:0; font:12px ui-monospace,Menlo,monospace; color:#2ee465; line-height:1.7; white-space:pre-wrap; }
.pl-side{
  flex:0 0 220px; display:flex; flex-direction:column; gap:8px;
  background:#11141a; border:1px solid rgba(255,255,255,.07); border-radius:10px; padding:12px;
}
.pl-op{ display:flex; gap:10px; align-items:center; }
.pl-op .ic{ width:34px; height:34px; display:flex; align-items:center; justify-content:center;
  background:#16324a; border-radius:8px; }
.pl-op b{ display:block; }
.pl-op span{ font-size:10px; opacity:.55; }
.pl-side em{ font-style:normal; font-size:9px; letter-spacing:1px; opacity:.45; margin-top:6px; }
.pl-kv{ display:flex; flex-direction:column; gap:1px; }
.pl-kv span{ font-size:9px; opacity:.45; }
.pl-kv b{ font-weight:500; font-size:12px; }
.pl-spacer{ flex:1; }
.pl-launch, .pl-ask{
  border:0; border-radius:8px; padding:9px 0; font-size:13px; cursor:pointer; color:#e8e8ec;
  background:rgba(255,255,255,.08);
}
.pl-launch:not([disabled]){ background:#1d4ed8; }
.pl-launch[disabled]{ opacity:.4; cursor:default; }
.pl-term{
  background:#0d0f14; border:1px solid rgba(255,255,255,.07); border-radius:10px;
  display:flex; flex-direction:column; min-height:110px;
}
.pl-term-head{ display:flex; padding:7px 12px; border-bottom:1px solid rgba(255,255,255,.06);
  font:600 11px ui-monospace,Menlo,monospace; }
.pl-term-head b{ flex:1; }
.pl-trash{ cursor:pointer; opacity:.6; }
.pl-term pre{
  flex:1; margin:0; padding:8px 12px; overflow:auto; max-height:130px;
  font:12px ui-monospace,Menlo,monospace; color:#2ee465; line-height:1.7; white-space:pre-wrap;
}
.pl-term .c{ color:#22d3ee; }
.pl-term .pl-l.ok{ color:#2ee4a5; font-weight:700; }
.pl-term .pl-l.dim{ opacity:.55; }
.pl-term .cursor{ animation:cblCursor 1s steps(1) infinite; }
@keyframes cblCursor{ 50%{ opacity:0; } }
.pl-qa{ background:#11141a; border:1px solid rgba(255,255,255,.07); border-radius:10px; padding:10px 12px;
  display:flex; flex-wrap:wrap; gap:8px; }
.pl-qa .list-a{ flex-basis:100%; }
@media(max-width:800px){
  .pl-system-grid[data-count="3"]{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .pl-system-note small{ display:none; }
}
@media(max-width:640px){
  .pl-system-toolbar{ flex-wrap:wrap; }.pl-system-toolbar>div:first-child{ flex-basis:100%; }
  .pl-system-grid[data-count]{ grid-template-columns:1fr; }.pl-system-grid[data-count="2"]::after{ display:none; }
  .pl-row{ flex-direction:column; }.pl-side{ flex-basis:auto; }.pl-spacer{ min-height:8px; }
}

/* GhostBridge left: clean composed macOS pane (symmetric with Win11 side) */
.gb-macpane{
  position:absolute; inset:0;
  background:linear-gradient(180deg,#0b1026 0%, #141a38 45%, #2a2440 80%, #4a3550 100%);
}
.gbm-bar{
  position:absolute; top:0; left:0; right:0; height:26px; display:flex; align-items:center;
  gap:12px; padding:0 14px; font-size:12px; color:#fff;
  background:rgba(20,20,26,.6); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
}
.gbm-bar .sp{ flex:1; }
.gbm-window{
  position:absolute; left:9%; right:9%; top:13%; height:60%;
  display:flex; flex-direction:column; border-radius:12px; overflow:hidden;
  background:rgba(28,28,32,.94); border:1px solid rgba(255,255,255,.16);
  box-shadow:0 20px 50px rgba(0,0,0,.5); color:#e8e8ec;
}
.gbm-chrome{
  flex:0 0 32px; display:flex; align-items:center; gap:7px; padding:0 12px;
  background:rgba(255,255,255,.06); border-bottom:1px solid rgba(255,255,255,.08); font-size:12px;
}
.gbm-chrome i{ width:11px; height:11px; border-radius:50%; }
.gbm-chrome .r{ background:#ff5f57; } .gbm-chrome .y{ background:#febc2e; }
.gbm-chrome .g{ background:#28c840; }
.gbm-chrome span{ margin-left:6px; opacity:.85; }
.gbm-body{ flex:1; min-height:0; display:flex; flex-direction:column; padding:10px 14px; }
.gbm-body table{ width:100%; border-collapse:collapse; font-size:12px; }
.gbm-body th{ text-align:left; font-size:10px; letter-spacing:.6px; color:#9ca3af;
  border-bottom:1px solid rgba(255,255,255,.1); padding:4px 8px; }
.gbm-body td{ padding:5px 8px; border-bottom:1px solid rgba(255,255,255,.05); }
.gbm-body td.num{ text-align:right; font-variant-numeric:tabular-nums; }
.gbm-foot{ margin-top:auto; padding-top:8px; font-size:12px; color:#34d399; font-weight:600; }
.gbm-dock{
  position:absolute; left:50%; bottom:10px; transform:translateX(-50%);
  display:flex; gap:14px; align-items:center; padding:7px 16px; border-radius:12px;
  background:rgba(255,255,255,.12); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
  border:1px solid rgba(255,255,255,.18); font-size:17px;
}

/* bridge interactivity */
.gbm-chrome, .w11-bar{ cursor:default; user-select:none; }
.gbm-window.min, .w11-window.min{ display:none; }
.w11-window.max{ left:1.5% !important; right:1.5% !important; top:4% !important; height:88% !important; transform:none !important; }
.gbm-dock.has-min::after, .w11-taskbar.has-min::after{
  content:''; position:absolute; bottom:2px; left:50%; transform:translateX(-50%);
  width:4px; height:4px; border-radius:50%; background:#fff; opacity:.9;
}
.gbm-dock, .w11-taskbar{ cursor:pointer; }
.gbm-dock span, .w11-taskbar span{ transition:font-size .12s ease-out; line-height:1; }
.gbm-dock{ align-items:flex-end; } .w11-taskbar{ align-items:flex-end; }
tr[data-rid]{ cursor:default; }
.gbm-body tr.sel td{ background:rgba(59,130,246,.28); }
.w11-body tr.sel td{ background:#cfe3ff; }
