@font-face{font-family:"IBM Plex Sans";src:url(fonts/plex-400.woff2);font-weight:400}
@font-face{font-family:"IBM Plex Sans";src:url(fonts/plex-600.woff2);font-weight:600}
@font-face{font-family:Caveat;src:url(fonts/caveat.woff2);font-weight:500}
@font-face{font-family:"Special Elite";src:url(fonts/elite.woff2)}
:root{--ac:#1F86C6;--ink:#1c1f2e;--ln:#e6e8f0}[hidden]{display:none!important}
body{margin:0;height:100vh;overflow:hidden;font:14px "IBM Plex Sans",system-ui,sans-serif;color:var(--ink);user-select:none;-webkit-user-select:none}
body[data-bg=dark]{--bg:#070b2a;--dot:#ffffff26;--txt:#eee}body[data-bg=light]{--bg:#f3f5f7;--dot:#0000002b;--txt:#1c1f2e}body[data-bg=slate]{--bg:#12263b;--dot:#ffffff28;--txt:#eef}
#stage{position:absolute;inset:0;background:var(--bg);touch-action:none;overflow:hidden}
#stage[data-grid="1"]{background-image:radial-gradient(var(--dot) 1.3px,transparent 1.6px)}
#stage[data-tool=hand]{cursor:grab}#stage[data-tool=connect]{cursor:crosshair}
#world{position:absolute;left:0;top:0;transform-origin:0 0}
#es{position:absolute;left:0;top:0;width:1px;height:1px;overflow:visible;pointer-events:none}
.s{fill:none;stroke:#d92b2b;stroke-width:2.2;stroke-linecap:round;transition:opacity .25s}
.hit{fill:none;stroke:transparent;stroke-width:18;pointer-events:stroke;cursor:pointer}
.s.glow{stroke:#ff3b3b;stroke-width:3.6;stroke-dasharray:14 8;animation:flow .9s linear infinite;filter:drop-shadow(0 0 5px #ff3b3b) drop-shadow(0 0 14px #ff3b3baa)}
@keyframes flow{to{stroke-dashoffset:-22}}.s.dim{opacity:.12}.s.esel{stroke:#ffb300;stroke-width:3.6;filter:drop-shadow(0 0 8px #ffb300)}
.item{position:absolute;box-sizing:border-box;cursor:grab;box-shadow:0 6px 18px #0006;transition:opacity .25s,box-shadow .25s}
.item.note{background:#ffd966;padding:24px 16px 16px;min-height:140px;font:500 25px/1.15 Caveat,cursive;color:#2b2416}
.item.photo{background:#fff;padding:10px 10px 8px}.photo img{display:block;width:100%;pointer-events:none}
.photo .tx{font:12px "Special Elite",monospace;color:#222;padding-top:8px}
.item.text{box-shadow:none;font:500 28px Caveat,cursive;color:var(--txt);padding:6px}
.tx{outline:none;white-space:pre-wrap;word-break:break-word}.tx[contenteditable=true]{user-select:text;-webkit-user-select:text;cursor:text}
.tx:empty:before{content:"Double-click to edit";opacity:.4}
.pin{position:absolute;left:50%;top:-2px;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ff8a80,#c62828 60%,#7f1010);box-shadow:0 3px 4px #0006}.text .pin{display:none}
.item.dim{opacity:.25}.item.linked{box-shadow:0 0 0 3px #ff4d4d,0 0 30px 8px #ff4d4daa}
.item.sel{box-shadow:0 0 0 3px #ffc400,0 0 30px 8px #ffc40088}.item.pend{box-shadow:0 0 0 3px var(--ac),0 0 24px 6px #1F86C6aa}
.card{position:absolute;display:flex;align-items:center;gap:2px;padding:6px;background:#fff;border:1px solid var(--ln);border-radius:14px;box-shadow:0 8px 28px #0000003d}
.b{width:38px;height:38px;border:0;border-radius:10px;background:none;color:#3a3f55;display:grid;place-items:center;cursor:pointer;font-size:18px}
.b:hover{background:#f0f1f7}.b.on{background:#E1F0FA;color:var(--ac)}.b:focus-visible,select:focus-visible,.pri:focus-visible{outline:2px solid var(--ac)}
.i{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pri{display:flex;gap:6px;align-items:center;height:38px;padding:0 14px;margin-left:4px;border:0;border-radius:10px;background:var(--ac);color:#fff;font:600 14px "IBM Plex Sans";cursor:pointer}.pri .i{width:16px}
select{height:34px;border:1px solid var(--ln);border-radius:9px;background:#fff;font:14px "IBM Plex Sans";padding:0 6px;margin:0 2px}
#brand{left:14px;top:14px}#acts{right:14px;top:14px}#tools{left:50%;bottom:16px;transform:translateX(-50%);max-width:calc(100vw - 16px);overflow-x:auto}
#zoom{left:14px;bottom:16px}#zp{min-width:46px;text-align:center;font-weight:600}
#title{border:0;width:190px;font:600 14px "IBM Plex Sans";color:var(--ink);background:none;outline:0;padding:0 8px}
.logo{width:34px;height:34px;border-radius:9px;background:var(--ac);color:#fff;display:grid;place-items:center;font:600 18px "IBM Plex Sans"}
.sep{width:1px;height:24px;background:var(--ln);margin:0 6px}
#insp{right:14px;top:50%;transform:translateY(-50%);flex-direction:column;align-items:stretch;gap:10px;padding:12px;width:150px}
#insp label{display:grid;gap:4px;font-size:12px;color:#6b7186}#sw{display:flex;gap:6px;flex-wrap:wrap}
#sw button{width:22px;height:22px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #c9ccd8;cursor:pointer}.row{display:flex;justify-content:space-between}
#toast{position:absolute;left:50%;bottom:84px;transform:translateX(-50%);background:#1c1f2e;color:#fff;padding:9px 16px;border-radius:10px;opacity:0;pointer-events:none;transition:opacity .25s;max-width:90vw}#toast.on{opacity:1}
@media(max-width:760px){#title{width:100px}#acts select,#grid,#imp,#exp{display:none}#zoom{bottom:76px}#insp{top:auto;bottom:130px;transform:none;flex-direction:row;width:auto;flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){.s.glow{animation:none}}
.logo{text-decoration:none}.b.on{box-shadow:inset 0 0 0 1px #1F86C633}
#stage[data-tool=pen]{cursor:crosshair}#stage[data-tool=erase]{cursor:cell}#ds{position:absolute;left:0;top:0;width:1px;height:1px;overflow:visible;pointer-events:none;z-index:5000}
.st{fill:none;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}#stage[data-tool=erase] .st{pointer-events:stroke}
#es text.lb{font:600 13px "IBM Plex Sans";fill:var(--txt);paint-order:stroke;stroke:var(--bg);stroke-width:4px;text-anchor:middle;pointer-events:none}
.s{stroke:var(--sc,#d92b2b)}.s.glow{stroke:var(--sc,#ff3b3b)}
.rz{display:none;position:absolute;right:-7px;bottom:-7px;width:calc(14px*var(--iz,1));height:calc(14px*var(--iz,1));background:#fff;border:2px solid #19B3B0;border-radius:3px;cursor:nwse-resize;z-index:3}
#stage[data-one="1"] .item.sel .rz{display:block}.item.text .rz{bottom:-3px}
#mq{position:absolute;border:1.5px solid #19B3B0;background:#19B3B022;pointer-events:none;z-index:9}
.sws{display:flex;gap:6px;flex-wrap:wrap}#sw{display:flex}.sws button{width:22px;height:22px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #c9ccd8;cursor:pointer;padding:0}
#insp b,#help b,#bl b{font-size:13px}#insp input[type=text]{height:32px;border:1px solid var(--ln);border-radius:8px;padding:0 8px;font:14px "IBM Plex Sans"}
#pen{left:50%;bottom:84px;transform:translateX(-50%);gap:14px;padding:10px 14px}#pen input{width:110px}
.pop{flex-direction:column;align-items:stretch;gap:6px;padding:12px;font-size:13.5px;line-height:1.5;z-index:20}#help{left:14px;bottom:76px;width:min(420px,calc(100vw - 28px))}#help p{margin:0;color:#4a5068}
#bl{left:14px;top:74px;width:260px;max-height:60vh;overflow:auto}.br{display:flex;align-items:center;gap:4px}.br>button:first-child{flex:1;text-align:left;border:0;background:none;padding:8px;border-radius:8px;font:14px "IBM Plex Sans";cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.br>button:first-child:hover,.br .cur{background:#E7F3FA}.br .b{width:30px;height:30px}
#sv{font-size:12px;color:#6b7186;padding:0 6px;min-width:44px}#insp{width:168px}
/* v0.5 */
#insp{width:272px;top:84px;transform:none;max-height:calc(100vh - 170px);overflow:auto;align-items:stretch}#ib,#ei{display:grid;gap:10px}
.ihead{display:flex;align-items:center;gap:0}.ihead .b{width:32px;height:32px}.grow{flex:1}.ihead b{font-size:13px;text-transform:capitalize}
#insp label{display:grid;gap:3px;font-size:12px;color:#5b6275}#insp select,#insp textarea,#insp input[type=date]{border:1px solid var(--ln);border-radius:8px;padding:6px 8px;font:13px "IBM Plex Sans";background:#fff;color:#14142b;min-height:32px}
#insp summary{cursor:pointer;font-weight:600;font-size:13px;margin-bottom:8px}#dtl{display:grid;gap:8px}.two{display:grid;grid-template-columns:1fr 1fr;gap:8px}.ck{display:flex!important;align-items:center;gap:6px;grid-auto-flow:column}
.meta{font-size:11.5px;color:#5b6275;word-break:break-all;line-height:1.45}.meta a{color:#1F86C6}#log{margin:0;padding-left:16px;font-size:11.5px;color:#5b6275;max-height:110px;overflow:auto}
#mn{right:14px;top:74px;width:240px}#mn label{display:flex;justify-content:space-between;align-items:center;font-size:13.5px;gap:8px}.mi{border:0;background:none;text-align:left;padding:9px 8px;border-radius:8px;font:14px "IBM Plex Sans";cursor:pointer;color:#14142b}.mi:hover{background:#E7F3FA}
#sb{left:50%;top:14px;transform:translateX(-50%);gap:8px;padding:8px}#sb input{height:34px;border:1px solid var(--ln);border-radius:9px;padding:0 10px;font:14px "IBM Plex Sans";width:220px}#scount{font-size:12px;color:#5b6275;min-width:56px}
#lk{left:50%;bottom:84px;transform:translateX(-50%);gap:8px;padding:8px;width:min(560px,calc(100vw - 24px))}#lk input{flex:1;height:38px;border:1px solid var(--ln);border-radius:9px;padding:0 10px;font:14px "IBM Plex Sans";min-width:0}
#tl{left:14px;top:74px;width:300px;max-height:60vh;overflow:auto}.tr{display:block;width:100%;text-align:left;border:0;background:none;padding:8px;border-radius:8px;cursor:pointer;font:13px "IBM Plex Sans";color:#14142b}.tr:hover{background:#E7F3FA}.tr small{display:block;color:#5b6275;font-size:11.5px}
.bd{position:absolute;left:0;top:-20px;font:600 10.5px/1 "IBM Plex Sans";text-transform:uppercase;letter-spacing:.06em;padding:4px 7px;border-radius:5px 5px 0 0;background:#14142b;color:#fff;font-style:normal;white-space:nowrap}.bd:empty{display:none}
.item[data-st=verified] .bd{background:#128a52}.item[data-st=probable] .bd{background:#2f6fdc}.item[data-st=unverified] .bd{background:#c77d0a}.item[data-st=disputed] .bd{background:#c4204a}
.item.frame .bd,.item.redact .bd,.item.text .bd{display:none}.item.locked:after{content:"locked";position:absolute;right:4px;bottom:3px;font:600 9px "IBM Plex Sans";text-transform:uppercase;letter-spacing:.08em;opacity:.55;color:#14142b}
.item.frame{box-shadow:none;border:2px dashed #19B3B0;min-height:60px;cursor:grab}.item.frame .tx{position:absolute;left:10px;top:6px;font:600 14px "IBM Plex Sans";color:var(--txt);opacity:.9;max-width:90%}.item.frame .pin,.item.redact .pin,.item.frame .tx:empty:before{display:none}
.item.redact{background:#000;box-shadow:0 0 0 1px #ffffff33;min-height:20px;display:grid;place-items:center}.item.redact:before{content:"REDACTED";color:#fff;font:600 11px "IBM Plex Sans";letter-spacing:.3em;opacity:.8}.item.redact .tx{display:none}
.item.hit{box-shadow:0 0 0 3px #19c3c3,0 0 26px 6px #19c3c388}.item.pathn{box-shadow:0 0 0 3px #ffc400,0 0 34px 10px #ffc400aa}
.item.embed{background:#fff;padding:0;box-shadow:0 6px 18px #0006;border-radius:4px;overflow:visible}.emb{display:block}.eh{display:flex;align-items:center;gap:8px;padding:6px 8px 6px 14px;background:#14142b;color:#fff;font:600 10.5px "IBM Plex Sans";letter-spacing:.08em;text-transform:uppercase;border-radius:4px 4px 0 0;cursor:grab}
.emb iframe,.emb video{display:block;width:100%;aspect-ratio:16/9;border:0;background:#000;pointer-events:none}.emb.k-map iframe{aspect-ratio:4/3}.emb.k-pdf iframe{aspect-ratio:3/4;background:#fff}.emb audio{display:block;width:100%;pointer-events:none}
.item.sel .emb iframe,.item.sel .emb video,.item.sel .emb audio{pointer-events:auto}.et{padding:8px 10px 2px;font:600 13px/1.3 "IBM Plex Sans";color:#14142b;word-break:break-word}.ed{padding:0 10px;font-size:12px;color:#5b6275}
.ea{display:flex;gap:12px;padding:8px 10px 10px;font:600 12px "IBM Plex Sans"}.ea a{color:#1F86C6;text-decoration:none;pointer-events:auto}.ea a:hover{text-decoration:underline}
.item.embed .tx{padding:2px 10px 10px;font:13px/1.4 "IBM Plex Sans";color:#33384d}.item.embed .pin{top:-6px}
.emb.k-social .eh{background:#1F86C6}.emb.k-link .eh{background:#3a4366}
@media(max-width:760px){#insp{top:auto;bottom:130px;width:calc(100vw - 28px);max-height:46vh}#sb input{width:140px}#sb{max-width:calc(100vw - 16px)}#mn{top:74px}}
.item.embed .tx:empty:before{content:"Add a note…"}.item.frame{pointer-events:none}.item.frame .tx,.item.frame .rz{pointer-events:auto}.item.frame:before{content:"";position:absolute;inset:-8px;border:14px solid transparent;pointer-events:auto}
#tp{right:14px;top:74px;width:290px}#es.front .hit{stroke-width:10}#sf.on{background:#E1F0FA;color:#1F86C6}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@font-face{font-family:"Kalam";src:url(/assets/fonts/ff-kalam.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Permanent Marker";src:url(/assets/fonts/ff-marker.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Courier Prime";src:url(/assets/fonts/ff-courier.woff2) format("woff2");font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(/assets/fonts/ff-mono.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Merriweather";src:url(/assets/fonts/ff-serif.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Oswald";src:url(/assets/fonts/ff-oswald.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Playfair Display";src:url(/assets/fonts/ff-play.woff2) format("woff2");font-display:swap}
.vbar{flex-direction:column;left:14px;top:110px;padding:4px;gap:2px;z-index:15;touch-action:none}.hsep{width:26px;height:1px;background:var(--ln);margin:4px 0}.grip{height:22px;width:38px;border:0;background:none;cursor:grab;color:#9aa0b5;display:grid;place-items:center;touch-action:none}.grip:active{cursor:grabbing}.grip .i{width:18px;height:18px}
#ex{width:230px}#ex .mi,#tp .tr{display:flex;align-items:center;gap:10px}#ex .mi .i{width:18px;height:18px;color:#1F86C6;flex:none}#bgp{width:190px}#bgp select{height:34px;border:1px solid var(--ln);border-radius:9px;padding:0 8px;font:14px "IBM Plex Sans"}
#pexit{position:fixed;top:16px;right:16px;z-index:50}body.present .card:not(#zoom),body.present #toast{display:none!important}body.present #zoom{opacity:.55}body.present #zoom:hover{opacity:1}
#fnt{display:grid;gap:8px}.fb2{display:flex;gap:4px}.fb2 .b{width:32px;height:32px}.fb2 .b.on{background:#E1F0FA;color:#1F86C6}#fnt .mi{padding:6px 10px;font-size:12.5px;color:#5b6275}
.emb .poster{position:relative;aspect-ratio:16/9;background:#000 center/cover}.poster img{width:100%;height:100%;object-fit:cover;display:block}
.play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:66px;height:66px;border-radius:50%;border:0;background:#d92b2be6;color:#fff;cursor:pointer;display:grid;place-items:center;box-shadow:0 6px 20px #0008;pointer-events:auto}.play:hover{background:#ef3b3b}.play .i{width:30px;height:30px;fill:#fff;stroke:#fff;margin-left:4px}
.cover{display:block;width:100%;aspect-ratio:1.91/1;object-fit:cover;background:#e6e9ee;pointer-events:none}.em{padding:6px 10px 0;font:600 11.5px "IBM Plex Sans";color:#5b6275;text-transform:uppercase;letter-spacing:.04em}.em:empty{display:none}.ed.dead{color:#c4204a}

#sh{right:14px;top:74px;width:340px}#sh label{display:grid;gap:3px;font-size:12px;color:#5b6275}#sh input,#sh textarea{border:1px solid var(--ln);border-radius:8px;padding:7px 8px;font:12.5px "IBM Plex Mono",monospace;color:#14142b;width:100%;box-sizing:border-box;resize:none}.sm{margin:0;font-size:12px;color:#5b6275}
body.view .card:not(#zoom),body.view #hq{display:none!important}body.view #zoom{left:12px;bottom:12px}
.vbrand{position:fixed;right:12px;bottom:12px;z-index:30;background:#fff;color:#1F86C6;font:600 12.5px "IBM Plex Sans";padding:8px 12px;border-radius:10px;text-decoration:none;box-shadow:0 6px 20px #0004}
.vtitle{position:fixed;left:12px;top:12px;z-index:30;background:#ffffffee;color:#14142b;font:600 13px "IBM Plex Sans";padding:8px 12px;border-radius:10px;max-width:60vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-shadow:0 6px 20px #0004}
.vhint{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:30;background:#000028e6;color:#fff;font:13px "IBM Plex Sans";padding:8px 14px;border-radius:999px;transition:opacity .6s;pointer-events:none;white-space:nowrap}.vhint.off{opacity:0}
.vtop{position:fixed;left:0;right:0;top:0;z-index:30;display:flex;gap:16px;align-items:center;padding:12px 18px;background:#000028ee;color:#fff;font:14px "IBM Plex Sans"}.vtop a{color:#c4cbe6;text-decoration:none}.vtop .vcta{background:#1F86C6;color:#fff;padding:8px 14px;border-radius:9px;font-weight:600}.vtop .grow{flex:1}
body.view:not(.embed) #stage{top:48px}
body.view .rz{display:none!important}

/* ===== Studio mode: realistic cork board, pinned prints, paper notes and a lamp. Visual only; behaviour is unchanged. ===== */
#cork,#lamp{display:none}#mq{z-index:7000}
body.studio #cork{display:block;position:absolute;inset:0;background-color:#b5804a;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='360' height='360'%3E%3Cfilter id='a' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.62' numOctaves='4' seed='7' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .30  0 0 0 0 .16  0 0 0 0 .06  0 0 0 1.25 -.22'/%3E%3C/filter%3E%3Cfilter id='b' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012 .02' numOctaves='3' seed='11' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .98  0 0 0 0 .78  0 0 0 0 .5  0 0 0 1.4 -.55'/%3E%3C/filter%3E%3Crect width='360' height='360' filter='url(%23b)' opacity='.55'/%3E%3Crect width='360' height='360' filter='url(%23a)'/%3E%3C/svg%3E");pointer-events:none}
body.studio #stage,body.studio #stage[data-grid="1"]{background:#2b1a0e}
body.studio #stage::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:5500;border:18px solid transparent;border-image:repeating-linear-gradient(90deg,#76502e 0 7px,#63421f 7px 10px,#7d5833 10px 17px,#5a3b1d 17px 19px) 18;box-shadow:inset 0 0 70px 14px rgba(0,0,0,.55),inset 0 0 8px 2px rgba(0,0,0,.6)}
body.studio #lamp{display:block;position:absolute;inset:0;z-index:6000;pointer-events:none;overflow:hidden}
#lamp i{position:absolute;display:block;transition:opacity .7s}
#lamp .dk.on{inset:0;background:radial-gradient(ellipse 60% 62% at var(--lx,50%) var(--ly,44%),rgba(0,0,0,0) 0,rgba(0,0,0,.2) 40%,rgba(0,0,0,.84) 100%)}
#lamp .dk.off{inset:0;background:rgba(5,8,28,.66)}
#lamp .beam{left:calc(var(--lx,50%) - 30%);top:-4%;width:60%;height:112%;background:linear-gradient(rgba(255,238,196,.4),rgba(255,238,196,.1) 55%,transparent 92%);clip-path:polygon(42% 0,58% 0,100% 100%,0 100%);filter:blur(22px);mix-blend-mode:screen}
#lamp .warm{inset:0;background:radial-gradient(ellipse 54% 54% at var(--lx,50%) var(--ly,44%),rgba(255,206,130,.34),transparent 72%);mix-blend-mode:soft-light}
#lamp .shade{left:calc(var(--lx,50%) - 46px);top:0;width:92px;height:22px;background:linear-gradient(#2b2b2b,#101010);clip-path:polygon(24% 0,76% 0,100% 100%,0 100%);opacity:1}
#lamp .bulb{left:calc(var(--lx,50%) - 22px);top:14px;width:44px;height:14px;border-radius:50%;background:radial-gradient(#fff7d6,#ffd98a 60%,transparent 72%);filter:blur(1.5px)}
body.lightoff #lamp .dk.on,body.lightoff #lamp .beam,body.lightoff #lamp .warm,body.lightoff #lamp .bulb,body:not(.lightoff) #lamp .dk.off{opacity:0}
:where(body.studio) .item{box-shadow:none;filter:drop-shadow(calc(var(--sx,0)*-7px) 9px 8px rgba(0,0,0,.55))}
:where(body.studio) .item.frame{filter:none}body.studio.heavy .item{filter:none}
body.studio .item.note::before,body.studio .item.embed::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:2;mix-blend-mode:multiply;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='p' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' seed='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45  0 0 0 0 .38  0 0 0 0 .25  0 0 0 .55 -.12'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23p)'/%3E%3C/svg%3E"),linear-gradient(135deg,transparent 84%,rgba(0,0,0,.2) 93%,rgba(255,255,255,.5) 100%),linear-gradient(180deg,rgba(255,255,255,.4),rgba(0,0,0,.07) 90%)}
body.studio .item.photo::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:2;background:linear-gradient(118deg,rgba(255,255,255,.34) 0,rgba(255,255,255,0) 34%,rgba(255,255,255,.07) 62%,rgba(0,0,0,.1) 100%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='p' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' seed='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45  0 0 0 0 .38  0 0 0 0 .25  0 0 0 .55 -.12'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23p)'/%3E%3C/svg%3E");mix-blend-mode:normal}
body.studio .photo img{box-shadow:0 0 0 1px rgba(0,0,0,.35);filter:contrast(1.06) saturate(.92)}
body.studio .item.text{background:linear-gradient(#f0e4bf,#e2d3a4);color:#2a2418;padding:8px 18px;border-radius:2px}
body.studio .item[data-v="1"]:not(.text):not(.frame):not(.redact)::after{content:"";position:absolute;left:-20px;top:4px;width:70px;height:22px;background:rgba(236,224,184,.78);transform:rotate(-38deg);box-shadow:0 2px 3px rgba(0,0,0,.35);z-index:3;pointer-events:none}
body.studio .item[data-v="2"]:not(.text):not(.frame):not(.redact)::after{content:"";position:absolute;right:-20px;top:4px;width:70px;height:22px;background:rgba(236,224,184,.78);transform:rotate(38deg);box-shadow:0 2px 3px rgba(0,0,0,.35);z-index:3;pointer-events:none}
:where(body.studio) .pin{width:20px;height:20px;margin-left:-10px;top:-9px;z-index:4;background:radial-gradient(circle at 32% 28%,#ffc2ba 0,#e2382d 36%,#8c1210 72%,#4a0907 100%);box-shadow:0 7px 6px -3px rgba(0,0,0,.7),inset -2px -3px 4px rgba(0,0,0,.4),inset 2px 2px 3px rgba(255,255,255,.45)}
:where(body.studio) .pin::after{content:"";position:absolute;left:55%;top:62%;width:16px;height:5px;background:rgba(0,0,0,.4);filter:blur(2px);border-radius:50%;transform:rotate(28deg);z-index:-1}
:where(body.studio) .s{stroke:var(--sc,#c5242b);stroke-width:2.8;filter:drop-shadow(2px 4px 2.5px rgba(0,0,0,.55))}
body.studio .tx:empty:before{color:#000}
#stage{z-index:0}

/* ===== v0.8 cinematic light: focused, colour-selectable, static (no lamp, no pointer movement) ===== */
body.studio #lamp .beam,body.studio #lamp .shade,body.studio #lamp .bulb{display:none}
body.studio #lamp .dk.on{inset:0;background:radial-gradient(ellipse var(--lf,70%) calc(var(--lf,70%)*.92) at var(--lx,70%) var(--ly,30%),rgba(0,0,0,0) 0,rgba(0,0,0,calc(var(--ld,.8)*.12)) 38%,rgba(0,0,0,calc(var(--ld,.8)*.58)) 72%,rgba(0,0,0,var(--ld,.8)) 100%)}
body.studio #lamp .warm{inset:0;background:radial-gradient(ellipse calc(var(--lf,70%)*.85) calc(var(--lf,70%)*.75) at calc(var(--lx,70%) + 5%) calc(var(--ly,30%) - 8%),rgba(var(--lc,255,205,135),calc(var(--li,.8)*.44)),transparent 70%),linear-gradient(215deg,rgba(var(--lc,255,205,135),calc(var(--li,.8)*.26)) 0,transparent 48%);mix-blend-mode:soft-light}
body.studio #lamp .wash{inset:0;background:rgba(var(--lc,255,205,135),var(--wash,.1));mix-blend-mode:multiply}
body.studio #lamp .dk.off{inset:0;background:radial-gradient(ellipse 90% 90% at var(--lx,70%) var(--ly,30%),rgba(var(--lc,255,205,135),.07),transparent 70%),rgba(4,6,22,.74)}
body.studio #lamp .grain{inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .5  0 0 0 0 .5  0 0 0 0 .5  0 0 0 1 0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23g)'/%3E%3C/svg%3E");opacity:.09;mix-blend-mode:overlay}
body.lightoff #lamp .dk.on,body.lightoff #lamp .warm,body.lightoff #lamp .wash,body:not(.lightoff) #lamp .dk.off{opacity:0}
#lamp.flick .dk.on,#lamp.flick .warm{animation:flick .85s steps(1,end) 1}
@keyframes flick{0%{opacity:0}9%{opacity:.75}16%{opacity:.1}27%{opacity:.95}38%{opacity:.4}52%{opacity:1}100%{opacity:1}}
body.studio #world{filter:var(--grade,none)}
:where(body.studio) .item{filter:drop-shadow(0 1px 1.5px rgba(0,0,0,.7)) drop-shadow(calc(var(--sx,0)*-9px) calc(var(--sy,1)*11px) var(--shb,13px) rgba(0,0,0,var(--soa,.5))) drop-shadow(0 0 22px rgba(0,0,0,.22))}
:where(body.studio) .pin{box-shadow:calc(var(--sx,0)*-4px) calc(var(--sy,1)*7px) 6px -3px rgba(0,0,0,.7),inset -2px -3px 4px rgba(0,0,0,.4),inset 2px 2px 3px rgba(255,255,255,.45)}
#hl{display:none}body.studio #hl{display:block;position:absolute;left:0;top:0;transform-origin:0 0;pointer-events:none;z-index:6100}
#hls{position:absolute;left:0;top:0;width:1px;height:1px;overflow:visible}
.hg{fill:none;stroke:var(--sc,#ff4a42);stroke-width:3.4;stroke-linecap:round;stroke-dasharray:14 8;animation:flow .9s linear infinite;filter:drop-shadow(0 0 5px var(--sc,#ff3b3b)) drop-shadow(0 0 14px var(--sc,#ff3b3b))}
.hr{fill:none;stroke-width:3}.hr.sel{stroke:#ffc400;filter:drop-shadow(0 0 7px #ffc400) drop-shadow(0 0 20px #ffc400aa)}.hr.lk{stroke:#ff4d4d;filter:drop-shadow(0 0 7px #ff3b3b) drop-shadow(0 0 20px #ff3b3baa)}
body.studio .item.dim{opacity:.32}
#lt{right:14px;top:74px;width:310px;gap:10px}.lrow{display:flex;align-items:center;justify-content:space-between}#lt label{display:grid;gap:3px;font-size:12px;color:#5b6275}
.lps{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.lps button{border:1.5px solid var(--ln);border-radius:10px;background:#fff;padding:7px 2px 5px;font:600 11px "IBM Plex Sans";color:#33384d;cursor:pointer;display:grid;gap:4px;justify-items:center}.lps button i{width:22px;height:22px;border-radius:50%;box-shadow:inset 0 0 0 1px #0002}.lps button.on{border-color:#1F86C6;background:#E7F3FA}
.ldir{display:flex;gap:6px}.ldir button{flex:1;height:34px;border:1.5px solid var(--ln);border-radius:9px;background:#fff;font-size:16px;cursor:pointer;color:#33384d}.ldir button.on{border-color:#1F86C6;background:#E7F3FA;color:#1F86C6}
.swt{position:relative;width:42px;height:24px;display:inline-block}.swt input{opacity:0;width:0;height:0}.swt span{position:absolute;inset:0;background:#c9ccd8;border-radius:24px;transition:.2s;cursor:pointer}.swt span:before{content:"";position:absolute;left:3px;top:3px;width:18px;height:18px;background:#fff;border-radius:50%;transition:.2s}.swt input:checked+span{background:#1F86C6}.swt input:checked+span:before{transform:translateX(18px)}

/* ===== v0.9 fresh app chrome ===== */
@font-face{font-family:"Plus Jakarta Sans";src:url(fonts/pjs-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Plus Jakarta Sans";src:url(fonts/pjs-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Plus Jakarta Sans";src:url(fonts/pjs-700.woff2) format("woff2");font-weight:700;font-display:swap}
:root{--ac:#1F86C6}
body[data-bg=mist]{--bg:#EEF4FA;--dot:#1F86C63d;--txt:#0E2A4A}
body{font-family:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;color:#0E2A4A}
.card,.card *,.pop *,#toast,.vbrand,.vtitle,.vtop,.vhint,#cb,#cb *{font-family:"Plus Jakarta Sans",system-ui,sans-serif}
.card{background:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(14px) saturate(1.4);backdrop-filter:blur(14px) saturate(1.4);border:1px solid rgba(255,255,255,.85);border-radius:18px;box-shadow:0 14px 40px rgba(11,34,64,.16),0 2px 6px rgba(11,34,64,.08)}
.b{border-radius:12px;color:#36516f;transition:background .15s,color .15s,transform .15s}.b:hover{background:#E7F3FA;color:#1F86C6}.b:active{transform:scale(.94)}
.b.on{background:linear-gradient(135deg,#1F86C6,#19B3B0);color:#fff;box-shadow:0 6px 16px rgba(31,134,198,.35)}
.pri{background:linear-gradient(135deg,#1F86C6,#19B3B0);border-radius:12px;box-shadow:0 8px 20px rgba(31,134,198,.3);transition:filter .15s,transform .15s}.pri:hover{filter:brightness(1.07);transform:translateY(-1px)}
.logo{background:none;width:38px;height:38px;border-radius:0;display:block}.logo img{width:100%;height:100%;display:block}
#title{font-weight:700;color:#0E2A4A}#sv{background:#E3F7F5;color:#0b7f86;border-radius:999px;padding:4px 10px;font-weight:700;font-size:11.5px;min-width:0}
select,#insp input,#insp textarea,#sh input,#sh textarea,#lk input,#sb input{font-family:inherit;border-radius:10px;border-color:#E2EBF3}select:hover,#insp input:hover,#insp textarea:hover{border-color:#b9d6ea}
.hsep{background:#E2EBF3}.vbar{padding:6px 5px}.grip{color:#9fb3c8}
.sws button{width:24px;height:24px;border-color:#fff}.sws button:hover{transform:scale(1.12)}
#insp summary,#ex b,#bgp b,#tp b,#tl b,#bl b,#sh b,#lt b,#help b{color:#0E2A4A;font-weight:700}
.mi{border-radius:10px;font-weight:600;color:#1d3a5a}.mi:hover{background:#E7F3FA}.tr:hover,.br>button:first-child:hover,.br .cur{background:#E7F3FA}
#toast{background:#0B2240;border-radius:12px;font-weight:600;box-shadow:0 12px 30px rgba(11,34,64,.35)}
.lps button.on,.ldir button.on{border-color:#1F86C6;background:#E7F3FA;color:#1F86C6}.swt input:checked+span{background:#1F86C6}
.vbrand{color:#1F86C6;font-weight:700}
:focus-visible{outline:2px solid #35B6BE;outline-offset:2px}

/* v0.10 colour icons */
.ci{width:27px;height:27px;display:block;flex:none;filter:drop-shadow(0 1px 1px rgba(11,34,64,.18))}
.b{width:42px;height:42px;border-radius:13px}
.b:hover{background:#EAF4FB;color:inherit}.b:hover .ci{transform:translateY(-1px) scale(1.06)}.ci{transition:transform .15s}
.b.on{background:#E3F1FB;box-shadow:inset 0 0 0 2px #1F86C6,0 4px 12px rgba(31,134,198,.22);color:inherit}
.ihead .b{width:34px;height:34px}.ihead .ci{width:23px;height:23px}.fb2 .b{width:34px;height:34px}.fb2 .ci{width:24px;height:24px}
.mi .ci,#ex .mi .ci{width:24px;height:24px}#ex .mi{gap:12px}.grip .ci{width:16px;height:24px}.hsep{margin:5px 0}
.lps button i{box-shadow:inset 0 0 0 1px #0002,0 2px 6px rgba(0,0,0,.18)}
#zoom .b{width:40px;height:40px}#zoom .ci{width:24px;height:24px}
#tp{width:370px}.tpl{display:grid!important;grid-template-columns:120px 1fr;gap:12px;align-items:center;padding:8px!important;border-radius:12px!important}.tpl img{width:120px;height:75px;border-radius:9px;object-fit:cover;border:1px solid #E2EBF3;background:#EEF4FA;box-shadow:0 4px 12px rgba(14,42,74,.1)}.tpl b{display:block;font-size:13.5px;margin-bottom:2px}.tpl small{display:block;line-height:1.35}
