@font-face{font-family:Inter;src:url('/assets/fonts/inter-normal.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:Newsreader;src:url('/assets/fonts/newsreader-normal.woff2') format('woff2');font-weight:200 800;font-display:swap}
:root{color-scheme:light;--paper:#f6f3ed;--ink:#282923;--muted:#696b63;--line:#dcdcd1;--accent:#426348;--stage:#18191b;--stage-ink:#efefe8;--stage-muted:#aaaead}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.55 Inter,system-ui,sans-serif}a{color:inherit;text-underline-offset:4px}button,input,select{font:inherit}button,select{cursor:pointer}button{min-height:40px;padding:8px 12px;border:1px solid var(--line);border-radius:5px;background:transparent;color:inherit;font-size:13px;line-height:1.3}button:hover{background:#e8e9df}button:disabled{opacity:.4;cursor:default}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid #9daaff;outline-offset:3px}button[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}button,input,select{touch-action:manipulation}[hidden]{display:none!important}
.site-bar{max-width:1600px;margin:auto;padding:22px 36px;display:flex;justify-content:space-between;align-items:center;font-size:14px;border-bottom:1px solid var(--line)}.site-bar a{text-decoration:none}.site-name{font-weight:600}.intro{max-width:1600px;margin:auto;padding:36px;display:flex;align-items:end;gap:48px;justify-content:space-between}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.16em;color:var(--muted);margin:0 0 12px}h1{font:400 clamp(38px,4.8vw,65px)/1 Newsreader,Georgia,serif;letter-spacing:-.035em;margin:0}.intro>p{max-width:420px;margin:0 0 2px;color:var(--muted);font-size:14px}.explorer{display:grid;grid-template-columns:minmax(0,1fr) 320px;max-width:1600px;margin:auto;padding:0 36px;align-items:start;gap:24px}.scene-column{min-width:0}.scene-toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap}.segmented{display:flex;gap:4px}.segmented button{border-color:transparent}.scene{position:relative;isolation:isolate;background:var(--stage);color:var(--stage-ink);height:clamp(480px,68vh,820px);overflow:hidden;border-radius:7px}.scene canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}.scene canvas:active{cursor:grabbing}.scene-heading{position:absolute;left:24px;top:22px;pointer-events:none;display:grid;gap:4px}.scene-heading>span:first-child{font-size:14px}.scene-heading>span:last-child{font-size:11px;color:var(--stage-muted)}.scene-bottom{position:absolute;bottom:18px;left:24px;right:24px;display:flex;align-items:center;justify-content:space-between;gap:12px;pointer-events:none;flex-wrap:wrap}.scene-bottom p{font-size:11px;color:var(--stage-muted);margin:0}.camera-controls{display:flex;gap:5px;pointer-events:auto}.camera-controls button{background:#242629;border-color:#404346;color:var(--stage-ink);font-size:12px;min-height:36px}.camera-controls button:hover{background:#383b3e}.camera-controls button[aria-pressed=true]{background:#ededdf;color:#202221}.hover-label{position:absolute;pointer-events:none;background:#f4f2eb;color:#252821;padding:7px 10px;border-radius:4px;font-size:12px;box-shadow:0 3px 16px #0003;max-width:220px}.scene-options{display:flex;align-items:center;gap:18px;flex-wrap:wrap;font-size:12px;color:var(--muted);padding:12px 0}.scene-options label{display:flex;align-items:center;gap:6px;min-height:28px}.scene-options input{accent-color:var(--accent)}.scene-options>span{margin-left:auto;font-variant-numeric:tabular-nums}
.inspector{min-width:0;padding-top:52px}.selected-sample{height:98px;background:#ddd;border:1px solid #0001;border-radius:5px}.selected-heading{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:14px 0 10px}.selected-heading h2{font-size:16px;line-height:1.3;font-weight:500;margin:0}.selected-heading span{font:12px/1.4 ui-monospace,SFMono-Regular,monospace;color:var(--muted);white-space:nowrap}.coordinates{display:flex;justify-content:space-between;gap:12px;margin:0}.coordinates div{display:flex;align-items:baseline;gap:7px}.coordinates dt{font-size:11px;color:var(--muted)}.coordinates dd{margin:0;font-size:14px;font-variant-numeric:tabular-nums}.display-note{font-size:11px;color:var(--muted);margin:10px 0 20px}.control-field{margin:16px 0}.control-field>label{display:flex;justify-content:space-between;font-size:12px;gap:12px;margin-bottom:7px}.control-field output{color:var(--muted);font-variant-numeric:tabular-nums}select{display:block;width:100%;padding:10px;background:#fdfcf8;border:1px solid var(--line);border-radius:5px;color:var(--ink);font-size:14px;min-height:42px}input[type=range]{width:100%;margin:0;min-height:28px;accent-color:var(--accent)}.range-ends{display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}.hue-heading{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:22px;margin-bottom:9px}.hue-heading h3{font-weight:500;font-size:12px;margin:0}.hue-heading span{font-size:10px;color:var(--muted)}.hue-page{display:grid;grid-template-columns:18px repeat(8,minmax(0,1fr));gap:4px;align-items:center}.hue-page .tick{font-size:10px;color:var(--muted);text-align:center;font-variant-numeric:tabular-nums}.hue-page .axis-tick{text-align:left}.hue-page .chip{display:block;border:0;min-height:24px;height:24px;width:100%;border-radius:2px;padding:0;position:relative}.hue-page .chip[aria-pressed=true]{outline:2px solid var(--ink);outline-offset:1px;box-shadow:inset 0 0 0 2px #fff}.hue-page .neutral{height:24px;border-radius:2px}.page-note{color:var(--muted);font-size:11px;margin:9px 0 16px}.comparison-links{display:flex;gap:7px;flex-wrap:wrap}.comparison-links button{font-size:11px;min-height:36px;padding:7px 9px}.live-status{font-size:11px;min-height:18px;color:var(--muted);margin:12px 0 0}
.reading{max-width:1050px;margin:60px auto 70px;padding:0 36px}.reading>h2{font:400 30px/1.2 Newsreader,Georgia,serif;margin:0 0 24px}.dimensions{display:grid;grid-template-columns:repeat(3,1fr);gap:36px}.dimensions h3{font-size:14px;font-weight:500;margin:0 0 8px}.dimensions p{font-size:13px;color:var(--muted);margin:0}details{border-top:1px solid var(--line);margin-top:36px;padding-top:20px;font-size:13px}summary{cursor:pointer;font-size:14px}.method{max-width:780px;color:var(--muted)}.method p{margin:16px 0}.method li{margin:7px 0}
.explorer:fullscreen,.explorer.expanded{max-width:none;width:100%;height:100%;background:var(--paper);padding:20px;overflow:auto}.explorer:fullscreen .scene,.explorer.expanded .scene{height:calc(100dvh - 125px)}.explorer:fullscreen .inspector,.explorer.expanded .inspector{padding-top:52px}
@media(min-width:1500px){.explorer{grid-template-columns:minmax(0,1fr) 350px;gap:32px}}
@media(max-width:1000px){.intro{gap:24px;padding-top:28px}.explorer{grid-template-columns:minmax(0,1fr) 280px;gap:18px}.site-bar,.intro{padding-left:24px;padding-right:24px}.explorer{padding:0 24px}.scene-heading{left:18px}.scene-bottom{left:18px;right:18px}.scene-bottom p{max-width:190px}.coordinates div{gap:4px}.scene-toolbar{gap:5px}.segmented{gap:0}.segmented button{padding:8px;font-size:12px}#fullscreen{font-size:12px;padding:8px}.dimensions{gap:24px}}
@media(max-width:760px){.intro{display:block;padding-bottom:24px}.intro>p{max-width:560px;margin-top:18px}.explorer{grid-template-columns:1fr}.scene{height:60vh;min-height:420px;max-height:600px}.inspector{padding-top:8px;display:grid;grid-template-columns:1fr 1fr;column-gap:24px;align-items:start}.selected-sample{grid-column:1;height:104px;grid-row:1/4}.selected-heading{grid-column:2;margin:0 0 8px;display:block}.selected-heading h2{margin-bottom:4px}.coordinates{grid-column:2;flex-wrap:wrap;justify-content:start;gap:8px 18px}.display-note{grid-column:2;margin:8px 0}.control-field{margin-top:20px}.hue-heading,.hue-page,.page-note,.comparison-links,.live-status{grid-column:1/-1}.hue-page .chip,.hue-page .neutral{height:32px}.hue-heading{margin-top:8px}.hue-heading h3{font-size:14px}.hue-page{grid-template-columns:24px repeat(8,minmax(0,1fr));gap:5px}.reading{margin-top:44px}.dimensions{grid-template-columns:1fr;gap:22px}.reading>h2{margin-bottom:22px}.explorer:fullscreen,.explorer.expanded{display:block}.explorer:fullscreen .scene,.explorer.expanded .scene{height:calc(100dvh - 150px)}.explorer:fullscreen .inspector,.explorer.expanded .inspector{padding-top:18px}}
@media(max-width:420px){.site-bar{padding:16px}.intro{padding:26px 16px 22px}.explorer{padding:0 12px}.intro h1{font-size:40px}.intro>p{font-size:13px}.scene-toolbar{gap:7px}.segmented button{padding:8px 7px}.scene-heading{left:16px;top:17px}.scene-bottom{left:14px;right:14px;bottom:14px;gap:9px}.scene-bottom p{max-width:none}.scene-options{gap:10px}.scene-options>span{margin-left:0}.inspector{padding:12px 4px 0;column-gap:16px}.reading{padding:0 20px}.selected-heading h2{font-size:15px}.control-field label{display:block}.control-field output{display:block;min-height:20px}.hue-page{gap:4px}.coordinates div{gap:5px}.coordinates dd{font-size:13px}.explorer:fullscreen,.explorer.expanded{padding:8px}}
@media(pointer:coarse){button{min-height:44px}.camera-controls button,.comparison-links button{min-height:44px}.hue-page .chip,.hue-page .neutral{height:40px}.hue-page{row-gap:6px}.scene-bottom p{font-size:10px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}

.explorer.expanded{position:fixed;inset:0;z-index:1000}.has-expanded{overflow:hidden}
.model-nav{max-width:1600px;margin:0 auto 24px;padding:0 36px;display:flex;gap:8px;flex-wrap:wrap}.model-nav a{display:flex;align-items:center;min-height:44px;padding:10px 14px;border:1px solid var(--line);border-radius:5px;font-size:12px;text-decoration:none}.model-nav a:hover{background:#e8e9df}.model-nav a[aria-current=page]{background:var(--ink);color:var(--paper);border-color:var(--ink)}@media(max-width:1000px){.model-nav{padding:0 24px}}@media(max-width:420px){.model-nav{padding:0 16px;gap:6px}.model-nav a{padding:9px 10px;font-size:11px}}
.limit-note{font-size:11px;color:var(--muted);line-height:1.6;margin:5px 0 0}.unit-note{font-size:13px;color:var(--muted);margin-top:28px;max-width:850px}.hue-page .edge-chip{font-size:9px;font-variant-numeric:tabular-nums}.hue-page .beyond-screen:after{content:"";position:absolute;right:1px;top:1px;width:5px;height:5px;border-top:2px solid #fff;border-right:2px solid #fff;filter:drop-shadow(0 0 1px #000)}.chroma-control{grid-column:1/-1}
@media(min-width:761px){.scene-column{position:sticky;top:16px}.explorer:fullscreen .inspector,.explorer.expanded .inspector{max-height:calc(100dvh - 40px);overflow-y:auto;padding-right:5px}.explorer:fullscreen .scene-column,.explorer.expanded .scene-column{top:0}}