:root{color-scheme:light;--bg: #f8fafc;--panel: rgba(255, 255, 255, .9);--panel-solid: #ffffff;--panel-border: rgba(226, 232, 240, .8);--panel-shadow: 0 16px 40px rgba(15, 23, 42, .05);--text: #0f172a;--muted: #64748b;--muted-soft: #94a3b8;--accent: #0ea5e9;--accent-deep: #0284c7;--warning: #f59e0b;--success: #10b981;--radius-xl: 28px;--radius-lg: 20px;--radius-md: 14px;--radius-sm: 10px;--transition: .18s ease;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}*{box-sizing:border-box}html,body{min-height:100%}body{margin:0;background:radial-gradient(circle at top left,rgba(248,250,252,.7),transparent 28%),radial-gradient(circle at bottom right,rgba(241,245,249,.9),transparent 32%),linear-gradient(180deg,#f8fafc,#f1f5f9);color:var(--text)}button,input,select,textarea{font:inherit}code{font-family:SF Mono,Cascadia Code,Consolas,monospace}.background{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:-1}.background__mesh{position:absolute;width:38rem;height:38rem;border-radius:999px;filter:blur(42px);opacity:.34}.background__mesh--left{top:-11rem;left:-13rem;background:radial-gradient(circle,rgba(224,242,254,.95),transparent 64%)}.background__mesh--right{right:-12rem;bottom:-12rem;background:radial-gradient(circle,rgba(241,245,249,.96),transparent 68%)}.app-shell{width:100%;max-width:none;margin:0 auto;padding:.9rem .4rem 1.5rem}.hero{margin-bottom:.7rem;padding-inline:.2rem}.hero__panel{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.1rem;border:1px solid rgba(226,232,240,.88);border-radius:24px;background:linear-gradient(135deg,#ffffffd9,#f8fafcc2);box-shadow:0 18px 38px #0f172a08;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.hero__brand{display:flex;align-items:center;gap:.95rem;min-width:0}.hero__logo{flex:0 0 auto;width:75px;height:75px;object-fit:contain;border-radius:12px}.hero__mark{flex:0 0 auto;width:52px;height:52px;display:grid;place-items:center;border-radius:18px;background:linear-gradient(135deg,#0ea5e9,#0ea5e9 60%,#0369a1 150%);color:#fff;font-size:1rem;font-weight:700;letter-spacing:-.05em;box-shadow:inset 0 1px #fff3,0 14px 26px #0284c726}.hero__copy{min-width:0}.hero__eyebrow{margin:0 0 .18rem;color:var(--muted-soft);font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}.hero__copy h1{margin:0 0 .16rem;max-width:none;font-size:clamp(1.5rem,2vw,2rem);font-weight:700;line-height:1.08;letter-spacing:-.035em}.hero__lead{margin:0;color:var(--muted);font-size:.9rem;line-height:1.45}.hero__chips{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.55rem}.hero__chip{display:inline-flex;align-items:center;padding:.5rem .75rem;border:1px solid rgba(226,232,240,.85);border-radius:999px;background:#ffffffe6;color:#475569;font-size:.8rem;font-weight:600;white-space:nowrap}.stat-card,.panel,.font-chip,.preview-card,.empty-state{background:var(--panel);border:1px solid var(--panel-border);box-shadow:var(--panel-shadow);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.stat-card{padding:1rem 1.1rem;border-radius:var(--radius-lg)}.stat-card__label,.eyebrow{display:block;margin:0;color:var(--muted-soft);font-size:.75rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}.stat-card__value{display:block;margin-top:.38rem;font-size:1.2rem;font-weight:700}.stat-card__caption{display:block;margin-top:.45rem;color:var(--muted);line-height:1.55}.panel{padding:1.35rem;border-radius:var(--radius-xl);margin-bottom:1rem}.workspace-secondary{display:grid;grid-template-columns:1fr;gap:1rem;align-items:start}.workspace-secondary .panel{margin-bottom:0}.panel__body[hidden]{display:none}.collapsible-panel.is-collapsed{padding-bottom:1.1rem}.collapsible-panel.is-collapsed .section-header--panel{margin-bottom:0}.collapsible-inline{padding:1rem 1rem .2rem;border:1px solid #e0dad2;border-radius:var(--radius-lg);background:#ffffffa3}.collapsible-inline.is-collapsed{padding-bottom:1rem}.collapsible-inline .panel__body{padding-top:.95rem}.collapsible-inline--compact{padding:.82rem .9rem .2rem;border-radius:var(--radius-md)}.collapsible-inline--compact.is-collapsed{padding-bottom:.82rem}.inline-panel-header{display:flex;align-items:center;justify-content:space-between;gap:1rem}.inline-panel-header h3{margin:.18rem 0 0;font-size:1.2rem;font-weight:700;letter-spacing:-.02em}.collapsible-inline--compact .inline-panel-header h3{font-size:1rem}.controls{display:grid;gap:1.2rem;grid-template-columns:repeat(2,minmax(0,1fr))}.controls__group{display:grid;gap:.72rem}.controls__action-row{display:flex;flex-wrap:wrap;gap:.72rem;align-items:center}.controls__group--wide{grid-column:1 / -1}.controls__split{grid-column:1 / -1;display:grid;gap:1rem;grid-template-columns:repeat(2,minmax(0,1fr))}.controls__split--four{grid-template-columns:repeat(4,minmax(0,1fr))}.controls__split--compact{gap:.85rem}.controls__toolbar{grid-column:1 / -1;display:grid;gap:1rem;grid-template-columns:minmax(0,1.4fr) minmax(240px,.7fr)}.control-label{color:#413e46;font-size:.94rem;font-weight:600}.upload-zone{display:grid;gap:.25rem;min-height:118px;align-content:center;padding:1.25rem;border:1px dashed #d8d1c8;border-radius:var(--radius-lg);background:#ffffffeb;cursor:pointer;transition:transform var(--transition),border-color var(--transition),box-shadow var(--transition),background var(--transition)}.upload-zone:hover,.upload-zone.is-dragging,.upload-zone:focus-within{transform:translateY(-1px);border-color:#c8d4e7;background:#fffffffa;box-shadow:0 16px 34px #5a769614}.upload-zone__title{font-size:1.08rem;font-weight:700}.upload-zone__subtitle,.hint,.value-readout,.counter,.font-chip__meta,.preview-card__subtitle{color:var(--muted);line-height:1.55}.action-button,.ghost-button,.quiet-button,.chip-remove,.preset-button,.view-toggle__button{appearance:none;border-radius:var(--radius-sm);border:1px solid #e2e8f0;background:#fffffff0;color:var(--text);cursor:pointer;transition:transform var(--transition),border-color var(--transition),box-shadow var(--transition),background var(--transition),color var(--transition)}.action-button:hover,.ghost-button:hover,.quiet-button:hover,.chip-remove:hover,.preset-button:hover,.view-toggle__button:hover{transform:translateY(-1px);border-color:#cbd5e1}.action-button{padding:.88rem 1.1rem;background:var(--accent);border-color:var(--accent);color:#fff}.action-button:hover{background:var(--accent-deep);border-color:var(--accent-deep)}.ghost-button,.quiet-button,.chip-remove,.preset-button,.view-toggle__button{padding:.72rem .95rem}.ghost-button:hover,.quiet-button:hover,.chip-remove:hover,.preset-button:hover,.view-toggle__button:hover{background:#f0f9ff;color:#0284c7;border-color:#bae6fd}.quiet-button{justify-self:start;padding:0;border:0;background:transparent;color:var(--muted);font-size:.85rem;font-weight:600;box-shadow:none}.quiet-button:hover{color:var(--text);background:transparent}.preset-list{display:flex;flex-wrap:wrap;gap:.65rem}.preset-button.is-active,.view-toggle__button.is-active{background:var(--accent-deep);border-color:var(--accent-deep);color:#fff}textarea,input[type=range],select,.text-input{width:100%}textarea,select,.text-input{border:1px solid #e2e8f0;border-radius:var(--radius-md);background:#f8fafc;color:var(--text);padding:.95rem 1rem}textarea:focus,select:focus,.text-input:focus{outline:none;border-color:var(--accent);background:#fff}textarea{min-height:120px;resize:vertical;line-height:1.62}.text-input::placeholder{color:#b6b0b9}.text-input--compact,.select--compact{padding:.68rem .82rem;font-size:.92rem}input[type=range]{accent-color:var(--accent)}.view-toggle{display:inline-flex;flex-wrap:wrap;gap:.6rem}.status-message{margin:0;padding:.95rem 1rem;border:1px solid #e2e8f0;border-radius:var(--radius-md);background:#f8fafc;line-height:1.55}.status-message[data-tone=warning]{color:var(--warning);border-color:#cdb06f8c;background:#fff7eb}.status-message[data-tone=success]{color:var(--success);border-color:#91bea48c;background:#eef8f1}.section-header{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin-bottom:1rem}.section-header--panel{align-items:center}.section-header__actions{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.section-header h2{margin:.18rem 0 0;font-size:clamp(1.7rem,2.6vw,2.45rem);font-weight:700;letter-spacing:-.04em}.panel-toggle{display:inline-flex;align-items:center;gap:.55rem;padding:.62rem .82rem;border-radius:var(--radius-sm);border:1px solid #e2e8f0;background:#fffffff0;color:var(--text);cursor:pointer;transition:transform var(--transition),border-color var(--transition),box-shadow var(--transition),background var(--transition)}.panel-toggle:hover{transform:translateY(-1px);border-color:#cbd5e1}.panel-toggle__label{font-size:.88rem;font-weight:600}.panel-toggle__icon{display:inline-grid;place-items:center;width:1.25rem;height:1.25rem;border-radius:999px;background:#f0f9ff;color:var(--accent);font-size:.92rem;line-height:1}.font-list{display:grid;gap:.85rem}.library-tools{display:grid;gap:1rem;margin-bottom:1rem}.font-chip{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.85rem;padding:.9rem 1rem;border-radius:var(--radius-md)}.font-chip__marker{width:11px;height:11px;border-radius:999px;background:var(--tone-accent, #70b8ef);box-shadow:0 0 0 4px var(--tone-soft, rgba(112, 184, 239, .18))}.font-chip__content{min-width:0}.font-chip__name{display:block;font-size:.98rem}.chip-remove{padding:.56rem .78rem;font-size:.84rem}.preview-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));min-height:260px;align-content:start}.preview-drop-hint{margin:.35rem 0 0;color:var(--muted);font-size:.92rem;line-height:1.5}.preview-drop-zone{position:relative;border:1px dashed transparent;border-radius:var(--radius-lg);transition:border-color var(--transition),background var(--transition),box-shadow var(--transition)}.preview-toolbar{display:grid;gap:.75rem;margin-bottom:.9rem;padding-bottom:.9rem;border-bottom:1px solid rgba(226,232,240,.88)}.preview-config{display:grid;gap:.85rem;margin-bottom:1rem;padding:1rem;border:1px solid rgba(226,232,240,.88);border-radius:var(--radius-lg);background:#ffffff9e}.preview-config__group{display:grid;gap:.65rem}.preview-config .control-label{color:var(--muted-soft);font-size:.74rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.preview-config .preset-list{gap:.55rem}.preview-config .preset-button{padding:.62rem .82rem;font-size:.88rem}.preview-config textarea{min-height:92px;padding:.82rem .92rem}.preview-config .status-message{padding:.82rem .92rem}.preview-toolbar__row{display:grid;align-items:center;gap:.75rem}.preview-toolbar__row--compact{grid-template-columns:minmax(18rem,32rem) auto;justify-content:space-between}.preview-search{min-width:0;width:100%}.preview-search__input{width:100%}.preview-toolbar__actions{display:inline-flex;align-items:center;justify-self:end;gap:.65rem;min-width:0}.preview-toolbar__mode{flex:0 0 auto}.view-toggle--compact .view-toggle__button{padding:.58rem .78rem;font-size:.88rem}.toolbar-button{padding:.58rem .82rem;font-size:.88rem;font-weight:600;white-space:nowrap}.customization-popover{position:relative;flex:0 0 auto}.customization-popover__panel{position:absolute;top:calc(100% + .65rem);right:0;z-index:12;width:min(760px,calc(100vw - 2rem));padding:1rem;border:1px solid rgba(226,232,240,.9);border-radius:22px;background:linear-gradient(180deg,#fffffffa,#f8fafcf5);box-shadow:0 24px 60px #0f172a14;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.customization-popover__header{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.95rem;padding-bottom:.85rem;border-bottom:1px solid rgba(226,232,240,.88)}.customization-popover__header h3{margin:.14rem 0 0;font-size:1.04rem;font-weight:700;letter-spacing:-.02em}.customization-popover__close{padding:.52rem .78rem;border-radius:999px;font-size:.82rem;font-weight:600}.customization-popover__panel .eyebrow{font-size:.68rem;letter-spacing:.13em}.customization-grid{gap:.8rem}.customization-field{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.65rem .75rem;align-content:start;min-height:116px;padding:.82rem .9rem;border:1px solid rgba(226,232,240,.88);border-radius:16px;background:#ffffffd1;box-shadow:inset 0 1px #fffc}.customization-field .control-label{grid-column:1;align-self:center;margin:0;color:#475569;font-size:.8rem;font-weight:600}.customization-field input[type=range],.customization-field select,.customization-field input[type=color]{grid-column:1 / -1;margin:0}.customization-field input[type=color]{width:100%;height:40px;padding:0;border:1px solid rgba(226,232,240,.88);border-radius:8px;cursor:pointer;background:transparent}.customization-field input[type=color]::-webkit-color-swatch-wrapper{padding:0}.customization-field input[type=color]::-webkit-color-swatch{border:none;border-radius:7px}.customization-field .value-readout{grid-column:2;justify-self:end;align-self:center;margin:0;padding:.18rem .46rem;border:1px solid rgba(226,232,240,.88);border-radius:999px;background:#f8fafc;color:var(--text);font-size:.78rem;font-weight:600;line-height:1.2}.customization-field select{height:46px;padding:.68rem .82rem;background:#fffffff5}.preview-drop-zone.is-dragging{border-color:#bae6fd;background:#f0f9ff;box-shadow:inset 0 0 0 1px #0ea5e91a}.preview-grid--stack,.preview-grid--simple,.preview-grid--waterfall{grid-template-columns:1fr}.preview-card,.empty-state{padding:1.15rem;border-radius:var(--radius-lg)}.preview-card{display:grid;gap:.9rem;align-content:start;min-height:300px;position:relative;background:var(--tone-bg, #f0f9ff);border-color:var(--tone-line, rgba(14, 165, 233, .34));cursor:grab}.preview-card.is-dragging{opacity:.58;cursor:grabbing}.preview-card.is-drop-target{box-shadow:0 0 0 2px #0f172a24,var(--panel-shadow)}.preview-card__head{display:flex;justify-content:space-between;align-items:start;gap:.9rem}.preview-card__info{min-width:0}.preview-card__source{margin:0;color:#2f3f53bd;font-size:.73rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.preview-card__title{margin:.28rem 0 0;font-size:1.08rem;word-break:break-all}.preview-card__remove{flex:0 0 auto;background:#ffffffa8}.preview-card__sample{margin:0;white-space:pre-wrap;word-break:break-word;padding:1rem;border-radius:var(--radius-md);transition:background-color var(--transition),color var(--transition)}.preview-card__details{display:none;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.7rem;margin:0}.preview-grid--stack .preview-card,.preview-grid--simple .preview-card,.preview-grid--waterfall .preview-card{min-height:auto;grid-template-columns:minmax(220px,.42fr) minmax(0,1fr);gap:1rem}.waterfall-row{margin-bottom:1.25rem}.waterfall-row:last-child{margin-bottom:0}.waterfall-label{display:block;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;margin-bottom:.35rem;opacity:.6}.preview-grid--stack .preview-card__head,.preview-grid--simple .preview-card__head{grid-column:1;flex-direction:column}.preview-grid--stack .preview-card__sample,.preview-grid--simple .preview-card__sample{grid-column:2;align-self:center}.preview-grid--waterfall .preview-card__head{grid-column:1;flex-direction:column}.preview-grid--waterfall .preview-card__sample{grid-column:2;align-self:start}.preview-grid--stack .preview-card__details{grid-column:1 / -1;display:grid}.meta-item{padding:.78rem .82rem;border-radius:12px;background:#ffffffad;border:1px solid rgba(255,255,255,.72)}.meta-item dt{margin-bottom:.28rem;color:var(--muted);font-size:.73rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.meta-item dd{margin:0;font-weight:600;line-height:1.45;word-break:break-word}.empty-state{text-align:center;min-height:170px;display:grid;place-items:center}.empty-state h3{margin-top:0;margin-bottom:.6rem}.empty-state p{margin:0;color:var(--muted)}.empty-state--upload{min-height:220px;padding:1.4rem;border:1px dashed #cbd5e1;background:#fffffff0;box-shadow:none;cursor:pointer;transition:transform var(--transition),border-color var(--transition),box-shadow var(--transition),background var(--transition)}.empty-state--upload:hover,.empty-state--upload:focus-visible{transform:translateY(-1px);border-color:#bae6fd;background:#fffffffa;box-shadow:0 16px 34px #0f172a0d;outline:none}.preview-drop-zone.is-dragging .empty-state--upload{border-color:#bae6fd;background:#f0f9ff;box-shadow:0 16px 34px #0f172a14}.empty-state__content{display:grid;gap:.28rem;max-width:38rem}.empty-state__eyebrow{display:inline-block;margin-bottom:.12rem;color:var(--muted-soft);font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}.empty-state__subtitle{font-size:1rem;font-weight:600;color:var(--text)!important}.font-chip[data-tone=sky],.preview-card[data-tone=sky]{--tone-accent: #0ea5e9;--tone-bg: #e0f2fe;--tone-soft: rgba(14, 165, 233, .18);--tone-line: rgba(14, 165, 233, .34)}.font-chip[data-tone=gold],.preview-card[data-tone=gold]{--tone-accent: #f59e0b;--tone-bg: #fef3c7;--tone-soft: rgba(245, 158, 11, .2);--tone-line: rgba(245, 158, 11, .34)}.font-chip[data-tone=mint],.preview-card[data-tone=mint]{--tone-accent: #10b981;--tone-bg: #d1fae5;--tone-soft: rgba(16, 185, 129, .2);--tone-line: rgba(16, 185, 129, .32)}.font-chip[data-tone=coral],.preview-card[data-tone=coral]{--tone-accent: #f43f5e;--tone-bg: #ffe4e6;--tone-soft: rgba(244, 63, 94, .2);--tone-line: rgba(244, 63, 94, .34)}.font-chip[data-tone=violet],.preview-card[data-tone=violet]{--tone-accent: #6366f1;--tone-bg: #e0e7ff;--tone-soft: rgba(99, 102, 241, .2);--tone-line: rgba(99, 102, 241, .34)}.font-chip[data-tone=rose],.preview-card[data-tone=rose]{--tone-accent: #ec4899;--tone-bg: #fce7f3;--tone-soft: rgba(236, 72, 153, .2);--tone-line: rgba(236, 72, 153, .34)}.font-chip[data-tone=slate],.preview-card[data-tone=slate]{--tone-accent: #64748b;--tone-bg: #f1f5f9;--tone-soft: rgba(100, 116, 139, .2);--tone-line: rgba(100, 116, 139, .34)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:980px){.controls__split--four,.controls__toolbar{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:860px){.workspace-secondary,.controls,.controls__split,.controls__split--four,.controls__toolbar,.preview-grid--stack .preview-card,.preview-grid--simple .preview-card,.preview-toolbar__row--compact{grid-template-columns:1fr}.preview-toolbar__actions{justify-self:stretch;flex-wrap:wrap}.hero__panel{flex-direction:column;align-items:flex-start;padding:.95rem 1rem}.hero__brand{width:100%}.hero__mark{width:46px;height:46px;border-radius:16px;font-size:.94rem}.hero__copy h1{font-size:1.55rem}.hero__chips{justify-content:flex-start}.customization-popover{width:100%}.customization-popover__panel{position:static;width:100%;margin-top:.65rem}.section-header,.inline-panel-header,.font-chip,.preview-card__head{align-items:start;flex-direction:column}.section-header__actions{width:100%}.preview-grid--stack .preview-card__sample,.preview-grid--simple .preview-card__sample,.preview-grid--stack .preview-card__details{grid-column:1}.customization-popover__close,.toolbar-button{width:auto}.action-button,.ghost-button,.panel-toggle{width:100%;justify-self:stretch}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}