/* The sample desktop uses solid content surfaces and a lightly tinted outer shell. */
.desktop-page {
  --background:#e9e9e5; --surface:#fff; --text:#202124; --secondary:#5b5d61;
  --line:#dedfe1; --accent:#805115; --selection:#f3e6ca; --sidebar:#f3f3f1;
  --wallpaper-tint:#e8cb86; --wallpaper-shade:#d8d2c5;
  --hover:#eeeef0; --control-border:#c2c3c6; --sample-surface:#f7f7f8; --dock-surface:#f4f4f3;
  --glass-rim:#ffffffd9; --glass-shadow:#36383c24;
  --glass-control:linear-gradient(175deg,#ffffff2b,transparent 72%);
  --pink:var(--selection); --lavender:#e6e4e9; --mint:#e3ebe8;
  --room:var(--background); --room-floor:var(--sidebar);
  min-width:280px; background:var(--background); color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",sans-serif; line-height:1.5;
}
.desktop-page[data-theme="apricot"] {
  --wallpaper-tint:#e1b59b; --wallpaper-shade:#d9c8bf;
  --accent:#914d32; --selection:#f4e2d9;
}
.desktop-page[data-theme="butter"] {
  --wallpaper-tint:#ebe5c8; --wallpaper-shade:#cacdd0;
  --accent:#7d5b20; --selection:#f1ebd9;
}
.desktop-page [hidden] { display:none!important; }
.desktop-page button { font:inherit; cursor:pointer; }
.desktop-page button:focus-visible,.desktop-page a:focus-visible,.desktop-page summary:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.desktop-page .skip-link { z-index:100; }
.desktop-page .desktop-shell,.desktop-page .desktop-playground,.desktop-page .desktop-canvas-root { width:100%; min-width:0; }
.desktop-page .desktop-canvas { position:relative; min-height:100dvh; padding:0 32px 16px; isolation:isolate; overflow:clip; }
.desktop-wallpaper {
  position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:-1;
  background:linear-gradient(130deg,#f2f3f3 6%,var(--background) 56%,var(--wallpaper-tint));
}
.desktop-wallpaper span {
  position:absolute; inset:0; display:block;
  background:linear-gradient(145deg,transparent 52%,#ffffff82 52.15%,transparent 64%);
}
.desktop-wallpaper span+span {
  background:linear-gradient(151deg,transparent 65%,var(--wallpaper-shade) 65.2%,#f2f2ef 87%,#e2e4e3);
}
.desktop-anchor { position:absolute; top:0; }
.desktop-icon { width:21px; height:21px; flex:none; }
.desktop-menubar { height:40px; margin:0 -32px; padding:0 26px; display:flex; align-items:center; gap:20px; border-bottom:1px solid #25262a14; background:#f8f8f65c; font-size:12px; }
.desktop-menubar button { border:0; background:transparent; padding:8px 0; min-height:36px; }
.desktop-menubar .desktop-brand { font-size:15px; font-weight:650; letter-spacing:-.025em; color:var(--text); }
.desktop-menu-toggle { color:var(--secondary)!important; }
.desktop-menu-toggle:hover { color:var(--text)!important; text-decoration:underline; text-underline-offset:3px; }
.desktop-top-links { margin-left:auto; display:flex; gap:18px; }
.desktop-top-links a { color:var(--secondary); text-decoration:none; }
.desktop-top-links a:hover { color:var(--accent); text-decoration:underline; }
.desktop-page .motion-control { min-height:36px; font-size:12px; padding:8px 0; margin-left:0; }
/* Only one main character. The transparent native canvas gives hands room. */
.desktop-page .desktop-chii { position:fixed; z-index:50; top:0; left:50%; transform:translateX(-50%); width:min(460px,38vw); pointer-events:none; }
.desktop-page .desktop-chii .native-stage { position:relative; width:100%; margin:0; aspect-ratio:1160/320; overflow:visible; pointer-events:none; }
.desktop-page .desktop-chii .native-stage::before { content:""; position:absolute; top:0; left:0; width:100%; height:34.7%; background:#000; border-radius:0 0 14px 14px; }
.desktop-page .desktop-chii .native-pet-art { width:100%; max-width:none; aspect-ratio:1160/320; object-fit:contain; top:0; left:0; }
.desktop-page .native-pointer-art { position:absolute; top:0; left:-10.344827586%; width:120.689655172%; max-width:none; height:100%; pointer-events:none; }
.desktop-page [data-pointer-reach="true"] .native-pet-art { visibility:hidden; }
.desktop-page .desktop-chii .mac-chii-hotspot { top:0; left:0; right:0; width:100%; height:34.7%; min-height:28px; border:0; background:transparent; border-radius:0 0 11px 11px; pointer-events:auto; }
.desktop-page .desktop-chii .mac-chii-hotspot:focus-visible { outline-color:#ffc879; outline-offset:-3px!important; }
.desktop-page .desktop-native-menu { position:absolute; z-index:51; top:34.7%; left:0; width:100%; border:0; border-radius:0 0 20px 20px; background:#000; box-shadow:0 5px 8px #5d421b24; overflow:visible; pointer-events:auto; transform-origin:top center; animation:desktop-menu-in .3s cubic-bezier(.2,.8,.2,1); }
@keyframes desktop-menu-in { from { clip-path:inset(0 0 100%); opacity:.5; } to { clip-path:inset(0 0 -35px); opacity:1; } }
@keyframes desktop-page-in { from { opacity:.3; transform:translateY(5px); } to { opacity:1; transform:none; } }
.desktop-showcase [data-desktop-panel]:not([hidden]) { animation:desktop-page-in .22s ease-out; }
.motion-paused .desktop-native-menu,.motion-paused .desktop-showcase [data-desktop-panel] { animation:none; }
.desktop-page .desktop-menu-art { position:relative; width:100%; aspect-ratio:360/300; overflow:hidden; border-radius:0 0 20px 20px; }
.desktop-page .desktop-menu-art>img { width:100%; height:auto; max-width:none; margin-top:-10%; pointer-events:none; }
.desktop-page .desktop-native-actions { position:absolute; inset:0; pointer-events:auto; }
.desktop-page .native-menu-hit { position:absolute; pointer-events:auto; background:transparent; border:1px solid transparent; border-radius:10px; padding:0; min-height:0; }
.desktop-page .native-menu-hit:hover { background:#f5c49a33; border-color:#f5c49a88; }
.desktop-page .native-menu-hit:focus-visible { outline:2px solid #ffd28b; outline-offset:-3px; background:#fff2; }
.native-hit-talk,.native-hit-reminders { top:15.33%; width:44.72%; height:17.33%; }
.native-hit-talk,.native-hit-focus { left:4.17%; }
.native-hit-reminders,.native-hit-play { left:50.83%; }
.native-hit-focus,.native-hit-play { top:35.33%; width:44.72%; height:17.33%; }
.native-hit-book,.native-hit-snack,.native-hit-hello { top:61.67%; width:28.9%; height:19%; }
.native-hit-book { left:4.17%; }.native-hit-snack { left:35.3%; }.native-hit-hello { left:66.7%; }
.native-hit-about { top:84.7%; height:13.3%; left:4.17%; width:91.4%; }
.desktop-page .desktop-native-menu .mac-menu-close { display:block; position:absolute; top:10px; right:5px; z-index:3; width:36px; height:36px; min-height:36px; padding:0; border:0; border-radius:8px; background:#000; color:#fff; font-size:25px; line-height:1; }
.desktop-page .desktop-native-menu .mac-menu-close:hover { background:#2b2b2b; }
.native-menu-caption { position:absolute; width:100%; bottom:-27px; margin:0; text-align:center; font-size:11px; background:var(--surface); color:var(--secondary); border:1px solid var(--line); border-radius:6px; padding:4px; }
/* The information window is the site: content changes inside, not below it. */
.desktop-window {
  width:min(1080px,100%); margin:42px auto 20px; scroll-margin-top:80px;
  background:var(--surface); border:1px solid #30313624; border-radius:17px;
  box-shadow:inset 0 1px 0 var(--glass-rim),0 3px 8px #272a3010,0 14px 34px var(--glass-shadow);
  overflow:hidden;
}
.desktop-window-bar { display:grid; grid-template-columns:100px 1fr 100px; align-items:center; min-height:45px; padding:0 17px; border-bottom:1px solid #33363b16; background:#fbfbfa9c; }
.desktop-window-bar h2 { margin:0; text-align:center; font-size:13px; font-weight:600; letter-spacing:-.01em; }
.desktop-window-bar h2:focus { outline:none; }
.desktop-window-lights { display:flex; gap:7px; align-items:center; }
.desktop-window-lights i { width:11px; height:11px; border-radius:50%; border:1px solid #00000012; background:#fa766e; }
.desktop-window-lights i:nth-child(2) { background:#f7c14d; }.desktop-window-lights i:nth-child(3) { background:#6ac47b; }
.desktop-window-preview { color:var(--secondary); text-align:right; font-size:10px; }
.desktop-window-layout { display:grid; grid-template-columns:174px minmax(0,1fr); min-height:480px; height:clamp(480px,calc(100dvh - 244px),640px); }
.desktop-sidebar { display:flex; flex-direction:column; background:color-mix(in srgb,var(--sidebar) 78%,transparent); border-right:1px solid #33363b14; padding:17px 9px 14px; gap:24px; }
.desktop-sidebar nav { display:flex; flex-direction:column; gap:4px; }
.desktop-sidebar button { display:flex; align-items:center; gap:11px; width:100%; min-height:41px; padding:9px 12px; background:transparent; border:0; border-radius:7px; text-align:left; font-size:14px; color:var(--secondary); }
.desktop-sidebar button:hover { background:#24262909; color:var(--text); }
.desktop-sidebar button[aria-current="page"] { background:#dedfdf; color:var(--text); font-weight:600; }
.desktop-sidebar button[aria-current="page"] .desktop-icon { color:var(--accent); }
.desktop-sidebar .desktop-icon { width:19px; height:19px; }
.desktop-sidebar-bottom { margin-top:auto; display:flex; flex-direction:column; gap:4px; }
.desktop-sidebar-bottom a { padding:7px 12px; font-size:12px; color:var(--secondary); text-decoration:none; display:flex; justify-content:space-between; }
.desktop-sidebar-bottom a:hover { color:var(--accent); text-decoration:underline; }
.desktop-content { min-width:0; min-height:0; overflow:auto; overscroll-behavior:contain; scrollbar-color:#a7a8aa80 transparent; background:var(--surface); }
.desktop-page .desktop-showcase { min-height:100%; border:0; border-radius:0; background:transparent; overflow:visible; }
.desktop-page .sample-disclaimer { position:relative; font-size:10px; line-height:1.4; padding:14px 30px 0; margin:0; color:var(--secondary); }
.desktop-home,.desktop-play-panel,.desktop-about { padding:28px 32px 30px; }
.desk-prop { display:block; width:88px; max-width:100%; height:auto; pointer-events:none; }
.desktop-panel-intro h3 { margin:0 0 12px; font-size:30px; font-weight:600; letter-spacing:-.035em; line-height:1.15; }
.desktop-panel-intro p { max-width:62ch; color:var(--secondary); font-size:14px; line-height:1.7; margin:0 0 16px; }
/* Local function samples are readable examples, not another desktop pet. */
.desktop-page .sample-chii,.desktop-page .music-art-stage { display:none; }
.desktop-page .feature-layout { gap:25px; grid-template-columns:.82fr 1.18fr; padding:28px 30px 32px; align-items:start; }
.desktop-page .feature-copy h3 { font-size:32px; font-weight:600; letter-spacing:-.04em; line-height:1.08; margin-bottom:16px; }
.desktop-page .feature-copy p { color:var(--secondary); font-size:14px; line-height:1.6; margin-bottom:16px; }
.desktop-page .feature-copy a { font-size:12px; }
.desktop-page .sample-window { background:var(--sample-surface); color:var(--text); border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.desktop-page .sample-window-body { padding:21px; }
.desktop-page .sample-window-label { color:var(--secondary); font-size:10px; margin-bottom:20px; }
.desktop-page .sample-window p { color:var(--text); }
.desktop-page .sample-window button,.desktop-page .sample-window select,.desktop-page .sample-window input { font-family:inherit; color:var(--text); }
.desktop-page .sample-window button { border-color:var(--control-border); background:var(--surface); border-radius:8px; min-height:40px; font-size:13px; padding:9px 12px; }
.desktop-page .sample-window button:hover { background:var(--hover); border-color:#acadb0; }
.desktop-page .sample-window .sample-primary { background:var(--text); border-color:transparent; color:#fff; }
.desktop-page .sample-window .sample-primary:hover { background:#414246; border-color:transparent; }
.desktop-page .sample-window .sample-footnote,.desktop-page .sample-window .sample-field-hint { color:var(--secondary); font-size:11px; line-height:1.6; }
.desktop-page .sample-prompts { gap:8px; }.desktop-page .sample-prompts button[aria-pressed="true"] { border-color:var(--accent); background:var(--selection); }
.desktop-page .talk-invitation { font-size:22px; line-height:1.2; }
.desktop-page .sample-conversation { border-color:var(--line); }.desktop-page .sample-conversation span { color:var(--secondary); }
.desktop-page .sample-you { background:var(--selection); }.desktop-page .sample-conversation p { font-size:14px; }
.desktop-page .reminder-sample label { color:var(--text); font-size:12px; }
.desktop-page .reminder-sample input,.desktop-page .reminder-sample select { color:var(--text); border-color:var(--control-border); background:var(--surface); font-size:14px; }
.desktop-page .reminder-sample input:focus,.desktop-page .reminder-sample select:focus { outline-color:var(--accent); }
.desktop-page .sample-error { color:#a33e20!important; }.desktop-page .sample-step { color:var(--secondary)!important; }
.desktop-page .reminder-sample h4 { color:var(--text); font-size:22px; }
.desktop-page .sample-details dt,.desktop-page #sample-reminder-saved-time { color:var(--secondary); }.desktop-page .sample-details { font-size:13px; }
.desktop-page .sample-success { color:#4e6a2d!important; }.desktop-page .sample-task.is-complete { color:var(--secondary); }
.sample-reminder-options { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,145px),1fr)); gap:0 14px; }
.desktop-page .sample-reminders-list { margin:0 0 20px; padding:16px 18px; border:1px solid var(--line); border-radius:10px; background:var(--surface); }
.desktop-page .sample-reminders-list .sample-list-app { margin:0 0 3px; font-size:12px; color:var(--secondary); }
.desktop-page .sample-reminders-list h4 { color:#0876bd; margin:0 0 12px; }
.sample-list-row { position:relative; padding:12px 0 0 26px; border-top:1px solid var(--line); }
.sample-list-row::before { content:""; position:absolute; top:16px; left:0; width:13px; height:13px; border:1.5px solid currentColor; border-radius:50%; color:var(--secondary); }
[data-completed="true"] .sample-list-row::before { background:#0876bd; color:#0876bd; }
.desktop-page .sample-list-row .sample-task { margin:0; font-size:17px; }
.sample-list-row #sample-reminder-saved-time { margin:4px 0 0; font-size:13px; }
@media(prefers-reduced-motion:no-preference) {
  body:not(.motion-paused) #sample-reminder-saved:not([hidden]) .sample-list-row { animation:reminder-row-enter .27s ease-out both; }
  @keyframes reminder-row-enter { from { opacity:0; transform:translateY(5px); } to { opacity:1; transform:none; } }
}
.desktop-page .focus-sample .focus-countdown { color:var(--text); font-size:64px; font-weight:500; font-variant-numeric:tabular-nums; letter-spacing:-.045em; line-height:1; margin:12px 0 24px; }
.desktop-page .sample-track-name { font-size:24px; }.desktop-page .sample-track-byline { color:var(--secondary)!important; }
.desktop-page .music-demo-instruments button[aria-pressed="true"] { background:var(--selection); border-color:var(--accent); }
.desktop-page .music-demo-transport button:first-child,.desktop-page .music-demo-transport button:last-child { font-size:25px; }
.desktop-page .music-demo-transport { flex-wrap:wrap; }
/* Explicit, bounded play controls drive the one native actor at the top. */
.desktop-play-activities { padding:16px 0 22px; }
.desktop-page .gift-tray { justify-content:flex-start; gap:14px; margin:0 0 20px; align-items:stretch; }
.desktop-page .gift-button { min-height:118px; width:115px; padding:15px 10px 12px; gap:12px; background:var(--glass-control),#fffaf080; border:1px solid #ffffffe6; border-radius:16px; font-size:12px; }
.desktop-page .gift-button:hover { background:var(--glass-control),var(--selection); border-color:#cda25a; }
.desktop-page .gift-button:hover .gift-art { transform:none; }
.desktop-page .gift-button .desk-prop { width:78px; }
.desktop-page .pillow-art { background:#e8e8bf; border-color:#c9cb9e; color:#727a3f; box-shadow:0 3px 0 #d7d8b2; }
.desktop-pet-button { display:inline-flex; min-height:42px; align-items:center; gap:14px; padding:9px 15px; border:1px solid #c99c6859; border-radius:12px; background:var(--glass-control),var(--selection); font-size:13px!important; }
.desktop-pet-button:hover { background:var(--glass-control),var(--hover); }
.desktop-page .pet-message { margin:0 0 20px; padding:12px 16px; font-size:14px; border:1px solid var(--line); border-radius:9px; background:#fff7e4; box-shadow:none; transform:none; max-width:100%; text-align:left; }
.desktop-page .pet-message::before { display:none; }
.desktop-page .playground-instruction,.desktop-page .drag-hint { text-align:left; padding:0; margin:0 0 9px; color:var(--secondary); font-size:11px; }
.desktop-play-note { color:var(--secondary); font-size:12px; line-height:1.7; border-top:1px solid var(--line); padding-top:18px; margin:22px 0 0; max-width:65ch; }
.desktop-page .joy-effects { pointer-events:none; }
/* Details hold supporting app evidence without cluttering the welcome. */
.desktop-appearance { border-top:1px solid var(--line); padding:20px 0 22px; }
.desktop-appearance h4 { margin:0 0 14px; font-size:13px; font-weight:550; }
.desktop-page .color-picker { gap:8px; flex-wrap:wrap; margin:0; }
.desktop-page .color-choice { display:inline-flex; align-items:center; gap:7px; width:auto; height:auto; min-height:40px; margin:0; padding:7px 10px; border:1px solid var(--control-border); border-radius:8px; background:var(--surface); color:var(--secondary); font-size:12px; }
.desktop-page .color-choice:hover { transform:none; background:var(--hover); color:var(--text); }.desktop-page .color-choice[aria-pressed="true"] { background:var(--selection); border-color:var(--accent); color:var(--text); }
.color-swatch { width:14px; height:14px; border:1px solid #bd934d88; border-radius:50%; background:#f8d581; }.apricot .color-swatch { background:#efb675; }.butter .color-swatch { background:#fff0b3; }
.desktop-page .native-look { margin:0; }.desktop-page summary { padding:16px 0; font-size:13px; }
.desktop-page .native-previews { gap:20px; padding:12px 0 24px; }.desktop-page .native-previews figure { max-width:48%; }.desktop-page .native-previews figcaption { font-size:10px; }
.desktop-page .native-moments { margin:0; }.desktop-page .real-moments { padding:12px 0 22px; gap:12px; }
.desktop-page .real-moment { box-shadow:none; border:1px solid var(--line); border-radius:9px; background:var(--sidebar); }
.desktop-page .moment-art { background:#22282b; }.desktop-page .real-moment>span:last-child { font-size:12px; padding:12px 14px; }
.desktop-page .real-moment-options { gap:8px; }.desktop-page .real-moment-options button { min-height:40px; font-size:11px; padding:8px 10px; }.desktop-page .real-moment-options p { font-size:10px; margin-top:5px; }
.desktop-compatibility-title { margin:28px 0 16px; font-size:23px; }.desktop-page .home-faq { max-width:none; }.desktop-page .answer { padding:0 14px 0; font-size:13px; line-height:1.7; }
.desktop-about-links { display:flex; flex-wrap:wrap; gap:12px 24px; margin-top:24px; font-size:12px; }
/* The dock and sidebar are real navigation; decorative traffic lights are not. */
.desktop-dock { display:flex; justify-content:center; gap:4px; width:max-content; max-width:100%; margin:0 auto 14px; padding:5px; border:1px solid #34363a22; border-radius:17px; background:var(--dock-surface); box-shadow:inset 0 1px 0 var(--glass-rim),0 3px 8px #23252812; }
.desktop-dock button { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; width:60px; min-height:51px; padding:5px 8px; border:0; border-radius:11px; background:transparent; color:var(--secondary); font-size:11px; }
.desktop-dock .desktop-icon { width:21px; height:21px; }
.desktop-dock button:hover { color:var(--text); background:#25272a09; }
.desktop-dock button[aria-current="page"] { color:var(--text); background:#ffffffd9; box-shadow:0 1px 3px #2425281a; }
.desktop-dock button[aria-current="page"] .desktop-icon { color:var(--accent); }
.desktop-sidebar button,.desktop-dock button,.desktop-home-bottom button,.desktop-pet-button,.desktop-page .sample-window button,.desktop-page .gift-button,.desktop-page .color-choice { transition:background-color .16s ease,color .16s ease,border-color .16s ease; }
.desktop-home-bottom button,.desktop-pet-button,.desktop-page .gift-button { box-shadow:inset 0 1px 0 #ffffffd9,0 1px 2px #2425280c; }
.desktop-dock button:active,.desktop-sidebar button:active { background:#26282b18; }
.desktop-page.motion-paused :is(.desktop-sidebar button,.desktop-dock button,.desktop-home-bottom button,.desktop-pet-button,.sample-window button,.gift-button,.color-choice) { transform:none; transition:none; }
/* Only the two outer panes sample the wallpaper. Inner surfaces need no blur. */
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  .desktop-window { background:#f6f6f4a8; -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); }
  .desktop-dock { background:#f5f5f2a8; -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); }
}
.desktop-footer { max-width:1080px; margin:0 auto; text-align:center; font-size:10px; line-height:1.5; color:var(--secondary); }
.desktop-footer p { margin:0 0 4px; }.desktop-page .desktop-footer .draft-note { border:0; padding:0; background:transparent; color:var(--secondary); font-size:10px; }
@media (max-width:1050px) {
  .desktop-page .desktop-canvas { padding-inline:22px; }.desktop-menubar { margin-inline:-22px; padding-inline:20px; gap:15px; }
  .desktop-window-layout { grid-template-columns:155px minmax(0,1fr); }
  .desktop-page .feature-layout { grid-template-columns:1fr; gap:18px; }.desktop-page .feature-copy { max-width:62ch; }.desktop-page .feature-copy h3 br { display:none; }.desktop-page .feature-copy p { max-width:none; }
  .desktop-page .sample-window { width:100%; max-width:none; margin:0; }.desktop-home { padding-inline:26px; }.desktop-home h1 { font-size:39px; }
  .desktop-top-links { gap:12px; }.desktop-menubar .desktop-menu-toggle { font-size:11px; }
}
@media (max-width:1100px) {
  .desktop-menubar { height:80px; padding-top:35px; }
  .desktop-page .desktop-chii { width:min(360px,calc(100vw - 36px)); }
}
@media (max-width:760px) {
  .desktop-page .desktop-canvas { padding:0 14px 16px; }
  .desktop-menubar { margin:0 -14px; height:80px; padding:35px 16px 0; gap:12px; flex-wrap:nowrap; }
  .desktop-menubar .desktop-brand { font-size:13px; }.desktop-menu-toggle { margin-left:auto; }.desktop-top-links { display:none; }.desktop-page .motion-control { margin-left:0; font-size:11px; white-space:nowrap; }
  .desktop-page .desktop-chii { width:min(360px,calc(100vw - 36px)); }
  .desktop-window { margin-top:22px; margin-bottom:18px; border-radius:15px; }
  .desktop-window-layout { display:flex; flex-direction:column; height:auto; min-height:0; }
  .desktop-window-bar { grid-template-columns:65px 1fr 65px; padding:0 12px; }.desktop-window-preview { font-size:8px; }.desktop-window-bar h2 { font-size:12px; }
  .desktop-sidebar { flex-direction:row; border-right:0; border-bottom:1px solid var(--line); padding:8px; gap:4px; align-items:center; overflow:auto; }
  .desktop-sidebar nav { display:flex; flex-direction:row; gap:3px; }.desktop-sidebar button { width:auto; gap:6px; padding:9px; font-size:12px; white-space:nowrap; min-height:40px; }.desktop-sidebar .desktop-icon { width:17px; height:17px; }
  .desktop-sidebar-bottom { margin:0; display:contents; }.desktop-sidebar-bottom a { display:none; }
  .desktop-content { overflow:visible; }
  .desktop-home,.desktop-play-panel,.desktop-about { padding:24px; }.desktop-page .sample-disclaimer { padding:14px 24px 0; }
  .desktop-home h1 { font-size:38px; }.desktop-home-intro { font-size:14px; }
  .desktop-page .feature-layout { padding:24px; }.desktop-page .feature-copy h3 { font-size:28px; }.desktop-page .sample-window-body { padding:21px; }
  .desktop-page .gift-tray { gap:10px; flex-wrap:wrap; }.desktop-page .gift-button { flex:1; min-width:95px; max-width:calc(50% - 5px); }
  .desktop-dock { gap:2px; padding:6px; }.desktop-dock button { width:52px; }.desktop-footer { max-width:53ch; }.desktop-footer p { margin-bottom:7px; }
}
@media (max-width:440px) {
  .desktop-sidebar { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); overflow:visible; }
  .desktop-sidebar nav { display:contents; }
  .desktop-sidebar button { justify-content:center; padding:8px 3px; min-width:0; font-size:11px; }
  .desktop-sidebar .desktop-icon { display:none; }
  .desktop-menubar { padding-inline:12px; gap:10px; }.desktop-menubar .desktop-brand { font-size:12px; }.desktop-menubar .desktop-menu-toggle { font-size:10px; }.desktop-page .motion-control { font-size:10px; }
  .desktop-page .desktop-canvas { padding-inline:10px; }.desktop-menubar { margin-inline:-10px; }.desktop-window-bar { grid-template-columns:48px 1fr 50px; padding-inline:10px; }.desktop-window-lights { gap:5px; }.desktop-window-lights i { width:8px; height:8px; }
  .desktop-home,.desktop-play-panel,.desktop-about { padding:21px 18px 26px; }.desktop-page .sample-disclaimer { padding:14px 18px 0; font-size:9px; }
  .desktop-home h1 { font-size:35px; }.desktop-top-hint { font-size:11px; line-height:1.5; align-items:start; }
  .desktop-page .feature-layout { padding:24px 18px; }.desktop-page .feature-copy h3,.desktop-panel-intro h3 { font-size:26px; }.desktop-page .sample-window-body { padding:18px 16px; }
  .desktop-page .sample-prompts { flex-direction:column; align-items:stretch; }.desktop-page .sample-prompts button { text-align:left; }.desktop-page .sample-window .sample-footnote { font-size:11px; }
  .desktop-page .native-previews { flex-direction:column; align-items:center; }.desktop-page .native-previews figure { max-width:100%; width:300px; }
  .desktop-dock { width:100%; padding:6px 3px; }.desktop-dock button { flex:1; width:auto; padding:6px 3px; font-size:8px; }.desktop-dock .desktop-icon { width:21px; height:21px; }
  .desktop-footer { font-size:9px; padding-inline:6px; }.desktop-page .desktop-footer .draft-note { font-size:9px; }
}
.desktop-page .sample-disclaimer,.desktop-window-preview,.desktop-home-bottom p,.desktop-page .sample-window-label,.desktop-dock button,.desktop-footer,.desktop-page .desktop-footer .draft-note,.desktop-page .native-previews figcaption,.desktop-page .real-moment-options p { font-size:11px; }
@media (max-width:580px) {
}
@media (max-width:440px) { .desktop-menubar .desktop-menu-toggle,.desktop-page .motion-control,.desktop-dock button { font-size:11px; } }
@media (max-width:760px) {
  .desktop-window { background:var(--sidebar); -webkit-backdrop-filter:none; backdrop-filter:none; }
  .desktop-dock { background:var(--dock-surface); -webkit-backdrop-filter:none; backdrop-filter:none; }
}
@media (prefers-reduced-transparency:reduce),(prefers-contrast:more) {
  .desktop-window,.desktop-dock { background:var(--surface); -webkit-backdrop-filter:none; backdrop-filter:none; border-color:var(--line); }
  .desktop-window-bar,.desktop-sidebar,.desktop-content { background:var(--surface); }
  .desktop-sidebar button[aria-current="page"],.desktop-dock button[aria-current="page"] { background:var(--selection); box-shadow:inset 0 0 0 1px var(--accent); }
}
@media (prefers-reduced-motion:reduce) {
  .desktop-page * { scroll-behavior:auto!important; animation:none!important; transition:none!important; }
  .desktop-page :is(.desktop-sidebar button,.desktop-dock button,.desktop-home-bottom button,.desktop-pet-button,.sample-window button,.gift-button,.color-choice) { transform:none; }
}