/* ================================================================ */ /* pluma — tokens.css */ /* Generated by sampo-build.py. DO NOT HAND-EDIT. */ /* Source: pluma.tokens.json (W3C DTCG) is canonical. */ /* tokens.json is derived. Edit the DTCG file, re-run build. */ /* ================================================================ */ /* sampo-fingerprint: brand=pluma | slug=pluma | ground=light | accent=#DF612C | display=Coco Gothic */ :root { /* === brand — Sampo v1 Layer A === */ --orange: #DF612C; --terracotta: #AE5733; --maroon: #6A200F; --paper: #EFD3C3; --mustard: #D6B128; --tealGrey: #73999C; --teal: #1D6266; --cream: #FDDFC7; --accent: #DF612C; --ink: #6A200F; --white: #FFFFFF; --black: #000000; --laguna: #0A4249; --arena: #D5AB8E; --blush: #FEE5D2; --ink-ground: #0A4249; --paper-ground: #D5AB8E; --accent: #DF612C; --muted: #1D6266; --font-display: 'Coco Gothic','Jost','Century Gothic',sans-serif; --font-weight-display: 200; --font-subtitle: 'Jost','Questrial','Century Gothic','Trebuchet MS',sans-serif; --font-weight-subtitle: 400; --font-body: 'EB Garamond','GaramondNo8','Garamond',Georgia,serif; --font-weight-body: 400; --font-accent: 'Daniel','Caveat',cursive; --font-weight-accent: 500; --fs-hero: 132px; --fs-h1: 72px; --fs-h2: 42px; --fs-h3: 26px; --fs-body: 17px; --fs-caption: 12px; --fs-ratio: 1.5; --space-unit: 8px; --space-0: 4px; --space-1: 8px; --space-2: 16px; --space-3: 24px; --space-4: 40px; --space-5: 64px; --space-6: 96px; --space-7: 160px; --radius-none: 0px; --radius-sm: 4px; --radius-md: 14px; --radius-lg: 24px; /* === Layer B — derived by sampo-build.py (do not hand-edit) === */ /* B1: Surface ramp */ --surface-1: #1E5158; --surface-2: #2F5E64; --surface-3: #406C71; /* B2: Alpha derivatives (fallback + live) */ --paper-ghost: rgba(213,171,142,0.06); /* fallback */ --paper-ghost: color-mix(in srgb, rgb(213,171,142) 6%, transparent); /* live */ --paper-border: rgba(213,171,142,0.12); /* fallback */ --paper-border: color-mix(in srgb, rgb(213,171,142) 12%, transparent); /* live */ --paper-hover: rgba(213,171,142,0.16); /* fallback */ --paper-hover: color-mix(in srgb, rgb(213,171,142) 16%, transparent); /* live */ --ink-ghost: rgba(10,66,73,0.06); /* fallback */ --ink-ghost: color-mix(in srgb, rgb(10,66,73) 6%, transparent); /* live */ --ink-border: rgba(10,66,73,0.12); /* fallback */ --ink-border: color-mix(in srgb, rgb(10,66,73) 12%, transparent); /* live */ --ink-hover: rgba(10,66,73,0.16); /* fallback */ --ink-hover: color-mix(in srgb, rgb(10,66,73) 16%, transparent); /* live */ --accent-dim: rgba(223,97,44,0.18); /* fallback */ --accent-dim: color-mix(in srgb, rgb(223,97,44) 18%, transparent); /* live */ --accent-border: rgba(223,97,44,0.35); /* fallback */ --accent-border: color-mix(in srgb, rgb(223,97,44) 35%, transparent); /* live */ /* B3: Semantic status palette (brand-tunable via tokens.json `status`) */ --green: #599965; --green-dim: rgba(89,153,101,0.12); /* fallback */ --green-dim: color-mix(in srgb, rgb(89,153,101) 12%, transparent); /* live */ --amber: #BB7F0D; --amber-dim: rgba(187,127,13,0.12); /* fallback */ --amber-dim: color-mix(in srgb, rgb(187,127,13) 12%, transparent); /* live */ --error: #C24B2B; --error-dim: rgba(194,75,43,0.12); /* fallback */ --error-dim: color-mix(in srgb, rgb(194,75,43) 12%, transparent); /* live */ --info: #4B6D86; --info-dim: rgba(75,109,134,0.12); /* fallback */ --info-dim: color-mix(in srgb, rgb(75,109,134) 12%, transparent); /* live */ /* B3b: On-fill foregrounds (stable, not a reused --paper) */ --on-dark: #F5F5F2; --on-accent: #F5F5F2; /* B4: Motion tokens */ --ease-out-expo: cubic-bezier(0.16,1,0.3,1); --dur-fast: 150ms; --dur-normal: 300ms; --stagger-step: 40ms; /* B5: Animated background gradient stops */ --bg-gradient-stops: #0A4249, #093E45, #394943, #DF612C; /* === Layer C — consumer alias superset (primaryMode=light) === */ color-scheme: light; --ground: #EFD3C3; --on-ground: #6A200F; --surface: #FFFFFF; --surface-hi: #EACCBC; --line: #DCBAAA; --ghost: #E8CABA; --accent-2: #73999C; --success: var(--green); --ease: var(--ease-out-expo); /* chat-ui contract aliases (were the valo-chat overlay) */ --c-green: var(--green); --c-amber: var(--amber); --c-error: var(--error); --c-info: var(--info); }/* pluma base (site layer): self-hosted faces, steps the Sampo scale lacks, and NRQ-name aliases so older surfaces read Pluma */ @font-face{font-family:'Coco Gothic';font-weight:100 900;font-style:normal;font-display:swap;src:url(/fonts/jost-var.woff2) format('woff2')}@font-face{font-family:'Daniel';font-weight:400 700;font-style:normal;font-display:swap;src:url(/fonts/caveat-500.woff2) format('woff2')} @font-face{font-family:'Jost';font-weight:100 900;font-style:normal;font-display:swap;src:url(/fonts/jost-var.woff2) format('woff2')} @font-face{font-family:'EB Garamond';font-weight:400;font-style:normal;font-display:swap;src:url(/fonts/eb-garamond-400.woff2) format('woff2')} @font-face{font-family:'Caveat';font-weight:500;font-style:normal;font-display:swap;src:url(/fonts/caveat-500.woff2) format('woff2')} :root{--space-8:224px;--space-9:288px;--fs-label:.72rem;--font-display:"Coco Gothic","Jost","Century Gothic",sans-serif;--font-accent:"Daniel","Caveat",cursive; --dusk:linear-gradient(158deg,#0A4249 0%,#4a4a40 30%,#8D553C 58%,#DF612C 100%); --navy:var(--laguna);--ivory:var(--blush);--gold:var(--orange);--mauve:color-mix(in srgb,var(--blush) 68%,var(--laguna))} /* ---- fork additions (2026-11-03): her brand faces. Trial numerals are placeholder bars, so digits are EXCLUDED from the range and fall through to Jost (the next family in --font-display). Daniel: one handwritten line per view. ---- */