:root{--ground:#f3f4f6;--surface:#fff;--ink:#17181d;--muted:#646773;--line:#dfe1e6;--hover:#eceef2;--ok:#0f7b4f;--ok-bg:#dcf3e8;--warn:#8a5a00;--warn-bg:#fbefd4;--bad:#b42318;--bad-bg:#fde4e1;--radius:10px;--sans:"Instrument Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;--mono:"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root{--ground:#121317;--surface:#1b1c21;--ink:#ececf0;--muted:#9a9cab;--line:#2f3038;--hover:#25262d;--ok:#4fd39a;--ok-bg:#12352a;--warn:#f2b64d;--warn-bg:#3a2d10;--bad:#ff8a80;--bad-bg:#3d1a17;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}html,body{margin:0}body{background:var(--ground);color:var(--ink);font:15px/1.5 var(--sans);flex-direction:column;min-height:100vh;display:flex}#root{flex-direction:column;flex:1;display:flex}button,input,select{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.4}:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.mono{font-family:var(--mono);font-size:.92em}.muted{color:var(--muted)}.small{font-size:13px}h1{letter-spacing:-.01em;text-wrap:balance;margin:0 0 4px;font-size:22px;line-height:1.2}h2{margin:0;font-size:16px}.top{border-bottom:1px solid var(--line);background:var(--surface);flex-wrap:wrap;align-items:center;gap:28px;padding:12px 20px;display:flex}.brand{color:var(--ink);letter-spacing:-.01em;align-items:center;gap:10px;font-weight:600;text-decoration:none;display:flex}.brand-mark{border-radius:4px;width:30px;height:18px;display:flex;overflow:hidden}.brand-mark i{flex:1;transition:background .3s}nav{flex-wrap:wrap;gap:4px;display:flex}nav a{color:var(--muted);border-radius:999px;padding:6px 12px;font-weight:500;text-decoration:none}nav a:hover{background:var(--hover);color:var(--ink)}nav a[aria-current]{background:var(--ink);color:var(--surface)}.btn{border:1px solid var(--ink);background:var(--ink);color:var(--surface);white-space:nowrap;border-radius:999px;align-items:center;gap:8px;padding:7px 14px;font-weight:600;display:inline-flex}.btn.ghost{color:var(--ink);border-color:var(--line);background:0 0}.btn.ghost:hover:not(:disabled){background:var(--hover)}.btn.icon{padding:7px 10px}.btn.small{padding:4px 10px;font-size:13px}.btn kbd{font:11px var(--mono);opacity:.6;border:1px solid;border-radius:4px;padding:0 4px}.link{color:var(--ink);background:0 0;border:0;padding:0;text-decoration:underline}.toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:12px 20px;display:flex}.tb-group{flex-wrap:wrap;gap:6px;display:flex}main{flex:1;min-height:0;padding:0 20px 20px;display:flex}.tool{flex:1;grid-template-columns:minmax(300px,380px) minmax(0,1fr);align-items:start;gap:20px;display:grid}.tool.single{grid-template-columns:minmax(0,1fr)}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);flex-direction:column;gap:16px;padding:20px;display:flex}.panel-head p{color:var(--muted);max-width:60ch;margin:0}.stage{flex-direction:column;gap:16px;min-width:0;display:flex}.stack{flex-direction:column;gap:12px;display:flex}.hint{color:var(--muted);margin:0;font-size:13px}.tabs{border-bottom:1px solid var(--line);gap:2px;display:flex}.tabs button{color:var(--muted);background:0 0;border:0;border-bottom:2px solid #0000;margin-bottom:-1px;padding:8px 10px;font-weight:500}.tabs button[aria-selected=true]{color:var(--ink);border-bottom-color:var(--ink)}.field{flex-direction:column;gap:4px;display:flex}.field label{justify-content:space-between;font-size:13px;font-weight:500;display:flex}.field input:not([type]),.field input[inputmode],.field select,.color-input input:not([type=color]){border:1px solid var(--line);background:var(--surface);border-radius:8px;width:100%;padding:7px 10px}.color-input{align-items:center;gap:8px;display:flex}.color-input input[type=color]{border:1px solid var(--line);background:var(--surface);border-radius:8px;flex:none;width:38px;height:36px;padding:2px}[aria-invalid=true]{border-color:var(--bad)!important}input[type=range]{appearance:none;background:var(--track,var(--line));border:1px solid var(--line);border-radius:999px;width:100%;height:14px}input[type=range]::-webkit-slider-thumb{appearance:none;background:#fff;border:2px solid #17181d;border-radius:50%;width:20px;height:20px;box-shadow:0 0 0 1px #fff}input[type=range]::-moz-range-thumb{background:#fff;border:2px solid #17181d;border-radius:50%;width:18px;height:18px}.wheel{aspect-ratio:1;touch-action:none;width:100%;max-width:300px;margin:0 auto;position:relative}.wheel canvas{width:100%;height:100%;display:block}.wheel-line{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.wheel-line line{stroke:#fff;stroke-width:.6px;opacity:.85}.marker{cursor:grab;touch-action:none;border:2px solid #fff;border-radius:50%;width:24px;height:24px;margin:-12px 0 0 -12px;padding:0;position:absolute;box-shadow:0 0 0 1px #00000059,0 2px 6px #00000040}.marker.base{border-width:3px;width:32px;height:32px;margin:-16px 0 0 -16px}.marker.sel{box-shadow:0 0 0 2px #17181d,0 0 0 4px #fff}.harmonies{border:0;margin:0;padding:0}.harmonies legend{margin-bottom:8px;font-size:13px;font-weight:500}.chips{flex-wrap:wrap;gap:6px;display:flex}.chip{border:1px solid var(--line);background:var(--surface);border-radius:999px;align-items:center;gap:6px;padding:4px 10px 4px 6px;font-size:13px;display:inline-flex}.chip:hover{background:var(--hover)}.chip[aria-pressed=true]{background:var(--ink);color:var(--surface);border-color:var(--ink)}.swatches{border-radius:var(--radius);border:1px solid var(--line);display:flex;overflow:hidden}.swatches.tall{min-height:max(320px,100vh - 290px)}.swatches:not(.tall){height:120px}.swatch{cursor:pointer;flex-direction:column;flex:1;justify-content:space-between;min-width:0;padding:12px;transition:flex .2s;display:flex;position:relative}.swatch.sel{flex:1.25}.swatch.sel:after{content:"";opacity:.7;background:currentColor;border-radius:2px;height:3px;position:absolute;bottom:6px;left:12px;right:12px}.swatch-tools{opacity:0;flex-direction:column;align-self:flex-end;gap:4px;transition:opacity .15s;display:flex}.swatch:hover .swatch-tools,.swatch:focus-within .swatch-tools,.swatch.sel .swatch-tools{opacity:1}.swatch-tools button{width:30px;height:30px;color:inherit;background:#7f7f7f2e;border:0;border-radius:8px;place-items:center;font-size:18px;line-height:1;display:grid}.swatch-tools button[aria-pressed=true]{background:#7f7f7f6b}.swatches:not(.tall) .swatch-tools{flex-direction:row}.swatch-hex{color:inherit;font:600 14px var(--mono);text-align:left;background:0 0;border:0;align-self:flex-start;padding:0}.swatch-hex:hover{text-decoration:underline}.ratio-row{justify-content:space-between;align-items:center;gap:12px;display:flex}.badge{font:600 14px var(--mono);border-radius:999px;padding:4px 10px}.badge.ok,.verdict.ok{color:var(--ok);background:var(--ok-bg)}.badge.warn{color:var(--warn);background:var(--warn-bg)}.badge.bad,.verdict.bad{color:var(--bad);background:var(--bad-bg)}.verdict{border-radius:6px;padding:2px 8px;font-size:13px;font-weight:600}.pair{grid-template-columns:1fr 1fr;gap:12px;display:grid}.pick{border:0;margin:0;padding:0}.pick legend{margin-bottom:6px;font-size:13px;font-weight:500}.pick-row{flex-wrap:wrap;gap:4px;display:flex}.pick-row button{border:1px solid var(--line);border-radius:6px;width:26px;height:26px;padding:0}.pick-row button[aria-pressed=true]{box-shadow:0 0 0 2px var(--surface), 0 0 0 4px var(--ink)}.wcag{border-collapse:collapse;width:100%;font-size:14px}.wcag th{text-align:left;color:var(--muted);padding:6px 0;font-size:12px;font-weight:500}.wcag td{border-top:1px solid var(--line);padding:8px 0}.suggest{flex-direction:column;gap:8px;display:flex}.sugg{grid-template-columns:52px 1fr auto;align-items:center;gap:12px;font-size:13px;display:grid}.sugg-prev{height:44px;font:700 20px var(--sans);border:1px solid var(--line);border-radius:8px;place-items:center;display:grid}.preview{border-radius:var(--radius);border:1px solid var(--line);flex-direction:column;align-items:flex-start;gap:14px;min-height:340px;padding:clamp(24px,5vw,56px);transition:background .2s,color .2s;display:flex;position:relative}.preview h2{letter-spacing:-.02em;font-size:clamp(30px,5vw,54px);line-height:1}.preview p{max-width:46ch;margin:0;font-size:16px}.preview svg{position:absolute;top:clamp(24px,5vw,56px);right:clamp(24px,5vw,56px)}.pv-eyebrow{font:600 12px var(--mono);text-transform:uppercase;letter-spacing:.1em;border:1px solid;border-radius:999px;padding:3px 10px}.pv-cta{border-radius:999px;padding:10px 20px;font-weight:600}.matrix-wrap{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;overflow-x:auto}.matrix-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;display:flex}.matrix-head label{align-items:center;gap:8px;font-size:13px;display:flex}.matrix-head select{border:1px solid var(--line);background:var(--surface);border-radius:6px;padding:3px 6px}.matrix{gap:4px;min-width:320px;display:grid}.mx-h{text-align:center;text-shadow:0 0 1px var(--muted);font-size:18px;font-weight:700}.mx-r{place-items:center;padding-right:6px;display:grid}.mx-r i{border:1px solid var(--line);border-radius:5px;width:20px;height:20px}.mx-cell{aspect-ratio:1.4;border-radius:6px;place-items:center;font-size:18px;font-weight:700;line-height:1;display:grid}.mx-cell small{font:500 10px var(--mono);opacity:.85}.mx-cell.off{background:repeating-linear-gradient(135deg, var(--hover) 0 4px, transparent 4px 8px)}.cvd{flex-direction:column;gap:10px;display:flex}.cvd-label{flex-direction:column;font-size:13px;display:flex}.cvd-row{flex-direction:column;gap:4px;display:flex}.cvd-strip{border-radius:var(--radius);border:1px solid var(--line);height:84px;display:flex;overflow:hidden}.cvd-strip span{flex:1;place-items:center;font-size:22px;display:grid}.scales{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);flex-direction:column;gap:10px;padding:16px;display:flex;overflow-x:auto}.scale-row{grid-template-columns:110px repeat(var(--n,11), minmax(52px, 1fr)) auto;min-width:calc(220px + var(--n,11) * 56px);align-items:center;gap:4px;display:grid}.scale-name{text-transform:capitalize;grid-template-columns:14px 1fr;align-items:center;column-gap:6px;font-size:13px;display:grid}.scale-name i{border-radius:4px;grid-row:span 2;width:14px;height:14px;box-shadow:inset 0 0 0 1px #0000001f}.scale-name .mono{color:var(--muted);grid-column:2;font-size:11px}.scale-step.is-base{outline:2px solid var(--ink);outline-offset:2px}.scale-opts{flex-wrap:wrap;align-items:center;gap:10px 16px;margin-block:12px;display:flex}.scale-opts label{align-items:center;gap:6px;font-size:13px;display:inline-flex}.color-list{flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px;display:flex}.color-item{border:1px solid var(--line);background:var(--surface);border-radius:8px;align-items:center;gap:4px;padding:4px;display:inline-flex}.color-item input[type=color]{background:0 0;border:0;width:32px;height:28px;padding:0}.pick-list{flex-direction:column;gap:8px;margin-top:12px;display:flex}.pick-list input[type=search]{max-width:420px}.pick-list ul{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:6px;margin:0;padding:0;list-style:none;display:grid}.pick-list li button{text-align:left;border:1px solid var(--line);background:var(--surface);border-radius:8px;align-items:center;gap:8px;width:100%;padding:6px 8px;font-size:13px;display:flex}.pick-list li button[aria-pressed=true]{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}.mini{border-radius:4px;flex:none;width:64px;height:18px;display:inline-flex;overflow:hidden}.scale-step{border:0;border-radius:6px;flex-direction:column;justify-content:space-between;align-items:flex-start;height:56px;padding:6px;font-size:12px;display:flex}.scale-step span{opacity:.85;font-size:10px}.bottom{padding:10px 20px calc(10px + env(safe-area-inset-bottom,0px));background:var(--surface);border-top:1px solid var(--line);z-index:5;flex-wrap:wrap;align-items:center;gap:16px;display:flex;position:sticky;bottom:0}.mini{border:1px solid var(--line);border-radius:6px;flex:none;width:96px;height:28px;display:inline-flex;overflow:hidden}.mini i{flex:1}.name{color:var(--muted);flex-direction:column;flex:1;min-width:160px;max-width:280px;font-size:11px;display:flex}.name input{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:8px;padding:5px 9px;font-size:14px}.actions{flex-wrap:wrap;gap:6px;margin-left:auto;display:flex}.menu-wrap{position:relative}.menu{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);z-index:10;min-width:240px;max-height:70vh;margin:0;padding:6px;list-style:none;position:absolute;bottom:calc(100% + 8px);right:0;overflow:auto;box-shadow:0 12px 32px #0000002e}.menu li button[role=menuitem]{text-align:left;background:0 0;border:0;border-radius:6px;width:100%;padding:8px 10px}.menu li button[role=menuitem]:hover{background:var(--hover)}.code-menu{flex-direction:column;gap:10px;width:min(480px,100vw - 32px);padding:12px;display:flex}.code-menu pre{background:var(--ground);font:12px/1.5 var(--mono);border-radius:8px;max-height:280px;margin:0;padding:12px;overflow:auto}.seg{flex-wrap:wrap;gap:4px;display:flex}.seg button{border:1px solid var(--line);background:0 0;border-radius:999px;padding:3px 10px;font-size:12px}.seg button[aria-selected=true]{background:var(--ink);color:var(--surface);border-color:var(--ink)}.lib{width:min(340px,100vw - 32px);padding:12px}.lib p{margin:0 0 8px}.lib ul{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex}.lib li{align-items:center;gap:4px;display:flex}.lib-item{text-align:left;background:0 0;border:0;border-radius:6px;flex:1;align-items:center;gap:10px;min-width:0;padding:6px;display:flex}.lib-item:hover{background:var(--hover)}.lib-item .mini{width:70px;height:20px}.lib-item span:last-child{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.toast{background:var(--ink);color:var(--surface);z-index:20;border-radius:999px;max-width:calc(100vw - 32px);padding:10px 16px;font-weight:500;position:fixed;bottom:90px;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #0003}[hidden]{display:none!important}@media (width<=860px){.tool{grid-template-columns:minmax(0,1fr)}.tool .stage{order:-1}.swatches.tall{min-height:240px}.swatch-tools{opacity:1}.actions{margin-left:0}.top{gap:12px;padding:10px 16px}main,.toolbar{padding-left:16px;padding-right:16px}.bottom{padding-left:16px;padding-right:16px;position:static}}@media (width<=520px){.swatches.tall{flex-direction:column}.swatch{flex-direction:row;align-items:center;min-height:48px}.swatch-tools{flex-direction:row;order:2}.swatch.sel:after{display:none}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}.drop{border:1.5px dashed var(--line);border-radius:var(--radius);text-align:center;flex-direction:column;align-items:center;gap:12px;padding:28px 20px;transition:background .15s,border-color .15s;display:flex}.drop.over{background:var(--hover);border-color:var(--ink)}.drop p{margin:0}.samples{flex-direction:column;align-items:center;gap:8px;margin-top:8px;display:flex}.samples div{grid-template-columns:repeat(4,minmax(0,72px));justify-content:center;gap:6px;display:grid}.samples button{background:0 0;border:2px solid #0000;border-radius:8px;padding:0;line-height:0;overflow:hidden}.samples button:hover{border-color:var(--ink)}.samples img{aspect-ratio:4/3;object-fit:cover;width:100%;height:auto}.img-controls{flex-direction:column;gap:12px;display:flex}.imgframe{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);justify-content:center;padding:12px;display:flex}.imgbox{touch-action:none;cursor:crosshair;-webkit-user-select:none;user-select:none;max-width:100%;margin:0 auto;position:relative}.imgbox img{pointer-events:none;border-radius:6px;width:100%;height:100%;display:block}.img-path{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.img-path polyline{fill:none;stroke:#fff;stroke-width:2px;filter:drop-shadow(0 0 1px #0009)}.pin{cursor:grab;touch-action:none;border:3px solid #fff;border-radius:50%;width:26px;height:26px;margin:-13px 0 0 -13px;padding:0;position:absolute;box-shadow:0 0 0 1px #0006,0 2px 8px #00000059}.pin.sel{width:34px;height:34px;margin:-17px 0 0 -17px;box-shadow:0 0 0 2px #17181d,0 2px 8px #00000059}.gbar{border-radius:var(--radius);border:1px solid var(--line);touch-action:none;height:88px;margin:0 14px;position:relative}.gstop{cursor:ew-resize;touch-action:none;border:3px solid #fff;border-radius:50%;width:28px;height:28px;margin:-14px 0 0 -14px;padding:0;position:absolute;top:50%;box-shadow:0 0 0 1px #0006,0 2px 6px #0000004d}.gstop.sel{box-shadow:0 0 0 2px #17181d,0 0 0 4px #fff}.gmid{cursor:ew-resize;touch-action:none;background:#fff;border:1px solid #00000080;width:12px;height:12px;margin-left:-6px;padding:0;position:absolute;bottom:8px;transform:rotate(45deg)}.grad-tools{flex-wrap:wrap;align-items:flex-end;gap:12px 16px;display:flex}.grad-tools .angle{width:220px}.grad-preview{border-radius:var(--radius);border:1px solid var(--line);height:clamp(160px,30vh,320px)}.css-out{background:var(--surface);border:1px solid var(--line);font:12px/1.5 var(--mono);white-space:pre-wrap;word-break:break-all;border-radius:8px;margin:0;padding:10px 12px}.grad-list{border-radius:var(--radius);border:1px solid var(--line);flex-direction:column;margin:0;padding:0;list-style:none;display:flex;overflow:hidden}.grad-list li{cursor:pointer;align-items:center;gap:12px;padding:10px 14px;display:flex}.grad-list li.sel{box-shadow:inset 4px 0}.grad-list li .mono{opacity:.85;margin-left:auto}.icon-btn{color:inherit;background:#7f7f7f33;border:0;border-radius:6px;width:26px;height:26px;font-size:16px;line-height:1}.explore,.admin{flex-direction:column;flex:1;gap:18px;min-width:0;padding-top:20px;display:flex}.explore-head{text-align:center;flex-direction:column;align-items:center;gap:12px;padding-block:8px 4px;display:flex}.explore-head h1{font-size:clamp(26px,4vw,36px)}.explore-head>p{max-width:60ch;margin:0}.search{background:var(--surface);border:1px solid var(--line);width:min(620px,100%);color:var(--muted);border-radius:999px;align-items:center;gap:8px;padding:4px 8px 4px 16px;display:flex}.search:focus-within{border-color:var(--ink)}.search input{color:var(--ink);background:0 0;border:0;outline:none;flex:1;min-width:0;padding:8px 0}.search input::-webkit-search-cancel-button{display:none}.quick{flex-wrap:wrap;justify-content:center;gap:6px;display:flex}.chip.ghost{border-style:dashed}.chip.on{background:var(--ink);color:var(--surface);border-color:var(--ink)}.tag-groups{text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px 24px;width:100%;padding:16px;display:grid}.tag-group h2,.tag-group h3{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0 0 6px;font-size:12px}.explore-bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.result-line{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.filters{flex-wrap:wrap;gap:6px;display:flex}.filters select,.admin-filters select,.admin-filters input{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:6px 10px}.grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:18px 16px;margin:0;padding:0;list-style:none;display:grid}.card{flex-direction:column;gap:8px;min-width:0;display:flex}.card-open{border-radius:var(--radius);background:0 0;border:0;width:100%;padding:0;transition:transform .15s;display:block}.card-open:hover{transform:translateY(-2px)}.strip{border-radius:var(--radius);border:1px solid var(--line);width:100%;height:76px;display:flex;overflow:hidden}.strip.tall{height:110px}.strip i{flex:1}.card-foot{justify-content:space-between;align-items:center;gap:8px;display:flex}.card-name{text-overflow:ellipsis;white-space:nowrap;font-weight:500;overflow:hidden}.more{justify-content:center;display:flex}.empty{text-align:center;padding:40px 16px}.empty p{margin:4px 0}.error-box{background:var(--bad-bg);color:var(--bad);border-radius:8px;margin:0;padding:10px 12px}.icon-btn.plain{color:var(--muted);background:0 0}dialog.detail{background:var(--surface);width:min(860px,100vw - 32px);max-height:calc(100vh - 48px);color:var(--ink);border:0;border-radius:14px;padding:0;box-shadow:0 24px 64px #0000004d}dialog.detail::backdrop{background:#0a0a0f8c}.detail-body{flex-direction:column;gap:16px;padding:24px;display:flex;position:relative}.detail-x{border:1px solid var(--line);background:var(--surface);border-radius:50%;width:34px;height:34px;font-size:20px;line-height:1;position:absolute;top:12px;right:12px}.detail-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px;padding-right:40px;display:flex}.detail-head h2{font-size:22px}.field.inline{white-space:nowrap;flex-direction:row;align-items:center;gap:8px}.field.inline select{border:1px solid var(--line);background:var(--surface);border-radius:6px;padding:4px 8px}.detail-grad{border-radius:var(--radius);border:1px solid var(--line);height:120px}.detail-swatches{border-radius:var(--radius);border:1px solid var(--line);min-height:200px;display:flex;overflow:hidden}.detail-swatches button{text-align:left;border:0;flex-direction:column;flex:1;justify-content:flex-end;align-items:flex-start;gap:2px;min-width:0;padding:10px;font-size:12px;display:flex}.detail-swatches button:hover .mono{text-decoration:underline}.detail-code{flex-direction:column;gap:8px;margin-top:12px;display:flex}.detail-code pre{background:var(--ground);font:12px/1.5 var(--mono);border-radius:8px;max-height:200px;margin:0;padding:12px;overflow:auto}.detail-actions{flex-wrap:wrap;gap:6px;display:flex}.btn.danger{background:var(--bad);border-color:var(--bad);color:#fff}.login{width:100%;max-width:420px;margin:40px auto}.login .field input{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:8px 10px}.admin-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px;display:flex}.admin-head p{margin:0}.admin-filters{flex-wrap:wrap;gap:8px;display:flex}.admin-filters input{flex:1;min-width:200px}.admin-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.admin-list li{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);grid-template-columns:220px minmax(0,1fr) auto;align-items:center;gap:16px;padding:10px 12px;display:grid}.admin-list li .strip{height:40px}.admin-list li.hidden-row{opacity:.55}.admin-meta{flex-direction:column;min-width:0;display:flex}.tags-line{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.editor .detail-body h2{padding-right:40px;font-size:20px}.ed-row{flex-wrap:wrap;align-items:flex-end;gap:12px;display:flex}.ed-row .grow{flex:1;min-width:200px}.editor input:not([type=color]):not([type=checkbox]),.editor select,.editor textarea{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:6px 9px}.editor textarea{resize:vertical;width:100%;font:inherit;color:inherit}.ed-colors,.ed-tags{border:1px solid var(--line);border-radius:var(--radius);flex-direction:column;gap:8px;margin:0;padding:12px;display:flex}.ed-colors legend,.ed-tags legend{padding:0 4px;font-size:13px;font-weight:500}.ed-color{grid-template-columns:36px minmax(80px,110px) minmax(100px,130px) 70px repeat(3,28px);align-items:center;gap:6px;display:grid}.ed-color input[type=color]{border:1px solid var(--line);background:var(--surface);border-radius:6px;width:36px;height:32px;padding:2px}.check{align-items:center;gap:6px;padding-bottom:6px;font-size:14px;display:flex}@media (width<=640px){.admin-list li{grid-template-columns:1fr auto}.admin-list li .strip{grid-column:1/-1}.ed-color{grid-template-columns:36px 1fr 1fr}.detail-swatches{flex-direction:column;min-height:0}.detail-swatches button{flex-direction:row;justify-content:space-between;align-items:center;min-height:52px}}.seg.big button{padding:6px 14px;font-size:14px;font-weight:500}.holidays{flex-direction:column;gap:22px;display:flex}.hol-section{align-items:baseline;gap:10px;margin:8px 0 -6px;font-size:20px;display:flex}.hol-row{flex-direction:column;gap:10px;display:flex}.hol-row header{justify-content:space-between;align-items:flex-end;gap:12px;display:flex}.hol-row h2{font-size:16px}.hol-row header div{flex-direction:column;display:flex}.hol-row .grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr))}.card.skeleton .strip{background:var(--hover);border-color:#0000}.hol-calendar{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px;display:grid}.hol-day{text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:8px;flex-direction:column;align-items:flex-start;gap:2px;padding:8px 12px;display:flex}.hol-day:hover{border-color:var(--ink)}.fixes{background:var(--ground);border-radius:var(--radius);flex-direction:column;gap:10px;padding:12px;display:flex}.fixes-head{justify-content:space-between;align-items:center;display:flex}.fix{grid-template-columns:auto 1fr auto;align-items:center;gap:10px;font-size:13px;display:grid}.fix p{margin:0}.fix-swatch{color:var(--muted);align-items:center;gap:4px;display:inline-flex}.fix-swatch i{border:1px solid var(--line);border-radius:5px;width:22px;height:22px}.note{background:var(--warn-bg);color:var(--warn);border-radius:8px;margin:0;padding:8px 10px;font-size:13px}.warn-text{color:var(--warn)}.panel h2.sub{margin:4px 0 -6px;font-size:14px}.roles{flex-direction:column;gap:6px;display:flex}.role-row{grid-template-columns:22px 72px 1fr 72px;align-items:center;gap:8px;display:grid}.role-row .dot{border:1px solid var(--line);border-radius:6px;width:22px;height:22px}.role-row select,.role-row input{border:1px solid var(--line);background:var(--surface);border-radius:6px;width:100%;min-width:0;padding:5px 6px}.pct{color:var(--muted);align-items:center;gap:2px;font-size:13px;display:flex}.sheet{gap:20px}.sheet-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);flex-direction:column;gap:14px;padding:24px;display:flex}.sheet-title{letter-spacing:-.02em;font-size:30px}.sheet-card h3{margin:0;font-size:15px}.role-cards{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px;display:grid}.role-card{flex-direction:column;gap:2px;display:flex}.role-card .circle{border:1px solid var(--line);border-radius:50%;width:72px;height:72px;margin-bottom:6px}.usage{border:1px solid var(--line);border-radius:8px;height:36px;display:flex;overflow:hidden}.usage span{font:600 12px var(--mono);place-items:center;min-width:0;display:grid}.sheet-grid{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px;display:grid}.tint-grid{border-radius:6px;gap:0;margin-top:8px;display:grid;overflow:hidden}.tint-grid button{border:0;height:42px;padding:0}.brand-grads{flex-direction:column;gap:10px;margin-top:8px;display:flex}.brand-grad{text-align:left;background:0 0;border:0;flex-direction:column;align-items:flex-start;gap:4px;padding:0;display:flex}.brand-grad i{border-radius:6px;width:100%;height:44px}.checks-head{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.checks-head .seg{margin-left:auto}.checks td{vertical-align:middle}.pair-chip{border:1px solid var(--line);border-radius:5px;place-items:center;width:34px;height:24px;margin-right:6px;font-weight:700;display:inline-grid}.mini-dot{vertical-align:-1px;border:1px solid var(--line);border-radius:3px;width:12px;height:12px;display:inline-block}.demos{gap:16px;display:grid}.demos.three{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.demo{flex-direction:column;gap:6px;margin:0;display:flex}.demo-site{border:1px solid var(--line);background:var(--b-bg);color:var(--b-text);border-radius:10px;font-size:13px;overflow:hidden}.demo-head{background:var(--h-surface);color:var(--h-text);border-bottom:1px solid var(--h-border);align-items:center;gap:12px;padding:10px 14px;display:flex}.demo-head nav{color:var(--h-muted);gap:10px;margin-right:auto;font-size:12px;display:flex}.demo-hero{background:var(--h-bg);color:var(--h-text);flex-direction:column;align-items:flex-start;gap:8px;padding:22px 16px;display:flex}.demo-hero h4{margin:0;font-size:20px;line-height:1.15}.demo-hero p{color:var(--h-muted);margin:0}.demo-badge{background:var(--h-accent);color:var(--h-onAccent);border-radius:999px;padding:2px 8px;font-size:11px;font-weight:600}.demo-actions{flex-wrap:wrap;gap:8px;display:flex}.demo-btn{white-space:nowrap;border-radius:999px;padding:6px 12px;font-size:12px;font-weight:600}.demo-btn.ghost{border:1px solid var(--h-border);color:var(--h-text)}.demo-body{background:var(--b-bg);grid-template-columns:1fr 1fr;gap:10px;padding:14px;display:grid}.demo-card{background:var(--b-surface);border:1px solid var(--b-border);color:var(--b-text);border-radius:8px;flex-direction:column;gap:6px;padding:10px;display:flex}.demo-card .small{color:var(--b-muted)}.demo-bars{align-items:flex-end;gap:5px;height:56px;display:flex}.demo-bars i{border-radius:3px 3px 0 0;flex:1}.demo-input{border:1px solid var(--b-border);color:var(--b-muted);background:var(--b-bg);border-radius:6px;padding:5px 8px}.demo-link{color:var(--b-link);font-size:12px;text-decoration:underline}@media (width<=760px){.sheet-grid{grid-template-columns:1fr}.role-row{grid-template-columns:22px 1fr 64px}.role-row .mono{display:none}}@media print{.top,.toolbar,.bottom,.no-print,.toast{display:none!important}body{background:#fff}main{padding:0}.tool{display:block}.sheet-card{break-inside:avoid;border:0;padding:12px 0}*{-webkit-print-color-adjust:exact;print-color-adjust:exact}}.improve textarea{border:1px solid var(--line);background:var(--surface);resize:vertical;border-radius:8px;width:100%;padding:8px 10px;font-size:13px}.imp-strip{border:1px solid var(--line);border-radius:6px;flex:1;min-width:120px;height:28px;display:flex;overflow:hidden}.imp-strip span{flex:1}.imp-head{flex-flow:wrap;align-items:center;gap:24px}.imp-sum{flex-direction:column;flex:1;gap:8px;min-width:200px;display:flex}.score{align-items:center;gap:12px;display:flex}.score div{flex-direction:column;display:flex}.score b{font-size:20px}.score .track{fill:none;stroke:var(--hover);stroke-width:9px}.score .arc{fill:none;stroke-width:9px;stroke-linecap:round;stroke:var(--bad)}.score.warn .arc{stroke:var(--warn)}.score.good .arc,.score.ok .arc{stroke:var(--ok)}.score text{font:700 26px var(--sans);fill:var(--ink)}.sheet-card h2{align-items:baseline;gap:10px;font-size:17px;display:flex}.before-after{gap:10px;display:grid}.before-after>div{grid-template-columns:80px 1fr;align-items:center;gap:10px;display:grid}.findings{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex}.finding{border-top:1px solid var(--line);grid-template-columns:82px 1fr auto;align-items:start;gap:14px;padding:12px 0;display:grid}.finding:first-child{border-top:0}.finding-body{flex-direction:column;gap:6px;min-width:0;display:flex}.finding-body p{color:var(--muted);max-width:72ch;margin:0}.sev{text-transform:uppercase;letter-spacing:.05em;text-align:center;border-radius:999px;margin-top:2px;padding:3px 8px;font-size:11px;font-weight:600}.sev.critical{color:var(--bad);background:var(--bad-bg)}.sev.warn{color:var(--warn);background:var(--warn-bg)}.sev.tip{color:var(--muted);background:var(--hover)}.fix-preview{max-width:480px;color:var(--muted);align-items:center;gap:8px;display:flex}.sw-row{align-items:center;gap:6px;display:flex}.sw{border:1px solid var(--line);border-radius:5px;width:22px;height:22px}.strengths{flex-direction:column;gap:6px;margin:0;padding-left:0;list-style:none;display:flex}.strengths li:before{content:"✓ ";color:var(--ok);font-weight:700}.ai-text{white-space:pre-wrap;max-width:72ch;margin:0}@media (width<=640px){.finding{grid-template-columns:1fr}.sev{justify-self:start}}.imp-sum .imp-strip,.before-after .imp-strip{flex:none;height:32px}.grad-preview{touch-action:none;position:relative}.grad-center{cursor:move;touch-action:none;background:0 0;border:3px solid #fff;border-radius:50%;width:26px;height:26px;margin:-13px 0 0 -13px;padding:0;position:absolute;box-shadow:0 0 0 1px #00000080,inset 0 0 0 1px #00000080}.grad-center:after{content:"";background:#fff;border-radius:50%;position:absolute;inset:8px;box-shadow:0 0 0 1px #00000080}.grad-point{cursor:move;touch-action:none;border:3px solid #fff;border-radius:50%;width:30px;height:30px;margin:-15px 0 0 -15px;padding:0;position:absolute;box-shadow:0 0 0 1px #00000073,0 2px 8px #0000004d}.grad-point.sel{box-shadow:0 0 0 2px #17181d,0 2px 8px #0000004d}.link-row{gap:6px;width:100%;display:flex}.link-row input{border:1px solid var(--line);background:var(--surface);border-radius:8px;flex:1;min-width:0;padding:6px 10px}#site-url{border:1px solid var(--line);background:var(--surface);border-radius:8px;width:100%;padding:8px 10px}.site-shot{flex-direction:column;gap:6px;margin:0;display:flex}.site-shot img,.site-shot-img{border:1px solid var(--line);border-radius:8px;width:100%;display:block}.site-shot-img{object-fit:cover;max-height:220px}.goals{border:0;flex-direction:column;gap:8px;margin:0;padding:0;display:flex}.goals legend{margin-bottom:8px;font-size:13px;font-weight:600}.goals textarea{border:1px solid var(--line);background:var(--surface);resize:vertical;width:100%;font:inherit;color:inherit;border-radius:8px;padding:8px 10px;font-size:14px}.sev.goal{color:var(--ink);background:var(--hover);border:1px solid var(--line);text-transform:none;letter-spacing:0;font-size:11px}.finding.goal{grid-template-columns:120px 1fr auto}.pattern-preview{aspect-ratio:16/9;border-radius:var(--radius);border:1px solid var(--line);width:100%}.pattern-gallery{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px;margin:0;padding:0;list-style:none;display:grid}.pattern-gallery button{background:0 0;border:0;flex-direction:column;align-items:flex-start;gap:4px;width:100%;padding:0;display:flex}.pattern-thumb{aspect-ratio:4/3;border:1px solid var(--line);border-radius:8px;width:100%;display:block}.pattern-gallery button[aria-pressed=true] .pattern-thumb{box-shadow:0 0 0 2px var(--surface), 0 0 0 4px var(--ink)}.pick-row button{position:relative}.pick-row .order{font:700 11px var(--sans);background:#ffffffd9;border-radius:4px;place-items:center;display:grid;position:absolute;inset:3px}:root{--checker:repeating-conic-gradient(#d9dbe0 0 25%, #fff 0 50%) 0 0 / 16px 16px}.checker{background:var(--checker)}.preview-wrap{border-radius:var(--radius);overflow:hidden}.preview-wrap .pattern-preview{border:1px solid var(--line);display:block}canvas.pattern-preview{height:auto;display:block}.label-text{font-size:13px;font-weight:500}.checks-row{flex-wrap:wrap;gap:4px 14px;display:flex}.checks-row .check{padding:0;font-size:13px}.motif-tray{flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;display:flex}.motif-tray li{border:1px solid var(--line);background:var(--ground);border-radius:8px;place-items:center;width:44px;height:44px;font-size:24px;display:grid;position:relative}.motif-tray li.empty{background:0 0;border-style:dashed;width:auto;padding:0 10px;font-size:13px}.motif-tray svg,.motif-tray img{object-fit:contain;width:28px;height:28px}.motif-tray li button{border:1px solid var(--line);background:var(--surface);width:18px;height:18px;color:var(--ink);border-radius:50%;padding:0;font-size:12px;line-height:1;position:absolute;top:-7px;right:-7px}.motif-add{border:1px solid var(--line);border-radius:10px;flex-direction:column;gap:8px;padding:10px;display:flex}.motif-add input[type=search],.inline-form input{border:1px solid var(--line);background:var(--surface);width:100%;color:var(--ink);font:inherit;border-radius:8px;padding:6px 10px}.icon-grid{grid-template-columns:repeat(auto-fill,minmax(36px,1fr));gap:4px;max-height:200px;margin:0;padding:0;list-style:none;display:grid;overflow-y:auto}.icon-grid button{aspect-ratio:1;width:100%;color:var(--ink);background:0 0;border:1px solid #0000;border-radius:6px;place-items:center;padding:0;display:grid}.icon-grid button:hover{background:var(--hover);border-color:var(--line)}.icon-grid svg{width:22px;height:22px}.emoji-row{flex-wrap:wrap;gap:4px;display:flex}.emoji-row button{border:1px solid var(--line);background:var(--surface);border-radius:8px;width:36px;height:36px;padding:0;font-size:20px}.inline-form{gap:6px;margin-top:6px;display:flex}.file-btn{cursor:pointer;position:relative;overflow:hidden}.file-btn input{opacity:0;cursor:pointer;position:absolute;inset:0}.upload-motif{flex-direction:column;align-items:flex-start;gap:8px;display:flex}.upload-result{border:1px solid var(--line);border-radius:8px;place-items:center;width:100%;height:120px;display:grid}.upload-result img{max-width:90%;max-height:110px}.region{-webkit-user-select:none;user-select:none;touch-action:none;border-radius:8px;width:100%;line-height:0;position:relative;overflow:hidden}.region img{width:100%;display:block}.region-box{outline-offset:-2px;cursor:move;touch-action:none;outline:2px dashed #fff;position:absolute;box-shadow:0 0 0 9999px #00000073,inset 0 0 0 1px #000}.region-box:focus-visible{outline:3px solid var(--accent,#4c6fff)}.region-handle{cursor:nwse-resize;touch-action:none;background:#fff;border:2px solid #111;border-radius:50%;width:16px;height:16px;position:absolute;bottom:2px;right:2px}.colorways ul{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px;margin:8px 0 0;padding:0;list-style:none;display:grid}.colorways button{aspect-ratio:5/3;border:1px solid var(--line);border-radius:8px;width:100%;padding:0}.colorways button:hover{box-shadow:0 0 0 2px var(--surface), 0 0 0 4px var(--ink)}.custom-color{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.custom-color input[type=color]{background:0 0;border:0;width:32px;height:28px;padding:0}.custom-color input.mono{border:1px solid var(--line);background:var(--surface);width:84px;color:var(--ink);border-radius:6px;padding:4px 6px}.grad-list li{cursor:grab}.grad-list li.dragging{opacity:.5}.grad-move{gap:2px;display:inline-flex}.grad-move .icon-btn{color:inherit}.diagram{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);grid-template-columns:minmax(0,420px) minmax(0,1fr);align-items:center;gap:24px;margin-top:16px;padding:20px;display:grid}.diagram-wheel svg{width:100%;height:auto;display:block}.diagram-text{flex-direction:column;align-items:flex-start;gap:10px;display:flex}.diagram-text h2{margin:4px 0 0;font-size:22px}.diagram-text p{max-width:60ch;margin:0}.diagram-notes{color:var(--muted);gap:4px;margin:0;padding-left:18px;font-size:14px;display:grid}.diagram-sw{gap:4px;display:flex}.diagram-sw i{border-radius:6px;width:28px;height:28px;box-shadow:inset 0 0 0 1px #0000001a}@media (width<=760px){.diagram{grid-template-columns:1fr}}.view-bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;display:flex}.strips{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);flex-direction:column;gap:14px;padding:16px;display:flex}.strip-row{flex-direction:column;gap:4px;display:flex}.strip-label{text-transform:capitalize;font-size:13px;font-weight:600}.strip-bar{border-radius:6px;height:56px;display:flex;overflow:hidden}.strip-bar button{border:0;flex:1;min-width:0;padding:0;font-size:12px}.strip-bar button.is-base{flex:1.6;box-shadow:inset 0 0 0 2px}.strip-ends{justify-content:space-between;display:flex}.kit-cards{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;display:grid}.kit-card{border-radius:8px;flex-direction:column;justify-content:flex-end;min-height:230px;display:flex;position:relative;overflow:hidden}.kit-tints{width:72%;height:48%;display:flex;position:absolute;top:0;right:0}.kit-tints button{border:0;flex:1;justify-content:center;align-items:flex-start;padding:6px 0 0;display:flex}.kit-tints span{writing-mode:vertical-rl;opacity:.85;font-size:11px}.kit-card-text{flex-direction:column;gap:2px;padding:14px;font-size:12px;display:flex}.kit-card-text b{text-transform:capitalize;margin-bottom:4px;font-size:16px}.kit-card-text button{all:unset;cursor:pointer;font-family:var(--mono)}.uses{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;display:grid}.use-row{grid-template-columns:40px 1fr;gap:12px;display:grid}.use-sw{border-radius:8px;width:40px;height:40px;box-shadow:inset 0 0 0 1px #0000001a}.use-row ul{color:var(--muted);gap:2px;margin:6px 0 0;padding-left:16px;font-size:13px;display:grid}.use-bar{background:var(--ground);border-radius:4px;height:18px;margin-top:6px;position:relative;overflow:hidden}.use-bar i{opacity:.9;position:absolute;inset:0 auto 0 0}.use-bar span{color:var(--muted);font-size:11px;position:absolute;top:1px;right:6px}.type-spec{border:1px solid var(--line);border-radius:8px;gap:14px;padding:18px;display:grid}.type-row{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center;gap:16px;display:grid}.type-h1{letter-spacing:-.01em;font-size:34px;font-weight:800;line-height:1.1}.type-large:not(.type-h1){font-size:22px;font-weight:700}.type-body{font-size:16px;line-height:1.5}.type-small{font-size:13px}.type-btn{border-radius:8px;padding:10px 18px;font-weight:600;display:inline-block}.type-badge{border-radius:999px;padding:3px 10px;font-size:12px;font-weight:700;display:inline-block}.type-meta{font-size:13px}.type-meta .verdict{margin-left:6px}@media (width<=700px){.type-row{grid-template-columns:1fr}}.comp{background:var(--k-bg);color:var(--k-text);border:1px solid var(--line);border-radius:8px;gap:16px;padding:18px;display:grid}.comp-label{text-transform:uppercase;letter-spacing:.06em;color:var(--k-muted);margin-bottom:6px;font-size:11px;display:block}.comp-row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.k-btn{background:var(--k-primary);color:var(--k-on-primary);cursor:default;border:1px solid #0000;border-radius:8px;padding:9px 16px;font-weight:600}.k-btn.hover{background:var(--k-primary-hover)}.k-btn.sec{background:var(--k-secondary);color:var(--k-on-secondary)}.k-btn.outline{border-color:var(--k-primary);color:var(--k-primary);background:0 0}.k-btn.ghost{color:var(--k-primary);background:0 0}.k-btn:disabled{background:var(--k-border);color:var(--k-muted)}.k-input{border:1px solid var(--k-strong-border);background:var(--k-surface);color:var(--k-muted);border-radius:8px;min-width:160px;padding:8px 12px;font-size:14px}.k-input.focus{border-color:var(--k-primary);box-shadow:0 0 0 3px color-mix(in srgb, var(--k-primary) 30%, transparent);color:var(--k-text)}.k-check{align-items:center;gap:6px;font-size:14px;display:inline-flex}.k-check i{background:var(--k-primary);width:18px;height:18px;color:var(--k-on-primary);border-radius:4px;place-items:center;font-size:12px;font-style:normal;display:grid}.k-toggle{background:var(--k-primary);border-radius:999px;width:40px;height:22px;position:relative}.k-toggle i{background:var(--k-on-primary);border-radius:50%;width:16px;height:16px;position:absolute;top:3px;right:3px}.k-tabs{border-bottom:1px solid var(--k-border);gap:14px;font-size:14px;display:inline-flex}.k-tabs>*{color:var(--k-muted);padding:6px 2px}.k-tabs b{color:var(--k-text);box-shadow:inset 0 -2px 0 var(--k-primary)}.k-badge{background:var(--k-accent);color:var(--k-on-accent);border-radius:999px;padding:3px 10px;font-size:12px;font-weight:700}.k-badge.sec{background:var(--k-secondary);color:var(--k-on-secondary)}.k-badge.neu{background:var(--k-border);color:var(--k-text)}.k-progress{background:var(--k-border);border-radius:999px;width:140px;height:8px;overflow:hidden}.k-progress i{background:var(--k-primary);width:62%;height:100%;display:block}.k-card{background:var(--k-surface);border:1px solid var(--k-border);border-radius:10px;gap:4px;min-width:200px;padding:14px;font-size:14px;display:grid}.k-card span{color:var(--k-muted)}.k-card a{color:var(--k-link);font-weight:600}.k-alerts{gap:8px;display:grid}.k-alert{border-left:4px solid var(--k-link);background:var(--k-info-subtle);color:var(--k-on-info-subtle);border-radius:6px;max-width:380px;padding:10px 14px;font-size:14px}.k-alert.ok{background:var(--k-success-subtle);color:var(--k-on-success-subtle);border-color:currentColor}.k-alert.bad{background:var(--k-danger-subtle);color:var(--k-on-danger-subtle);border-color:currentColor}.k-btn.danger{background:var(--k-danger);color:var(--k-on-danger)}.k-badge.warn{background:var(--k-warning);color:var(--k-on-warning)}.sheet-card .diagram{border:0;margin-top:0;padding:0}.brand-import{flex-direction:column;gap:16px;margin-top:16px;display:flex}.import-sources{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;padding:16px;display:grid}.import-sources textarea{width:100%;font:13px/1.4 var(--mono);border:1px solid var(--line);background:var(--surface);color:var(--ink);resize:vertical;border-radius:8px;padding:8px}.import-sources .field{align-items:flex-start;gap:8px}.import-table{border-collapse:collapse;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);width:100%;overflow:hidden}.import-table th,.import-table td{border-bottom:1px solid var(--line);text-align:left;vertical-align:middle;padding:8px 10px}.import-table input{border:1px solid var(--line);background:var(--surface);width:100%;min-width:140px;color:var(--ink);border-radius:6px;padding:4px 8px}.state-error{color:#b42318}.state-ready,.state-saved{color:#067647}@media (width<=700px){.import-table{display:block;overflow-x:auto}}.card-site{font-weight:400;display:block}.showcase{flex-direction:column;gap:12px;display:flex}.showcase-controls{flex-wrap:wrap;align-items:center;gap:8px 12px;display:flex}.showcase-controls select,.showcase-sub{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:6px;padding:4px 8px}.showcase-controls .check{padding:0;font-size:13px}.showcase-preview{border:1px solid var(--line);border-radius:8px;line-height:0;overflow:hidden}.showcase-preview svg,.embed svg{width:100%;height:auto;display:block}html.embed-page,html.embed-page body{background:0 0;margin:0;padding:0}.embed{line-height:0;display:block}.recolor-view{flex-direction:column;gap:10px;display:flex}.photo-wrap{border-radius:var(--radius);background:var(--checker);width:100%;position:relative;overflow:hidden}.photo-wrap canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.photo-wrap .overlay{touch-action:none}.photo-wrap .overlay.wand{cursor:crosshair}.photo-wrap .overlay.brush{cursor:cell}.compare{align-items:center;gap:10px;display:flex}.compare input{flex:1}.layers{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex}.layers li{align-items:center;gap:6px;display:flex}.layer-pick{text-align:left;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:8px;flex:1;align-items:center;gap:8px;padding:6px 8px;font-size:13px;display:flex}.layer-pick[aria-pressed=true]{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}.layer-pick i{border-radius:4px;width:18px;height:18px;box-shadow:inset 0 0 0 1px #0000001a}.imp-steps{gap:8px;margin:0;padding:0;list-style:none;display:grid}.imp-steps li{border-left:3px solid var(--line);padding-left:10px}.imp-steps li.off b{color:var(--muted);text-decoration:line-through}.imp-steps p{margin:2px 0 0 26px}.site-review{flex-direction:column;gap:12px;display:flex}.review-sum{margin:0}.ok-text{color:#067647}.bad-text{color:#b42318}.table-wrap{overflow-x:auto}.review-table{border-collapse:collapse;width:100%}.review-table th,.review-table td{text-align:left;border-bottom:1px solid var(--line);vertical-align:top;padding:8px}.pair-sample{text-overflow:ellipsis;white-space:nowrap;border-radius:6px;max-width:280px;padding:6px 10px;font-size:14px;display:inline-block;overflow:hidden;box-shadow:inset 0 0 0 1px #00000014}.pair-sample.large{font-size:20px;font-weight:700}.pass-list{flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none;display:flex}.shot-wrap{border:1px solid var(--line);border-radius:8px;width:100%;position:relative;overflow:hidden}.shot-wrap canvas{width:100%;height:100%;position:absolute;inset:0}.month-bar{grid-template-columns:repeat(12,minmax(0,1fr));gap:4px;margin-bottom:18px;display:grid}.month-bar button{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:8px;padding:8px 0;font-size:13px;position:relative}.month-bar button.now{font-weight:700}.month-bar button[aria-selected=true]{background:var(--ink);color:var(--surface);border-color:var(--ink)}.month-bar button i{background:#e4572e;border-radius:50%;width:5px;height:5px;position:absolute;top:4px;right:5px}@media (width<=700px){.month-bar{grid-template-columns:repeat(6,minmax(0,1fr))}}.month-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px 32px;margin-bottom:8px;display:flex}.month-head h2{margin:0;font-size:26px}.month-head p{margin:4px 0 0}.month-colors{flex-direction:column;align-items:flex-start;gap:6px;display:flex}.month-strip{border-radius:8px;min-height:44px;display:flex;overflow:hidden}.month-strip button{border:0;justify-content:center;align-items:flex-end;width:64px;height:44px;padding:0 0 4px;font-size:10px;display:flex}.plan-ahead{flex-wrap:wrap;align-items:center;gap:6px;margin:4px 0 24px;display:flex}.amount{border:0;flex-direction:column;gap:6px;margin:0;padding:0;display:flex}.amount legend{margin-bottom:6px;font-size:13px;font-weight:500}.analysis{gap:12px;margin:0 0 12px;padding:0;list-style:none;display:grid}.analysis li{grid-template-columns:26px 1fr;gap:10px;display:grid}.analysis p{color:var(--muted);max-width:75ch;margin:2px 0 6px;font-size:14px}.an-mark{background:var(--ground);border-radius:50%;place-items:center;width:24px;height:24px;font-size:13px;font-weight:700;display:grid}.an-good .an-mark{color:#067647;background:#dcfae6}.an-warn .an-mark{color:#93370d;background:#fef0c7}.an-bad .an-mark{color:#b42318;background:#fee4e2}.an-ideas{flex-wrap:wrap;gap:6px;display:flex}.idea{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;align-items:center;gap:6px;padding:4px 10px 4px 4px;display:inline-flex}.idea i{border-radius:50%;width:22px;height:22px}.pairings{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px;margin:0;padding:0;list-style:none;display:grid}.pairings li{align-items:center;gap:10px;display:flex}.pairings li>div{flex-direction:column;display:flex}.pair-chip.big{border-radius:8px;place-items:center;width:44px;height:44px;font-size:18px;font-weight:700;display:grid;box-shadow:inset 0 0 0 1px #00000014}.steps{gap:3px;margin:10px 0 14px;display:grid;overflow-x:auto}.steps-head,.steps-row{grid-template-columns:80px repeat(12,minmax(30px,1fr));align-items:center;gap:3px;min-width:520px;display:grid}.steps-head span{color:var(--muted);text-align:center;font-size:10px}.steps-row button{border:0;border-radius:4px;height:30px;padding:0;font-size:11px}.token-groups{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;display:grid}.token-group{flex-direction:column;gap:3px;display:flex}.token{text-align:left;color:var(--ink);background:0 0;border:0;grid-template-columns:20px 1fr auto;align-items:center;gap:6px;padding:2px 0;display:grid}.token i{border-radius:4px;width:20px;height:20px;box-shadow:inset 0 0 0 1px #0000001f}.presets summary{cursor:pointer}.presets input{border:1px solid var(--line);background:var(--surface);width:100%;color:var(--ink);border-radius:8px;margin:8px 0;padding:6px 10px}.presets ul{gap:4px;max-height:260px;margin:0;padding:0;list-style:none;display:grid;overflow-y:auto}.presets li button{border:1px solid var(--line);background:var(--surface);text-align:left;width:100%;color:var(--ink);border-radius:8px;grid-template-columns:64px 1fr auto;align-items:center;gap:8px;padding:5px 8px;display:grid}.font-picker{flex-direction:column;gap:10px;display:flex}.font-picker .industry{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:8px;max-width:480px;padding:6px 10px}.font-cards{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;display:grid}.font-card{text-align:left;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:10px;flex-direction:column;gap:4px;padding:12px;display:flex}.font-card[aria-pressed=true]{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}.fc-head{font-size:24px;line-height:1.1}.fc-body{color:var(--muted);font-size:13px}.demos{--demo-head-font:inherit;--demo-body-font:inherit}.demo-site{font-family:var(--demo-body-font), system-ui, sans-serif}.demo-hero h4,.demo-head b{font-family:var(--demo-head-font), serif}details.sheet-card summary{cursor:pointer}.sys-preview{flex-direction:column;gap:10px;display:flex}.sys-mini{border:1px solid var(--line);border-radius:10px;flex-direction:column;gap:12px;padding:16px;display:flex}.sys-card{border:1px solid;border-radius:10px;flex-direction:column;gap:6px;padding:14px;font-size:14px;display:flex}.sys-card b{font-size:18px}.sys-row{flex-wrap:wrap;gap:6px;margin-top:4px;display:flex}.sys-btn{border-radius:8px;padding:7px 12px;font-size:13px;font-weight:600}.sys-btn.outline{border:1px solid}.sys-tag{border-radius:999px;padding:3px 10px;font-size:12px;font-weight:600}.sys-scale{border-radius:6px;height:18px;display:flex;overflow:hidden}.sys-scale i{flex:1}