:root{color-scheme:light;--paper:#faf7fc;--draft-radius:36px;--ink:#51495c;--quiet:#756b7e;--line:#e1dbe6;--accent:#756386;--sidebar:#f2edf6;--selected:#fdfbff;--hover:#eae3f0;--swatch:#e9e1ef;--serif:"Songti SC","Noto Serif SC",Georgia,serif}
:root[data-style="B"]{--paper:#f7faf7;--ink:#45564b;--quiet:#66766a;--line:#dbe5dc;--accent:#607c66;--sidebar:#eef3ee;--selected:#fbfdfb;--hover:#e3ece4;--swatch:#e0eade}
body,.sidebar,.direction,dialog{transition:background-color .25s ease,color .25s ease,border-color .25s ease}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;font-size:14px;display:grid;grid-template-columns:240px minmax(0,1fr);min-height:100vh}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.sidebar{height:100dvh;position:sticky;top:0;background:var(--sidebar);border-right:1px solid var(--line);padding:32px 22px 22px;display:flex;flex-direction:column}.sidebar nav{margin-top:0}.nav-label,.side-foot{display:flex;align-items:center;justify-content:space-between;color:var(--quiet)}.nav-label{margin:0 6px 13px}.direction{width:100%;background:transparent;border:1px solid transparent;border-radius:10px;text-align:left;display:flex;align-items:center;gap:11px;padding:12px 9px;margin:5px 0}.direction:hover{background:var(--hover)}.direction[aria-pressed=true]{background:var(--selected);border-color:var(--line)}.direction strong,.direction small{display:block}.direction small{color:var(--quiet);font-size:10px;margin-top:3px}.swatch{background:var(--swatch);color:var(--accent);display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:7px;font:italic 17px Georgia,serif}.side-foot{margin-top:auto;border-top:1px solid var(--line);padding-top:19px;justify-content:flex-start;gap:7px}.side-foot span:last-child{margin-left:auto}.status{width:6px;height:6px;background:var(--accent);border-radius:50%}
main{min-width:0;width:min(100%,1500px);padding:28px clamp(22px,4vw,70px) 24px;margin:auto;align-self:start}.topline{display:flex;justify-content:space-between;gap:12px;color:var(--quiet);border-bottom:1px solid var(--line);padding-bottom:17px}.topline b{margin:0 8px;color:#8a8a7f}.intro{padding:40px 0 34px;position:relative;overflow:hidden;isolation:isolate}.edition{display:inline-block;padding:6px 10px;border:1px solid currentColor;border-radius:30px;color:var(--accent);font-weight:650}.intro h1{font:600 clamp(32px,4vw,56px)/1.08 var(--serif);margin:16px 0 12px;letter-spacing:-.065em}.intro p{color:var(--quiet);line-height:1.8;margin:0;max-width:520px}.watermark{position:absolute;right:2%;top:50%;transform:translateY(-55%);font:italic clamp(150px,22vw,310px)/1 Georgia,serif;color:color-mix(in srgb,var(--accent) 8%,var(--paper));z-index:-1;user-select:none}.palette{display:flex;gap:6px;margin-top:17px}.palette span{width:14px;height:14px;border:1px solid #292c2425;border-radius:50%}
.section-head{border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:15px 0 13px}.section-head h2,.viewer-bar h2{font-size:16px;margin:0}.section-head>span,footer{color:var(--quiet)}.gallery{display:grid;grid-template-columns:repeat(auto-fit,375px);gap:48px;align-items:start;justify-content:safe center;overflow-x:auto;padding:4px}.tile{background:none;border:0;padding:0;text-align:left;min-width:0;align-self:start}.art{display:block;width:375px;background:transparent;border-radius:var(--draft-radius);position:relative}.caption{display:flex;align-items:center;gap:8px;padding:12px 0}.caption small{font:italic 12px Georgia,serif;color:var(--quiet)}.caption b{margin-left:auto;font-weight:400}footer{margin-top:20px;border-top:1px solid var(--line);padding-top:16px;display:flex;justify-content:space-between;gap:12px}
.phone{font-size:18px;width:375px;height:auto;border-radius:var(--draft-radius);padding:1.1em;background:var(--screen);color:var(--text);border:.24em solid var(--rim);box-shadow:0 .9em 2.6em #242c2833;display:flex;flex-direction:column;gap:.75em;}.art:has(>img)::after{content:"";position:absolute;inset:-3px;border:3px solid #92958f;border-radius:calc(var(--draft-radius) + 3px);pointer-events:none}.phone img,.art>img{display:block;width:375px;height:auto;border-radius:inherit}.phone-top,.phone-nav,.line-item{display:flex;justify-content:space-between;align-items:center}.phone-top{font-size:.72em;font-weight:700}.phone-brand{font-size:.78em;letter-spacing:.2em;margin-top:.7em}.phone h3{font:600 2.15em/1.12 var(--serif);margin:0}.phone p{font-size:.78em;margin:0;line-height:1.45;opacity:.8}.phone-hero{min-height:9.5em;border-radius:1em;background:var(--hero);color:var(--hero-text);padding:1em;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:end;isolation:isolate}.phone-hero strong{font:italic 3.2em/.95 Georgia,serif}.phone-hero svg{position:absolute;right:-.8em;top:-1.3em;width:10em;height:10em;z-index:-1}.line-item{font-size:.8em;background:var(--panel);padding:.8em;border-radius:.65em;gap:.4em}.line-item b{font-size:.92em}.phone-nav{margin-top:1em;border-top:1px solid var(--rule);padding-top:.65em;font-size:.68em}.bars{height:6em;display:flex;align-items:end;gap:.42em;margin-top:.5em}.bars i{flex:1;border-radius:.24em .24em 0 0;background:currentColor;opacity:.62}.bars i:nth-child(4){opacity:1}.timer{font:400 2.8em Georgia,serif;text-align:center;margin:.7em 0}.timer-ring{border:1px solid var(--rule);border-radius:50%;display:grid;place-items:center;width:10.4em;height:10.4em;margin:.5em auto}.phone-cta{background:var(--hero);color:var(--hero-text);text-align:center;border-radius:.7em;padding:.8em;font-size:.82em}.night .phone h3{font-family:system-ui,sans-serif;letter-spacing:-.06em}.night .phone-hero{border-radius:.5em}.night .phone-hero strong,.night .timer{font-family:system-ui,sans-serif;font-style:normal;font-weight:650}
dialog{width:405px;max-width:calc(100vw - 16px);max-height:94dvh;overflow:auto;border:1px solid var(--line);border-radius:15px;background:var(--paper);color:var(--ink);padding:14px}dialog::backdrop{background:#222722a8}.viewer-bar,.viewer-nav{display:flex;justify-content:space-between;align-items:center;gap:8px}.viewer-bar{padding:0 0 10px;position:sticky;top:-14px;background:var(--paper);z-index:1}.viewer-bar small{color:var(--quiet)}.viewer-nav{padding-top:10px;position:sticky;bottom:-14px;background:var(--paper)}.viewer-nav button,#close{background:transparent;border:1px solid var(--line);border-radius:7px;padding:7px 10px}#close{font-size:22px;line-height:1}.viewer-nav button:disabled{opacity:.4;cursor:default}#viewer-art{overflow-x:auto}
@media(max-width:960px){body{grid-template-columns:190px minmax(0,1fr)}.sidebar{padding-inline:14px}.gallery{gap:32px}}
@media(max-width:720px){body{display:block}.sidebar{height:auto;position:static;padding:16px 18px;border-right:0;border-bottom:1px solid var(--line)}.sidebar nav{margin-top:0}#directions{display:grid;grid-template-columns:1fr 1fr;gap:6px}.direction{margin:0}.side-foot{display:none}main{padding:18px}.intro{padding-block:26px}.topline span:last-child{display:none}}
@media(max-width:390px){.direction small{font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important}}

@media(min-width:721px){
  body{grid-template-columns:200px minmax(0,1fr);font-size:12px}
  .sidebar{padding:24px 18px 18px}
  .direction{padding:10px 8px;gap:9px}
  .direction strong{font-size:12px}
  .direction small{font-size:9px}
  .swatch{width:28px;height:28px;font-size:15px}
  main{height:100dvh;margin:0 auto;padding:18px clamp(24px,4vw,64px) 14px;display:flex;flex-direction:column}
  .topline{font-size:9px;padding-bottom:12px;flex:none}
  .intro{display:grid;grid-template-columns:max-content 1fr;align-items:center;gap:10px 24px;padding:16px 0;flex:none}
  .edition{grid-column:1;grid-row:1;justify-self:start;font-size:9px;padding:4px 8px}
  .intro h1{grid-column:1;grid-row:2;font-size:32px;margin:0;letter-spacing:-.04em}
  .intro p{grid-column:2;grid-row:2;font-size:12px;line-height:1.6;max-width:none}
  .palette{grid-column:2;grid-row:1;margin:0;gap:5px}
  .palette span{width:12px;height:12px}
  .watermark{font-size:150px}
  main>section{display:flex;flex-direction:column;flex:1;min-height:0}
  .section-head{padding:10px 0;flex:none}
  .section-head h2{font-size:13px}
  .gallery{grid-template-columns:repeat(2,var(--preview-width,200px));flex:1;min-height:0;gap:48px;overflow:visible}
  .gallery .art,.gallery .art>img{width:var(--preview-width,200px)}
  .gallery .art{--draft-radius:calc(var(--preview-width,200px) * .096)}
  .gallery .art::after{inset:-2px;border-width:2px}
  .caption{font-size:11px;padding:9px 0}
  .caption small{font-size:10px}
  footer{flex:none;margin-top:8px;padding-top:9px;font-size:9px}
}