:root{--cf-canvas:#f3f3f2;--cf-border-subtle:#eeeeec;--cf-radius-sm:4px;--cf-primary:#ff5e1f;--cf-primary-hover:#ff7038;--cf-primary-active:#d63c01;--cf-hover:#f9f7f6;--cf-pressed:#e5e5e5;--cf-danger:#dc2626;--cf-danger-border:#fca5a5;--cf-danger-hover:#fef2f2;--brand-white:#fff;--brand-slate:#202b38;--brand-purple:#126d60;--brand-blue:#2c5ea8;--brand-pink:#b04d76;--surface:#fff;--canvas:var(--cf-canvas);--text:#18181b;--muted:#71717a;--subtle:#71717a;--line:var(--cf-border-subtle);--input-border:var(--line);--neutral-soft:var(--cf-hover);--accent:var(--cf-primary);--accent-hover:var(--cf-primary-hover);--accent-soft:#fff5ef;--accent-tint:#ffede3;--accent-border:var(--line);--focus:var(--accent);--notice-text:var(--text);--notice-surface:var(--cf-hover);--radius:var(--cf-radius-sm);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
/* Theme only: QR color presets and shape artwork retain their existing values. */
body{background:var(--canvas)}button,input,select,textarea{font-family:inherit}
.sidebar{width:216px;padding:28px 16px}.brand{gap:8px;margin-bottom:40px}.brand-logo{width:151px;height:32px}.brand-sub{padding-left:39px;font-size:9px;letter-spacing:1.5px}.nav-item{padding:10px 12px;border-radius:var(--radius)}.nav-item.active{background:var(--neutral-soft);color:var(--text)}.nav-count,.workspace-monogram,.workspace-card{border-radius:var(--radius)}.workspace-monogram{background:var(--neutral-soft);color:var(--text)}.workspace-card{padding:12px}.main-wrap{margin-left:216px}.topbar{height:58px;padding:0 28px;font-size:12px}main{padding:28px 28px 0}.page-heading{margin-bottom:24px}h1{font-size:30px;font-weight:600;letter-spacing:-1px}.eyebrow{color:var(--muted);letter-spacing:1px}.workspace-grid{grid-template-columns:minmax(0,1fr) 310px;gap:24px}.section-heading{margin-bottom:12px}.section-heading h2{font-size:15px;font-weight:600}
.composer,.result,.profile-notice,.account-note,.link-preview,.qr-board,#qr-profile,dialog,.toast,.search{border:1px solid var(--line);border-radius:var(--radius);box-shadow:none}.composer,.result{background:var(--surface);padding:16px}.composer h2{font-size:21px}.profile-notice{background:var(--surface);padding:12px 16px;margin-bottom:20px}.account-note,.link-preview,#qr-profile{padding:12px;background:var(--neutral-soft)}.account-tabs,.library-tabs{margin:12px 0;gap:16px}.account-tabs button,.library-tabs button{font-size:12px;padding:10px 0;border-radius:var(--radius)}.account-tabs button.active,.library-tabs button.active{color:var(--text);border-bottom-color:var(--accent)}.toolbar{gap:10px}.search{background:var(--surface)}input,select,textarea{border:1px solid var(--line);border-radius:var(--radius);padding:9px 12px;font-size:13px;background:var(--surface)}
.button,.row-actions button,.text-button,.icon-button{border-radius:var(--radius);box-shadow:none;font-size:13px;font-weight:400}.button{min-height:32px;padding:6px 12px}.button.primary{background:var(--cf-primary);color:#fff;border:none;font-weight:500}.button.primary:hover{background:var(--cf-primary-hover)}.button.primary:active{background:var(--cf-primary-active)}.button.secondary,.row-actions button{background:#fff;color:#000;border:1px solid var(--line);padding:6px 12px}.button.secondary:hover,.row-actions button:hover,.text-button:hover,.icon-button:hover{background:var(--cf-hover)}.button.secondary:active,.row-actions button:active{background:var(--cf-pressed)}.text-button{color:var(--text);padding:6px 8px}.icon-button{width:32px;height:32px}.button.danger,.row-actions button.danger{background:#fff;color:var(--cf-danger);border:1px solid var(--cf-danger-border)}.button.danger:hover,.row-actions button.danger:hover{background:var(--cf-danger-hover)}
.link-list{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.link-row,.design-row{padding:16px 12px;border-bottom:1px solid var(--line);transition:background-color .15s}.link-row:last-child,.design-row:last-child{border-bottom:0}.link-row:hover,.design-row:hover{background:color-mix(in srgb,var(--cf-hover) 50%,transparent)}.link-body h3{font-weight:500}.row-actions{gap:6px}.row-actions button{font-size:11px;padding:6px 8px}.short-link{color:var(--text)}th{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:#a1a1aa}th,td{border-left:0;border-right:0}tr{border-bottom:1px solid var(--line);transition:background-color .15s}tr:hover{background:var(--cf-hover)}.form-error{color:var(--cf-danger);background:var(--cf-danger-hover);border:1px solid var(--cf-danger-border);border-radius:var(--radius)}.tip{padding:16px 4px}footer{margin-top:28px}dialog{padding:20px}dialog::backdrop{background:rgba(24,24,27,.35);backdrop-filter:none}:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
.qr-dialog{padding:0}.qr-header{padding:16px 20px}.qr-header h2{font-size:23px}.qr-controls{padding:0 20px}.qr-section{padding:16px 0}.qr-step{margin-bottom:16px}.qr-preview-panel{padding:24px;background:var(--canvas)}.qr-preview-label{margin-bottom:28px}.qr-preview-note{margin-bottom:24px}.qr-board{background:#fff}.qr-section select,.qr-color-input{border-color:var(--line);border-radius:var(--radius);min-height:34px;font-size:13px}.qr-color-input{padding:4px 8px}.qr-shape-art,.qr-swatch,.qr-quality-note,.qr-notice{border-radius:var(--radius);box-shadow:none}.qr-shape input:checked + .qr-shape-art{box-shadow:none;border-color:var(--accent)}.qr-download-row .button{min-height:34px}
@media(max-width:1150px){.sidebar{width:195px}.main-wrap{margin-left:195px}main{padding:24px 20px 0}.topbar{padding:0 20px}.workspace-grid{grid-template-columns:minmax(0,1fr) 285px;gap:16px}}
@media(max-width:900px){.sidebar{width:100%;height:76px;padding:12px 20px}.brand{margin-bottom:0}.brand-logo{width:142px;height:30px}.brand-sub{padding-left:37px}.main-wrap{margin-left:0}.topbar{height:44px}main{padding:24px 20px 0}.workspace-grid{gap:20px}.qr-preview-panel{padding:20px}}
@media(max-width:650px){main{padding:20px 16px 0}.topbar{padding:0 16px}h1{font-size:27px}.profile-notice{padding:12px;gap:12px}.link-row,.design-row{padding:12px}.qr-dialog{border-radius:var(--radius)}.qr-header{padding:16px}.qr-controls{padding:0 16px}.qr-section select,input{font-size:16px}.qr-color-input input{font-size:13px}}
