/* Archives web app: Shop theme tokens (Zach's board picks, Nov 8 2026: 1B Shop, 2C Soft corners, 4A date on the
   margin, 6A one floating pill bar, 7A develop). The single source of truth for every /account/ screen; screens
   use these names and never restate the values. Map from the older prefixes: docs/WEB-THEME.md. */
@font-face{font-family:Newsreader;src:url('/fonts/newsreader.ttf') format('truetype');font-display:swap}
/* Oswald 500, latin subset, served by the Worker from the account bundle
   (src/account/oswald.woff2, 12,704 bytes, OFL in oswald-OFL.txt; public/ is pinned to live, so it can't go there). The one label face. */
@font-face{font-family:Oswald;font-style:normal;font-weight:500;font-display:swap;src:url('/account/oswald.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* Colour: Day is 1B "Shop, warmer" (Nov 8 round 2 board): off-white paper with a 3% grain, warm ink, warm-grey
   hairlines. Night is the same theme on warm near-black: cream type, prints keep a thin light edge. Night follows
   the phone (prefers-color-scheme) unless html[data-theme] says otherwise (theme.js, theme-boot.js). Photos are never
   tinted: the grain is painted on the page background, under every photo. Contrast (WCAG AA): see docs/WEB-THEME.md. */
:root{
 color-scheme:light;
 --bg:#faf8f4;
 --surface:#faf8f4;         /* sheets, dialogs, menus: one step up from --bg at Night */
 --ink:#23201c;
 --muted:#6b645c;
 --line:#e6dfd4;            /* the hairline; also the only "shadow" */
 --line-strong:#cbc2b5;     /* hovered input borders */
 --fill:#f1ece4;            /* one neutral surface: skeletons, pressed states, chips when filled */
 --on-ink:#faf8f4;          /* type on ink buttons and the pill bar */
 --on-ink-muted:rgba(250,248,244,.72); /* the pill bar's other tabs */
 --on-photo:#fff;           /* type over a photo, always with --scrim-photo-* behind it */
 --scrim:rgba(35,32,28,.45);/* sheet backdrops */
 --scrim-photo-top:linear-gradient(to bottom,rgba(0,0,0,.55),rgba(0,0,0,0));
 --scrim-photo-bottom:linear-gradient(to top,rgba(0,0,0,.6),rgba(0,0,0,0));
 --photo-text-shadow:0 1px 10px rgba(0,0,0,.45);
 --danger:#d0202c;          /* destructive only; the AGENTS.md red darkened to pass AA on the paper (5.0:1) */
 --action:#253772;          /* reserved: one rare action per screen at most */
 --badge:#d0202c;--on-badge:#fff; /* the count on Events and Friends: small, red, white numeral */
 --shimmer-a:#f3f4f6;--shimmer-b:#e5e7eb; /* AGENTS.md shimmer pair (Day); Night has its own */
 --print-edge:0px;          /* Night only: the light edge round a print */
 --print-edge-color:transparent;
 --paper:#faf8f4;--paper-ink:#23201c; /* always light, both themes: a QR code has to scan */
 /* The pill tab bar: ink with a paper pill by Day; at Night a raised warm-dark bar with a cream pill (never a cream slab). */
 --bar-bg:var(--ink);--bar-text:var(--on-ink-muted);--bar-pill:var(--bg);--bar-on-pill:var(--ink);--bar-edge:transparent;
 /* A postcard sits on its own paper (Nov 9: it disappeared into the page): a lighter sheet, a hairline and a soft lift. */
 --card:#fffefb;--card-shadow:0 0 0 1px var(--line),0 1px 2px rgba(35,32,28,.06),0 10px 28px rgba(35,32,28,.09);
 --toast-bg:var(--ink);--toast-ink:var(--on-ink);--toast-hover:rgba(250,248,244,.12);
 --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.03'/%3E%3C/svg%3E");
 --photo-ground:#000;       /* the photo viewer only: a photo full screen reads best on black (Nov 8) */
 /* Type: Newsreader for the wordmark and titles, Oswald uppercase with tracking for every label, button, tab,
    date and eyebrow, the system sans for body copy and inputs. */
 --serif:Newsreader,Georgia,serif;
 --label:Oswald,"Arial Narrow","Helvetica Neue",Arial,sans-serif;
 --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,Roboto,Helvetica,Arial,sans-serif;
 --track:.12em;             /* letter-spacing that goes with --label */
 --fs-label-s:11px;--fs-label:12px;--fs-label-l:13px;
 --fs-body:15px;
 --fs-title:24px;--fs-title-l:30px;
 --fs-wordmark:28px;
 --fs-display:clamp(40px,5.4vw,68px);
 /* Radii (2C Soft): controls 8, sheets 12, photos and prints square. */
 --r-control:8px;--r-sheet:12px;--r-photo:0;--r-pill:999px;
 /* Spacing. */
 --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;
 --gutter:16px;
 --tap:44px;
 /* Motion (AGENTS.md): 150-300 ms, one curve; the develop reveal (7A) 1.8 s per tile, 220 ms apart, once per device. */
 --ease:cubic-bezier(.4,0,.2,1);
 --t-fast:150ms;--t:200ms;--t-slow:300ms;
 --develop:1.8s;--develop-stagger:220ms;
 --shimmer:1.5s;
 /* Springs as linear() curves (Safari 17.2+), sampled from a damped spring; older browsers fall back to --ease.
    --spring: stiffness 300, damping 26, ~2.6% overshoot, settles in --t-spring (tab pill, pages, sheets).
    --spring-bounce: stiffness 600, damping 22, for a press letting go (.96 → 1.008 → 1). */
 --spring:var(--ease);--spring-bounce:var(--ease);
 --t-spring:440ms;--t-press:110ms;--t-release:480ms;
 --press:.96;
 /* Elevation: none. A hairline stands in for every shadow. */
 --shadow:0 0 0 1px var(--line);
 --bar-h:52px;              /* the pill bar's height, for bottom padding under it */
}
@media (min-width:761px){:root{--gutter:40px}}
@supports (transition-timing-function:linear(0,1)){:root{
 --spring:linear(0,.04,.121,.237,.351,.476,.582,.686,.766,.84,.893,.939,.969,.994,1.008,1.019,1.024,1.026,1.025,1.023,1.021,1.018,1.015,1.012,1.009,1.007,1.005,1.003,1);
 --spring-bounce:linear(0,.128,.378,.657,.902,1.077,1.174,1.202,1.178,1.128,1.072,1.022,.986,.964,.959,.964,.974,.985,.995,1.003,1.007,1.008,1.007,1.005,1);
}}
/* Night: the same names, warm near-black. Both blocks hold the same values (the system setting, and the toggle). */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
 color-scheme:dark;
 --bg:#14120f;--surface:#1c1915;--ink:#efe6d6;--muted:#a69c8e;--line:#332d28;--line-strong:#4a423b;--fill:#241f1b;
 --on-ink:#14120f;--on-ink-muted:rgba(20,18,15,.66);--scrim:rgba(0,0,0,.6);
 --danger:#ff6f6a;--action:#a9b8f0;--shimmer-a:#1f1b18;--shimmer-b:#2a2521;--print-edge:1px;--print-edge-color:rgba(239,230,214,.16);
 --bar-bg:#262119;--bar-text:#a69c8e;--bar-pill:#efe6d6;--bar-on-pill:#14120f;--bar-edge:#3a332c;
 --card:#231f1a;--card-shadow:0 0 0 1px #3a332c,0 1px 2px rgba(0,0,0,.4),0 12px 32px rgba(0,0,0,.45);--badge:#e0453c;--on-badge:#fff;
 --toast-bg:#2a2521;--toast-ink:#efe6d6;--toast-hover:rgba(239,230,214,.1);
 --scrim-photo-top:linear-gradient(to bottom,rgba(10,8,6,.6),rgba(10,8,6,0));--scrim-photo-bottom:linear-gradient(to top,rgba(10,8,6,.66),rgba(10,8,6,0));
 --photo-ground:#0b0a08;
 --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 1 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E");
}}
:root[data-theme="dark"]{
 color-scheme:dark;
 --bg:#14120f;--surface:#1c1915;--ink:#efe6d6;--muted:#a69c8e;--line:#332d28;--line-strong:#4a423b;--fill:#241f1b;
 --on-ink:#14120f;--on-ink-muted:rgba(20,18,15,.66);--scrim:rgba(0,0,0,.6);
 --danger:#ff6f6a;--action:#a9b8f0;--shimmer-a:#1f1b18;--shimmer-b:#2a2521;--print-edge:1px;--print-edge-color:rgba(239,230,214,.16);
 --bar-bg:#262119;--bar-text:#a69c8e;--bar-pill:#efe6d6;--bar-on-pill:#14120f;--bar-edge:#3a332c;
 --card:#231f1a;--card-shadow:0 0 0 1px #3a332c,0 1px 2px rgba(0,0,0,.4),0 12px 32px rgba(0,0,0,.45);--badge:#e0453c;--on-badge:#fff;
 --toast-bg:#2a2521;--toast-ink:#efe6d6;--toast-hover:rgba(239,230,214,.1);
 --scrim-photo-top:linear-gradient(to bottom,rgba(10,8,6,.6),rgba(10,8,6,0));--scrim-photo-bottom:linear-gradient(to top,rgba(10,8,6,.66),rgba(10,8,6,0));
 --photo-ground:#0b0a08;
 --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 1 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E");
}