/* The Features tab: two big cards stacked — the reel, which plays the ninety-second film
   on a desk, and the test desk, where the visitor drives the Store demo. Under them the
   plans, what else is in the box, and the requirements. */
.features-panel{padding:0 24px}
.features-page{width:min(1180px,100%);margin:0 auto;padding:0 0 48px}
.features-head{margin:0 0 16px;max-width:80ch}
.features-head h1{margin:0 0 10px;font:700 34px/1.12 var(--site);letter-spacing:-.6px;color:var(--ink)}
.features-head p{margin:0 0 6px;font-size:16px;line-height:1.45;color:var(--ink)}
.features-head .release{margin:0;font-size:14px;color:var(--muted)}
.features-head .release b{color:var(--ink);font-weight:600}
.features-head .release a{color:var(--blue);text-decoration:underline;text-underline-offset:2px}

/* The two cards, one under the other: the reel fills the first screen, the test desk
   waits below it. Side by side they were too small to read (Duc, 2026-09-18). */
.feature-duo{display:grid;grid-template-columns:minmax(0,1fr);gap:28px}
.feature-big{display:flex;flex-direction:column;min-width:0;border:1px solid var(--line);border-radius:16px;background:var(--ui-surface,#fff);overflow:hidden;box-shadow:0 18px 50px -36px #0b1a3366}
[data-theme=dark] .feature-big{border-color:#3e4e63}
.feature-big-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;padding:18px 20px 8px}
.feature-big-head h2{margin:0;font:700 22px/1.2 var(--site);letter-spacing:-.3px;color:var(--ink)}
.feature-big-head .tier,.reel-chapters .tier{display:inline-block;margin-left:8px;padding:2px 8px;border:1px solid #e8cf9c;border-radius:20px;background:#ffedc9;color:#6b4a10;font:600 10px/1.5 var(--site);letter-spacing:.4px;vertical-align:middle;font-style:normal}
[data-theme=dark] .feature-big-head .tier,[data-theme=dark] .reel-chapters .tier{background:#3a2e17;border-color:#6b5a2e;color:#f0d9a0}
.feature-big-head .reel-count{font-size:13px;color:var(--muted)}
.feature-big-head p{flex-basis:100%;margin:0;font-size:15px;line-height:1.5;color:var(--ink)}
.reel-chapters{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:12px 20px 0}
.reel-chapters button{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 5px;border:1px solid var(--line);border-radius:20px;background:var(--ui-surface,#fff);color:var(--muted);font:600 12px/1.4 var(--site);cursor:pointer;transition:border-color .15s,color .15s}
.reel-chapters button span{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--ui-soft,#eef2f7);color:var(--muted);font-size:10px}
.reel-chapters button:hover{border-color:#8fb0e0;color:var(--ink)}
.reel-chapters button[aria-current=true]{border-color:var(--blue);color:var(--ink)}
.reel-chapters button[aria-current=true] span{background:var(--blue);color:#fff}
.reel-chapters .tier{margin-left:2px;padding:1px 6px;font-size:9px}
.feature-story{padding:0 20px 10px;min-height:50px}
.feature-story h3{margin:0 0 2px;font:700 17px/1.25 var(--site);color:var(--ink)}
.feature-story p{margin:0;font-size:14px;line-height:1.5;color:var(--muted)}
.feature-media{position:relative;aspect-ratio:16/9;background:#101823;cursor:pointer}
.feature-media .media-state{position:absolute;inset:auto auto 14px 14px;display:none;align-items:center;gap:7px;padding:7px 12px 7px 9px;border-radius:22px;background:#0f1722d9;color:#fff;font:600 13px/1 var(--site);pointer-events:none;z-index:2}
.feature-media .media-state .icon{width:14px;height:14px}
.feature-media.is-paused .media-state{display:inline-flex}
.feature-scrub{position:relative;height:4px;background:#ffffff22}
[data-theme=light] .feature-scrub{background:#0b1a3322}
.feature-scrub span{position:absolute;left:0;top:0;bottom:0;width:0;background:#7fb1ff}
.feature-steps{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:8px;margin:0;padding:14px 20px 0;cursor:pointer}
.feature-steps li{display:flex;align-items:center;gap:9px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--ui-surface,#fff);color:var(--muted);font:600 13px/1.3 var(--site);transition:border-color .15s,color .15s}
.feature-steps li span{display:grid;place-items:center;flex:none;width:22px;height:22px;border-radius:50%;background:var(--ui-soft,#eef2f7);color:var(--muted);font-size:11px}
.feature-steps li.is-lit{border-color:#8fb0e0;color:var(--ink)}
.feature-steps li.is-lit span{background:var(--blue);color:#fff}
.feature-note{margin:0;padding:12px 20px 18px;font-size:13px;line-height:1.55;color:var(--muted)}

/* The test desk's bar: the Compass button, four of the app's own switches, the look, reset. */
.live-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;padding:12px 20px 4px}
.live-button{padding:7px 12px;border:1px solid var(--line);border-radius:8px;background:var(--ui-surface,#fff);color:var(--ink);font:600 13px/1 var(--site);cursor:pointer}
.live-button:hover{border-color:#8fb0e0;color:var(--blue)}
.live-button.primary{border-color:var(--blue);background:var(--blue);color:#fff}
.live-button.primary:hover{background:#3a62d9;color:#fff}
.live-actions{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;min-width:0;font:600 13px/1.2 var(--site);color:var(--ink)}
.live-actions select{min-width:0;max-width:100%;padding:8px;border:1px solid var(--line);border-radius:7px;background:var(--ui-surface,#fff);color:var(--ink);font:600 13px/1.2 var(--site)}
.live-switch{display:inline-flex;align-items:center;gap:6px;font:600 13px/1 var(--site);color:var(--ink);cursor:pointer}
.live-switch input{accent-color:var(--blue);margin:0;width:15px;height:15px}
.live-select{display:inline-flex;align-items:center;gap:6px;font:600 13px/1 var(--site);color:var(--ink)}
.live-select select{padding:5px 8px;border:1px solid var(--line);border-radius:7px;background:var(--ui-surface,#fff);color:var(--ink);font:600 13px/1.2 var(--site)}
.live-bar .live-reset{margin-left:auto}
.live-say{margin:0;padding:8px 20px 0;min-height:44px;font-size:14px;line-height:1.5;color:var(--ink)}
.live-keys{margin:0;padding:6px 20px 16px;font-size:12px;line-height:1.5;color:var(--muted)}
/* The keyboard picture: the shortcut's keys in red, the words on the caps. */
.live-keyboard{padding:8px 20px 0;max-width:640px}
.live-input-guide{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-right:32px}
.live-input-guide .live-keyboard{flex:1;min-width:0}
.live-mouse-guide{flex:0 0 180px;min-height:200px;display:grid;place-items:center}
.live-mouse-guide .desk-mouse{position:relative;right:auto;bottom:auto;z-index:auto;will-change:transform}
.live-mouse-guide .desk-mouse-caption{color:var(--ink);text-shadow:none}
@media(max-width:700px){
  .live-input-guide{flex-wrap:wrap;gap:0;padding-right:14px}
  .live-input-guide .live-keyboard{flex-basis:100%;padding-left:14px;padding-right:0}
  .live-mouse-guide{margin-left:auto;flex-basis:150px}
}
.faq-keyboard{max-width:520px;margin:10px 0 2px}
[data-keyboard] svg{display:block;width:100%;height:auto;--key-cap:#e9edf3;--key-ink:#243040}
[data-theme=dark] [data-keyboard] svg{--key-cap:#3a4453;--key-ink:#e6edf7}

/* Under the cards: the plans and the facts, on the site's page width. */
.features-page .page{padding:34px 0 0}
.features-page .page h2{margin:36px 0 12px}
.features-page .plans{margin-top:0;grid-template-columns:repeat(2,minmax(0,1fr));max-width:920px;width:100%;margin-inline:auto}
.also{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:8px 24px}
.also li{margin:0;padding:8px 0;border-top:1px solid var(--line);font-size:14px;line-height:1.5;color:var(--ink)}
.also b{font-weight:600}

@media(max-width:700px){
  .features-panel{padding:0 14px}
  .features-page{padding:24px 0 36px}
  .features-head h1{font-size:28px;letter-spacing:-.5px}
  .features-head p{font-size:15px}
  .feature-big-head{padding:14px 14px 6px}
  .feature-big-head h2{font-size:19px}
  .live-actions{flex:1 1 100%}
  .live-actions select{width:100%}
  .live-actions select,.live-button,.live-select select{min-height:44px}
  .reel-chapters,.feature-story,.feature-steps,.feature-note,.live-bar,.live-say,.live-keys{padding-left:14px;padding-right:14px}
  .features-page .plans{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  .reel-chapters button,.feature-steps li{transition:none}
}

/* The ninety-second hero: the film fills the frame; story titles, the
   pause/replay control, the concept badge and the scrubber live inside it. */
.hero-reel{margin-bottom:28px}

/* Hero fills the viewport left–right so the Compass stays readable. */
.hero-reel,.live-desk-wrap,#livePanel .feature-big{
  width:100vw;
  max-width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  border-radius:0;
  border-left:0;
  border-right:0;
}
.hero-reel{
  /* Slab under the site nav: desk owns the first viewport. */
  margin-top:0;
}
.features-page > .hero-reel{
  margin-inline:0;
}
.hero-reel .desk-host,#reelDesk.desk-host{
  aspect-ratio:auto;
  width:100%;
  height:calc(100svh - var(--nav-h, 72px));
  min-height:520px;
  max-height:none;
}
/* Live desk keeps the 16:9 letterbox; only the hero fills the viewport. */
.live-media .desk-host,#liveDesk.desk-host{
  aspect-ratio:16/9;
  max-height:920px;
}
.hero-story h3{font-size:clamp(18px,2.2vw,28px)!important;letter-spacing:-.45px}
.hero-story p{font-size:clamp(14px,1.4vw,18px)!important;line-height:1.45!important}
.desk-chapter h3{font-size:clamp(40px,5vw,64px)}
.desk-chapter p{font-size:clamp(17px,2vw,24px);max-width:38em;margin-inline:auto}

.hero-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.hero-media{cursor:default;aspect-ratio:auto;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto minmax(72px,auto) auto;grid-template-areas:"desk desk" "story toggle" "concept toggle";padding-bottom:4px}
.hero-media>#reelDesk{grid-area:desk;min-width:0}
.hero-story{grid-area:story;align-self:center;position:relative;z-index:3;max-width:700px;margin:8px 0 8px 16px;padding:10px 14px;border-radius:12px;background:#0e1724b8;color:#eef4fb;backdrop-filter:blur(10px);pointer-events:none;opacity:0;transform:translateY(6px);transition:opacity .3s,transform .3s}
.hero-story.has-text{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.hero-story{transition:none}}
.hero-story h3{margin:0 0 2px;font:700 16px/1.25 var(--site);letter-spacing:-.2px;color:#fff}
.hero-story p{margin:0;font-size:12.5px;line-height:1.45;color:#c3d2e2}
.hero-toggle{grid-area:toggle;align-self:center;position:relative;margin:14px;z-index:3;display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border:1px solid #ffffff2e;border-radius:22px;background:#0e1724cc;color:#fff;font:600 12.5px/1 var(--site);cursor:pointer;backdrop-filter:blur(10px)}
.hero-toggle:hover{background:#1c2c42cc}
.hero-toggle:focus-visible{outline:3px solid #8fb6f2;outline-offset:2px}
.hero-concept{grid-area:concept;position:relative;z-index:3;display:flex;align-items:baseline;gap:9px;width:fit-content;max-width:calc(100% - 16px);margin:0 0 12px 16px;padding:8px 13px;border:1px solid #ffd98a;border-radius:11px;background:#221a08d9;color:#ffe9bb;font:600 12px/1.4 var(--site);pointer-events:none;backdrop-filter:blur(10px)}
.hero-concept b{color:#ffd98a;font-weight:700}
.hero-concept .short{display:none}
@media(max-width:700px){
  .hero-media{grid-template-rows:auto minmax(56px,auto) auto}
  .hero-story{margin-left:12px;padding:7px 11px}
  .hero-story h3{font-size:13.5px}
  .hero-story p{display:none}
  .hero-concept{margin-left:12px;max-width:calc(100% - 12px);padding:6px 10px;font-size:11px}
  .hero-concept .long{display:none}
  .hero-concept .short{display:inline}
}
.hero-scrub{position:absolute;left:0;right:0;bottom:0;height:4px;background:#ffffff22;z-index:3}
[data-theme=light] .hero-scrub{background:#0b1a3322}
.hero-scrub span{position:absolute;left:0;top:0;bottom:0;width:0;background:#7fb1ff}

/* The hero's desk: the dimmer under the outro logo, the demo browser window,
   the shot tray, the region frame and the flash. */
.desk-dim{position:absolute;inset:0;z-index:8;background:#0a1520;pointer-events:none}
/* The hero's intro and outro: the loading sequence's assembly on the desk. The
   app icon becomes the hub; the disc's own renders tick in under masks; the
   rings unfold entry by entry; it all folds back into the icon. */
.desk-hero-assembly{position:absolute;inset:0;z-index:41;display:grid;place-items:center;overflow:visible}
.dha-box{position:relative;transform-origin:center;will-change:transform}
.dha-layer{position:absolute;inset:0;width:100%;height:100%}
.dha-icon-flyer{position:fixed;z-index:10000;pointer-events:none;will-change:transform,opacity;box-shadow:0 18px 40px #0a1a3340}
a.brand img.is-hero-arrived{animation:heroBrandPop .7s ease}
@keyframes heroBrandPop{0%{transform:scale(1)}40%{transform:scale(1.12)}100%{transform:scale(1)}}
.dha-icon{position:absolute;left:50%;top:50%;width:200px;height:200px;margin:-100px 0 0 -100px;z-index:11}
/* The markup note: the app's text-mark colour and sweep, with this page's own
   question in it, set inside the region — never over the window's bar. */
.desk-hero-note{position:absolute;z-index:47;padding:6px 12px;border-radius:10px;background:#ffffffe0;border:1px solid #cfe0f5;box-shadow:0 8px 22px -10px #12243f80;color:#2f6ac2;font:600 15px/1.4 var(--site);white-space:nowrap;pointer-events:none}
.desk-keycap{position:absolute;left:50%;bottom:64px;z-index:74;display:flex;align-items:center;gap:10px;padding:8px 14px;border-radius:14px;background:#0d1626d9;box-shadow:0 12px 30px -12px #000a;color:#eef6ff;font:500 15px/1.2 var(--native);transform:translateX(-50%);pointer-events:none}
.desk-keycap b{padding:5px 12px;border:1px solid #ffffff40;border-bottom-width:3px;border-radius:8px;background:#ffffff1f;font-weight:600}
.desk-chapter{position:absolute;inset:0;z-index:72;display:grid;place-items:center;align-content:center;padding:40px;text-align:center;color:#eef6ff;pointer-events:none}
.desk-chapter[hidden]{display:none}
.desk-chapter h3{margin:0 0 10px;font:700 44px/1.05 var(--site);letter-spacing:-.9px;text-shadow:0 10px 36px #041018}
.desk-chapter p{margin:0 auto;max-width:540px;font:500 18px/1.4 var(--site);color:#c9d7e8;text-shadow:0 6px 20px #041018}
.dha-green{position:absolute;left:50%;top:50%;width:280px;height:280px;margin:-140px 0 0 -140px;border-radius:50%;background:radial-gradient(circle,#30d158a8 0%,#1b7f4680 38%,transparent 70%);z-index:0;opacity:0;pointer-events:none}
.desk-dim.is-green{background:radial-gradient(circle at center,#163528 0%,#0a1520 72%)}
.desk-ai,.desk-wa{position:absolute;left:656px;top:30px;width:600px;height:660px;z-index:48;display:flex;flex-direction:column;border-radius:12px;overflow:hidden;box-shadow:0 30px 60px -28px #12243fb0,0 2px 6px #12243f1f;pointer-events:none;color:#16171a}
.desk-ai{background:#fff}
[data-theme=dark] .desk-ai{background:#1f2a3a;color:#e6edf7}
.desk-ai-tag{margin:0;padding:6px 12px;border-bottom:1px solid #e2e7ee;font:600 11px/1.4 var(--native);color:#5a6472}
.desk-ai-thread{flex:1;min-height:0;overflow:auto;padding:12px 14px;display:flex;flex-direction:column;gap:10px}
.desk-ai-shots,.desk-wa-shots{display:flex;gap:6px;margin-top:8px}
.desk-ai-shots .desk-thumb,.desk-wa-shots .desk-thumb{width:88px;height:64px;flex:none}
.desk-ai-mark,.desk-cloud .desk-ai-mark{width:16px;height:16px;flex:none;display:block;margin-right:6px}
.desk-ai .desk-note-bar,.desk-cloud .desk-note-bar{gap:0;justify-content:center}
.desk-ai .desk-note-bar span:last-of-type,.desk-cloud .desk-note-bar span:last-of-type{margin-left:2px}
.desk-ai-compose,.desk-cloud-compose{display:flex;align-items:center;gap:8px;padding:10px 12px 12px;border-top:1px solid #e2e7ee}
.desk-ai-compose>span,.desk-cloud-compose>span{flex:1;padding:8px 10px;border-radius:9px;background:#f4f7fb;color:#7b8494;font:500 12px/1.3 var(--native)}
.desk-ai-compose b{flex:none;padding:8px 12px;border-radius:8px;background:#4670e9;color:#fff;font:600 12px/1 var(--native)}
.desk-wa{background:#ece5dd}
.desk-wa-head{display:flex;flex-direction:column;gap:2px;padding:12px 16px 10px;background:#075e54;color:#fff}
.desk-wa-head b{font:700 16px/1.2 var(--site)}
.desk-wa-head span{font:500 11px/1.3 var(--native);opacity:.82}
.desk-wa-thread{flex:1;min-height:0;padding:16px 14px;display:flex;flex-direction:column}
.desk-wa-msg{align-self:flex-end;max-width:86%;padding:8px 10px 6px;border-radius:12px 12px 4px 12px;background:#dcf8c6;color:#111b21;box-shadow:0 1px 0 #0001}
.desk-wa-msg span{display:block;margin-top:6px;font:500 13px/1.4 var(--native)}
.desk-wa-msg em{display:block;margin-top:4px;text-align:right;font:600 10px/1 var(--native);color:#53bdeb;font-style:normal}
.desk-stack{position:absolute;left:340px;top:120px;width:600px;z-index:49;padding:18px 20px 16px;border-radius:16px;background:#f7f9fd;border:1px solid #c9d3e2;box-shadow:0 24px 48px -20px #12243fb8;color:#1b2430;pointer-events:none}
.desk-stack header{margin:0 0 12px;font:700 22px/1.2 var(--site)}
.desk-stack ol{margin:0;padding:0;list-style:none}
.desk-stack li{margin:0 0 10px;padding:14px 16px;border-radius:12px;background:#fff;border:1px solid #d5deea;font:600 17px/1.4 var(--site);color:#1a2433}
.desk-stack p{margin:8px 0 0;font:500 14px/1.4 var(--site);color:#5a6472}
.desk-browser .desk-note-tail.is-pasted.is-stack{padding:12px;background:#eef3fb;border:1px solid #c9d6e8}
.desk-browser .desk-note-tail.is-stack span{display:block;margin:0 0 8px;padding:12px 14px;border-radius:10px;background:#fff;border:1px solid #d5deea;font:600 16px/1.45 var(--site);color:#1a2433}
.desk-note.desk-browser{left:56px;top:60px;width:872px;height:600px}
.desk-browser-address{display:inline-flex;align-items:center;height:24px;padding:0 14px;border-radius:12px;background:#e9ebefc9;color:#5b6675;font-size:12px;font-weight:500}
[data-theme=dark] .desk-browser-address{background:#2c3a4dc9;color:#c0cee0}
.desk-browser-viewport{height:calc(100% - 28px);overflow:hidden;background:#fdfcf9}
.desk-browser-page{width:100%;padding:26px 34px 60px;color:#2a3442;font-size:14.5px;line-height:1.55}
.brow-flag{display:inline-block;margin-bottom:18px;padding:3px 10px;border:1px dashed #b9c2cf;border-radius:6px;color:#8a94a3;font-size:11px;font-weight:600;letter-spacing:.3px}
.brow-region{margin-bottom:34px}
.brow-region h2{margin:0 0 10px;font-size:27px;font-weight:700;letter-spacing:-.4px;color:#22303f}
.brow-region h3{margin:0 0 10px;font-size:19px;font-weight:700;letter-spacing:-.2px;color:#22303f}
.brow-lead{max-width:560px;margin:0 0 14px;font-size:15px;color:#4c5a6b}
.brow-facts{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.brow-facts li{padding:5px 11px;border:1px solid #dde3ec;border-radius:16px;background:#fff;color:#3c4a5b;font-size:12.5px;font-weight:600}
.brow-region figure{margin:0}
.brow-region figure img{display:block;width:100%;height:330px;object-fit:cover;border-radius:10px;border:1px solid #e2e7ee;box-shadow:0 10px 26px -16px #12243f66}
.brow-region figcaption{margin-top:8px;font-size:12.5px;color:#778392}
.brow-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid #e2e7ee;border-radius:10px;overflow:hidden;font-size:13.5px}
.brow-table td{padding:9px 13px;border-top:1px solid #edf0f5;vertical-align:top}
.brow-table td:first-child{width:150px;color:#22303f;font-weight:700;border-right:1px solid #edf0f5}
.brow-table tr:first-child td{border-top:0}
.brow-checks{margin:0;padding:0;list-style:none}
.brow-checks li{position:relative;margin-bottom:7px;padding:8px 12px 8px 34px;border:1px solid #e2e7ee;border-radius:9px;background:#fff}
.brow-checks li:before{content:"";position:absolute;left:12px;top:50%;width:11px;height:11px;margin-top:-6px;border:1.5px solid #b6c0cd;border-radius:3px}
.brow-checks li.is-selected{background:#b4d0ff;border-color:#8fb0e0}
[data-theme=dark] .brow-checks li.is-selected{background:#2d5da8;border-color:#4a7ec2}
.brow-hint{margin:0 0 6px;font-size:12px;color:#98a2b0}
.desk-browser .desk-note-tail{min-height:64px;margin:0;padding:10px 12px;border:1px dashed #c3ccd8;border-radius:9px;background:#fff;font-size:13.5px}
.desk-browser-rail{position:absolute;right:0;top:28px;bottom:0;width:10px;background:#f1f3f7;border-left:1px solid #e6eaf0}
.desk-browser-thumb{position:absolute;left:2px;width:6px;border-radius:3px;background:#c2cbd8}
/* The clipboard home, the app's panel in the app's order: header (title, live
   count, pin, collapse), the Input Monitor band, the five tool toggles, the
   action row above the cards, the cards, Share, the selection hint, and the
   Settings/Quit row with the Reset-after-paste switch. The panel is a
   deliberate miniature of the app's 620pt home — the desk is a miniature Mac. */
.desk-tray{position:absolute;left:952px;top:48px;width:300px;padding:10px;border:1px solid #747984;border-radius:14px;background:linear-gradient(#dbe2f3f5,#f7f7f8 170px);box-shadow:0 12px 30px #0003;backdrop-filter:blur(14px);z-index:25;color:#16171a}
[data-theme=dark] .desk-tray{background:linear-gradient(#2a3647f5,#232d3c 170px);border-color:#48566b;color:#e6edf7}
.desk-clipboard-head{display:flex;align-items:center;gap:7px;margin-bottom:10px;font-size:13px;font-weight:600}
.desk-clipboard-count{height:18px;padding:1px 8px;border-radius:9px;background:#4670e9;color:#fff;font:600 11px/16px var(--native);font-variant-numeric:tabular-nums}
.desk-clipboard-gear{margin-left:auto;width:22px;height:22px;border-radius:11px;background:#4670e924;display:grid;place-items:center;color:#4670e9}
.desk-clipboard-gear .dda{width:11px;height:11px}
.desk-clipboard-pin{width:22px;height:22px;border-radius:11px;background:#4670e924;display:grid;place-items:center;color:#4670e9}
.desk-clipboard-collapse{width:22px;height:22px;border-radius:11px;background:#4670e924;display:grid;place-items:center;color:#4670e9}
.dda{--m:none;display:inline-block;width:11px;height:11px;flex:none;background:currentColor;-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}
.desk-clipboard-pin .dda{width:10px;height:10px}
.desk-clipboard-collapse .dda{width:10px;height:10px}
.dda.doc-on-doc{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='black' d='M4 0h4l2 2v8a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V1a1 1 0 0 1 1-1Zm4 0v2h2'/%3E%3Cpath fill='black' opacity='.4' d='M2 3h4l2 2v6a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1Z'/%3E%3C/svg%3E")}
.dda.trash{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='black' d='M4 0h4v1h4v2H0V1h4V0ZM1.5 4h9l-.8 7.1A1.2 1.2 0 0 1 8.5 12h-5a1.2 1.2 0 0 1-1.2-.9L1.5 4Z'/%3E%3C/svg%3E")}
.dda.square-down{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='black' d='M0 0h12v12H0V0Zm1.5 1.5v9h9v-9h-9ZM6 2.5 8.6 5H7v3H5V5H3.4L6 2.5Z'/%3E%3C/svg%3E")}
.dda.sparkles{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='black' d='M6 0l1.1 3.2L10.5 4 7.6 5.4 6 9 4.4 5.4 1.5 4l3.4-.8L6 0Zm4.5 7 .6 1.4 1.4.6-1.4.6-.6 1.4-.6-1.4-1.4-.6 1.4-.6.6-1.4Z'/%3E%3C/svg%3E")}
.dda.share{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='black' d='M6 0l4 3.6L6 7V4.7c-2.2.2-3.6 1.3-4.4 3.2C1.4 5.3 3 2.9 6 2.5V0ZM2 8h8v4H2V8Zm1 1v2h6V9H3Z'/%3E%3C/svg%3E")}
.dda.gear{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='black' d='M4.9 0h2.2l.3 1.6 1.4.6 1.4-.8 1.6 1.6-.8 1.4.6 1.4L12 6.9v2.2l-1.6.3-.6 1.4.8 1.4-1.6 1.6-1.4-.8-1.4.6-.3 1.6H4.9l-.3-1.6-1.4-.6-1.4.8-1.6-1.6.8-1.4-.6-1.4L0 7.9V5.7l1.6-.3.6-1.4-.8-1.4L2.9 1l1.4.8 1.4-.6L4.9 0ZM6 3.6a2.4 2.4 0 1 0 0 4.8 2.4 2.4 0 0 0 0-4.8Z'/%3E%3C/svg%3E")}
.dda.power{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='black' d='M5 0h2v5H5V0ZM3.4 1.4 4.7 2.7a4 4 0 1 0 2.6 0l1.3-1.3a5.7 5.7 0 1 1-5.2 0Z'/%3E%3C/svg%3E")}
.dda.pin{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='black' d='M6 0a4 4 0 0 1 4 4c0 2.9-3.1 7.5-4 8-.9-.5-4-5.1-4-8a4 4 0 0 1 4-4Zm0 2.3A1.7 1.7 0 1 0 6 5.7 1.7 1.7 0 0 0 6 2.3Z'/%3E%3C/svg%3E")}
.dda.chevron-up{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='black' d='M6 2l5 6H1l5-6Z'/%3E%3C/svg%3E")}
.desk-clipboard-pin .dda{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='black' d='M6 0a4 4 0 0 1 4 4c0 2.9-3.1 7.5-4 8-.9-.5-4-5.1-4-8a4 4 0 0 1 4-4Zm0 2.3A1.7 1.7 0 1 0 6 5.7 1.7 1.7 0 0 0 6 2.3Z'/%3E%3C/svg%3E")}
.desk-clipboard-collapse .dda{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='black' d='M6 2l5 6H1l5-6Z'/%3E%3C/svg%3E")}
.desk-clipboard-monitor{margin-bottom:8px;padding:4px 8px;border:1px solid #c9cfd8;border-radius:10px;background:#fff;font:600 11px/1.5 var(--native)}
[data-theme=dark] .desk-clipboard-monitor{background:#ffffff12;border-color:#ffffff22}
.desk-clipboard-toggles{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin-bottom:8px}
.desk-clipboard-toggles>span{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:47px;padding:4px;border:1px solid #c9cfd8;border-radius:10px;background:#fff;text-align:center;font-size:8px;line-height:1.15;color:#3c4756}
[data-theme=dark] .desk-clipboard-toggles>span{background:#ffffff0d;border-color:#ffffff1f;color:#c8d2e0}
.desk-clipboard-toggles .is-on{background:#4670e929;border-color:#4670e98c;color:#2b50b8}
[data-theme=dark] .desk-clipboard-toggles .is-on{color:#9db8f5}
.dct-check{position:absolute;left:3px;top:3px;width:8px;height:8px;border-radius:50%;background:#4670e9;display:none}
.desk-clipboard-toggles .is-on .dct-check{display:block;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath fill='white' d='M5 0a5 5 0 1 0 0 10A5 5 0 0 0 5 0Zm-.7 7.1L2.4 5.2l.9-.9 1 1 2.4-2.4.9.9-3.3 3.3Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath fill='white' d='M5 0a5 5 0 1 0 0 10A5 5 0 0 0 5 0Zm-.7 7.1L2.4 5.2l.9-.9 1 1 2.4-2.4.9.9-3.3 3.3Z'/%3E%3C/svg%3E") center/contain no-repeat}
.dct-glyph{width:13px;height:13px;border-radius:3px;background:currentColor;opacity:.85}
.desk-clipboard-toggles>span:first-child .dct-glyph{-webkit-mask:url('website-assets/icons/MouseTools-UI.svg') center/contain no-repeat;mask:url('website-assets/icons/MouseTools-UI.svg') center/contain no-repeat;border-radius:0}
.desk-clipboard-toggles>span em{font-style:normal;font-weight:500}
.desk-clipboard-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin:9px 0 8px}
.desk-clipboard-actions span{display:inline-flex;align-items:center;justify-content:center;gap:4px;min-height:26px;padding:3px 2px;background:#fff;border:1px solid #c9cfd8;border-radius:10px;font:500 8.5px/1.2 var(--native);color:#3c4756;white-space:nowrap}
[data-theme=dark] .desk-clipboard-actions span{background:#ffffff0d;border-color:#ffffff1f;color:#c8d2e0}
.desk-clipboard-share{display:flex;margin:2px 0 6px}
.desk-clipboard-share span{display:inline-flex;align-items:center;gap:5px;padding:4px 12px;background:#fff;border:1px solid #c9cfd8;border-radius:10px;font:500 9.5px/1.3 var(--native);color:#3c4756}
[data-theme=dark] .desk-clipboard-share span{background:#ffffff0d;border-color:#ffffff1f;color:#c8d2e0}
.desk-clipboard-selection{margin:4px 0 8px;font:400 11px/1.4 var(--native);color:#5a6472}
[data-theme=dark] .desk-clipboard-selection{color:#9aa6b6}
.desk-clipboard-settings{display:flex;align-items:center;gap:8px;font:500 9px/1.2 var(--native);color:#3c4756}
[data-theme=dark] .desk-clipboard-settings{color:#c8d2e0}
.desk-clipboard-settings .dcs-settings,.desk-clipboard-settings .dcs-quit{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;border-radius:10px;background:#fff;border:1px solid #c9cfd8;color:#2b50b8}
[data-theme=dark] .desk-clipboard-settings .dcs-settings,[data-theme=dark] .desk-clipboard-settings .dcs-quit{background:#ffffff0d;border-color:#ffffff1f;color:#9db8f5}
.desk-clipboard-settings .dcs-quit{color:#c0472e}
[data-theme=dark] .desk-clipboard-settings .dcs-quit{color:#e5886f}
.dcs-reset{display:inline-flex;align-items:center;gap:6px;color:#7b8494}
.dcs-switch{position:relative;width:22px;height:13px;border-radius:7px;background:#d4d9e0;flex:none}
.dcs-switch:after{content:"";position:absolute;left:1px;top:1px;width:11px;height:11px;border-radius:50%;background:#fff;box-shadow:0 1px 2px #0003}
[data-theme=dark] .dcs-switch{background:#ffffff26}
.desk-tray-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}
.desk-tray-slot{position:relative;height:72px;padding:4px;border:1px solid #c9cfd8;border-radius:10px;overflow:hidden;background:#fff;transition:border-color .2s,background .2s}
[data-theme=dark] .desk-tray-slot{background:#ffffff0d;border-color:#ffffff1f}
.desk-tray-slot.is-filled{border-color:#9aa3b0}
.desk-tray-slot.is-picked{border:1.5px solid #4670e9;background:#fff;box-shadow:0 0 0 3px #4670e959}
[data-theme=dark] .desk-tray-slot.is-picked{background:#ffffff0d}
.desk-handoff{position:absolute;left:360px;top:156px;width:400px;padding:14px 16px 12px;border:1px solid #747984;border-radius:14px;background:linear-gradient(#e8eef8f7,#f7f7f8);box-shadow:0 16px 36px #0003;z-index:48;color:#16171a;pointer-events:none}
[data-theme=dark] .desk-handoff{background:linear-gradient(#2a3647f7,#232d3c);border-color:#48566b;color:#e6edf7}
.desk-handoff header{margin:0 0 4px;font:700 15px/1.2 var(--site)}
.desk-handoff p{margin:0 0 10px;font:500 12px/1.4 var(--site);color:#5a6472}
[data-theme=dark] .desk-handoff p{color:#9aa6b6}
.desk-handoff-row{display:flex;align-items:baseline;gap:8px;padding:8px 10px;border:1px solid #c9cfd8;border-radius:10px;margin-top:7px}
[data-theme=dark] .desk-handoff-row{border-color:#ffffff1f}
.desk-handoff-row strong{font:700 13px/1.3 var(--site)}
.desk-handoff-row span{flex:1;font:500 12px/1.3 var(--site);color:#5a6472}
.desk-handoff-row b{min-width:52px;text-align:right;font:600 11px/1.3 var(--native);color:transparent}
.desk-handoff-row.is-on{border-color:#4670e9;box-shadow:0 0 0 3px #4670e959}
.desk-handoff-row.is-sent b{color:#1f8f4e}
.desk-handoff-row.is-sent b:after{content:"Sent · demo"}
.desk-thumb{border-radius:6px;overflow:hidden;background:#fdfcf9;box-shadow:0 8px 20px -10px #0b1a3388;border:1px solid #00000014;pointer-events:none}
.desk-thumb>*{margin:0!important;pointer-events:none;user-select:none}
/* The capture frame, the app's own drawing: a black keyline with a white rim,
   accent corner brackets, everything outside dimmed to black 0.18, and the
   size pill centred just below the frame — "W × H px", monospaced digits. */
.desk-shotframe{position:absolute;z-index:65;pointer-events:none;border-radius:1px;box-shadow:0 0 0 3px rgba(0,0,0,.8),0 0 0 4px rgba(255,255,255,.95),0 0 0 2000px rgba(0,0,0,.18);
background:
linear-gradient(#4670e9,#4670e9) left top/14px 2px,
linear-gradient(#4670e9,#4670e9) left top/2px 14px,
linear-gradient(#4670e9,#4670e9) right top/14px 2px,
linear-gradient(#4670e9,#4670e9) right top/2px 14px,
linear-gradient(#4670e9,#4670e9) left bottom/14px 2px,
linear-gradient(#4670e9,#4670e9) left bottom/2px 14px,
linear-gradient(#4670e9,#4670e9) right bottom/14px 2px,
linear-gradient(#4670e9,#4670e9) right bottom/2px 14px;
background-repeat:no-repeat}
.desk-shotframe span{position:absolute;left:50%;top:calc(100% + 12px);transform:translateX(-50%);padding:4px 9px;border-radius:8px;background:rgba(23,32,44,.96);border:1px solid rgba(70,112,233,.7);color:#fff;font:600 11px/1.3 var(--native);font-variant-numeric:tabular-nums;white-space:nowrap}
.desk-flash-hero{position:absolute;z-index:66;background:#fff;pointer-events:none;border-radius:4px}
.desk-file i{position:relative;overflow:hidden}
.desk-file-thumb{position:absolute;left:1px;top:1px;max-width:calc(100% - 2px);max-height:calc(100% - 2px);border-radius:3px;box-shadow:none}
.desk-file-thumb .desk-thumb{border:0;border-radius:0;box-shadow:none}

/* The desk: a drawn Mac under the app's own surfaces. Laid out in 1280 x 720 desk
   units and scaled to whatever width it is given; the layers are the app's own
   pixels (website-assets/layers), the note, the folder and the mouse are the page's. */
.desk-host{position:relative;display:block;width:100%;aspect-ratio:16/9;overflow:hidden;background:#95c3df}
/* zoom, not transform: the browser lays the desk out at its shown size and draws
   every layer at the screen's own pixels — a transform rasterises once and scales
   the result, and the disc's lettering went soft. */
.desk{position:absolute;left:0;top:0;width:1280px;height:720px;zoom:var(--desk-scale,1);font-family:var(--native);overflow:hidden;isolation:isolate;z-index:1}
/* PointerFX overlay: a screen-sized panel above the desk windows, trail under the
   cursor. Live Trail lifts it to the page (position:fixed) so it is not only the 16:9 canvas. */
.desk-overlay{position:absolute;inset:0;z-index:6;pointer-events:none;overflow:visible}
.desk-overlay.is-screen{position:fixed;inset:0;z-index:80;width:auto;height:auto}
.desk-overlay.is-live .desk-cursor{visibility:hidden}
.desk-wallpaper{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
[data-theme=dark] .desk-wallpaper{filter:brightness(.52) saturate(.85) hue-rotate(10deg)}
.desk-menubar{position:absolute;inset:0 0 auto;height:24px;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:0 14px;background:#e7f0f6a3;border-bottom:1px solid #ffffff36;backdrop-filter:blur(24px);font-size:13px;color:#1d2733;user-select:none}
.desk-menubar>div{display:flex;align-items:center;gap:16px}
.desk-menubar b{font-weight:650}
.desk-status{display:inline-flex;align-items:center;gap:6px;height:20px;padding:0 8px;border:1px solid currentColor;border-radius:8px;font-size:11px;font-weight:600;font-variant-numeric:tabular-nums;opacity:.92}
.desk-hero .desk-status{gap:7px;font-variant-numeric:tabular-nums}
.desk-brand-mark{display:inline-block;flex:none;width:14px;height:14px;background:currentColor;mask:url('website-assets/icons/MouseTools-UI.svg') center/contain no-repeat;-webkit-mask:url('website-assets/icons/MouseTools-UI.svg') center/contain no-repeat}
[data-theme=dark] .desk-menubar{background:#1a2d42a8;color:#b1c7df;border-color:#ffffff0e}
.desk-note,.desk-finder{position:absolute;z-index:10;display:flex;flex-direction:column;border-radius:12px;background:#fff;box-shadow:0 30px 60px -28px #12243fb0,0 2px 6px #12243f1f;overflow:hidden;user-select:none}
.desk-note{left:290px;top:80px;width:700px;height:560px}
.desk-finder{left:24px;top:410px;width:250px;height:260px}
[data-theme=dark] .desk-note,[data-theme=dark] .desk-finder{background:#1f2a3a;color:#e6edf7}
.desk-note-bar{position:relative;display:flex;align-items:center;justify-content:center;height:28px;padding:0 14px;background:#f5f7fa;border-bottom:1px solid #e2e7ee;font-size:13px;font-weight:600;color:#405063;flex:none}
.desk-note-bar .desk-dots{position:absolute;left:12px;top:50%;transform:translateY(-50%)}
[data-theme=dark] .desk-note-bar{background:#283548;border-color:#3a4a60;color:#c0cee0}
.desk-dots{display:inline-flex;gap:7px}
.desk-dots i{width:12px;height:12px;border-radius:50%;background:#ff5f57}
.desk-dots i:nth-child(2){background:#febc2e}
.desk-dots i:nth-child(3){background:#28c840}
.desk-note-body{padding:26px 40px;font-size:17px;line-height:1.55;color:#2a3442;overflow:hidden}
[data-theme=dark] .desk-note-body{color:#e6edf7}
.desk-note-body h3{margin:0 0 14px;font-size:22px;font-weight:700;letter-spacing:-.2px}
.desk-note-body p{margin:0 0 10px;padding:1px 6px;margin-left:-6px;border-radius:4px}
.desk-note-body p.is-selected{background:#b4d0ff}
[data-theme=dark] .desk-note-body p.is-selected{background:#2d5da8}
.desk-note-tail{min-height:1em;color:#2a3442}
[data-theme=dark] .desk-note-tail{color:#e6edf7}
.desk-note-tail.is-pasted span{display:inline-block}
.desk-finder-body{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;padding:16px}
.desk-file{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;color:#3b4859;text-align:center}
.desk-file i{width:58px;height:70px;border-radius:5px;background:linear-gradient(#fff,#eef2f7);border:1px solid #cfd8e3;box-shadow:0 2px 4px #12243f14}
.desk-layers{position:absolute;inset:0;z-index:20;pointer-events:none}
.desk-layer{position:absolute;left:0;top:0;width:200px;height:auto;transform-origin:center;will-change:transform,opacity;filter:drop-shadow(0 16px 30px #0b1a3352)}
.desk-layer[data-layer^="mark-"],.desk-layer[data-layer^="pulse-"],.desk-layer[data-layer="ring"],.desk-layer[data-layer="trail"],.desk-layer[data-layer="flash"]{filter:none}
.desk-layer[data-layer="capture-frame"]{filter:none;width:1280px;height:720px}
.desk-mark-sweep{-webkit-mask:conic-gradient(from -20deg,#000 var(--sweep,0turn),transparent 0);mask:conic-gradient(from -20deg,#000 var(--sweep,0turn),transparent 0)}
.desk-shade{position:absolute;inset:0;width:100%;height:100%;z-index:60;pointer-events:none}
.desk-shade[hidden]{display:none}
.desk-trail{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.desk-trail[hidden]{display:none}
.desk-overlay .desk-cursor{position:absolute;left:0;top:0;width:28px;height:40px;z-index:3;pointer-events:none;filter:drop-shadow(0 3px 4px #20344950)}
.desk-overlay-ring{position:absolute;left:0;top:0;z-index:2;pointer-events:none;filter:none}
.desk-focus{position:absolute;z-index:70;border:1.5px solid #6ea9eb;border-radius:9px;box-shadow:0 0 0 4px #75a8e91a;pointer-events:none}
.desk-focus>span{position:absolute;left:8px;top:calc(100% + 8px);white-space:nowrap;font-size:12px;line-height:1.4;background:#f2f8ffed;color:#345b87;border:1px solid #bed5f0;border-radius:5px;padding:5px 8px}
.desk-mouse{position:absolute;right:34px;bottom:26px;z-index:90;display:flex;flex-direction:column;align-items:center;gap:9px;user-select:none;pointer-events:none;will-change:transform}
.desk-live .desk-mouse{transition:transform .09s linear}
.desk-mouse-body{position:relative;width:84px;height:129px;border:1px solid #ffffffd9;border-radius:43px 43px 36px 36px;background:radial-gradient(ellipse at 34% 18%,#fff 8%,#f5f7fa 43%,#d6dfe9 91%);box-shadow:inset 2px 1px 3px #fff,inset -3px -4px 8px #a6b3c66b,0 13px 16px -6px #17314b77,0 2px 4px #18355233;transform:rotate(10deg);transition:transform .12s}
.desk-mouse.pressed .desk-mouse-body{transform:rotate(10deg) translateY(2px)}
.desk-mouse-seam{position:absolute;left:50%;top:0;width:1px;height:54px;background:#c1ccd87a}
.desk-mouse-wheel{position:absolute;z-index:1;width:14px;height:29px;left:calc(50% - 7px);top:18px;border:1px solid #cc4444;border-radius:8px;background:repeating-linear-gradient(0deg,#f76f68 0 2px,#df4847 2px 4px);box-shadow:0 0 0 4px #f66b6330,0 0 12px #ff696966,inset 0 1px 2px #ffb1a1;transition:transform .12s}
.desk-mouse.pressed .desk-mouse-body{transform:rotate(10deg) translateY(2px)}
.desk-mouse-body span{position:absolute;bottom:25px;left:0;right:0;text-align:center;color:#9caaba;font-family:var(--site);font-size:6px;letter-spacing:.5px}
.desk-mouse-caption{font-size:11px;font-weight:600;color:#fff;text-shadow:0 1px 3px #0009}
.desk-mouse-caption:empty{display:none}
/* Neon Night's aura: the app's accent halo, breathing behind the open disc. */
.desk-aura{position:absolute;width:560px;height:560px;border-radius:50%;pointer-events:none;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(255,60,172,.5),rgba(124,77,255,.32) 45%,transparent 68%);animation:desk-aura 1.4s ease-in-out infinite}
@keyframes desk-aura{0%,100%{opacity:.55;scale:.96}50%{opacity:1;scale:1.05}}
/* A coordinate plate beside a mark, the app's own style: monospaced digits,
   white on black at 0.72, counted from the screen's bottom-left corner. */
.desk-plate{position:absolute;padding:1.5px 6px;border-radius:4px;background:rgba(0,0,0,.72);color:rgba(255,255,255,.95);font:500 10px/1.4 var(--native);font-variant-numeric:tabular-nums;white-space:nowrap;pointer-events:none;z-index:36}
@media(prefers-reduced-motion:reduce){.desk-layer,.desk-cursor{transition:none}}

/* Keep the OS pointer visible; only the animated reel needs a drawn arrow. */
.desk-live{cursor:default;touch-action:none;user-select:none;-webkit-user-select:none}
.desk-live:focus-visible{outline:3px solid var(--blue);outline-offset:-3px}
/* Playtest default scene: sample document, Cloud chat already open, clipboard
   already on the right — screenshot, drag and Send to AI without hunting. */
.desk-live .desk-note{left:18px;top:40px;width:500px;height:640px}
.desk-live .desk-note-body{padding:18px 22px;font-size:15px}
.desk-live .desk-note-body h3{font-size:18px;margin-bottom:10px}
.desk-live .desk-note.is-drop{box-shadow:0 0 0 3px #4670e9,0 30px 60px -28px #12243fb0}
.desk-live .desk-tray{left:944px;top:40px;width:318px;z-index:26}
.desk-live .desk-clipboard-monitor,.desk-live .desk-clipboard-toggles{display:none}
.desk-live .desk-clipboard-actions{grid-template-columns:repeat(3,1fr)}
.desk-live .desk-clipboard-actions [data-tray-action="send"]{grid-column:1/-1;min-height:34px;background:#4670e9;border-color:#3560d4;color:#fff;font:600 12px/1.2 var(--native)}
.desk-live .desk-clipboard-actions [data-tray-action="send"] .dda{color:#fff}
.desk-live .desk-tray-slot{height:86px}
.desk-cloud{position:absolute;left:530px;top:40px;width:400px;height:640px;z-index:12;display:flex;flex-direction:column;border-radius:12px;background:#fff;box-shadow:0 30px 60px -28px #12243fb0,0 2px 6px #12243f1f;overflow:hidden;color:#16171a}
[data-theme=dark] .desk-cloud{background:#1f2a3a;color:#e6edf7}
.desk-cloud-tag{margin:0;padding:6px 12px;border-bottom:1px solid #e2e7ee;font:600 11px/1.4 var(--native);color:#5a6472;letter-spacing:.2px}
[data-theme=dark] .desk-cloud-tag{border-color:#3a4a60;color:#9aa6b6}
.desk-cloud-thread{flex:1;min-height:0;overflow:auto;padding:12px 14px 8px;display:flex;flex-direction:column;gap:10px}
.desk-cloud-msg{max-width:92%;padding:8px 11px;border-radius:12px;font:500 13px/1.45 var(--native)}
.desk-cloud-msg p{margin:0}
.desk-cloud-msg.is-user{align-self:flex-end;background:#4670e9;color:#fff;border-bottom-right-radius:4px}
.desk-cloud-msg.is-assistant{align-self:flex-start;background:#eef2f7;color:#243040;border-bottom-left-radius:4px}
[data-theme=dark] .desk-cloud-msg.is-assistant{background:#2a3647;color:#e6edf7}
.desk-cloud-attach{display:flex;align-items:center;gap:8px;margin-top:6px;padding:6px;border-radius:8px;background:#ffffff24}
.desk-cloud-swatch{width:36px;height:28px;border-radius:5px;border:1px solid #ffffff55;flex:none}
.desk-cloud-drop{margin:0 12px 8px;padding:8px 10px;border:1px dashed #9aa8bc;border-radius:10px;background:#f4f7fb;color:#5a6472;font:600 11px/1.4 var(--native);text-align:center}
[data-theme=dark] .desk-cloud-drop{background:#ffffff0d;border-color:#ffffff33;color:#9aa6b6}
.desk-cloud.is-drop .desk-cloud-drop{border-color:#4670e9;background:#4670e918;color:#2b50b8}
.desk-cloud-compose{display:flex;align-items:center;gap:8px;padding:10px 12px 12px;border-top:1px solid #e2e7ee}
[data-theme=dark] .desk-cloud-compose{border-color:#3a4a60}
.desk-cloud-compose>span{flex:1;padding:8px 10px;border-radius:9px;background:#f4f7fb;color:#7b8494;font:500 12px/1.3 var(--native)}
[data-theme=dark] .desk-cloud-compose>span{background:#ffffff0d;color:#9aa6b6}
.desk-cloud-compose button{flex:none;padding:8px 12px;border:0;border-radius:8px;background:#4670e9;color:#fff;font:600 12px/1 var(--native);cursor:pointer}
.desk-live .desk-tray{pointer-events:auto}
.desk-live .desk-clipboard-actions span,.desk-live .desk-clipboard-share span,.desk-live .dcs-settings,.desk-live .dcs-quit,.desk-live .desk-tray-slot{cursor:pointer}
.desk-drag-ghost{position:absolute;z-index:46;width:120px;padding:6px;border-radius:10px;background:#fff;border:1.5px solid #4670e9;box-shadow:0 12px 24px #12243f40;pointer-events:none;font:600 10px/1.3 var(--native);color:#243040}
.desk-drag-ghost i{display:block;height:44px;border-radius:6px;margin-bottom:4px}
.desk-marks{position:absolute;inset:0;width:100%;height:100%;z-index:15;pointer-events:none;overflow:visible}
.desk-extra{position:absolute;inset:0;z-index:40;pointer-events:none}
.desk-text{position:absolute;min-width:24px;max-width:600px;padding:2px 4px;font:500 22px/1.2 var(--native);color:#4DB8FF;text-shadow:0 1px 4px rgba(0,0,0,.7);white-space:pre-wrap;outline:none;pointer-events:auto;cursor:text}
.desk-text[contenteditable=true]{min-width:90px;padding:8px 11px;outline:none;cursor:text;border-radius:9px;background:#0004189e;border:2px solid #4670e9;caret-color:#fff;box-shadow:0 8px 22px -8px #000c}
.desk-frame{position:absolute;border-radius:1px;box-shadow:0 0 0 3px rgba(0,0,0,.8),0 0 0 4px rgba(255,255,255,.95),0 0 0 2000px rgba(0,0,0,.18);pointer-events:none}
.desk-frame .dfc{position:absolute;width:14px;height:14px;filter:drop-shadow(0 0 4px rgba(70,112,233,.9))}
.dfc:before,.dfc:after{content:"";position:absolute;background:#4670e9}
.dfc:before{width:14px;height:2px}
.dfc:after{width:2px;height:14px}
.dfc-tl{left:0;top:0}.dfc-tr{right:0;top:0}.dfc-tr:before{right:0}.dfc-tr:after{right:0}
.dfc-bl{left:0;bottom:0}.dfc-bl:after{bottom:0}
.dfc-br{right:0;bottom:0}.dfc-br:before{right:0}.dfc-br:after{right:0;bottom:0}
.desk-frame-badge{position:absolute;transform:translateX(-50%);padding:4px 9px;border-radius:8px;background:rgba(23,32,44,.96);border:1px solid rgba(70,112,233,.7);color:#fff;font:600 11px/1.3 var(--native);font-variant-numeric:tabular-nums;white-space:nowrap;pointer-events:none;z-index:67}
.desk-flash{position:absolute;background:#fff;animation:desk-flash .28s ease-out forwards;pointer-events:none}
@keyframes desk-flash{from{opacity:.8}to{opacity:0}}

/* A short window: the head shrinks so the desk stays on screen. */
@media(max-height:640px){
  .features-page{padding-top:16px}
  .features-head{margin-bottom:12px}
  .features-head h1{font-size:22px;margin:0 0 4px}
  .features-head p{font-size:14px;margin:0 0 4px}
  .feature-big-head{padding:10px 16px 4px}
  .feature-big-head h2{font-size:17px}
  .feature-big-head p{display:none}
  .reel-chapters{padding:4px 16px 6px}
  .feature-story{min-height:0;padding:0 16px 6px}
  .feature-story h3{font-size:14px}
  .feature-story p{font-size:12px}
}

/* The Settings window on the desk: the app's own chrome, 780 x 560, centred.
   No title text — the traffic lights float over full-size content, and the
   detail page wears a wash of its tab's colour, as in the app. */
.desk-settings{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:58;width:780px;height:560px}
.ds-window{position:relative;width:100%;height:100%;display:flex;border-radius:11px;overflow:hidden;background:#f5f5f7;box-shadow:0 40px 90px -24px #04101fb5,0 0 0 1px #00000018}
.ds-window:before{content:"";position:absolute;left:12px;top:9px;width:12px;height:12px;border-radius:50%;background:#ff5f57;box-shadow:20px 0 #febc2e,40px 0 #28c840;z-index:5}
[data-theme=dark] .ds-window{background:#23252b;color:#e8ecf3}
.ds-sidebar{width:200px;flex:none;padding:32px 8px 8px;background:#ececf0;border-right:1px solid #00000012}
[data-theme=dark] .ds-sidebar{background:#1c1e23;border-color:#ffffff14}
.ds-sidebar ul{list-style:none;margin:0;padding:0}
.ds-sidebar li{display:flex;align-items:center;gap:7px;height:30px;padding:0 8px;border-radius:7px;font:400 13px/1 var(--native);color:#2a3442;cursor:pointer;user-select:none}
.ds-sidebar li .ds-icon{width:15px;height:15px;color:var(--tab)}
.ds-sidebar li:hover{background:#0000000d}
.ds-sidebar li.is-on{background:#377cf6;color:#fff}
.ds-sidebar li.is-on .ds-icon{color:#fff}
[data-theme=dark] .ds-sidebar li{color:#c9d1dd}
.ds-main{flex:1;min-width:0;display:flex;flex-direction:column;padding:14px 22px 18px;overflow:hidden}
.ds-page-head{display:flex;align-items:center;gap:10px;margin-bottom:14px;color:var(--tab)}
.ds-page-head .ds-icon{width:21px;height:21px}
.ds-page-head h4{margin:0;font:700 22px/1.1 var(--native);color:var(--ink);letter-spacing:-.3px}
[data-theme=dark] .ds-page-head h4{color:#eef2f8}
.ds-subtabs{margin:-6px 0 12px}
.ds-seg{display:inline-flex;background:#00000014;border-radius:7px;padding:2px}
[data-theme=dark] .ds-seg{background:#ffffff14}
.ds-seg b{padding:3px 14px;border-radius:5px;font:500 13px/1.4 var(--native);color:#3c4756;cursor:pointer}
[data-theme=dark] .ds-seg b{color:#c9d1dd}
.ds-seg b.is-on{background:#fff;box-shadow:0 1px 3px #0002;color:#1d2733}
[data-theme=dark] .ds-seg b.is-on{background:#3a4150;color:#f2f5fa}
.ds-content{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:18px;padding-bottom:8px;scrollbar-width:thin}
.ds-section h5{display:flex;align-items:center;gap:6px;margin:0 0 7px;font:600 11px/1 var(--native);letter-spacing:.4px;color:#7d8798;text-transform:uppercase}
[data-theme=dark] .ds-section h5{color:#8b95a5}
.ds-section .ds-mark{width:17px;height:17px;color:#9aa4b2}
[data-theme=dark] .ds-section .ds-mark{color:#78828f}
.ds-card{border:1px solid #dfe3e9;border-radius:10px;background:#fff;overflow:hidden}
[data-theme=dark] .ds-card{background:#ffffff0d;border-color:#ffffff17}
.ds-row{display:flex;align-items:center;gap:16px;min-height:40px;padding:8px 13px;font:400 13px/1.35 var(--native);color:#2a3442}
[data-theme=dark] .ds-row{color:#dde4ee}
.ds-row+.ds-row{border-top:1px solid #eceff3}
[data-theme=dark] .ds-row+.ds-row{border-color:#ffffff10}
.ds-row-title{flex:1;min-width:0}
.ds-row-stacked{flex-direction:column;align-items:stretch;gap:10px;padding-top:10px}
.ds-row-detail{flex-basis:100%;font-size:11px;color:#8b95a5}
.ds-row:has(>.ds-row-detail){flex-wrap:wrap;row-gap:3px}
.ds-row-note{font-size:11px;color:#8b95a5}
.ds-button{padding:3px 12px;border:1px solid #cfd5dd;border-radius:6px;background:#fff;font:500 12.5px/1.5 var(--native);color:#2a3442;cursor:pointer;box-shadow:0 .5px 1.5px #00000012;white-space:nowrap}
[data-theme=dark] .ds-button{background:#2a2e36;border-color:#ffffff1f;color:#dde4ee}
.ds-switch{position:relative;width:30px;height:18px;flex:none;border-radius:20px;background:#d4d8df;cursor:pointer;transition:background .15s}
.ds-switch:after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:transform .15s}
.ds-switch.is-on{background:#377cf6}
.ds-switch.is-on:after{transform:translateX(12px)}
.ds-popup{display:inline-flex;align-items:center;gap:14px;max-width:220px;padding:2px 8px;border:1px solid #cfd5dd;border-radius:6px;background:#fff;font:400 13px/1.6 var(--native);color:#2a3442;cursor:pointer;box-shadow:0 .5px 1.5px #00000012}
[data-theme=dark] .ds-popup{background:#2a2e36;border-color:#ffffff1f;color:#dde4ee}
.ds-popup svg{width:9px;height:6px;opacity:.6}
.ds-slider{display:inline-flex;align-items:center;gap:9px}
.ds-slider-track{position:relative;width:120px;height:4px;border-radius:2px;background:#d4d8df}
[data-theme=dark] .ds-slider-track{background:#ffffff22}
.ds-slider-track i{position:absolute;left:0;top:0;bottom:0;border-radius:2px;background:#377cf6}
.ds-slider-track b{position:absolute;top:50%;width:15px;height:15px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0004;transform:translate(-50%,-50%)}
.ds-slider-label{font:500 12px/1 var(--native);font-variant-numeric:tabular-nums;color:#5a6472;min-width:38px}
[data-theme=dark] .ds-slider-label{color:#9aa6b6}
.ds-reactive{display:inline-flex;align-items:center;gap:8px;font:400 11px/1 var(--native);color:#5a6472}
.ds-swatches{display:inline-flex;gap:7px}
.ds-swatches i{width:20px;height:20px;border-radius:50%;border:1px solid #00000022;cursor:pointer}
.ds-swatches i.is-selected{box-shadow:0 0 0 2px #f5f5f7,0 0 0 4px #2a3442}
.ds-well{display:inline-flex;align-items:center;gap:7px;font:400 13px/1 var(--native);color:#2a3442}
[data-theme=dark] .ds-well{color:#dde4ee}
.ds-well i{width:28px;height:22px;border-radius:5px;border:1px solid #00000022;background:linear-gradient(140deg,#6490f5,#3e65d7)}
.ds-mousepic{display:flex;flex-direction:column;align-items:center;gap:8px;padding:6px 0 4px}
.ds-mp-body{position:relative;width:44px;height:68px;border-radius:22px 22px 18px 18px;background:radial-gradient(ellipse at 34% 18%,#fff 8%,#f5f7fa 43%,#d6dfe9 91%);box-shadow:inset 1px 1px 2px #fff,inset -2px -3px 6px #a6b3c666,0 8px 12px -5px #17314b55;border:1px solid #ffffffd9}
.ds-mp-wheel{position:absolute;left:calc(50% - 4px);top:9px;width:8px;height:16px;border-radius:5px;border:1px solid #cc4444;background:repeating-linear-gradient(0deg,#f76f68 0 1.5px,#df4847 1.5px 3px)}
.ds-mp-caption{font:600 12px/1.3 var(--native);color:#e0413a}
.ds-tokens{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.ds-token-empty{padding:5px 10px;border:1px dashed #c3ccd8;border-radius:11px;font:400 11px/1 var(--native);color:#98a2b0}
.ds-token-add{padding:5px 10px;border:1px solid #cfd5dd;border-radius:11px;background:#fff;font:500 11px/1 var(--native);color:#2b50b8;cursor:pointer}
[data-theme=dark] .ds-token-add{background:#2a2e36;border-color:#ffffff1f;color:#9db8f5}
.ds-perm{gap:12px}
.ds-pi{width:17px;height:17px;color:#4670e9}
.ds-perm-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ds-perm-text b{font-weight:600}
.ds-perm-text small{font-size:11px;color:#8b95a5}
.ds-perm-status{font:500 12px/1 var(--native);color:#1f8f4e}
.ds-hint{margin:0;font-size:11px;line-height:1.5;color:#8b95a5}
.ds-editor{position:relative;height:300px;border-radius:10px;overflow:hidden;background:#101823;border:1px solid #00000040}
.ds-editor-tools{position:absolute;left:10px;top:10px;display:flex;gap:6px;z-index:2}
.ds-editor-tools span{padding:4px 10px;border-radius:7px;background:#25323de6;border:1px solid #ffffff1e;color:#dfe7f2;font:500 11px/1.5 var(--native)}
.ds-editor-disc{position:absolute;left:50%;top:50%;width:340px;transform:translate(-50%,-50%)}
.ds-editor-zoom{position:absolute;right:10px;bottom:10px;display:inline-flex;align-items:center;gap:8px;padding:3px 9px;border-radius:7px;background:#25323de6;border:1px solid #ffffff1e;color:#dfe7f2;font:600 11px/1.6 var(--native);font-variant-numeric:tabular-nums;z-index:2}
.ds-editor-zoom b{cursor:pointer;font-size:13px}
.ds-monitor-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.ds-tiles{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.ds-tile{padding:12px 10px;border:1px solid #dfe3e9;border-radius:10px;background:#fff;text-align:center}
[data-theme=dark] .ds-tile{background:#ffffff0d;border-color:#ffffff17}
.ds-tile span{display:block;font:500 11px/1 var(--native);color:var(--tile)}
.ds-tile b{display:block;margin-top:7px;font:600 20px/1 var(--native);font-variant-numeric:tabular-nums;color:var(--ink)}
[data-theme=dark] .ds-tile b{color:#eef2f8}
.ds-about{display:flex;flex-direction:column;align-items:center;gap:5px;padding:14px 0 6px;text-align:center}
.ds-about img{border-radius:15px;box-shadow:0 8px 20px -8px #04101f66}
.ds-about h4{margin:6px 0 0;font:600 19px/1.2 var(--native);color:var(--ink)}
[data-theme=dark] .ds-about h4{color:#eef2f8}
.ds-about-build{margin:0;font-size:12px;color:#8b95a5;user-select:text}
.ds-about-blurb{margin:4px 0 8px;font-size:13px;color:#5a6472}
.ds-about-buttons{display:flex;gap:8px}
/* Store Settings pieces: key caps, folder paths, the looks strip. */
.ds-key{display:inline-block;padding:2px 8px;border:1px solid #cfd5dd;border-bottom-width:2px;border-radius:6px;background:#fff;font:600 12px/1.4 var(--native);color:#2a3442;white-space:nowrap}
[data-theme=dark] .ds-key{background:#2a2e36;border-color:#ffffff26;color:#dde4ee}
.ds-keys-open{gap:8px}
.ds-keys-open .ds-row-title{flex:none}
.ds-folder{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:400 12px/1.4 var(--native);color:#5a6472}
.ds-help{width:22px;padding:3px 0;border-radius:50%;text-align:center}
.ds-looks{gap:12px}
.ds-look{display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px;border:1px solid transparent;border-radius:9px;font:500 11px/1.2 var(--native);color:#5a6472}
.ds-look img{width:74px;height:74px;object-fit:contain}
.ds-look em{font-style:normal}
.ds-look.is-on{border-color:#377cf6;background:#377cf614;color:#2b50b8}
/* The four tool glyphs, the app's own symbols: moon, cursor rays, motion
   lines, and the coordinate circle — the first cell keeps the brand mark. */
.desk-clipboard-toggles>span:nth-child(2) .dct-glyph{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 13'%3E%3Cpath fill='black' d='M10.8 8.1A5 5 0 0 1 4.9 2.2 5 5 0 1 0 10.8 8.1Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 13'%3E%3Cpath fill='black' d='M10.8 8.1A5 5 0 0 1 4.9 2.2 5 5 0 1 0 10.8 8.1Z'/%3E%3C/svg%3E") center/contain no-repeat}
.desk-clipboard-toggles>span:nth-child(3) .dct-glyph{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 13'%3E%3Cpath fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round' d='M6.5 4v9M6.5 0v2M2.6 6.5H0m13 0h-2.6M3.7 3.7 2.2 2.2m9.1 9.1-1.5-1.5m0-6.1 1.5-1.5M3.7 9.3l-1.5 1.5'/%3E%3Ccircle cx='6.5' cy='6.5' r='1.6' fill='black'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 13'%3E%3Cpath fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round' d='M6.5 4v9M6.5 0v2M2.6 6.5H0m13 0h-2.6M3.7 3.7 2.2 2.2m9.1 9.1-1.5-1.5m0-6.1 1.5-1.5M3.7 9.3l-1.5 1.5'/%3E%3Ccircle cx='6.5' cy='6.5' r='1.6' fill='black'/%3E%3C/svg%3E") center/contain no-repeat}
.desk-clipboard-toggles>span:nth-child(4) .dct-glyph{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 13'%3E%3Cpath fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round' d='M1 6.5h11'/%3E%3Ccircle cx='2' cy='6.5' r='1.7' fill='black'/%3E%3Ccircle cx='6.5' cy='6.5' r='1.7' fill='black' opacity='.65'/%3E%3Ccircle cx='11' cy='6.5' r='1.7' fill='black' opacity='.35'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 13'%3E%3Cpath fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round' d='M1 6.5h11'/%3E%3Ccircle cx='2' cy='6.5' r='1.7' fill='black'/%3E%3Ccircle cx='6.5' cy='6.5' r='1.7' fill='black' opacity='.65'/%3E%3Ccircle cx='11' cy='6.5' r='1.7' fill='black' opacity='.35'/%3E%3C/svg%3E") center/contain no-repeat}
.desk-clipboard-toggles>span:nth-child(5) .dct-glyph{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 13'%3E%3Cpath fill='none' stroke='black' stroke-width='1.4' d='M6.5 1a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11Zm0 3.4a2.1 2.1 0 1 0 0 4.2 2.1 2.1 0 0 0 0-4.2Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 13'%3E%3Cpath fill='none' stroke='black' stroke-width='1.4' d='M6.5 1a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11Zm0 3.4a2.1 2.1 0 1 0 0 4.2 2.1 2.1 0 0 0 0-4.2Z'/%3E%3C/svg%3E") center/contain no-repeat}
/* The content column must not shrink its cards or the editor canvas away. */
.ds-content>.ds-section,.ds-content>.ds-editor,.ds-content>.ds-hint,.ds-content>.ds-monitor-head,.ds-content>.ds-tiles,.ds-content>.ds-about{flex:none}