:root {
  color-scheme: light dark;

  /* Surfaces — the landing's paper (#f4f1e7/#fffdf6), not a generic grey-white.
     Daylight cohesion is the point: the app and the landing are one place. */
  --bg: #f4f1e7;
  --surface: #fffdf6;
  --surface-raised: #eeece2;
  --surface-sunken: #f1eee4;
  /* Form fields sit BELOW their card in both modes — one rule, not a per-mode
     special case. Light previously had white-on-white distinguished only by a
     border, and dark had a darker field; unifying on "inset" keeps the boundary
     legible without depending on border contrast. */
  --field-bg: #f1eee4;
  --row-hover: rgba(22, 78, 54, 0.05);

  /* Text — the landing's forest ink trio, exact. */
  --fg: #20372c;
  --fg-muted: #59655b;
  --fg-subtle: #626d62;
  --brand-mark: #164e36;
  --grove-ground: #eeece2;
  --grove-path: #fffdf6;
  --grove-path-edge: #fffdf6;
  --grove-hairline: #d5d7c9;
  --grove-scene-ink: #164e36;
  --grove-accent: #de651e;

  /* Lines — the landing's exact hairlines. */
  --border: #d5d7c9;
  --border-strong: #808778;

  /* Interaction — landing links/primary/focus, exact. */
  --link: #386539;
  /* Paper focus uses the deeper orange; the bright action fill is too
     light to draw a 3:1 boundary on every paper surface. */
  --focus: #bc541d;
  --mark: #de651e;
  --btn-primary-bg: #f58a32;
  --btn-primary-bg-hover: #ff9b48;
  --btn-primary-fg: #24140a;
  /* The creation threshold uses the brand's orange in either appearance. */
  --grove-action-bg: #f58a32;
  --grove-action-hover: #ff9b48;
  --grove-action-fg: #24140a;
  --btn-ghost-hover: rgba(22, 78, 54, 0.07);
  --btn-danger-bg: #b3261e;
  --btn-danger-bg-hover: #8f1e17;
  --btn-danger-fg: #ffffff;

  /* Status — each is a (bg, fg, border) triple shared by banners and badges.
     Semantic colours stay semantic on the warm paper; only the neutral triple
     warms, because "neutral" must mean "this surface's own quiet". */
  --danger-bg: #fdecea;
  --danger-fg: #b3261e;
  --danger-border: #f5c6c0;
  --info-bg: #eef4ff;
  --info-fg: #1a3a7a;
  --info-border: #cfe0ff;
  --success-bg: #eaf7ee;
  --success-fg: #1a6b34;
  --success-border: #c5e9d1;
  --warn-bg: #fff5e5;
  --warn-fg: #8a5300;
  --warn-border: #f5e0b8;
  --neutral-bg: #eeece2;
  --neutral-fg: #59655b;
  --neutral-border: #d5d7c9;

  --landing-accent-ink: #b34a18;
  --landing-workflow-bg: #173f2d;
  --landing-workflow-card: #244d3a;
  --landing-workflow-ink: #f3f0e6;
  --landing-workflow-muted: #c7c1b4;
  --landing-workflow-accent: #ffa15d;
  --machine-ink: #285f9f;

  --avatar-bg: #e8dfcb;
  --avatar-fg: #403b30;

  /* Radii — 8/10/99, the DESIGN.md trio (controls / boxes / identity). */
  --radius-sm: 8px;
  --radius-md: 10px;
  --radius-pill: 99px;

  /* Type scale */
  --fs-xs: 12px;
  --fs-sm: 13.5px;
  --fs-base: 14px;
  --fs-lg: 17px;
  --fs-xl: 20px;

  /* Spacing scale */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;

  --shadow-card: 0 1px 2px rgba(42, 65, 43, 0.06);
  --shadow-pop: 0 6px 20px rgba(42, 65, 43, 0.16);
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  /* The brand's print voice (landing headings; Songti is the zh twin the
     viewer uses). Display-only: brand mark and page h1s, never body copy. */
  --font-serif: Georgia, "Times New Roman", "Songti SC", serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
}

