.ov-back{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;display:grid;place-items:center;padding:24px;background:color-mix(in oklab,var(--bg) 62%,transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;transition:opacity .16s ease}.ov-back.in{opacity:1}.ov-card{width:min(560px,100%);max-height:min(84vh,760px);display:flex;flex-direction:column;border:1px solid var(--hair);border-radius:14px;background:var(--panel);box-shadow:0 24px 64px color-mix(in oklab,var(--ink) 26%,transparent);transform:translateY(8px) scale(.985);transition:transform .18s cubic-bezier(.2,.7,.3,1)}.ov-back.in .ov-card{transform:none}.ov-card.wide{width:min(760px,100%)}.ov-head{display:flex;align-items:flex-start;gap:12px;padding:18px 20px 14px;border-bottom:1px solid var(--hair)}.ov-title{margin:0;font:600 15px/1.4 var(--font-ui);color:var(--ink)}.ov-sub{margin:3px 0 0;font:12px/1.5 var(--font-ui);color:var(--ink-soft)}.ov-x{margin-left:auto;flex:none;width:26px;height:26px;display:grid;place-items:center;border:1px solid transparent;border-radius:7px;background:none;color:var(--ink-soft);cursor:pointer}.ov-x:hover{border-color:var(--hair);color:var(--ink)}.ov-x svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}.ov-body{padding:18px 20px 20px;overflow-y:auto;font:13px/1.65 var(--font-ui);color:var(--ink)}.ov-field{display:block;margin-bottom:12px}.ov-field>span{display:block;margin-bottom:5px;font:12px/1.4 var(--font-ui);color:var(--ink-soft)}.ov-field>input{width:100%;box-sizing:border-box;padding:9px 11px;border:1px solid var(--hair);border-radius:8px;background:var(--stage);color:var(--ink);font:13px/1.4 var(--font-mono)}.ov-field>input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in oklab,var(--accent) 26%,transparent)}.ov-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:9px 16px;border:1px solid var(--hair);border-radius:8px;background:var(--panel);color:var(--ink);font:500 13px/1.2 var(--font-ui);cursor:pointer}.ov-btn:hover{border-color:color-mix(in oklab,var(--ink) 26%,transparent)}.ov-btn:disabled{opacity:.5;cursor:default}.ov-btn-primary{border-color:transparent;background:var(--accent);color:#fff}.ov-btn-primary:hover{background:var(--accent-hover);border-color:transparent}.ov-btn-full{width:100%}.ov-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.ov-row-end{justify-content:flex-end}.ov-link{border:none;background:none;padding:0;color:var(--accent);font:12px/1.5 var(--font-ui);cursor:pointer;text-decoration:underline;text-underline-offset:2px}.ov-note{margin:10px 0 0;font:12px/1.5 var(--font-ui);min-height:0}.ov-note:empty{display:none}.ov-note-err{color:#cf222e}.ov-note-ok{color:#1a7f37}.ov-note-muted{color:var(--ink-soft)}.ov-hr{height:1px;margin:16px 0;background:var(--hair);border:0}.ov-plans{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media(max-width:620px){.ov-plans{grid-template-columns:1fr}}.ov-plan{display:flex;flex-direction:column;gap:10px;padding:16px;border:1px solid var(--hair);border-radius:12px;background:var(--stage)}.ov-plan-pick{border-color:color-mix(in oklab,var(--accent) 52%,var(--hair))}.ov-plan-name{font:600 14px/1.3 var(--font-ui)}.ov-plan-price{font:600 22px/1.1 var(--font-mono)}.ov-plan-price small{font:400 12px/1 var(--font-ui);color:var(--ink-soft)}.ov-plan-feats{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:5px}.ov-plan-feats li{display:flex;gap:7px;font:12px/1.5 var(--font-ui);color:var(--ink-soft)}.ov-plan-feats li:before{content:"";flex:none;width:12px;height:12px;margin-top:4px;background:currentColor;color:var(--accent);clip-path:polygon(14% 52%,38% 76%,88% 20%,96% 30%,39% 92%,6% 60%)}.ov-plan-feats li.no{opacity:.72}.ov-plan-feats li.no:before{color:var(--ink-soft);clip-path:polygon(12% 12%,22% 4%,50% 36%,78% 4%,88% 12%,56% 46%,88% 84%,78% 94%,50% 58%,22% 94%,12% 84%,44% 46%)}.ov-plan .ov-btn{margin-top:auto}.ov-cycle{display:inline-flex;gap:2px;padding:2px;margin-bottom:14px;border:1px solid var(--hair);border-radius:9px;background:var(--stage)}.ov-cycle button{padding:5px 12px;border:0;border-radius:7px;background:none;color:var(--ink-soft);font:12px/1.3 var(--font-ui);cursor:pointer}.ov-cycle button[aria-pressed=true]{background:var(--panel);color:var(--ink);box-shadow:0 1px 3px color-mix(in oklab,var(--ink) 16%,transparent)}.ov-kv{display:grid;grid-template-columns:auto 1fr;gap:7px 16px;margin:0}.ov-kv dt{font:12px/1.6 var(--font-ui);color:var(--ink-soft)}.ov-kv dd{margin:0;font:12px/1.6 var(--font-mono);color:var(--ink)}.ov-badge{display:inline-block;padding:1px 8px;border-radius:999px;font:500 11px/1.7 var(--font-ui);border:1px solid}.ov-badge-paid{color:#1a7f37;border-color:color-mix(in oklab,#1a7f37 40%,transparent)}.ov-badge-free{color:var(--ink-soft);border-color:var(--hair)}.ov-badge-ro{color:#bf8700;border-color:color-mix(in oklab,#bf8700 44%,transparent)}.ov-inv{display:flex;flex-direction:column;gap:1px}.ov-inv-row{display:grid;grid-template-columns:1fr auto auto auto;align-items:center;gap:12px;padding:9px 2px;border-bottom:1px solid var(--hair);font:12px/1.4 var(--font-mono)}.ov-inv-row:last-child{border-bottom:0}.ov-inv-date{color:var(--ink-soft)}.ov-inv-amt{font-weight:600}.ov-inv a{color:var(--accent);text-decoration:none;font-family:var(--font-ui);font-size:12px}.ov-inv a:hover{text-decoration:underline}.up-btn{display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 10px;border:1px solid color-mix(in oklab,var(--accent) 46%,transparent);border-radius:7px;background:color-mix(in oklab,var(--accent) 9%,transparent);color:var(--accent);font:500 12px/1 var(--font-ui);cursor:pointer;white-space:nowrap}.up-btn:hover{background:color-mix(in oklab,var(--accent) 16%,transparent)}.up-btn svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.up-btn[hidden]{display:none}.acct-btn{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 8px 0 4px;border:1px solid var(--hair);border-radius:7px;background:none;color:var(--ink);font:12px/1 var(--font-ui);cursor:pointer;max-width:190px}.acct-btn:hover{border-color:color-mix(in oklab,var(--ink) 26%,transparent)}.acct-who{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--font-mono);font-size:11px}.acct-ava{flex:none;width:19px;height:19px;display:grid;place-items:center;border-radius:5px;background:color-mix(in oklab,var(--accent) 18%,transparent);color:var(--accent);font:600 10px/1 var(--font-mono);text-transform:uppercase}.acct-ava.anon{background:color-mix(in oklab,var(--ink) 10%,transparent);color:var(--ink-soft)}:root.state-auth .dock{visibility:hidden;pointer-events:none}:root.state-auth .marquee{display:none}:root.state-auth #clear,:root.state-auth .pop-wrap{visibility:hidden;pointer-events:none}.stage.scene-login .node.locked:not(.pj-masked){opacity:1}.stage.scene-login .node.locked .node-shape,.stage.scene-login .group.locked .group-box{stroke-dasharray:none}:root.view-extrude .stage.scene-login .node.locked .node-side{stroke-dasharray:none}.stage.scene-card-open .group-box{transform-box:fill-box;transform-origin:top left;animation:scene-card .62s cubic-bezier(.22,.7,.24,1) both}@keyframes scene-card{0%{transform:scale(.015,.02)}to{transform:scale(1)}}.stage.scene-card-open .t-chip,.stage.scene-card-open .chip-icon,.stage.scene-card-open .group-chip{animation:scene-ink .22s .44s ease both}.stage.scene-drawing .node.ink .node-shape{stroke-dasharray:1200;animation:scene-stroke var(--scene-stroke) cubic-bezier(.4,.05,.35,1) both}@keyframes scene-stroke{0%{stroke-dashoffset:1200}to{stroke-dashoffset:0}}.stage.scene-drawing .node.ink .node-label,.stage.scene-drawing .node.ink .icon,.stage.scene-drawing .node.ink .field-caret{animation:scene-ink .2s .26s ease both}@keyframes scene-ink{0%{opacity:0}to{opacity:1}}.stage.scene-drawing .node.ink .node-side,.stage.scene-drawing .node.ink .node-shade{animation:scene-ink .2s .32s ease both}.stage.scene-login .group:hover .group-ring,.stage.scene-login .group.selected .group-ring{opacity:0}.stage.scene-login .group:hover .group-hit{fill:transparent}.stage.scene-login .group:hover .group-box{stroke-width:2}.stage.scene-login .group.selected .group-chip{stroke-width:1.5}.stage.scene-login{--scene-step: .1s;--scene-stroke: .5s;--scene-erase: .36s}.stage.scene-drawing .node.erase .node-shape{stroke-dasharray:1200;animation:scene-unstroke var(--scene-erase) cubic-bezier(.65,0,.6,.95) both}@keyframes scene-unstroke{0%{stroke-dashoffset:0}to{stroke-dashoffset:1200}}.stage.scene-drawing .node.erase .node-label,.stage.scene-drawing .node.erase .icon,.stage.scene-drawing .node.erase .field-caret{animation:scene-unink .16s ease both}@keyframes scene-unink{0%{opacity:1}to{opacity:0}}.stage.scene-drawing .node.erase .node-side,.stage.scene-drawing .node.erase .node-shade,.stage.scene-drawing .node.erase .node-ring{animation:scene-unink var(--scene-erase) ease both}.stage.scene-card-close .group-box{transform-box:fill-box;transform-origin:top left;animation:scene-card-out .44s cubic-bezier(.6,.04,.72,.1) both}@keyframes scene-card-out{0%{transform:scale(1)}to{transform:scale(.015,.02)}}.stage.scene-card-close .t-chip,.stage.scene-card-close .chip-icon,.stage.scene-card-close .group-chip{animation:scene-unink .14s ease both}@keyframes pj-born-stroke{0%{stroke-dashoffset:1200}to{stroke-dashoffset:0}}@keyframes pj-born-fill{0%{fill-opacity:0}to{fill-opacity:1}}@keyframes pj-born-ink{0%{opacity:0}to{opacity:1}}@keyframes pj-born-glow{0%{filter:drop-shadow(0 0 0 transparent)}40%{filter:drop-shadow(0 0 16px color-mix(in oklab,var(--accent) 62%,transparent))}to{filter:drop-shadow(0 0 0 transparent)}}.stage.scene-login .group.pj-born .group-box{stroke-dasharray:1200;animation:pj-born-stroke .5s cubic-bezier(.4,.05,.35,1) both,pj-born-fill .44s .18s ease both,pj-born-glow 1s ease-in-out .62s both}.stage.scene-login .node.pj-born .node-shape{stroke-dasharray:1200;animation:pj-born-stroke .5s cubic-bezier(.4,.05,.35,1) .12s both,pj-born-fill .44s .3s ease both,pj-born-glow 1s ease-in-out .62s both}.stage.scene-login .node.pj-born .node-label,.stage.scene-login .node.pj-born .icon,.stage.scene-login .node.pj-born .thumb-art{animation:pj-born-ink .26s .56s ease both}@media(prefers-reduced-motion:reduce){.stage.scene-login .group.pj-born .group-box,.stage.scene-login .node.pj-born .node-shape,.stage.scene-login .node.pj-born .node-label,.stage.scene-login .node.pj-born .icon,.stage.scene-login .node.pj-born .thumb-art{animation:none;stroke-dasharray:none}}.stage.scene-swap-l,.stage.scene-swap-r{--swap-dx-in: 690px;--swap-dx-out: 690px;--swap-span: 1.05s;--swap-card-out: .96s;--swap-zoom: .55s;--swap-at: 30s}.stage.scene-swap-l .node.leave,.stage.scene-swap-l .group[data-group$="~out"]{animation:swap-out-l var(--swap-span) cubic-bezier(.42,.02,.3,1) var(--swap-at) both}.stage.scene-swap-r .node.leave,.stage.scene-swap-r .group[data-group$="~out"]{animation:swap-out-r var(--swap-span) cubic-bezier(.42,.02,.3,1) var(--swap-at) both}.stage.scene-swap-l .node:not(.leave),.stage.scene-swap-l .group:not([data-group$="~out"]){animation:swap-in-r var(--swap-span) cubic-bezier(.42,.02,.3,1) var(--swap-at) both}.stage.scene-swap-r .node:not(.leave),.stage.scene-swap-r .group:not([data-group$="~out"]){animation:swap-in-l var(--swap-span) cubic-bezier(.42,.02,.3,1) var(--swap-at) both}.stage.scene-swap-l .group .group-box,.stage.scene-swap-r .group .group-box{transform-box:fill-box;transform-origin:top left}.stage.scene-swap-l .group[data-group$="~out"] .group-box,.stage.scene-swap-r .group[data-group$="~out"] .group-box{animation:scene-card-out var(--swap-card-out) cubic-bezier(.6,.04,.72,.1) var(--swap-at) both}.stage.scene-swap-l .group:not([data-group$="~out"]) .group-box,.stage.scene-swap-r .group:not([data-group$="~out"]) .group-box{animation:scene-card .62s cubic-bezier(.22,.7,.24,1) var(--swap-at) both}.stage.scene-swap-l .group[data-group$="~out"] .t-chip,.stage.scene-swap-l .group[data-group$="~out"] .chip-icon,.stage.scene-swap-r .group[data-group$="~out"] .t-chip,.stage.scene-swap-r .group[data-group$="~out"] .chip-icon{animation:scene-unink .14s ease var(--swap-at) both}.stage.scene-swap-l .group:not([data-group$="~out"]) .t-chip,.stage.scene-swap-l .group:not([data-group$="~out"]) .chip-icon,.stage.scene-swap-r .group:not([data-group$="~out"]) .t-chip,.stage.scene-swap-r .group:not([data-group$="~out"]) .chip-icon{animation:scene-ink .22s ease calc(var(--swap-at) + .44s) both}@keyframes swap-out-l{0%{transform:translate(0)}to{transform:translate(calc(-1 * var(--swap-dx-out)))}}@keyframes swap-out-r{0%{transform:translate(0)}to{transform:translate(var(--swap-dx-out))}}@keyframes swap-in-r{0%{transform:translate(var(--swap-dx-in))}to{transform:translate(0)}}@keyframes swap-in-l{0%{transform:translate(calc(-1 * var(--swap-dx-in)))}to{transform:translate(0)}}.stage.scene-drawing .node.ink-d1 .node-shape{animation-delay:calc(-1 * var(--scene-step))}.stage.scene-drawing .node.ink-d1 .node-label,.stage.scene-drawing .node.ink-d1 .icon,.stage.scene-drawing .node.ink-d1 .field-caret{animation-delay:calc(.26s + -1 * var(--scene-step))}.stage.scene-drawing .node.ink-d2 .node-shape{animation-delay:calc(-2 * var(--scene-step))}.stage.scene-drawing .node.ink-d2 .node-label,.stage.scene-drawing .node.ink-d2 .icon,.stage.scene-drawing .node.ink-d2 .field-caret{animation-delay:calc(.26s + -2 * var(--scene-step))}.stage.scene-drawing .node.ink-d3 .node-shape{animation-delay:calc(-3 * var(--scene-step))}.stage.scene-drawing .node.ink-d3 .node-label,.stage.scene-drawing .node.ink-d3 .icon,.stage.scene-drawing .node.ink-d3 .field-caret{animation-delay:calc(.26s + -3 * var(--scene-step))}.stage.scene-drawing .node.ink-d4 .node-shape{animation-delay:calc(-4 * var(--scene-step))}.stage.scene-drawing .node.ink-d4 .node-label,.stage.scene-drawing .node.ink-d4 .icon,.stage.scene-drawing .node.ink-d4 .field-caret{animation-delay:calc(.26s + -4 * var(--scene-step))}.stage.scene-drawing .node.ink-d5 .node-shape{animation-delay:calc(-5 * var(--scene-step))}.stage.scene-drawing .node.ink-d5 .node-label,.stage.scene-drawing .node.ink-d5 .icon,.stage.scene-drawing .node.ink-d5 .field-caret{animation-delay:calc(.26s + -5 * var(--scene-step))}.stage.scene-drawing .node.erase-d1 .node-shape,.stage.scene-drawing .node.erase-d1 .node-side,.stage.scene-drawing .node.erase-d1 .node-shade,.stage.scene-drawing .node.erase-d1 .node-ring,.stage.scene-drawing .node.erase-d1 .node-label,.stage.scene-drawing .node.erase-d1 .icon,.stage.scene-drawing .node.erase-d1 .field-caret{animation-delay:calc(-1 * var(--scene-step))}.stage.scene-drawing .node.erase-d2 .node-shape,.stage.scene-drawing .node.erase-d2 .node-side,.stage.scene-drawing .node.erase-d2 .node-shade,.stage.scene-drawing .node.erase-d2 .node-ring,.stage.scene-drawing .node.erase-d2 .node-label,.stage.scene-drawing .node.erase-d2 .icon,.stage.scene-drawing .node.erase-d2 .field-caret{animation-delay:calc(-2 * var(--scene-step))}.stage.scene-drawing .node.erase-d3 .node-shape,.stage.scene-drawing .node.erase-d3 .node-side,.stage.scene-drawing .node.erase-d3 .node-shade,.stage.scene-drawing .node.erase-d3 .node-ring,.stage.scene-drawing .node.erase-d3 .node-label,.stage.scene-drawing .node.erase-d3 .icon,.stage.scene-drawing .node.erase-d3 .field-caret{animation-delay:calc(-3 * var(--scene-step))}.stage.scene-drawing .node.erase-d4 .node-shape,.stage.scene-drawing .node.erase-d4 .node-side,.stage.scene-drawing .node.erase-d4 .node-shade,.stage.scene-drawing .node.erase-d4 .node-ring,.stage.scene-drawing .node.erase-d4 .node-label,.stage.scene-drawing .node.erase-d4 .icon,.stage.scene-drawing .node.erase-d4 .field-caret{animation-delay:calc(-4 * var(--scene-step))}.stage.scene-drawing .node.erase-d5 .node-shape,.stage.scene-drawing .node.erase-d5 .node-side,.stage.scene-drawing .node.erase-d5 .node-shade,.stage.scene-drawing .node.erase-d5 .node-ring,.stage.scene-drawing .node.erase-d5 .node-label,.stage.scene-drawing .node.erase-d5 .icon,.stage.scene-drawing .node.erase-d5 .field-caret{animation-delay:calc(-5 * var(--scene-step))}@media(prefers-reduced-motion:reduce){.stage.scene-card-open .group-box,.stage.scene-card-open .t-chip,.stage.scene-card-open .chip-icon,.stage.scene-card-close .group-box,.stage.scene-card-close .t-chip,.stage.scene-card-close .chip-icon,.stage.scene-drawing .node.ink .node-shape,.stage.scene-drawing .node.ink .node-label,.stage.scene-drawing .node.ink .icon,.stage.scene-drawing .node.ink .field-caret,.stage.scene-drawing .node.erase .node-shape,.stage.scene-drawing .node.erase .node-label,.stage.scene-drawing .node.erase .icon,.stage.scene-drawing .node.erase .field-caret,.stage.scene-drawing .node.erase .node-side,.stage.scene-drawing .node.erase .node-shade,.stage.scene-drawing .node.ink .node-side,.stage.scene-drawing .node.ink .node-shade,.stage.scene-swap-l .node,.stage.scene-swap-r .node,.stage.scene-swap-l .group,.stage.scene-swap-r .group{animation:none}}.stage.scene-out>svg{opacity:0;transform:scale(.965);transition:opacity .62s ease,transform .62s cubic-bezier(.4,0,.6,1)}.pop-row.locked>span:after{content:"VIP";margin-left:6px;padding:0 5px;border:1px solid color-mix(in oklab,var(--accent) 40%,transparent);border-radius:999px;color:var(--accent);font:500 9px/1.5 var(--font-ui);vertical-align:1px}.pop-row.locked>button{opacity:.5}.cf-turnstile-host{position:fixed;left:50%;top:50%;z-index:95;width:0;height:0;overflow:hidden;transform:translate(-50%,-50%);opacity:0;pointer-events:none;transition:opacity .24s ease,transform .24s cubic-bezier(.2,0,0,1)}.cf-turnstile-host.on{width:332px;height:97px;padding:16px;border:1px solid var(--stroke);border-radius:14px;background:var(--panel);box-shadow:0 18px 48px #00000047;opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}.cf-turnstile-host:not(.on){transform:translate(-50%,-50%) scale(.94)}.cf-turnstile-host.anchored.on{width:300px;height:65px;padding:0;border:none;background:none;box-shadow:none}.cp{--cp-gap: 6px;--cp-checker: repeating-conic-gradient(rgba(0, 0, 0, .18) 0% 25%, transparent 0% 50%) 50% / 8px 8px;display:flex;flex-direction:column;gap:8px;font-family:var(--font-mono);font-size:11px;color:var(--ink)}.cp-sv{position:relative;height:148px;border-radius:8px;cursor:crosshair;touch-action:none;background:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,transparent),var(--hue-color, #1677ff);box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--ink) 12%,transparent)}.cp-sv:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.cp-sv-dot{position:absolute;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--sw);box-shadow:0 0 0 2px #fff,0 0 0 3px #0006;pointer-events:none}.cp-sv-dot.on-light{box-shadow:0 0 0 2px #0000008c,0 0 0 3px #ffffff80}.cp-bars{display:flex;align-items:center;gap:8px}.cp-eye{flex:0 0 auto;width:30px;height:30px;padding:0;display:grid;place-items:center;line-height:0}.cp-eye svg{width:16px;height:16px;display:block}.cp-eye svg path{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.cp-preview{flex:0 0 auto;display:flex;width:52px;height:30px;border-radius:8px;overflow:hidden;box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--ink) 18%,transparent)}.cp-half{position:relative;flex:1 1 0;min-width:0;padding:0;border:0;border-radius:0;background:var(--cp-checker);cursor:pointer}.cp-half:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:var(--sw)}.cp-new{cursor:default}.cp-old:disabled{cursor:default;opacity:1}.cp-old:not(:disabled):hover:after{top:0;right:0;bottom:3px;left:0}.cp-half:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;z-index:1}.cp-tracks{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:var(--cp-gap)}.cp-track{position:relative;height:12px;border-radius:6px;cursor:pointer;touch-action:none;box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--ink) 12%,transparent)}.cp-track:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.cp-hue{background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.cp-alpha{background:var(--cp-checker)}.cp-alpha:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:linear-gradient(to right,transparent,var(--to, #1677ff))}.cp-knob{position:absolute;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--panel);box-shadow:0 0 0 1px #00000059,0 1px 3px #0000004d;pointer-events:none;z-index:1}.cp-row{display:flex;align-items:center;gap:var(--cp-gap)}.cp-fmts{flex:1 1 auto;min-width:0;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:3px}.cp-fmts button{padding:5px 0;font-size:10px;letter-spacing:.02em;color:var(--ink-soft)}.cp-fmts button[aria-pressed=true]{color:var(--accent)}.cp-fields{display:flex;align-items:center;gap:1px;background:var(--bg);border:1px solid var(--hair);border-radius:7px;padding:4px 7px;min-height:30px;overflow:hidden}.cp-fields:focus-within{outline:2px solid var(--accent);outline-offset:1px}.cp-syn{flex:0 0 auto;font-family:var(--font-mono);font-size:11.5px;color:var(--ink-soft);-webkit-user-select:none;user-select:none;pointer-events:none;white-space:pre}.cp-cell{flex:1 1 auto;min-width:0;display:flex;align-items:center;justify-content:center}.cp-unit{flex:0 0 auto;font-family:var(--font-mono);font-size:11.5px;color:var(--ink-soft);-webkit-user-select:none;user-select:none;pointer-events:none}.cp-slash{margin:0 4px}.cp-slot{flex:0 0 auto;width:3.4ch;border:0;background:transparent;border-radius:4px;padding:2px;color:var(--ink);font-family:var(--font-mono);font-size:11.5px;text-align:right;cursor:ew-resize}.cp-slot.wide{width:5.2ch}.cp-slot:hover{background:color-mix(in oklab,var(--ink) 8%,transparent)}.cp-slot:focus{background:color-mix(in oklab,var(--accent) 14%,transparent);cursor:text}.cp-slot:focus-visible{outline:none}:root.scrubbing .cp-slot{cursor:ew-resize}.cp-hex{flex:1 1 auto;min-width:0;border:0;background:transparent;padding:2px 1px;color:var(--ink);font-family:var(--font-mono);font-size:11.5px;letter-spacing:.04em}.cp-hex:focus-visible{outline:none}.cp-star{flex:0 0 auto;width:30px;height:30px;padding:0;display:grid;place-items:center;line-height:0;color:var(--ink-soft)}.cp-star svg{width:15px;height:15px;display:block}.cp-star svg path{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}.cp-star.on{color:var(--accent);border-color:var(--accent)}.cp-star.on svg path{fill:currentColor}.cp-meta{color:var(--ink-soft);font-size:10.5px;letter-spacing:.04em;min-height:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cp-meta.weak{color:#e5484d}.cp-tabs{display:flex;gap:3px;border-top:1px solid var(--hair);padding-top:8px}.cp-tabs button{flex:1 1 0;padding:5px 0;font-size:11px}.cp-body{display:flex;flex-direction:column;gap:6px}.cp-label{color:var(--ink-soft);font-size:10px;letter-spacing:.08em;text-transform:uppercase}.cp-note{color:var(--ink-soft);font-size:10px;line-height:1.5;font-family:var(--font-ui)}.cp-fams{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:3px}.cp-fams .cp-sw{width:auto;height:18px}.cp-shades{display:grid;grid-template-columns:repeat(10,1fr);gap:3px}.cp-swatches{display:flex;flex-wrap:wrap;gap:4px;align-items:center}.cp-swatches[hidden],.cp-label[hidden]{display:none}.cp-sw{position:relative;width:22px;height:22px;padding:0;border-radius:5px;border:1px solid color-mix(in oklab,var(--ink) 14%,transparent);background:var(--cp-checker);overflow:hidden;cursor:pointer}.cp-sw:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:var(--sw)}.cp-sw:hover{border-color:var(--ink-soft)}.cp-sw[aria-pressed=true]{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in oklab,var(--accent) 32%,transparent);background:var(--cp-checker)}.cp-sw.tall{width:auto;height:30px}.cp-sw-tag{position:absolute;inset:auto 0 1px 0;z-index:1;font-family:var(--font-mono);font-size:8px;line-height:1.4;letter-spacing:0;text-align:center;opacity:.85;pointer-events:none;overflow:hidden;white-space:nowrap}.insp-popover.for-color{width:288px;max-height:min(560px,var(--pop-room, 100vh))}.insp-color{padding:5px 7px}.insp-chip{width:17px;height:17px;border-radius:5px;display:block;background:linear-gradient(var(--sw),var(--sw)),repeating-conic-gradient(rgba(0,0,0,.18) 0% 25%,transparent 0% 50%) 50% / 8px 8px;box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--ink) 22%,transparent)}
