@font-face{font-family:Space Grotesk;src:url(/fonts/space-grotesk-latin-wght-normal.woff2) format("woff2");font-weight:300 700;font-display:swap}@font-face{font-family:Manrope;src:url(/fonts/manrope-latin-wght-normal.woff2) format("woff2");font-weight:200 800;font-display:swap}:root{font-family:Manrope,Arial,sans-serif;background:#fff;color:#111;font-synthesis:none;--line:#deded9;--ink:#111}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,select{font:inherit;color:inherit}button,a,input,select{outline-offset:4px}button{border-radius:0;cursor:pointer}a{color:inherit;text-underline-offset:4px}svg{display:block}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid currentColor}::selection{background:#111;color:#fff}[hidden]{display:none!important}.inner{max-width:1600px;margin:auto;padding-inline:clamp(22px,4.2vw,72px)}.skip-link{position:fixed;left:20px;top:-100px;background:#111;color:#fff;padding:12px;z-index:20}.skip-link:focus{top:15px}.site-header{border-bottom:1px solid var(--line)}.header-inner{display:flex;justify-content:space-between;align-items:center;min-height:88px;gap:20px}.brand{font-family:Space Grotesk,sans-serif;font-weight:600;text-decoration:none;font-size:18px;letter-spacing:-.06em}.brand span{font-family:Manrope,sans-serif;font-size:11px;font-weight:400;letter-spacing:0;margin-left:18px}nav{display:flex;gap:24px}nav a{font-size:11px;text-decoration:none}nav a:hover{text-decoration:underline}.hero{border-bottom:1px solid #111}.hero .inner{padding-top:48px;padding-bottom:34px}h1{font-family:Space Grotesk,sans-serif;font-size:clamp(75px,12.5vw,190px);font-weight:500;line-height:.95;letter-spacing:-.085em;margin:0}h1 span{color:#111}label{display:flex;flex-direction:column;font-size:10px;gap:8px}select,input[type=text],#hex-input{border:1px solid var(--line);border-radius:0;background:#fff;padding:11px 12px;font-size:12px;min-height:44px}select{min-width:148px}.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid #111;background:#fff;padding:13px 18px;min-height:44px;font-size:11px}.button.dark{background:#111;color:#fff}.button:hover{background:#efefeb}.button.dark:hover{background:#333}.palette-toolbar{border-bottom:1px solid #111}.toolbar-inner{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));width:100%;max-width:none;margin:0;padding:0}.harmony-filters{display:grid;grid-column:span 4;grid-template-columns:repeat(4,minmax(0,1fr))}.harmony-filters button,#generate{min-height:72px;background:#fff;border:0;border-right:1px solid #111;padding:18px 12px;font-size:13px}.harmony-filters button:first-child{border-left:1px solid #111}.harmony-filters button[aria-pressed=true]{background:#111;color:#fff}.harmony-filters button:hover:not([aria-pressed=true]),#generate:hover{background:#f2f2f0}.harmony-filters button:focus-visible,#generate:focus-visible{outline-offset:-6px}#generate{display:flex;align-items:center;justify-content:center;gap:10px;font-weight:600}#generate svg{flex-shrink:0}.palette-section{border-bottom:1px solid #111}.palette-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}.swatch{min-height:330px;background:var(--swatch);color:var(--foreground);display:flex;flex-direction:column;justify-content:space-between;padding:24px;position:relative;transition:background-color .18s ease;border-right:1px solid #1111}.swatch:last-child{border-right:0}.swatch-select{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:transparent;color:inherit}.swatch-select:focus-visible{outline:2px solid currentColor;outline-offset:-7px}.swatch-top,.swatch-bottom{position:relative;pointer-events:none}.swatch-top button,.swatch-bottom button{pointer-events:auto}.swatch-top{display:flex;align-items:center}.lock-button,.settings-button{border:0;background:transparent;color:inherit;width:44px;height:44px;display:grid;place-items:center;padding:8px}.lock-button:hover,.settings-button:hover{outline:1px solid currentColor;outline-offset:-3px}.swatch-bottom{display:flex;flex-direction:column;align-items:start;gap:6px}.hex-copy{font-family:Space Grotesk,sans-serif;font-size:clamp(18px,2.1vw,32px);letter-spacing:-.035em;font-weight:500;border:0;background:transparent;color:inherit;padding:0;min-height:44px}.hex-copy:hover{text-decoration:underline;text-underline-offset:5px}.palette-actions{border-bottom:1px solid #111}.action-inner{display:flex;align-items:center;justify-content:flex-end;gap:22px;padding-block:12px}.action-inner>div{display:flex;gap:24px}.text-action{background:none;border:0;padding:6px 0;font-size:11px;min-height:44px}.text-action:hover{text-decoration:underline;text-underline-offset:5px}.work-section{border-bottom:1px solid #111}.work-inner{display:grid;grid-template-columns:1fr 1fr}.nuances{padding:36px 48px 42px 0;border-right:1px solid var(--line)}.usage{padding:36px 0 42px 48px}.section-heading{display:flex;justify-content:space-between;align-items:baseline;gap:15px;margin-bottom:25px}h2{font-family:Space Grotesk,sans-serif;font-size:30px;line-height:1.1;letter-spacing:-.055em;font-weight:500;margin:0}.section-heading>span{font-size:10px;color:#777}.hex-field{max-width:185px}.hex-field input{font-family:Space Grotesk,sans-serif;letter-spacing:.05em}input[aria-invalid=true]{border:2px dashed #111}.sliders{display:grid;gap:12px;margin-top:24px}.range-label>span{display:flex;justify-content:space-between}.range-label output{color:#111;font-size:10px}input[type=range]{width:100%;appearance:none;-webkit-appearance:none;background:none;margin:0;height:40px;cursor:pointer}input[type=range]::-webkit-slider-runnable-track{background:var(--line);height:2px}input[type=range]::-webkit-slider-thumb{appearance:none;width:10px;height:18px;background:#111;margin-top:-8px;border-radius:0}input[type=range]::-moz-range-track{background:var(--line);height:2px}input[type=range]::-moz-range-thumb{width:10px;height:18px;background:#111;border:0;border-radius:0}h3{font-size:12px;font-weight:500;margin:0}.shades{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}.shades button{padding:0;min-height:260px;border:0}.shades span{font-size:8px}.shades button:hover{outline:1px solid currentColor;outline-offset:-5px}.usage-controls{display:flex;gap:15px;margin-bottom:22px}.usage-controls label{flex:1}.usage-controls select{min-width:0;width:100%}.color-poster{position:relative;min-height:260px;padding:26px;background:var(--poster-background);color:var(--poster-text);border:1px solid #1111;overflow:hidden}.color-poster h3{font-family:Space Grotesk,sans-serif;font-size:clamp(40px,4.6vw,70px);letter-spacing:-.065em;font-weight:500;line-height:1.04;margin:24px 0 17px;position:relative;z-index:1}.color-poster p{font-size:11px;margin:0;position:relative;z-index:1}.poster-mark{position:absolute;right:-20px;bottom:-35px;width:120px;height:120px;border-radius:50%;background:var(--poster-accent);opacity:.8}.contrast-result{font-size:10px;color:#777;margin:13px 0 0}.library{border-bottom:1px solid var(--line);padding-block:38px 48px}.library-heading{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:24px;gap:20px}.library-heading p{font-size:11px;color:#777;margin:0}.preset-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.preset{padding:0;border:1px solid var(--line);background:#fff;text-align:left}.preset:hover{border-color:#111}.preset-swatches{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));min-height:95px}.preset-name{display:flex;align-items:center;justify-content:space-between;font-size:11px;padding:13px 14px}.footer-inner{display:flex;justify-content:space-between;align-items:center;min-height:86px;font-size:10px;color:#777}.footer-inner a{color:#111}dialog{padding:0;width:min(740px,calc(100% - 32px));max-height:calc(100dvh - 40px);border:1px solid #111;background:#fff;color:#111;overflow:auto}dialog::backdrop{background:#0004}.dialog-header{display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid var(--line);padding:24px}.dialog-header h2{font-size:27px}.dialog-header button{border:0;background:none;font-size:10px;padding:6px}.export-tabs{display:flex;gap:24px;padding:0 24px;border-bottom:1px solid var(--line)}.export-tabs button{border:0;background:none;padding:17px 0;font-size:11px;color:#777}.export-tabs button[aria-selected=true]{color:#111;border-bottom:2px solid #111}pre{font:12px/1.7 ui-monospace,monospace;white-space:pre;overflow:auto;max-height:45vh;margin:24px;background:#f5f5f1;padding:22px}.dialog-actions{display:flex;justify-content:end;gap:12px;padding:0 24px 24px}.about-content{padding:24px;font-size:13px;line-height:1.8}.about-content p:first-child{margin-top:0}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%);border:1px solid #111;background:#fff;padding:12px 18px;font-size:11px;opacity:0;visibility:hidden;pointer-events:none;z-index:30;max-width:calc(100vw - 30px)}.toast.visible{opacity:1;visibility:visible}#color-editor-dialog{width:min(400px,calc(100% - 32px))}#color-editor-dialog .dialog-header{padding:16px 24px}#color-editor-dialog .dialog-header h2{font-size:24px}#close-color-editor{min-height:44px}.color-editor-body{padding:24px}.color-editor-body .hex-field{max-width:none}.color-editor-body #hex-input{font-size:20px;min-height:48px}@media(max-width:800px){.harmony-filters button,#generate{font-size:11px;padding-inline:8px}#generate{gap:6px}.work-inner{grid-template-columns:1fr}.nuances{border-right:0;border-bottom:1px solid var(--line);padding:30px 0}.usage{padding:30px 0}.preset-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.swatch{min-height:270px;padding:16px}.color-poster h3{font-size:64px}.shades button{min-height:160px}}@media(max-width:520px){.header-inner{min-height:74px}.brand{font-size:16px}.brand span{margin-left:10px;font-size:9px}nav{gap:14px}nav a{font-size:9px}.hero .inner{padding-top:36px;padding-bottom:27px}h1{font-size:18vw}.toolbar-inner{grid-template-columns:repeat(2,minmax(0,1fr))}.harmony-filters{grid-column:span 2;grid-template-columns:repeat(2,minmax(0,1fr))}.harmony-filters button{min-height:58px;border-bottom:1px solid #111;font-size:12px}.harmony-filters button:nth-child(odd){border-left:1px solid #111}#generate{grid-column:span 2;min-height:62px;font-size:12px;border-left:1px solid #111}.swatch{padding:10px 6px;min-height:240px}.swatch-top{justify-content:center}.swatch-bottom{align-items:center;gap:4px}.hex-copy{font-size:12px;letter-spacing:-.06em}.action-inner{padding-block:10px}.action-inner>div{justify-content:space-between;width:100%;gap:12px}.text-action{font-size:10px}h2{font-size:26px}.section-heading>span{font-size:9px}.shades span{font-size:6px}.shades button{min-height:130px}.color-poster h3{font-size:56px}.library-heading{display:block}.preset-grid{gap:12px}.preset-swatches{min-height:85px}.footer-inner{flex-direction:column;align-items:start;justify-content:center;gap:4px;padding-block:14px}.dialog-header h2{font-size:23px}.dialog-header{padding:20px;gap:12px}.dialog-header button{min-height:44px;flex-shrink:0}pre{margin:20px;font-size:10px;padding:16px}#color-editor-dialog .dialog-header{padding-inline:20px}.color-editor-body{padding:20px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}:root{--gutter:clamp(24px,3.4vw,58px);--header:72px}.site-header{border-bottom:1px solid #000;position:relative;z-index:5;background:#fff}.header-inner{padding:0 var(--gutter);display:flex;align-items:center;min-height:0;height:var(--header);gap:32px;max-width:2000px;margin:auto}.header-inner h1{margin:0;font-size:inherit;font-weight:inherit;line-height:normal;letter-spacing:normal}.wordmark{font-family:Space Grotesk,sans-serif;font-size:32px;letter-spacing:-.07em;font-weight:600;text-decoration:none}.editor-link{font-size:11px;margin-left:auto;text-decoration:none}.editor-link:hover,.wordmark:hover{text-decoration:underline}.intro{position:fixed;inset:0;z-index:30;background:#fff;overflow:hidden;animation:curtain-out .65s cubic-bezier(.76,0,.24,1) 2.65s forwards}.intro-stage{position:absolute;inset:0;display:grid;place-items:center}.intro-word{display:flex;align-items:baseline;font-family:Space Grotesk,sans-serif;font-size:clamp(110px,19vw,320px);font-weight:600;line-height:1.1;letter-spacing:-.07em;transform-origin:center;animation:word-dock 2.95s cubic-bezier(.65,0,.2,1) forwards;will-change:transform}.intro-letter{display:block;--entry-y:120%;--entry-angle:12deg;animation:letter-arrive 1.25s cubic-bezier(.16,1,.3,1) calc(.12s + var(--letter)*95ms) both;will-change:transform,opacity}.intro-letter:nth-child(2n){--entry-y:-120%;--entry-angle:-12deg}.intro-dot{transform-origin:50% 70%}.intro-credit{position:absolute;top:calc(50% + clamp(85px,14vw,210px));font-size:10px;animation:credit-arrive 2.5s ease both}#skip-intro{position:absolute;right:var(--gutter);bottom:30px;border:0;border-bottom:1px solid #000;background:transparent;padding:8px 0;font-size:11px;z-index:1}@keyframes letter-arrive{0%{opacity:0;transform:translateY(var(--entry-y)) rotate(var(--entry-angle)) scaleY(1.5);filter:blur(8px);clip-path:inset(20% 0 20% 0)}55%{opacity:1;transform:translateY(-4%) rotate(-2deg) scaleY(.95);filter:blur(0);clip-path:inset(0)}to{opacity:1;transform:none;filter:blur(0);clip-path:inset(0)}}@keyframes word-dock{0%,44%{transform:scale(1)}64%,76%{transform:scale(var(--intro-scale,.12))}to{transform:translate(var(--intro-x,0px),var(--intro-y,0px)) scale(var(--intro-scale,.12))}}@keyframes credit-arrive{0%,20%{opacity:0;transform:translateY(12px)}36%,64%{opacity:1;transform:none}90%,to{opacity:0;transform:translateY(-6px)}}@keyframes curtain-out{to{clip-path:inset(0 0 100% 0);visibility:hidden}}body.intro-active{overflow:hidden}@media(max-width:520px){.intro-word{font-size:clamp(88px,25vw,110px)}}@media(prefers-reduced-motion:reduce){.intro{display:none}}.palette-screen{height:calc(100vh - var(--header) - 1px);height:calc(100dvh - var(--header) - 1px);display:grid;grid-template-rows:auto minmax(0,1fr)}.palette-screen .palette-section{min-height:0}.palette-screen .palette-row{height:100%}.palette-screen .swatch{min-height:0}