@media (prefers-color-scheme: dark) {
  :root {
    /* 夜灯地图 — the tree viewer's exact surfaces (tree.css), so moving
       between the home page and a project's tree changes content, not world.
       R sits a few points above B on every layer: warm, but not a colour. */
    --bg: #1b1917;
    --surface: #25231f;
    --surface-raised: #302d28;
    --surface-sunken: #141311;
    --field-bg: #141311;
    --row-hover: rgba(242, 239, 221, 0.05);

    /* Cream paper desaturating into lamplight — the viewer's ink ramp. */
    --fg: #f3f0e6;
    --fg-muted: #c7c1b4;
    --fg-subtle: #a39a8b;
    --brand-mark: #f4f1e6;
    --grove-ground: #302d28;
    --grove-path: #25231f;
    --grove-path-edge: #81796b;
    --grove-hairline: #454038;
    --grove-scene-ink: #f4f1e6;
    --grove-accent: #ff9747;

    /* Faded cream ink, not solid grey: the same line on every layer.
       The strong step clears 3:1 non-text contrast for control borders. */
    --border: #454038;
    --border-strong: #81796b;

    /* Orange is the human-action colour at night (links, focus, primaries) —
       the landing's forest primary is invisible on warm charcoal, and the
       viewer reserves blue for machines. Formerly an inverted-cream button;
       the ember reads warmer and matches the viewer's send/approve/play. */
    --link: #ffa15d;
    --focus: #f58a32;
    --mark: #ff9747;
    --btn-primary-bg: #f58a32;
    --btn-primary-bg-hover: #ff9b48;
    --btn-primary-fg: #24140a;
    --btn-ghost-hover: rgba(255, 253, 242, 0.08);
    --btn-danger-bg: #c8332a;
    --btn-danger-bg-hover: #e04a40;
    --btn-danger-fg: #ffffff;

    --danger-bg: #3a2020;
    --danger-fg: #ff8a80;
    --danger-border: #5c2b2b;
    --info-bg: #1c2740;
    --info-fg: #a9c7ff;
    --info-border: #2c3e63;
    --success-bg: #16301f;
    --success-fg: #86e0a3;
    --success-border: #274b34;
    --warn-bg: #33280f;
    --warn-fg: #f5c265;
    --warn-border: #4d3d18;
    --neutral-bg: #302d28;
    --neutral-fg: #c7c1b4;
    --neutral-border: #454038;

    /* Lit windows: people glow on the dark map (viewer .av, exact pair). */
    --landing-accent-ink: #ffa15d;
    --landing-workflow-bg: #141311;
    --landing-workflow-card: #25231f;
    --machine-ink: #8ab4f8;

    --avatar-bg: #ece7d4;
    --avatar-fg: #1b1917;

    --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.3);
    --shadow-pop: 0 8px 28px rgba(0, 0, 0, 0.45);
  }
}

