/* ═══════════════════════════════════════════════════════════════════
   THE ENVIRONMENT (r5 prototype, local) — Study → Cover → Desk →
   windows → the Canvas → night → the next morning.
   Deep-sea palette per the settled system.
   ═══════════════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;0,6..72,600;1,6..72,500&family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,600;1,8..60,400&display=swap');
:root{
  --sea0:#0d1d30;--sea1:#152a42;--sea2:#1d3554;
  --card:#d8ecf8;--card-deep:#c2dff2;
  --ink:#1a1714;--ink-soft:#4a4540;--stone:#54748c;--hairline:#a8cfe9;
  --sand:#dbe4ee;--sand-dim:rgba(199,213,228,.62);--seam:rgba(142,162,182,.18);
  --jeong:#ee7a2d;--jeong-deep:#c2551f;--jeong-wash:rgba(238,122,45,.12);
  --blue:#3d8de0;--teal:#14b78a;--teal-deep:#0e9d76;--amber:#eab30b;--han:#25415a;--han-wash:#eef7fd;
  --display:'Newsreader',serif;--serif:'Source Serif 4',Georgia,serif;--mono:'IBM Plex Mono',monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%;overflow:hidden;background:linear-gradient(180deg,var(--sea0),var(--sea1) 55%,var(--sea2));color:var(--sand);font-family:var(--serif)}
button{font-family:inherit}
.view{position:fixed;inset:0;opacity:0;pointer-events:none;transition:opacity .55s ease}
.view.on{opacity:1;pointer-events:auto}

/* ═══ shared bits ═══ */
.mark{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:10px;font-weight:500;letter-spacing:.18em;color:#e8edf3;white-space:nowrap}
.mark svg{width:14px;height:17px;stroke:#e8edf3;stroke-width:1.4;fill:none}
.toast{position:fixed;left:50%;bottom:120px;transform:translateX(-50%) translateY(20px);background:var(--jeong);color:#fff;font-family:var(--mono);font-size:10px;letter-spacing:.06em;line-height:1.6;border-radius:16px;padding:9px 18px;opacity:0;transition:all .5s ease;z-index:200;pointer-events:none;max-width:min(74vw,560px);text-align:center}
.toast.on{opacity:1;transform:translateX(-50%)}

/* ═══ THE STUDY ═══ */
#vStudy .head{display:flex;align-items:center;gap:18px;height:58px;border-bottom:1px solid var(--seam);padding:0 34px}
#vStudy .head .mark{margin-right:auto}
#vStudy .who{font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--sand-dim)}
#vStudy .date{font-family:var(--mono);font-size:10px;letter-spacing:.14em;color:#e8edf3}
.stfield{position:absolute;left:34px;right:34px;top:58px;bottom:0}
.stfield > svg{position:absolute;inset:0;width:100%;height:100%}
.cover{position:absolute;border-radius:14px;overflow:hidden;box-shadow:0 24px 70px rgba(0,0,0,.5);cursor:pointer;transition:transform .25s ease}
.cover:hover{transform:translateY(-6px)}
.cover .cin{position:absolute;inset:0;padding:18px 20px;display:flex;flex-direction:column}
.cover .cmeta{font-family:var(--mono);font-size:8px;letter-spacing:.14em;color:rgba(248,244,236,.7)}
.cover .cname{font-family:var(--display);font-size:27px;font-weight:500;color:#faf6ee;line-height:1.1;margin-top:6px;text-shadow:0 2px 20px rgba(0,0,0,.5)}
.cover .cq{margin-top:auto;font-family:var(--serif);font-style:italic;font-size:14.5px;line-height:1.4;color:rgba(248,244,236,.92);text-shadow:0 2px 16px rgba(0,0,0,.6)}
.cover .cq .qk{font-family:var(--mono);font-style:normal;font-size:7px;letter-spacing:.12em;color:rgba(248,244,236,.55);display:block;margin-bottom:5px}
.cover .badge{position:absolute;top:14px;right:14px;font-family:var(--mono);font-size:8.5px;font-weight:500;letter-spacing:.08em;color:#fff;background:var(--jeong);border-radius:999px;padding:4px 10px;box-shadow:0 6px 20px rgba(238,122,45,.4);z-index:2}
.cover .vign{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,12,20,.18),transparent 34%,transparent 55%,rgba(6,12,20,.55));pointer-events:none}
.c-film{left:60%;top:16%;width:400px;height:255px;background:radial-gradient(500px 300px at 75% 30%,rgba(238,122,45,.2),transparent 60%),linear-gradient(115deg,#0e1a28,#1a2a3a 36%,#5b3a20 66%,#241610)}
.c-essay{left:31%;top:6%;width:330px;height:210px;background:linear-gradient(160deg,#152a42,#0f2036)}
.c-essay .sent{font-family:var(--serif);font-style:italic;font-size:19px;line-height:1.45;color:rgba(248,244,236,.9);margin-top:14px;max-width:250px}
.c-pod{left:3%;top:44%;width:330px;height:210px;background:linear-gradient(150deg,#0d1d30,#16324e)}
.c-pod svg.wave{position:absolute;left:0;right:0;top:52%;width:100%;height:56px;opacity:.8}
.c-pod svg.wave polyline{fill:none;stroke:#8fc0f0;stroke-width:1.6}
.cover .knock{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:rgba(6,12,20,.78);padding:20px;text-align:center;font-family:var(--mono);font-size:8px;letter-spacing:.08em;line-height:1.8;color:var(--sand)}
.cover.knocked .knock{display:flex}
.thlabel{position:absolute;font-family:var(--mono);font-size:8px;letter-spacing:.09em;color:var(--sand-dim);background:var(--sea1);padding:2px 7px;border-radius:3px}
.thlabel.wait{color:var(--amber)}
.axcap{position:absolute;bottom:8%;font-family:var(--mono);font-size:8.5px;letter-spacing:.16em;color:var(--sand-dim)}
.stlaw{position:absolute;left:0;right:0;bottom:3%;text-align:center;font-family:var(--mono);font-size:8.5px;letter-spacing:.12em;color:var(--sand-dim)}

/* ═══ THE COVER ═══ */
#vCover{background:radial-gradient(1200px 700px at 72% 30%,rgba(238,122,45,.14),transparent 60%),linear-gradient(115deg,#0e1a28 0%,#1a2a3a 34%,#5b3a20 62%,#6b4226 74%,#241610 100%)}
#vCover.friday{background:radial-gradient(1100px 650px at 30% 60%,rgba(61,141,224,.16),transparent 60%),linear-gradient(245deg,#0e1a28 0%,#16283c 40%,#2c3e50 70%,#101b26 100%)}
#vCover::after{content:"";position:absolute;inset:0;background:radial-gradient(140% 90% at 50% 40%,transparent 55%,rgba(6,12,20,.55) 100%);pointer-events:none}
#vCover .grain{position:absolute;inset:0;opacity:.05;pointer-events:none;background-image:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(255,255,255,.5) 2px,rgba(255,255,255,.5) 3px)}
#vCover .top{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;padding:18px 26px;z-index:5}
#vCover .top .l{font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;color:rgba(248,244,236,.66);cursor:pointer;background:none;border:0}
#vCover .top .l:hover{color:#fff}
#vCover .top .r{margin-left:auto;font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;color:rgba(248,244,236,.66)}
#vCover .body{position:absolute;left:7%;right:7%;bottom:15%;z-index:5;max-width:880px}
#vCover .ground{font-family:var(--serif);font-size:17px;line-height:1.5;color:rgba(248,244,236,.82);text-shadow:0 2px 24px rgba(0,0,0,.5)}
#vCover h1{font-family:var(--display);font-size:56px;font-weight:500;line-height:1.08;color:#faf6ee;margin:14px 0 10px;letter-spacing:-.005em;text-shadow:0 4px 40px rgba(0,0,0,.55)}
#vCover .cred{font-family:var(--mono);font-size:8.5px;letter-spacing:.14em;color:rgba(248,244,236,.55)}
#vCover .row{display:flex;align-items:center;gap:18px;margin-top:26px}
#vCover .take{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:#fff;background:var(--jeong);border:0;border-radius:999px;padding:13px 26px;cursor:pointer;box-shadow:0 10px 34px rgba(238,122,45,.35)}
#vCover .take:hover{background:var(--jeong-deep)}
#vCover .not{font-family:var(--mono);font-size:9px;letter-spacing:.08em;color:rgba(248,244,236,.6);background:none;border:0;cursor:pointer;text-decoration:underline dotted;text-underline-offset:3px}
#vCover .not.faded{opacity:.5;text-decoration:none;cursor:default}
#vCover .under{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;gap:14px;padding:15px 24px;z-index:5;background:linear-gradient(180deg,transparent,rgba(6,12,20,.6));font-family:var(--mono);font-size:9px;letter-spacing:.12em;color:rgba(248,244,236,.55)}
#vCover .under b{font-weight:500;color:rgba(248,244,236,.8)}
#vCover .door{cursor:pointer;border:1px solid rgba(248,244,236,.25);border-radius:999px;padding:6px 14px;color:rgba(248,244,236,.75);background:none;font-family:var(--mono);font-size:9px;letter-spacing:.12em}
#vCover .door:hover{border-color:rgba(248,244,236,.6);color:#fff}

/* ═══ THE DESK ═══ */
#vDesk .wall{position:absolute;inset:0;background:radial-gradient(1200px 700px at 72% 30%,rgba(238,122,45,.1),transparent 60%),linear-gradient(115deg,#0e1a28 0%,#16222f 34%,#42301e 62%,#4a2f1e 74%,#1a120c 100%)}
#vDesk.friday .wall{background:radial-gradient(1100px 650px at 30% 60%,rgba(61,141,224,.12),transparent 60%),linear-gradient(245deg,#0e1a28 0%,#141f2c 40%,#22303c 70%,#0e1720 100%)}
#vDesk .wall::after{content:"";position:absolute;inset:0;background:rgba(8,15,24,.45)}
#vDesk .top{position:absolute;top:0;left:0;right:0;height:44px;display:flex;align-items:center;gap:16px;padding:0 20px;background:rgba(10,20,32,.72);backdrop-filter:blur(6px);border-bottom:1px solid var(--seam);z-index:90}
#vDesk .top .w{font-family:var(--mono);font-size:9px;letter-spacing:.14em;color:rgba(248,244,236,.8);white-space:nowrap}
#vDesk .dq{display:flex;align-items:baseline;gap:8px;min-width:0}
#vDesk .dq b{font-family:var(--mono);font-size:7.5px;letter-spacing:.1em;color:var(--sand-dim);white-space:nowrap}
#vDesk .dq span{font-family:var(--display);font-size:14px;color:#faf6ee;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#vDesk .top .r{margin-left:auto;display:flex;gap:12px;font-family:var(--mono);font-size:8.5px;letter-spacing:.1em;color:var(--sand-dim);white-space:nowrap}
#vDesk .top .r button{background:none;border:0;color:inherit;font:inherit;letter-spacing:inherit;cursor:pointer}
#vDesk .top .r button:hover{color:#fff}

/* windows */
#winlayer{position:absolute;inset:44px 0 0 0;z-index:20}
.win{position:absolute;background:var(--card);border-radius:13px;box-shadow:0 30px 90px rgba(0,0,0,.55);color:var(--ink);display:flex;flex-direction:column;min-width:280px;opacity:0;transform:scale(.86) translateY(30px);transition:opacity .32s ease,transform .32s cubic-bezier(.2,.8,.25,1)}
.win.on{opacity:1;transform:none}
.win.front{box-shadow:0 36px 110px rgba(0,0,0,.62)}
.win .tbar{display:flex;align-items:center;gap:9px;padding:10px 14px;border-bottom:1px dashed var(--hairline);cursor:grab;user-select:none}
.win .tbar:active{cursor:grabbing}
.win .tbar h3{font-family:var(--display);font-size:15.5px;font-weight:500;line-height:1.2}
.win .tag{font-family:var(--mono);font-size:7px;font-weight:500;letter-spacing:.08em;color:#fff;background:var(--teal);border-radius:999px;padding:2px 7px;white-space:nowrap}
.win .tag.ask{background:var(--jeong)}
.win .tag.app{background:var(--han);}
.win .x{margin-left:auto;font-family:var(--mono);font-size:11px;color:var(--stone);cursor:pointer;padding:2px 7px;background:none;border:0}
.win .x:hover{color:var(--jeong-deep)}
.win .bd{padding:12px 14px;overflow:auto;max-height:calc(100vh - 220px)}
.frames{display:flex;gap:5px}
.frames span{flex:1;height:64px;border-radius:6px;position:relative;background:linear-gradient(135deg,#2c3e50,#4a6741)}
.frames span.g2{background:linear-gradient(135deg,#1a2a3a,#6b4226)}
.frames span.g3{background:linear-gradient(135deg,#3a2a3a,#26526b)}
.frames span i{position:absolute;left:6px;bottom:4px;font-style:normal;font-family:var(--mono);font-size:6.5px;letter-spacing:.05em;color:rgba(255,255,255,.88)}
.strand{margin-top:9px}
.strand .sn{display:flex;justify-content:space-between;font-family:var(--mono);font-size:7.5px;letter-spacing:.05em;color:var(--ink-soft)}
.strand .sn em{font-style:italic;color:var(--blue)}
.strand .sn em.ok{color:var(--teal-deep);font-style:normal}
.strand .bar{height:3px;border-radius:2px;background:#b0d5ec;margin-top:2px;overflow:hidden;position:relative}
.strand .bar i{position:absolute;left:0;top:0;bottom:0;background:var(--blue);border-radius:2px;transition:width 1.2s ease}
.wnote{margin-top:11px;background:var(--han-wash);border-left:2px solid var(--blue);border-radius:0 7px 7px 0;padding:7px 10px;font-style:italic;font-family:var(--serif);font-size:11.5px;line-height:1.45;color:var(--ink)}
.wnote b{font-family:var(--mono);font-size:6.5px;letter-spacing:.08em;color:var(--blue);display:block;font-style:normal;margin-bottom:2px}
.wbtns{display:flex;gap:6px;margin-top:11px;flex-wrap:wrap}
.wbtns button{font-family:var(--mono);font-size:8.5px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;border-radius:999px;padding:6px 12px;border:0;cursor:pointer;color:#fff;background:var(--jeong)}
.wbtns button:hover{background:var(--jeong-deep)}
.wbtns button.g{background:none;border:1px solid #8fc2e2;color:var(--ink-soft)}
.resolved{font-family:var(--mono);font-size:8.5px;color:var(--teal-deep);margin-top:10px;letter-spacing:.04em}
.typingline{font-family:var(--serif);font-style:italic;font-size:12px;color:var(--ink);border-left:2px solid var(--jeong);padding-left:9px;line-height:1.5}
.caret{display:inline-block;width:5px;height:11px;background:var(--jeong-deep);vertical-align:-1px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.readline{font-family:var(--mono);font-size:7px;letter-spacing:.07em;color:#2f6fb4;margin-top:8px;line-height:1.7}
.wfoot{margin-top:10px;border-top:1px dashed var(--hairline);padding-top:8px;font-family:var(--mono);font-size:7.5px;letter-spacing:.07em;color:var(--stone)}
.figbig{font-family:var(--display);font-size:34px;font-weight:500;line-height:1;color:var(--ink)}
.figbig i{font-style:normal;font-family:var(--mono);font-size:7.5px;letter-spacing:.08em;color:var(--stone);margin-left:8px}
.rail{font-family:var(--mono);font-size:7.5px;letter-spacing:.08em;color:var(--teal-deep);margin-top:10px;line-height:1.9}
.rail em{font-style:normal;color:var(--jeong-deep)}
.aprow{display:flex;align-items:baseline;gap:10px;padding:6px 0;border-bottom:1px dashed var(--hairline);font-family:var(--mono);font-size:8.5px;letter-spacing:.04em}
.aprow .l{color:var(--stone)}.aprow .v{color:var(--ink);margin-left:auto}.aprow .s{min-width:80px;text-align:right}
.aprow .s.ok{color:var(--teal-deep)}.aprow .s.flag{color:#9c7607}
.filelist{list-style:none}
.filelist li{display:flex;gap:10px;align-items:baseline;padding:7px 0;border-bottom:1px dashed var(--hairline);font-size:12.5px}
.filelist li b{font-family:var(--mono);font-size:7px;letter-spacing:.06em;color:var(--stone);margin-left:auto;white-space:nowrap;font-weight:500}
.writearea{width:100%;min-height:180px;border:1px solid var(--hairline);border-radius:8px;background:#fff;padding:10px;font-family:var(--serif);font-size:13px;line-height:1.6;color:var(--ink);resize:vertical}
.sheet-grid{border:1px solid var(--hairline);border-radius:8px;overflow:hidden;font-family:var(--mono);font-size:8.5px}
.sheet-grid .sr{display:grid;grid-template-columns:90px 1fr 1fr 1fr;border-bottom:1px dashed var(--hairline)}
.sheet-grid .sr:last-child{border-bottom:0}
.sheet-grid .sr span{padding:6px 8px;border-right:1px dashed var(--hairline);color:var(--ink-soft)}
.sheet-grid .sr span:last-child{border-right:0}
.sheet-grid .sr.h span{background:var(--han-wash);color:var(--han);font-weight:500}
.spaceview{position:relative;height:230px;border:1px solid var(--hairline);border-radius:9px;background:var(--han-wash)}
.spaceview svg{position:absolute;inset:0;width:100%;height:100%}
.spacenode{position:absolute;font-family:var(--mono);font-size:7.5px;letter-spacing:.06em;background:#fff;border:1px solid var(--hairline);border-radius:7px;padding:5px 9px;color:var(--ink)}

/* the dock */
#dock{position:absolute;left:50%;transform:translateX(-50%);bottom:34px;display:flex;align-items:flex-end;gap:14px;padding:12px 16px;background:rgba(10,20,32,.72);backdrop-filter:blur(10px);border:1px solid var(--seam);border-radius:18px;z-index:80}
.dgroup{display:flex;flex-direction:column;gap:6px}
.dgroup .glabel{font-family:var(--mono);font-size:6.5px;font-weight:500;letter-spacing:.14em;color:var(--sand-dim);text-align:center}
.dgroup.needs .glabel{color:var(--jeong)}
.drow{display:flex;gap:8px}
.dsep{width:1px;background:var(--seam);align-self:stretch;margin:0 2px}
.mini{width:96px;height:64px;border-radius:9px;background:var(--card);box-shadow:0 8px 22px rgba(0,0,0,.35);position:relative;padding:7px 8px;color:var(--ink);cursor:pointer;transition:transform .18s ease}
.mini:hover{transform:translateY(-4px)}
.mini.orange{box-shadow:0 0 0 2px var(--jeong),0 8px 24px rgba(238,122,45,.35)}
.mini.done{box-shadow:0 8px 22px rgba(0,0,0,.35)}
.mini .ml{font-family:var(--mono);font-size:6px;letter-spacing:.06em;color:var(--stone);position:absolute;left:8px;bottom:5px;right:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini .mframes{display:flex;gap:3px}
.mini .mframes span{flex:1;height:26px;border-radius:4px;background:linear-gradient(135deg,#2c3e50,#4a6741)}
.mini .mframes span.g2{background:linear-gradient(135deg,#1a2a3a,#6b4226)}
.mini .mfig{font-family:var(--display);font-size:17px;font-weight:500;line-height:1.1}
.mini .msub{font-family:var(--mono);font-size:6px;letter-spacing:.05em;color:var(--stone)}
.mini .mtype{font-family:var(--serif);font-style:italic;font-size:9.5px;line-height:1.3;color:var(--ink-soft)}
.mini .active{position:absolute;left:50%;transform:translateX(-50%);bottom:-9px;width:5px;height:5px;border-radius:50%;background:#fff;opacity:.9;display:none}
.mini.open .active{display:block}
.mini .mbadge{position:absolute;top:-6px;right:-6px;min-width:16px;height:16px;border-radius:999px;background:var(--jeong);color:#fff;font-family:var(--mono);font-size:8px;font-weight:500;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(238,122,45,.5)}
.mini .mcheck{position:absolute;top:-6px;right:-6px;width:16px;height:16px;border-radius:999px;background:var(--teal);color:#fff;font-size:9px;display:none;align-items:center;justify-content:center}
.mini.done .mcheck{display:flex}
.mini.done .mbadge{display:none}
.appt{width:64px;height:64px;border-radius:12px;background:rgba(216,236,248,.1);border:1px solid var(--seam);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer;position:relative;transition:transform .18s ease;color:var(--sand)}
.appt:hover{transform:translateY(-4px);border-color:rgba(216,236,248,.4)}
.appt svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.4;opacity:.85}
.appt .al{font-family:var(--mono);font-size:6px;letter-spacing:.1em;color:var(--sand-dim)}
.appt.built{background:var(--card);border:0;box-shadow:0 8px 22px rgba(0,0,0,.35);color:var(--ink)}
.appt.built .an{font-family:var(--display);font-size:17px;font-weight:500;line-height:1}
.appt.built .al{color:var(--stone)}
.appt.built .lcdot{position:absolute;top:6px;right:6px;width:6px;height:6px;border-radius:50%;background:var(--jeong);animation:lp 1.4s ease-in-out infinite}
@keyframes lp{0%,100%{opacity:.3}50%{opacity:1}}
.appt .active{position:absolute;left:50%;transform:translateX(-50%);bottom:-9px;width:5px;height:5px;border-radius:50%;background:#fff;opacity:.9;display:none}
.appt.open .active{display:block}
#desklaw{position:absolute;left:0;right:0;bottom:9px;text-align:center;font-family:var(--mono);font-size:7.5px;letter-spacing:.12em;color:rgba(248,244,236,.45);z-index:75}

/* ═══ THE CANVAS (as a maximized window/app view) ═══ */
.win.canvaswin{left:2.5%!important;top:3%!important;width:95%;height:92%}
.win.canvaswin .bd{max-height:none;flex:1;position:relative;padding:0;background-image:radial-gradient(rgba(84,116,140,.18) 1px,transparent 1px);background-size:26px 26px;border-radius:0 0 13px 13px;overflow:hidden}
.cvpres{margin-left:auto;display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:7px;letter-spacing:.09em;color:var(--teal-deep)}
.cvpres .d{width:6px;height:6px;border-radius:50%;background:var(--teal);animation:lp 1.4s ease-in-out infinite}
.cvtools{position:absolute;left:10px;top:10px;display:flex;flex-direction:column;gap:6px;z-index:30}
.cvtool{width:34px;height:34px;border-radius:9px;border:1px solid var(--hairline);background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--stone)}
.cvtool svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.5}
.cvtool.on{border-color:var(--jeong);color:var(--jeong-deep);box-shadow:0 0 0 1px var(--jeong)}
#penlayer{position:absolute;inset:0;z-index:25}
#penlayer.armed{cursor:crosshair}
#penlayer path{fill:none;stroke:rgba(37,65,90,.85);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.cvit{position:absolute;border-radius:10px;box-shadow:0 14px 40px rgba(0,0,0,.25);cursor:grab;z-index:10}
.cvit:active{cursor:grabbing}
.cvprov{position:absolute;top:-8px;left:10px;font-family:var(--mono);font-size:6.5px;font-weight:500;letter-spacing:.08em;border-radius:4px;padding:2px 6px;z-index:2}
.cvprov.yours{background:var(--card-deep);color:#3c617d}
.cvprov.made{background:var(--jeong);color:#fff}
.cvcap{font-family:var(--mono);font-size:6.5px;letter-spacing:.07em;color:var(--stone);margin-top:6px;line-height:1.6}
.cv-ph .img{width:250px;height:155px;border-radius:10px;background:linear-gradient(140deg,#3a3226,#241d14);position:relative;overflow:hidden}
.cv-ph .img i{position:absolute;background:rgba(248,244,236,.85);border-radius:2px;width:58px;height:36px;box-shadow:0 2px 8px rgba(0,0,0,.4)}
.cv-shot .img{width:230px;height:140px;border-radius:10px;background:linear-gradient(160deg,#16324e,#0d1d30);padding:11px}
.cv-shot .img .rw{height:24px;border-radius:6px;background:rgba(216,236,248,.16);margin-bottom:6px}
.cv-shot .img .rw.h{width:55%;height:11px;background:rgba(216,236,248,.3)}
.cv-csv{background:#fff;border:1px solid var(--hairline);border-radius:10px;padding:10px 12px;color:var(--ink);width:220px}
.cv-csv b{font-family:var(--mono);font-size:9px;letter-spacing:.04em}
.cv-csv i{display:block;font-style:normal;font-family:var(--mono);font-size:7px;color:var(--stone);margin-top:3px}
.cvhand{position:absolute;font-family:var(--serif);font-style:italic;color:rgba(37,65,90,.9);z-index:12;pointer-events:none}
.cv-uq{background:#fff;border-left:3px solid var(--blue);border-radius:10px;padding:11px 13px;color:var(--ink);width:270px}
.cv-uq b{font-family:var(--mono);font-size:6.5px;letter-spacing:.09em;color:var(--blue);display:block;margin-bottom:4px}
.cv-uq p{font-family:var(--serif);font-size:12.5px;line-height:1.45}
.cv-uq .row{display:flex;gap:6px;margin-top:9px;flex-wrap:wrap}
.cv-uq .row button{font-family:var(--mono);font-size:7.5px;font-weight:500;letter-spacing:.06em;border-radius:999px;border:0;padding:5px 11px;cursor:pointer;color:#fff;background:var(--jeong)}
.cv-uq .row button.g{background:none;border:1px solid var(--hairline);color:var(--ink-soft)}
.cv-wf{background:rgba(37,65,90,.05);border:1.5px dashed rgba(37,65,90,.45);border-radius:12px;padding:13px;width:230px}
.cv-wf .frame{border:1px solid rgba(37,65,90,.5);border-radius:8px;height:140px;position:relative}
.cv-wf .fcard{position:absolute;left:13px;right:13px;top:11px;height:68px;border:1px solid rgba(37,65,90,.55);border-radius:8px}
.cv-wf .fcard::after{content:"SC 14";position:absolute;left:8px;top:6px;font-family:var(--mono);font-size:7px;color:rgba(37,65,90,.7)}
.cv-wf .prow{position:absolute;left:13px;right:13px;bottom:11px;display:flex;gap:5px}
.cv-wf .prow i{flex:1;height:15px;border:1px solid rgba(37,65,90,.45);border-radius:999px}
.cv-wf .note{font-family:var(--mono);font-size:6.5px;letter-spacing:.07em;color:var(--stone);margin-top:8px;line-height:1.6}
.cv-fm{background:#fff;border-radius:13px;color:var(--ink);box-shadow:0 26px 70px rgba(0,0,0,.3);width:330px}
.cv-fm .tb{display:flex;align-items:center;gap:8px;padding:10px 13px;border-bottom:1px dashed var(--hairline)}
.cv-fm .tb h3{font-family:var(--display);font-size:15px;font-weight:500}
.cv-fm .tb .tag{font-family:var(--mono);font-size:6.5px;font-weight:500;letter-spacing:.08em;color:#fff;background:var(--teal);border-radius:999px;padding:2px 7px}
.cv-fm .fb{padding:11px 13px}
.cv-fm .prev{border:1px solid var(--hairline);border-radius:9px;background:var(--han-wash);padding:22px 10px 10px;position:relative}
.cv-fm .plive{position:absolute;top:6px;right:8px;font-family:var(--mono);font-size:6px;letter-spacing:.08em;color:var(--jeong-deep)}
.cv-fm .pcard{border:1px solid var(--hairline);background:#fff;border-radius:7px;height:60px;position:relative;box-shadow:0 3px 10px rgba(26,23,20,.08)}
.cv-fm .pcard::after{content:attr(data-prev);position:absolute;left:8px;top:7px;font-family:var(--mono);font-size:7px;color:var(--stone)}
.cv-fm .ptags{display:flex;gap:4px;margin-top:8px}
.cv-fm .ptags i{font-style:normal;font-family:var(--mono);font-size:6.5px;letter-spacing:.05em;color:#3c617d;background:var(--card-deep);border-radius:999px;padding:2px 7px}
.cv-fm .foot{font-family:var(--mono);font-size:6.5px;letter-spacing:.06em;color:var(--stone);margin-top:8px;line-height:1.7}
.cvlaw{position:absolute;left:0;right:0;bottom:0;padding:9px 0;text-align:center;font-family:var(--mono);font-size:7px;letter-spacing:.11em;color:var(--stone);background:linear-gradient(180deg,transparent,rgba(238,247,253,.9));z-index:28;pointer-events:none}
.cvthreads{position:absolute;inset:0;width:100%;height:100%;z-index:5;pointer-events:none}

/* ═══ NIGHT ═══ */
#vNight{background:rgba(6,12,20,.92);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;text-align:center;z-index:150}
#vNight .m{font-family:var(--display);font-size:28px;font-weight:500;color:#faf6ee}
#vNight .s{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;color:#c7d5e4}

/* ═══ UMMA — the central application ═══ */
.wtalk{margin-top:10px;border-top:1px dashed var(--hairline);padding-top:8px;font-family:var(--mono);font-size:7.5px;letter-spacing:.08em;color:var(--stone);cursor:pointer}
.wtalk:hover{color:var(--jeong-deep)}
.um-held{background:var(--jeong-wash);border:1px solid rgba(238,122,45,.35);border-radius:9px;padding:8px 11px;font-family:var(--mono);font-size:7.5px;letter-spacing:.06em;color:var(--jeong-deep);line-height:1.8;margin-bottom:10px}
.um-held b{font-weight:500;display:block;letter-spacing:.1em}
.um-held .chip{display:inline-block;background:#fff;border:1px solid var(--hairline);border-radius:999px;padding:2px 8px;margin:2px 4px 0 0;cursor:pointer;color:#3c617d}
.um-held .chip:hover{border-color:var(--jeong)}
.um-stream{display:flex;flex-direction:column;gap:9px;max-height:300px;overflow:auto;padding-right:4px}
.um-day{font-family:var(--mono);font-size:6.5px;letter-spacing:.16em;color:var(--stone);text-align:center;margin-top:2px}
.umsg{max-width:94%}
.umsg .an{display:inline-block;font-family:var(--mono);font-size:6px;font-weight:500;letter-spacing:.07em;color:#3c617d;background:var(--card-deep);border-radius:999px;padding:2px 7px;margin-bottom:3px;cursor:pointer}
.umsg .an:hover{background:#fff}
.umsg.you{align-self:flex-end;text-align:right}
.umsg.you .tx{display:inline-block;background:#c6e2f3;border:1px solid var(--hairline);border-radius:9px;padding:6px 10px;font-size:12px;line-height:1.45;color:var(--ink);text-align:left}
.umsg.her .tx{border-left:2px solid var(--jeong);padding:2px 0 2px 10px;font-family:var(--serif);font-size:12.5px;line-height:1.5;color:var(--ink)}
.umsg.her .who{font-family:var(--mono);font-size:6px;letter-spacing:.1em;color:var(--jeong-deep);display:block;margin-bottom:2px}
.umsg.her .act{display:block;font-family:var(--mono);font-size:6.5px;letter-spacing:.06em;color:var(--teal-deep);margin-top:3px}
.um-inrow{display:flex;gap:7px;margin-top:11px;border-top:1px dashed var(--hairline);padding-top:10px}
.um-inrow input{flex:1;font-family:var(--serif);font-size:12.5px;border:1px solid var(--hairline);border-radius:8px;padding:8px 10px;background:#fff;color:var(--ink)}
.um-inrow button{font-family:var(--mono);font-size:8px;font-weight:500;letter-spacing:.06em;color:#fff;background:var(--jeong);border:0;border-radius:999px;padding:0 14px;cursor:pointer}
.um-note{font-family:var(--mono);font-size:6.5px;letter-spacing:.08em;color:var(--stone);margin-top:7px;line-height:1.7}
.appt .udot{position:absolute;top:-6px;right:-6px;min-width:16px;height:16px;border-radius:999px;background:var(--jeong);color:#fff;font-family:var(--mono);font-size:8px;font-weight:500;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(238,122,45,.5)}
.appt.umma svg{stroke:#e8edf3}
/* claims — the statement's lines, unspooling */
.claim{cursor:pointer;border-radius:3px;font-family:var(--serif);font-size:12.5px;line-height:1.6;color:var(--ink)}
.claim.v{border-bottom:2px solid rgba(194,85,31,.55)}
.claim.v:hover{background:var(--jeong-wash)}
.claim.d{border-bottom:2px dotted var(--han);background:rgba(37,65,90,.05)}
.unspool{display:none;margin:6px 0 4px;border-left:2px solid var(--blue);padding:6px 10px;background:#c6e2f3;border-radius:0 8px 8px 0}
.unspool.on{display:block}
.unspool .src{display:inline-block;font-family:var(--mono);font-size:7px;color:#2f6fb4;border:1px solid var(--hairline);border-radius:999px;padding:2px 8px;margin:2px 3px 0 0;background:#ddeffa}
.unspool.gap{border-left-color:var(--amber)}
.unspool p{font-size:11px;color:var(--ink-soft);margin-top:3px;line-height:1.45}
.sheet-grid .sr.c5{grid-template-columns:90px 1fr 1fr 1fr 1fr}
.umsg.her.pending .dots i{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--stone);margin-right:4px;animation:umdot 1.2s ease-in-out infinite}
.umsg.her.pending .dots i:nth-child(2){animation-delay:.2s}
.umsg.her.pending .dots i:nth-child(3){animation-delay:.4s}
@keyframes umdot{0%,100%{opacity:.25;transform:translateY(0)}50%{opacity:1;transform:translateY(-2px)}}

/* ═══ showcase (show=1): the simulated client's cursor ═══ */
#simcur{position:fixed;left:60%;top:104%;z-index:300;width:20px;height:20px;border-radius:50%;background:rgba(238,122,45,.9);border:2px solid #fff;box-shadow:0 3px 16px rgba(0,0,0,.5);pointer-events:none;opacity:0;transform:translate(-50%,-50%);transition:left .65s cubic-bezier(.35,.7,.25,1),top .65s cubic-bezier(.35,.7,.25,1),opacity .35s ease,transform .16s ease}
#simcur.on{opacity:1}
#simcur.down{transform:translate(-50%,-50%) scale(.68)}
#simcur::after{content:"THE CLIENT";position:absolute;top:26px;left:50%;transform:translateX(-50%);font-family:var(--mono);font-size:8.5px;font-weight:500;letter-spacing:.09em;background:rgba(22,41,58,.92);color:#fff;padding:4px 8px;border-radius:999px;white-space:nowrap}
