/* PRFKT desk surfaces and the Pencil (desk-surface.js) */
html{--dsi:var(--inkc,var(--ink,#17191b));--dse:var(--edge,var(--line,#17191b));--dsw:var(--win,#fbf8ef);--dsp:var(--paper-2,#efe9d8);--dsl:var(--lime,#b6d82f);--dsx:var(--lime-ink,#17191b);--dsh:var(--hair,#d9d2bd)}
html[data-desk-surface="mat"]{--ds-base:#14506f;--ds-img:radial-gradient(150px 110px at 12% 18%,rgba(255,255,255,.06),transparent 70%),radial-gradient(230px 150px at 70% 26%,rgba(0,0,0,.1),transparent 70%),linear-gradient(135deg,#1a5a82,#134a6c 55%,#175177)}
html[data-desk-surface="blueprint"]{--ds-base:#1b4f9c;--ds-img:radial-gradient(120% 90% at 50% 40%,rgba(255,255,255,.09),transparent 70%),radial-gradient(100% 100% at 50% 50%,transparent 60%,rgba(0,12,40,.28))}
html[data-desk-surface="whiteboard"]{--ds-base:#fbfcfd;--ds-sh:.85;--ds-img:linear-gradient(115deg,transparent 0 20%,rgba(255,255,255,var(--ds-sh)) 28%,transparent 37% 52%,rgba(255,255,255,calc(var(--ds-sh)*.7)) 60%,transparent 68%),linear-gradient(115deg,transparent 38%,rgba(100,120,150,.1) 46%,transparent 54%),radial-gradient(190px 12px at 24% 31%,rgba(40,70,130,.1),transparent 72%),radial-gradient(140px 10px at 71% 58%,rgba(190,50,40,.07),transparent 72%),linear-gradient(135deg,#dde5ec,#fbfcfd 38%,#f6f9fb 68%,#dae2ea)}
html[data-desk-surface="whiteboard"] .grain{display:none}
html[data-desk-surface="whiteboard"] .ds-plane::after{content:"";position:absolute;inset:var(--ds-top,0) 0 0;box-shadow:inset 0 0 0 5px #e3e7eb,inset 0 0 0 6px #a9b1b9}
html[data-desk-surface="whiteboard"][data-theme="dark"]{--ds-sh:.3}
@media (prefers-color-scheme:dark){html[data-desk-surface="whiteboard"]:not([data-theme="light"]){--ds-sh:.3}}
html[data-ds-on] :is(.ds-root,.os.desk,.desk-body>.desk){background-color:var(--ds-base)!important;background-image:var(--ds-img)!important;background-size:auto!important;background-repeat:no-repeat!important;transform:none!important}
html[data-ds-on] :is(.os.desk,.desk-body>.desk)::before,html[data-ds-on] :is(.os.desk,.desk-body>.desk)::after{display:none}
html[data-ds-ink] .desk-body>.desk{transform:none!important}
html[data-ds-on] :is(.icons,#icons) .icon:not(.sel,:hover,:focus-visible,.over) span{background:#f6f2e4;color:#17191b;border-color:rgba(23,25,27,.28)}
.ds-plane{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.ds-plane svg{position:absolute;left:0;top:0;width:100%;height:100%}
.ds-canvas{position:absolute;left:0;top:0;width:100%;height:100%;z-index:0;pointer-events:none}
html.ds-pencil-on .ds-canvas{pointer-events:auto;touch-action:none;cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Cpath d='M3 21l1-5L16 4l4 4L8 20z' fill='%23fff' stroke='%23000'/%3E%3C/svg%3E") 3 21,crosshair}
.ds-canvas[hidden],.ds-box[hidden],.ds-tray[hidden]{display:none!important}
html.ds-pencil-on .ds-tray{z-index:9992}
html.ds-pencil-on body{touch-action:none}html.ds-pencil-on .icons{pointer-events:none}html.ds-pencil-on .icons>*{pointer-events:auto}
.ds-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.ds-tray{position:fixed;z-index:1;left:50%;bottom:var(--ds-bottom,0px);transform:translateX(-50%);display:flex;gap:18px;justify-content:center;min-width:260px;padding:7px 22px 5px;border-radius:6px 6px 0 0;background:linear-gradient(#f3f5f7,#c3c9cf 40%,#9aa1a8);box-shadow:0 1px 0 #fff inset,0 -4px 0 #8b9299 inset,0 -3px 8px rgba(0,0,0,.18)}
.ds-tr{display:flex;flex-direction:column;align-items:center;min-width:72px;min-height:48px;padding:2px 8px;background:none;border:0;border-radius:6px;color:#23272a;font:500 13px/1.1 var(--display,serif);cursor:pointer}
.ds-tr:hover,.ds-tr[aria-pressed="true"]{background:rgba(255,255,255,.7);box-shadow:0 0 0 1px #23272a}
.ds-tr svg{width:42px;height:26px}
.ds-toggle{display:inline-flex;align-items:center;gap:5px}
.ds-toggle svg{width:15px;height:15px}
.ds-toggle[aria-pressed="true"]{background:var(--dsl)!important;color:var(--dsx)!important}
.ds-pin{position:sticky;right:6px;margin-left:auto;z-index:3;background:var(--dsp)!important;box-shadow:-14px 0 10px var(--dsp)}
.ds-box,.ds-ask{background:var(--dsw);color:var(--dsi);border:1px solid var(--dse);border-radius:10px;box-shadow:3px 3px 0 var(--dse)}
.ds-box{position:fixed;left:50%;bottom:calc(var(--ds-bottom,0px) + 14px);transform:translateX(-50%);z-index:9991;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:0 8px;width:max-content;max-width:calc(100vw - 16px);padding:6px 8px;font:400 14px/1.2 var(--display,serif)}
.ds-box.ds-above-tray{bottom:calc(var(--ds-bottom,0px) + 78px)}
.ds-row{display:flex;gap:4px;justify-content:center;align-items:center}
.ds-box button{box-shadow:none;transform:none;font:inherit;color:inherit}
.ds-tb{display:flex;flex-direction:column;align-items:center;min-width:66px;min-height:46px;padding:3px 6px;background:none;border:1px solid transparent;border-radius:7px;cursor:pointer}
.ds-tb svg{width:22px;height:22px}.ds-tb span,.ds-tr span{font-size:13px;text-transform:capitalize}
.ds-tb:hover:not(:disabled){background:var(--dsp)}
.ds-tb[aria-checked="true"]{background:var(--dsl);color:var(--dsx);border-color:var(--dse)}
.ds-tb:disabled{opacity:.4;cursor:default}
.ds-cols,.ds-sizes{display:inline-flex;gap:2px;align-items:center}
.ds-sizes{margin-left:8px;padding-left:8px;border-left:1px solid var(--dsh)}
.ds-sw,.ds-sz{width:40px;height:44px;display:grid;place-items:center;background:none;border:0;border-radius:7px;cursor:pointer}
.ds-sw i{width:24px;height:24px;border-radius:50%;border:1.5px solid var(--dse)}
.ds-dot{display:block;border-radius:50%;background:var(--dsi)}
.ds-dot0{width:5px;height:5px}.ds-dot1{width:10px;height:10px}.ds-dot2{width:16px;height:16px}
.ds-sw[aria-checked="true"],.ds-sz[aria-checked="true"]{background:var(--dsp);box-shadow:0 0 0 2px var(--dse)}
.ds-note{flex:0 0 100%;margin:2px 6px 0;font-size:13px;text-align:center}.ds-note:empty{display:none}
.ds-askwrap{position:fixed;inset:0;z-index:9998;display:grid;place-items:center;background:rgba(23,25,27,.35)}
.ds-ask{max-width:360px;padding:18px 20px;font:400 15px/1.35 var(--display,serif)}
.ds-ask h2{margin:0 0 6px;font-size:22px}.ds-ask .row{display:flex;gap:8px;margin-top:14px}.ds-ask button{min-height:44px;padding:0 16px;font:inherit;border:1px solid var(--dse);border-radius:7px;background:var(--dsp);color:inherit;cursor:pointer}.ds-ask .primary{background:var(--dsl);color:var(--dsx)}
.menu .ds-sub-t{display:flex;width:100%;justify-content:space-between;align-items:center}
.menu .chev{width:10px;height:10px;fill:none;stroke:currentColor;stroke-width:2}
.menu .ds-sub.open .chev{transform:rotate(180deg)}
.menu .ds-subm{display:none;padding:0 0 0 12px}
.menu .ds-sub.open>.ds-subm{display:block}
.menu .ds-l{display:inline-flex;align-items:center;gap:6px}
.menu .ds-ck{visibility:hidden;font-style:normal;width:1em}
.menu .ds-mi.on .ds-ck{visibility:visible}
.menu .ds-mi::before,.menu .ds-mi::after{content:none!important}
@media (max-width:720px){.menu .ds-mi,.menu .ds-sub-t,.ds-toggle{min-height:44px}}
@media (max-width:520px){.ds-box{bottom:calc(var(--ds-bottom,0px) + 8px);gap:0;padding:4px 2px;max-width:calc(100vw - 8px)}.ds-row{flex:1 1 100%;flex-wrap:wrap}.ds-cols{gap:0}.ds-sw,.ds-sz{flex:none}.ds-box.ds-above-tray{bottom:calc(var(--ds-bottom,0px) + 76px)}.ds-tb{min-width:0;flex:1}.ds-sw,.ds-sz{width:44px}.ds-sizes{margin-left:2px;padding-left:2px}}
.ds-cardrow{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:8px}
.ds-card{display:flex;flex-direction:column;gap:3px;text-align:left;padding:6px;min-height:44px;background:var(--dsw);color:inherit;border:1px solid var(--dse);border-radius:8px;cursor:pointer;font:inherit}
.ds-card b{font-weight:500;font-size:15px}.ds-card span{font-size:12px;line-height:1.25;opacity:.8}
.ds-card[aria-checked="true"]{box-shadow:0 0 0 2px var(--dse);background:var(--dsl);color:var(--dsx)}
.ds-prev{display:block;height:40px;border-radius:5px;border:1px solid rgba(0,0,0,.35);background:var(--c)}
.ds-prev-paper{--c:#f1ecdd}.ds-prev-mat{--c:#14506f}.ds-prev-blueprint{--c:#1b4f9c}.ds-prev-whiteboard{--c:#f6f4ec}
.ds-cardnote{margin:8px 0 0;font-size:13px}
