html,body,#root{height:100%;margin:0}*{box-sizing:border-box}:root{--qc-result-minh:88px;--qc-accent-angle:135deg;--qc-bg:#0b1020;--qc-fg:#e7eaf3;--qc-muted:#9aa3b2;--qc-accent:#7c5cff;--qc-accent-2:#19d1ff;--qc-error:#ff6b6b;--qc-surface:#121628d9;--qc-border:#ffffff14;--qc-layer-elevated:linear-gradient(180deg,#ffffff1a,#ffffff0d);--qc-layer-elevated-border:#ffffff14;--qc-layer-button-bg:#ffffff14;--qc-layer-button-hover:#ffffff1f;--qc-layer-button-border:#ffffff14;--qc-layer-card-bg:#ffffff0f;--qc-layer-card-border:#ffffff14;--qc-layer-card-hover-shadow:0 10px 30px #00000059;--qc-layer-card-selected-shadow:0 0 0 2px #ffffff29 inset,0 10px 30px #00000059;--qc-layer-format-bg:#ffffff0f;--qc-layer-format-selected-bg:#ffffff1a;--qc-format-shadow-selected:0 8px 24px #00000040;--qc-layer-toast-bg:#ffffff14;--qc-layer-code-bg:#ffffff14;--qc-shadow-elevated:0 30px 80px #00000073}.qc-root{background:var(--qc-bg-layered,var(--qc-bg));min-height:100dvh;color:var(--qc-fg);place-items:center;font-family:Inter,Space Grotesk,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;transition:background .2s,color .12s;display:grid;position:relative}.qc-toolbar{z-index:1001;gap:8px;display:flex;position:fixed;top:12px;right:12px}.qc-tool-btn{background:var(--qc-layer-button-bg);color:var(--qc-fg);border:1px solid var(--qc-layer-button-border);letter-spacing:.04em;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:pointer;border-radius:10px;padding:6px 14px;font-family:Space Grotesk,Inter,ui-sans-serif;font-size:12px;font-weight:600;transition:background .16s,border-color .16s}.qc-tool-btn:hover{background:var(--qc-layer-button-hover);border-color:color-mix(in srgb,var(--qc-accent)40%,transparent)}.qc-tool-btn:focus{outline:2px solid var(--qc-accent);outline-offset:2px}.qc-main{text-align:center;width:min(820px,92vw);padding:60px 16px 120px}.qc-sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.qc-root:before{content:"";pointer-events:none;mix-blend-mode:overlay;background-image:radial-gradient(circle at 25% 15%,#ffffff05,#0000 40%),repeating-linear-gradient(0deg,#0000 0 2px,#00000005 2px 3px);position:fixed;inset:0}.qc-spotlight{-webkit-backdrop-filter:blur(10px)saturate(1.2);backdrop-filter:blur(10px)saturate(1.2);background:var(--qc-surface);border:1px solid var(--qc-border);z-index:1;border-radius:16px;width:min(820px,92vw);padding:22px 26px 18px;position:relative;box-shadow:0 30px 80px #00000059,inset 0 1px #ffffff14}.qc-spotlight:before{content:"";pointer-events:none;border-radius:inherit;background:linear-gradient(#ffffff0f,#ffffff08);position:absolute;inset:0}.qc-input{width:100%;color:var(--qc-fg);caret-color:var(--qc-accent);border:none;border-bottom:1px dashed var(--qc-border);background:0 0;outline:none;padding-bottom:10px;font:600 28px/1.2 Space Grotesk,Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;transition:box-shadow .16s,border-color .16s}.qc-input::placeholder{color:var(--qc-muted)}.qc-input:focus{box-shadow:inset 0 -2px 0 0 var(--qc-accent)}.qc-input::selection{background:color-mix(in srgb,var(--qc-accent)35%,transparent);color:var(--qc-fg)}.qc-result{border-top:1px dashed var(--qc-border);min-height:var(--qc-result-minh);margin-top:12px;padding-top:12px}.qc-result-value{letter-spacing:-.01em;background:linear-gradient(var(--qc-accent-angle),var(--qc-accent),var(--qc-accent-2));color:#0000;text-shadow:0 0 18px color-mix(in srgb,var(--qc-accent)35%,transparent),0 0 26px color-mix(in srgb,var(--qc-accent-2)28%,transparent);white-space:nowrap;text-overflow:ellipsis;-webkit-background-clip:text;background-clip:text;font:700 40px/1.15 Space Grotesk,Inter,ui-sans-serif,system-ui;overflow:hidden}.qc-result-sub,.qc-result-hint{color:var(--qc-muted);white-space:nowrap;text-overflow:ellipsis;margin-top:4px;font-family:Inter,ui-sans-serif,system-ui;font-size:14px;overflow:hidden}.qc-result-error{color:var(--qc-error);font-family:Inter,ui-sans-serif,system-ui;font-weight:600}.qc-muted{opacity:.8}.qc-toast{background:var(--qc-layer-toast-bg);border:1px solid var(--qc-layer-button-border);color:var(--qc-fg);opacity:0;border-radius:999px;padding:6px 10px;font-family:Inter,ui-sans-serif,system-ui;font-size:12px;transition:opacity .14s,transform .16s;position:absolute;top:12px;right:12px;transform:translateY(-6px)}.qc-toast.show{opacity:1;transform:translateY(0)}.qc-footer{color:var(--qc-muted);letter-spacing:.04em;align-items:center;gap:8px;padding:0;font-family:"Jersey 25",cursive;font-size:16px;display:flex;position:fixed;bottom:14px;left:50%;transform:translate(-50%)}.qc-footer-handle{color:var(--qc-fg);font-size:20px}.qc-footer span[aria-hidden=true]{color:var(--qc-muted);font-size:18px}.qc-footer-link{color:var(--qc-accent);font-size:20px;text-decoration:none}.qc-footer-link:hover,.qc-footer-link:focus-visible{text-decoration:underline}.qc-modal{z-index:1000;justify-content:center;align-items:center;display:none;position:fixed;inset:0}.qc-modal.show{display:flex}.qc-modal-panel{-webkit-backdrop-filter:blur(12px)saturate(1.2);backdrop-filter:blur(12px)saturate(1.2);background:var(--qc-layer-elevated);border:1px solid var(--qc-layer-elevated-border);width:min(520px,92vw);max-height:min(80vh,620px);box-shadow:var(--qc-shadow-elevated);color:var(--qc-fg);border-radius:16px;padding:22px 24px;position:relative;overflow:auto}.qc-modal-header{flex-direction:column;gap:8px;margin-bottom:16px;display:flex}.qc-modal-header h2{letter-spacing:.04em;margin:0;font-family:Space Grotesk,Inter,ui-sans-serif;font-size:16px}.qc-modal-header p{color:var(--qc-muted);margin:0;font-size:13px;line-height:1.45}.qc-format-list{gap:8px;margin:0;padding:0;list-style:none;display:grid}.qc-format-item{text-align:left;border:1px solid var(--qc-border);background:var(--qc-layer-format-bg);width:100%;color:var(--qc-fg);cursor:pointer;border-radius:10px;gap:4px;padding:10px 12px;transition:transform .14s,border-color .14s,background .14s;display:grid}.qc-format-item:hover{border-color:color-mix(in srgb,var(--qc-accent)45%,transparent);transform:translateY(-1px)}.qc-format-item.selected{border-color:color-mix(in srgb,var(--qc-accent)55%,transparent);background:var(--qc-layer-format-selected-bg);box-shadow:var(--qc-format-shadow-selected)}.qc-format-name{letter-spacing:.03em;font-family:Space Grotesk,Inter,ui-sans-serif;font-weight:600}.qc-format-hint{color:var(--qc-muted);font-size:12px}.qc-guide-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;display:grid}.qc-guide-grid h3{letter-spacing:.04em;text-transform:uppercase;margin:0 0 6px;font-family:Space Grotesk,Inter,ui-sans-serif;font-size:13px}.qc-guide-grid ul{color:var(--qc-muted);text-align:left;margin:0;padding-left:16px;font-size:13px;line-height:1.4}.qc-guide-grid code{background:var(--qc-layer-code-bg);color:var(--qc-fg);border-radius:6px;padding:2px 6px;font-family:Space Grotesk,Inter,ui-sans-serif}.qc-modal-close{border:1px solid var(--qc-layer-button-border);background:var(--qc-layer-button-bg);color:var(--qc-fg);letter-spacing:.04em;cursor:pointer;border-radius:999px;margin-top:18px;padding:6px 16px;font-family:Space Grotesk,Inter,ui-sans-serif;font-size:12px}.qc-modal-close:hover{background:var(--qc-layer-button-hover)}.qc-modal-close:focus{outline:2px solid var(--qc-accent);outline-offset:2px}.qc-picker{z-index:1000;justify-content:center;align-items:center;display:none;position:fixed;inset:0}.qc-picker.show{display:flex}.qc-picker-backdrop{z-index:0;background:#0006;position:absolute;inset:0}.qc-picker-panel{-webkit-backdrop-filter:blur(12px)saturate(1.2);backdrop-filter:blur(12px)saturate(1.2);background:var(--qc-layer-elevated);border:1px solid var(--qc-layer-elevated-border);width:min(920px,94vw);max-height:min(80vh,720px);box-shadow:var(--qc-shadow-elevated);z-index:1;border-radius:14px;padding:16px;position:relative;overflow:auto}.qc-picker-header{flex-direction:column;gap:4px;margin-bottom:16px;display:flex}.qc-picker-title{letter-spacing:.04em;margin:0;font-family:Space Grotesk,Inter,ui-sans-serif,system-ui;font-size:16px;font-weight:700}.qc-picker-sub{color:var(--qc-muted);margin:0;font-family:Inter,ui-sans-serif,system-ui;font-size:13px}.qc-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin:0;padding:0;list-style:none;display:grid}.qc-grid>li{list-style:none}.qc-card{border:1px solid var(--qc-layer-card-border);cursor:pointer;background:var(--qc-layer-card-bg);border-radius:12px;outline:none;width:100%;height:100%;transition:transform .14s,box-shadow .14s,border-color .14s;display:block;position:relative;overflow:hidden}.qc-card:focus-visible{box-shadow:0 0 0 2px var(--qc-accent);border-color:var(--qc-accent);transform:translateY(-2px)}.qc-card:hover{box-shadow:var(--qc-layer-card-hover-shadow);transform:translateY(-2px)}.qc-card.selected{box-shadow:var(--qc-layer-card-selected-shadow)}.qc-card-inner{padding:10px}.qc-swatch-row{grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:8px;display:grid}.qc-swatch{border-radius:6px;height:12px}.qc-card-title{color:var(--qc-fg);font-family:Space Grotesk,Inter,ui-sans-serif,system-ui;font-size:12px;font-weight:700}.qc-card-sub{color:var(--qc-muted);font-family:Inter,ui-sans-serif,system-ui;font-size:11px}.qc-mini{background:var(--qc-surface);border:1px solid var(--qc-border);border-radius:10px;margin-bottom:8px;padding:8px}.qc-mini-input{color:var(--qc-muted);border-bottom:1px dashed var(--qc-border);margin-bottom:6px;padding-bottom:6px;font:600 12px/1.2 Inter,ui-sans-serif,system-ui}.qc-mini-result{letter-spacing:-.01em;white-space:nowrap;text-overflow:ellipsis;font:800 18px/1.1 Space Grotesk,Inter,ui-sans-serif,system-ui;overflow:hidden}.qc-root[data-theme=dark]{--qc-bg:#0b1020;--qc-fg:#e7eaf3;--qc-muted:#9aa3b2;--qc-accent:#7c5cff;--qc-accent-2:#19d1ff;--qc-error:#ff6b6b;--qc-surface:#121628d9;--qc-border:#ffffff14;background:radial-gradient(1200px 800px at 10% 10%,#7c5cff1f,transparent 40%),radial-gradient(1000px 700px at 90% 30%,#19d1ff1f,transparent 45%),var(--qc-bg)}.qc-root[data-theme=light]{--qc-bg:#f6f7fb;--qc-fg:#0d1220;--qc-muted:#596273;--qc-accent:#5b72ff;--qc-accent-2:#2dd6d3;--qc-error:#d33b3b;--qc-surface:#ffffffdb;--qc-border:#00000014;background:radial-gradient(1200px 800px at 10% 10%,#5b72ff29,transparent 40%),radial-gradient(1000px 700px at 90% 30%,#2dd6d324,transparent 45%),var(--qc-bg)}.qc-root[data-theme=ocean]{--qc-bg:#071a24;--qc-fg:#e8fbff;--qc-muted:#8cb3bf;--qc-accent:#00c2ff;--qc-accent-2:#28ffa6;--qc-error:#ff7a7a;--qc-surface:#081824d9;--qc-border:#ffffff14;background:radial-gradient(1200px 800px at 20% 15%,#00c2ff2e,transparent 40%),radial-gradient(1000px 700px at 85% 35%,#28ffa61f,transparent 45%),var(--qc-bg)}.qc-root[data-theme=amoled]{--qc-bg:#000;--qc-fg:#f0f3ff;--qc-muted:#99a1b3;--qc-accent:#ff4dc4;--qc-accent-2:#00e1ff;--qc-error:#ff5a5a;--qc-surface:#000c;--qc-border:#ffffff1f;background:radial-gradient(1200px 800px at 10% 10%,#ff4dc429,transparent 40%),radial-gradient(1000px 700px at 90% 30%,#00e1ff29,transparent 45%),var(--qc-bg)}.qc-root[data-theme=sunset]{--qc-bg:#1a0f19;--qc-fg:#fff3f0;--qc-muted:#bf98a5;--qc-accent:#ff7a59;--qc-accent-2:#ff3d81;--qc-error:#ff6b6b;--qc-surface:#1a0f19d9;--qc-border:#ffffff1a;background:radial-gradient(1200px 800px at 15% 15%,#ff7a592e,transparent 40%),radial-gradient(1000px 700px at 85% 35%,#ff3d8124,transparent 45%),var(--qc-bg)}.qc-root[data-theme=forest]{--qc-bg:#08140d;--qc-fg:#eaf7f0;--qc-muted:#9bb7a5;--qc-accent:#2dd57b;--qc-accent-2:#41c7b1;--qc-error:#e05b65;--qc-surface:#08140dd9;--qc-border:#ffffff14;background:radial-gradient(1200px 800px at 18% 12%,#2dd57b2e,transparent 40%),radial-gradient(1000px 700px at 88% 32%,#41c7b11f,transparent 45%),var(--qc-bg)}.qc-root[data-theme=solarized]{--qc-bg:#fdf6e3;--qc-fg:#073642;--qc-muted:#586e75;--qc-accent:#268bd2;--qc-accent-2:#d33682;--qc-error:#dc322f;--qc-surface:#ffffffe6;--qc-border:#0000001a;background:radial-gradient(1200px 800px at 10% 10%,#268bd229,transparent 40%),radial-gradient(1000px 700px at 90% 30%,#d336821f,transparent 45%),var(--qc-bg)}.qc-root[data-theme=midnight]{--qc-bg:#0a0f1a;--qc-fg:#e6ebff;--qc-muted:#94a3c7;--qc-accent:#5b8eff;--qc-accent-2:#9b6bff;--qc-error:#ff5f5f;--qc-surface:#0a0f1ad9;--qc-border:#ffffff1a;background:radial-gradient(1200px 800px at 12% 12%,#5b8eff29,transparent 40%),radial-gradient(1000px 700px at 88% 28%,#9b6bff1f,transparent 45%),var(--qc-bg)}.qc-root[data-theme=candy]{--qc-bg:#1a0a14;--qc-fg:#fff0f6;--qc-muted:#b38aa3;--qc-accent:#ff4dc4;--qc-accent-2:#ffaa2c;--qc-error:#ff6b8b;--qc-surface:#1a0a14d9;--qc-border:#ffffff1f;background:radial-gradient(1200px 800px at 20% 20%,#ff4dc42e,transparent 40%),radial-gradient(1000px 700px at 84% 26%,#ffaa2c24,transparent 45%),var(--qc-bg)}.qc-root[data-theme=pastel]{--qc-bg:#f7f5fb;--qc-fg:#201d2c;--qc-muted:#6e6a7b;--qc-accent:#8a7ff0;--qc-accent-2:#f48fb1;--qc-error:#bf3f5a;--qc-surface:#ffffffd9;--qc-border:#00000014;background:radial-gradient(1200px 800px at 12% 12%,#8a7ff029,transparent 40%),radial-gradient(1000px 700px at 88% 28%,#f48fb11f,transparent 45%),var(--qc-bg)}
