@import url("https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Lilita+One&family=Geist:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap");:root{--paper:#f3ece0;--paper-2:#ece3d3;--paper-3:#e4dac5;--rule:#d9cdb6;--ink:#1a1614;--ink-2:#3a3530;--ink-3:#7a716a;--ink-4:#a89e93;--accent:#d97757;--accent-2:#2a6fdb;--good:#1f8a5b;--shadow:0 3px 0 rgba(26,22,20,0.12);--serif:"Instrument Serif","Times New Roman",serif;--display:"Lilita One","Instrument Serif",serif;--sans:"Geist",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;--radius:14px;--radius-lg:18px;--maxw:1100px;font-synthesis:none;color-scheme:light}@media (prefers-color-scheme:dark){:root{--paper:#15171a;--paper-2:#1d2024;--paper-3:#23272d;--rule:#2d3138;--ink:#f1ece2;--ink-2:#cdc6b9;--ink-3:#857f74;--ink-4:#5b574f;--accent:#f29470;--accent-2:#6ea8ff;color-scheme:dark}}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;background-image:radial-gradient(rgba(0,0,0,.02) 1px,transparent 0),radial-gradient(rgba(255,255,255,.015) 1px,transparent 0);background-size:3px 3px,7px 7px;background-position:0 0,1px 2px;mix-blend-mode:multiply;opacity:.85}@media (prefers-color-scheme:dark){body:before{mix-blend-mode:screen;opacity:.35}}a{color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;-webkit-text-decoration-color:var(--ink-4);text-decoration-color:var(--ink-4)}a:hover{-webkit-text-decoration-color:var(--accent);text-decoration-color:var(--accent);color:var(--accent)}h1,h2,h3,h4{font-family:var(--display);font-weight:400;letter-spacing:.005em;line-height:1.05;margin:0 0 .4em;text-wrap:balance}p{text-wrap:pretty}::selection{background:var(--ink);color:var(--paper)}.skip-link{position:absolute;left:-9999px;top:0}.skip-link:focus{position:static;display:inline-block;padding:.5rem 1rem;background:var(--ink);color:var(--paper)}.site-header{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:1rem;max-width:var(--maxw);margin:0 auto;padding:1.25rem clamp(1rem,4vw,2.5rem) 1rem;border-bottom:1.5px solid var(--rule);flex-wrap:wrap}.site-nav{display:flex;gap:1.25rem;font-family:var(--mono);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}.site-nav a{color:var(--ink-3);text-decoration:none}.site-nav a:hover{color:var(--ink)}.site-main{padding:2rem clamp(1rem,4vw,2.5rem) 4rem}.site-footer,.site-main{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto}.site-footer{padding:2.5rem clamp(1rem,4vw,2.5rem) 3rem;color:var(--ink-3);font-size:.875rem;border-top:1.5px solid var(--rule);display:grid;grid-gap:1rem;gap:1rem}.footer-links{display:flex;flex-wrap:wrap;gap:1.25rem;font-family:var(--mono);font-size:.75rem;letter-spacing:.08em;text-transform:uppercase}.footer-links a{color:var(--ink-2);text-decoration:none}.footer-links a:hover{color:var(--accent)}.footer-meta{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;padding-top:.75rem;border-top:1px solid var(--rule);font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-4)}.wordmark{display:inline-flex;align-items:center;gap:.55em;font-family:var(--display);font-size:1.5rem;line-height:1;letter-spacing:.005em;color:var(--ink);text-decoration:none}.wordmark .dot{width:.42em;height:.42em;border-radius:50%;background:var(--accent);display:inline-block}.hero{margin:0 0 2.5rem}.hero .eyebrow{font-family:var(--mono);font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);margin-bottom:.8rem}.hero h1{font-size:clamp(2.5rem,7vw,5.25rem);letter-spacing:-.005em;margin:0;line-height:.95}.hero .lede{font-family:var(--serif);font-style:italic;font-size:clamp(1.2rem,2vw,1.5rem);color:var(--ink-2);max-width:38rem;margin:1.1rem 0 0;line-height:1.4}.prose{max-width:44rem}.prose li,.prose p{color:var(--ink-2);font-size:1.025rem}.prose h2{margin-top:2.4rem;font-size:clamp(1.6rem,3vw,2.1rem)}.prose h3{margin-top:1.6rem;font-size:1.25rem}.prose ol,.prose ul{padding-left:1.2rem}.prose code{font-family:var(--mono);font-size:.9em;background:var(--paper-2);border:1px solid var(--rule);padding:.05em .35em;border-radius:4px}.home-hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);grid-gap:clamp(1.5rem,4vw,3.5rem);gap:clamp(1.5rem,4vw,3.5rem);align-items:center;margin:.5rem 0 3rem}@media (max-width:820px){.home-hero{grid-template-columns:1fr}}.home-hero .preview-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:.75rem;gap:.75rem;padding:1rem;background:var(--paper-2);border:1.5px solid var(--rule);border-radius:var(--radius-lg)}.home-hero .preview-cell{aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;background:var(--paper);border:1.5px solid var(--rule);border-radius:var(--radius);overflow:hidden;position:relative;padding:.5rem}.home-hero .preview-cell .preview-hex{position:absolute;bottom:.4rem;left:50%;transform:translateX(-50%);font-family:var(--mono);font-size:.6rem;color:var(--ink-2);letter-spacing:.05em;background:var(--paper);border:1px solid var(--rule);padding:.1rem .45rem;border-radius:999px}.home-hero .preview-cell.empty{border-style:dashed;font-family:var(--mono);font-size:.7rem;color:var(--ink-3);letter-spacing:.08em;text-align:center;padding:.4rem;flex-direction:column}.numerals{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:1.5rem;gap:1.5rem;margin:2rem 0;max-width:36rem}.numerals .num{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;color:var(--ink-3);text-transform:uppercase}.numerals .label{font-family:var(--display);font-size:1.4rem;margin:.25rem 0 .3rem;line-height:1}.numerals .body{font-size:.85rem;color:var(--ink-3);line-height:1.45}.collection-chooser{margin:0 0 1.25rem;background:var(--paper-2);border:1.5px solid var(--rule);border-top:3px solid var(--accent);border-radius:var(--radius-lg);padding:1.1rem 1.25rem 1.25rem}.collection-chooser h2{margin:0 0 .3rem;font-size:1.2rem}.collection-chooser p{margin:0 0 .9rem;color:var(--ink-3);font-size:.9rem}.chip-row{display:flex;flex-wrap:wrap;gap:.5rem}.chip{display:inline-flex;align-items:center;gap:.4rem;background:var(--paper);border:1.5px solid var(--rule);color:var(--ink);border-radius:999px;padding:.4rem .85rem;font:inherit;font-size:.85rem;line-height:1;cursor:pointer;font-family:var(--sans);transition:border-color .1s ease,background .1s ease}.chip.active,.chip:hover{border-color:var(--ink)}.chip.active{background:var(--ink);color:var(--paper);font-weight:500}.chip-dot{width:.7rem;height:.7rem;border-radius:50%;flex:none;border:1px solid rgba(0,0,0,.15)}.game{background:var(--paper-2);border:1.5px solid var(--rule);border-radius:var(--radius-lg);padding:1.5rem;margin:0 auto 2rem}.game-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.round-pill{background:var(--paper);border:1.5px solid var(--rule);border-radius:999px;padding:.3rem .85rem;font-size:.75rem;color:var(--ink-3);letter-spacing:.04em}.round-pill,.streak{font-family:var(--mono)}.streak{font-weight:700;font-size:.9rem;color:var(--ink-2)}.prompt{font-family:var(--serif);font-style:italic;font-size:1.25rem;margin:0 0 1.2rem;color:var(--ink);line-height:1.35}.prompt strong{font-family:var(--display);font-style:normal;font-weight:400}.prompt-art{margin:0 auto 1.25rem;width:100%;max-width:230px}.prompt-art>:first-child{height:220px;width:100%;border:1.5px solid var(--ink);border-radius:var(--radius);background:var(--paper-2);box-shadow:var(--shadow);padding:8px;box-sizing:border-box}.prompt-art figcaption{margin-top:.4rem;text-align:center;font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}.stage{display:flex;gap:.75rem;justify-content:center;margin-bottom:1.25rem}.stage-col{text-align:center;flex:1 1}.stage-label{display:block;font-family:var(--mono);font-size:.72rem;color:var(--ink-3);letter-spacing:.08em;text-transform:uppercase;margin-bottom:.35rem}.swatch{border-radius:10px;border:1.5px solid var(--ink);display:flex;align-items:flex-end;justify-content:center;box-shadow:var(--shadow)}.swatch.lg{height:130px;width:100%}.swatch.sm{height:22px;width:22px;display:inline-block;box-shadow:none}.swatch-hex{font-family:var(--mono);font-size:.72rem;background:rgba(0,0,0,.55);color:#fff;padding:1px 6px;border-radius:6px;margin-bottom:6px}.sliders{display:flex;flex-direction:column;gap:1rem}.slider-row{display:block}.slider-label{display:flex;justify-content:space-between;font-family:var(--mono);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-bottom:.3rem}.slider-value{color:var(--ink);font-feature-settings:"tnum";font-variant-numeric:tabular-nums}input[type=range]{width:100%;accent-color:var(--accent)}.btn{display:inline-block;background:var(--paper);border:2px solid var(--ink);border-radius:10px;padding:.7rem 1.1rem .6rem;font-family:var(--display);font-size:1.05rem;line-height:1;font-weight:400;cursor:pointer;text-align:center;box-shadow:0 3px 0 var(--ink);transition:transform .08s ease}.btn,.btn:hover{color:var(--ink);text-decoration:none}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(1px);box-shadow:0 1px 0 var(--ink)}.btn.primary{background:var(--ink);box-shadow:0 3px 0 var(--ink-3)}.btn.primary,.btn.primary:hover{color:var(--paper)}.btn.wide{width:100%;margin-top:.5rem}.actions{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:1rem}.reveal-score{font-family:var(--mono);font-size:1rem;color:var(--ink-2)}.reveal-score strong{font-family:var(--display);font-weight:400;font-size:1.4rem;color:var(--ink)}.reveal-note{color:var(--ink-3);font-style:italic;font-family:var(--serif);font-size:1rem}.reveal-detail{font-family:var(--mono);font-size:.78rem;color:var(--ink-3);letter-spacing:.04em}.score-big{font-family:var(--display);font-size:4rem;line-height:1;margin:.5rem 0 .25rem;color:var(--ink);letter-spacing:-.02em;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.score-max{font-family:var(--mono);font-size:1.1rem;color:var(--ink-3)}.result-list{list-style:none;padding:0;margin:1rem 0}.result-list li{display:flex;align-items:center;gap:.75rem;padding:.6rem 0;border-bottom:1px solid var(--rule)}.result-list li:last-child{border-bottom:none}.result-swatches{display:inline-flex;gap:3px}.result-name{flex:1 1;font-family:var(--display);font-size:1rem;color:var(--ink)}.result-meta{font-family:var(--mono);font-size:.78rem;color:var(--ink-3)}.hint{color:var(--ink-3);font-size:.85rem}.char-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));grid-gap:1rem;gap:1rem;list-style:none;padding:0}.char-card{background:var(--paper-2);border:1.5px solid var(--rule);border-radius:var(--radius);overflow:hidden;transition:border-color .12s ease,transform .12s ease}.char-card:hover{border-color:var(--ink);transform:translateY(-2px)}.char-card a{color:var(--ink);text-decoration:none;display:block}.char-card .swatch-block{height:160px;overflow:hidden;border-bottom:1.5px solid var(--rule)}.char-card .swatch-block.has-image{display:flex;align-items:center;justify-content:center;padding:.5rem}.char-card .char-body{padding:.65rem .85rem .8rem}.char-card .char-name{font-family:var(--display);font-size:1.05rem;line-height:1.1}.char-card .char-sub{font-family:var(--mono);font-size:.72rem;color:var(--ink-3);margin-top:.2rem;letter-spacing:.03em}.franchise-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));grid-gap:1rem;gap:1rem;list-style:none;padding:0}.franchise-card{background:var(--paper-2);border:1.5px solid var(--rule);border-radius:var(--radius);overflow:hidden;transition:border-color .12s ease,transform .12s ease}.franchise-card a{color:var(--ink);text-decoration:none;display:block}.franchise-card:hover{border-color:var(--ink);transform:translateY(-2px)}.franchise-strip{display:flex;height:56px;border-bottom:1.5px solid var(--rule)}.franchise-strip span{flex:1 1}.franchise-body{padding:.7rem .85rem}.franchise-name{font-family:var(--display);font-size:1.05rem}.color-readout{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));grid-gap:.75rem;gap:.75rem;margin:1.25rem 0}.color-readout .cell{background:var(--paper-2);border:1.5px solid var(--rule);border-radius:10px;padding:.7rem .9rem;position:relative}.color-readout .cell-label{font-family:var(--mono);font-size:.7rem;color:var(--ink-3);text-transform:uppercase;letter-spacing:.08em}.color-readout .cell-value{font-family:var(--mono);font-size:1.05rem;color:var(--ink);margin-top:.2rem}.color-readout .copy-btn{position:absolute;top:.4rem;right:.4rem;background:transparent;border:1px solid var(--rule);border-radius:6px;color:var(--ink-3);font-family:var(--mono);font-size:.65rem;padding:.15rem .4rem;cursor:pointer;letter-spacing:.06em}.color-readout .copy-btn:hover{color:var(--ink);border-color:var(--ink)}.hero-swatch{height:clamp(220px,38vw,320px);border-radius:var(--radius-lg);border:1.5px solid var(--rule);overflow:hidden;background:var(--paper-2)}.hero-swatch.hero-portrait{height:clamp(300px,56vw,460px);width:-moz-fit-content;width:fit-content;max-width:100%;margin-inline:auto;display:flex;align-items:center;justify-content:center}.palette-strip{display:grid;grid-template-columns:repeat(6,1fr);grid-gap:.5rem;gap:.5rem;margin:1rem 0 1.5rem}@media (max-width:520px){.palette-strip{grid-template-columns:repeat(3,1fr)}}.palette-cell{text-align:center}.palette-chip{height:64px;border-radius:10px;border:1.5px solid var(--rule)}.palette-label{color:var(--ink-3);margin-top:.3rem;letter-spacing:.06em;text-transform:uppercase}.palette-hex,.palette-label{font-family:var(--mono);font-size:.7rem}.palette-hex{color:var(--ink-2);margin-top:.1rem}.related{margin-top:2.5rem}.related h2{font-size:1.4rem;margin-bottom:.5rem}.related .hint{margin-bottom:.8rem}.faq{margin-top:2.5rem;max-width:44rem}.faq h2{font-size:clamp(1.6rem,3vw,2.1rem);margin-bottom:1rem}.faq details{border:1.5px solid var(--rule);border-radius:10px;padding:.4rem 1rem;margin-bottom:.6rem;background:var(--paper-2)}.faq details[open]{border-color:var(--ink)}.faq summary{cursor:pointer;font-family:var(--display);font-size:1.05rem;padding:.6rem 0;list-style:none}.faq summary::-webkit-details-marker{display:none}.faq summary:before{content:"+";display:inline-block;width:1em;margin-right:.4em;color:var(--accent);font-family:var(--mono)}.faq details[open] summary:before{content:"−"}.faq p{color:var(--ink-2);margin-top:0;padding-bottom:.6rem}.breadcrumb{font-family:var(--mono);font-size:.72rem;color:var(--ink-3);margin-bottom:1rem;letter-spacing:.04em;text-transform:uppercase}.breadcrumb a{color:var(--ink-3);text-decoration:none}.breadcrumb a:hover{color:var(--ink)}.tag-row{display:flex;flex-wrap:wrap;gap:.5rem;margin:.75rem 0 0}.tag{display:inline-flex;align-items:center;gap:.4rem;background:var(--paper-2);border:1.5px solid var(--rule);border-radius:999px;padding:.3rem .75rem;font-family:var(--mono);font-size:.75rem;letter-spacing:.04em;color:var(--ink-2);text-decoration:none}.tag:hover{border-color:var(--ink);color:var(--ink)}.tag .tag-dot{width:.6rem;height:.6rem;border-radius:50%;border:1px solid rgba(0,0,0,.15)}.notfound{text-align:center;padding:4rem 0}.notfound h1{font-size:clamp(4rem,14vw,9rem);line-height:.9;margin:0}.notfound p{font-family:var(--serif);font-style:italic;font-size:1.3rem;color:var(--ink-2);margin:1rem 0 2rem}