:root{--paper:var(--bg);--ink:var(--fg);--muted:var(--fg-muted);--line:var(--border);--field:var(--field-bg);--orange:var(--grove-accent);--serif:var(--font-serif);--sans:var(--font-sans);--games-cover-bg:var(--field-bg);--games-work-ink:var(--link)}
@media(prefers-color-scheme:dark){:root{--paper:var(--surface-sunken);--games-cover-bg:var(--surface);--games-work-ink:#9ace78}}
.games-mark{width:34px;height:34px;flex-shrink:0;display:block;fill:var(--brand-mark)}.games-mark path:last-child{fill:var(--grove-accent)}.brand{display:flex;align-items:center;gap:12px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}a:focus-visible{outline:3px solid var(--focus);outline-offset:5px}img{display:block;width:100%;height:100%;object-fit:cover}h1,h2,h3,p{overflow-wrap:anywhere}.site{max-width:1376px;margin:auto;padding:0 56px}.nav{min-height:96px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:22px}.brand strong{font:bold 25px var(--serif);letter-spacing:-1px}.brand strong span{font:400 12px var(--sans);margin-left:8px;letter-spacing:0}.brand small{font-size:9px;letter-spacing:.15em;display:block;margin-top:5px}.nav-links{display:flex;gap:28px;align-items:center;font-size:13px}.nav-links a{padding:12px 0}.nav-links a:nth-child(2){border:1px solid var(--border-strong);padding:11px 17px;border-radius:5px}.hero{display:grid;grid-template-columns:1fr 1fr;gap:34px;min-height:535px;padding:55px 0 43px}.hero-copy{display:flex;flex-direction:column;align-items:start;padding:15px 0;min-width:0}.eyebrow{font-size:11px;letter-spacing:.14em;font-weight:600}.eyebrow:before{content:'';display:inline-block;width:30px;height:2px;background:var(--orange);margin:0 12px 3px 0}h1{font:700 clamp(44px,5.6vw,76px)/1.22 var(--serif);letter-spacing:-.04em;margin:27px 0 22px;max-width:8em}.hero-copy p{max-width:28em;font-size:14px;line-height:1.95;color:var(--muted);margin:0 0 27px}.primary{display:inline-flex;align-items:center;justify-content:center;gap:17px;background:var(--btn-primary-bg);color:var(--btn-primary-fg);border-radius:5px;padding:15px 22px;font-size:14px;font-weight:600;min-height:48px}.primary:hover{background:var(--btn-primary-bg-hover)}.primary span{font-size:21px;font-weight:400}.hero-copy .footnote{font-size:11px;margin:21px 0 0}.hero-collection{position:relative;min-width:0;height:420px}.path{position:absolute;inset:25px 20px;border:1px solid var(--border-strong);border-radius:48%;transform:rotate(-13deg)}.ticket{position:absolute;background:var(--surface);padding:10px 10px 14px;border:1px solid var(--line);border-radius:5px;box-shadow:var(--shadow-pop);transition:transform .2s;max-width:65%}.ticket img,.ticket .cover-empty{aspect-ratio:1.3;height:auto;border-radius:2px}.ticket strong{display:block;margin:12px 5px 5px;font-size:15px;overflow-wrap:anywhere}.ticket small{font-size:10px;color:var(--fg-subtle);margin:0 5px}.ticket-0{width:262px;left:3%;top:5px;transform:rotate(-7deg);z-index:2}.ticket-1{width:205px;right:0;top:154px;transform:rotate(7deg);z-index:3}.ticket-2{width:169px;left:14%;bottom:0;transform:rotate(-4deg);z-index:4}.ticket:hover{transform:translateY(-5px);z-index:5}.first-ticket{position:relative;background:var(--surface);border:1px solid var(--line);padding:45px 32px;margin:30px auto;max-width:350px;transform:rotate(-5deg)}.first-ticket>span{font-size:60px;color:var(--orange)}.first-ticket h2{font:28px var(--serif)}.first-ticket p{font-size:13px;line-height:1.8;color:var(--muted)}.orientation{display:flex;justify-content:space-between;align-items:center;gap:22px;border-block:1px solid var(--line);padding:18px 0}.orientation strong{font:700 17px var(--serif)}.orientation span{font-size:11px;color:var(--muted)}.section-top{padding:38px 0 22px}.section-top h2{font:700 32px var(--serif);letter-spacing:-1px;margin:0 0 10px}.section-top p{font-size:12px;color:var(--muted);margin:0}.filters{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 28px}.filter{border:1px solid var(--border-strong);border-radius:99px;padding:10px 16px;font-size:12px}.filter[aria-current=true]{background:var(--surface-raised);color:var(--ink);border-color:var(--border-strong)}.game-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px 26px}.game-card{min-width:0}.preview{display:block;position:relative;width:100%;overflow:hidden;border-radius:5px;aspect-ratio:1.6;background:var(--field)}.play-overlay{position:absolute;bottom:14px;right:14px;background:var(--surface);border:1px solid var(--border-strong);border-radius:99px;padding:9px 14px;font-size:11px}.game-meta{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:16px 0 9px}.game-meta h3{font-size:17px;margin:0}.game-meta>span{font-size:10px;color:var(--fg-subtle)}.game-desc{font-size:12px;color:var(--muted);line-height:1.7;margin:0 0 10px}.byline{font-size:11px;color:var(--fg-subtle);margin:0 0 12px}.tags{display:flex;flex-wrap:wrap;gap:7px;font-size:10px}.tags span{border:1px solid var(--line);border-radius:3px;padding:5px 7px}.cover-empty{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;background:var(--games-cover-bg);padding:16px;text-align:center}.cover-empty>span{font-size:32px;color:var(--games-work-ink)}.cover-empty p{font-size:13px;line-height:1.6;margin:8px 0;max-width:25em}.cover-empty small{font-size:10px;color:var(--muted)}.creator-note{display:flex;align-items:center;gap:25px;border-block:1px solid var(--line);padding:30px 0;margin:55px 0 0}.creator-note>span{font-size:48px;color:var(--orange)}.creator-note>div{flex:1}.creator-note h2{font:700 23px var(--serif);margin:0 0 10px}.creator-note p{font-size:12px;line-height:1.8;color:var(--muted);margin:0}.creator-note>a{font-size:12px;white-space:nowrap}footer{display:flex;justify-content:space-between;gap:18px;padding:28px 0;font-size:11px;color:var(--muted)}.empty{border:1px dashed var(--line);padding:50px 28px;text-align:center;min-height:220px}.empty h1{max-width:none}.empty h3{font:26px var(--serif)}.empty p{font-size:13px;line-height:1.8;color:var(--muted)}.game-page{padding:28px 0 40px}.back{display:inline-block;font-size:12px;border-bottom:1px solid var(--line);padding:10px 0}.game-heading{display:flex;justify-content:space-between;align-items:end;gap:25px;margin:32px 0 25px}.game-heading h1{font-size:48px;max-width:none;margin:18px 0 12px}.game-heading p{font-size:14px;line-height:1.8;margin:0;max-width:40em}.play-window{border:1px solid var(--line);border-radius:6px;overflow:hidden;background:var(--field)}.play-cover{position:relative;height:520px}.play-cover>img,.play-cover>.cover-empty{height:100%}.play-cover .cover-empty{background:var(--field)}.play-cover .cover-empty>span{font-size:72px}.start{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);white-space:nowrap}.play-window iframe{display:block;border:0;width:100%;height:650px}.play-toolbar{display:flex;justify-content:flex-end;gap:24px;align-items:center;border-bottom:1px solid var(--line);padding:17px 0;font-size:13px}.play-toolbar a{font-size:12px}.load-help{font-size:12px;color:var(--muted);line-height:1.8}.author-note{border-left:2px solid var(--orange);padding:12px 20px;margin:25px 0}.author-note small{font-size:11px;color:var(--muted)}.author-note p{font:20px/1.6 var(--serif);margin:12px 0}.share-note{margin:30px 0;background:var(--surface);border:1px solid var(--line);padding:22px}.share-note h2{font:22px var(--serif);margin:0 0 10px}.share-note p{font-size:12px}.share-note code{display:block;overflow-wrap:anywhere;user-select:all;font-size:12px;line-height:1.8}.share-note small{display:block;margin-top:15px;color:var(--muted)}
@media(max-width:1050px){.site{padding:0 32px}.ticket-0{width:230px}.ticket-1{width:180px}.ticket-2{width:150px}.game-grid{gap:24px 18px}}
@media(max-width:750px){.site{padding:0 22px}.nav{min-height:82px}.nav-links{gap:15px}.hero{grid-template-columns:1fr;padding-top:26px;gap:8px}.hero-copy{padding:5px 0}.hero-copy h1{font-size:58px;max-width:8em}.hero-collection{height:340px;max-width:520px;width:100%;margin:auto}.ticket-0{left:7%;width:220px}.ticket-1{right:5%;top:110px;width:180px}.ticket-2{left:18%;width:140px}.orientation{align-items:start;flex-direction:column;gap:10px}.game-grid{grid-template-columns:repeat(2,1fr)}.game-heading{align-items:start;flex-direction:column}.play-cover{height:380px}.play-window iframe{height:520px}.creator-note{flex-wrap:wrap}.creator-note>a{margin-left:70px}footer{flex-wrap:wrap}}
@media(max-width:440px){.site{padding:0 18px}.nav{gap:12px}.brand{gap:8px}.brand .games-mark{width:28px;height:28px}.brand strong{font-size:21px}.brand strong span{display:none}.brand small{font-size:8px}.nav-links{font-size:11px;gap:12px}.nav-links a:nth-child(2){padding:10px}.nav-links>a:first-child{display:none}.hero-copy h1{font-size:clamp(40px,12vw,48px)}.hero-copy p{font-size:13px}.hero-collection{height:300px}.ticket-0{width:190px;left:2%}.ticket-1{width:150px;right:2%;top:110px}.ticket-2{width:125px;left:12%}.ticket strong{font-size:12px}.ticket small{font-size:9px}.ticket .cover-empty p{font-size:10px}.path{transform:none;inset:20px 12px}.section-top h2{font-size:29px}.game-grid{grid-template-columns:1fr;gap:30px}.filter{padding:10px 13px}.creator-note{gap:18px}.creator-note>div{min-width:200px}.creator-note>a{margin-left:0}.play-toolbar{align-items:start;flex-direction:column;gap:12px}.game-heading h1{font-size:36px}.play-cover{height:300px}.play-window iframe{height:440px}footer>span:nth-child(2){width:100%;order:3}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.ticket{transition:none}}