.fontcard-root{--fc-bg:#d9d6ef;--fc-bg-deep:#cdc8e8;--fc-text:#1c1524;--fc-text-soft:#1c15249e;--fc-accent:#e63500;--fc-accent-deep:#c92e00;--fc-line:#1c152438;--fc-line-strong:#1c15248c;--fc-panel:#ffffff6b;--fc-surface:#f4f3fb;--fc-shadow:0 18px 40px #14122824, 0 4px 12px #14122814;--fc-ui:"Archivo", "Helvetica Neue", Helvetica, Arial, sans-serif;--fc-display:"Archivo Black", "Archivo", sans-serif;min-height:100dvh;color:var(--fc-text);font-family:var(--fc-ui);background:linear-gradient(180deg, #e4e1f5 0%, var(--fc-bg) 42%, var(--fc-bg-deep) 100%);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;padding:20px clamp(16px,3vw,40px) 48px;position:relative;overflow:hidden}.fontcardPage{background:var(--fc-bg,#d9d6ef);min-height:100dvh;margin:0}.fontcard-back{z-index:2;min-height:36px;color:var(--fc-text-soft);letter-spacing:.08em;text-transform:uppercase;align-items:center;margin-bottom:14px;font-size:12px;font-weight:700;text-decoration:none;transition:color .15s;display:inline-flex;position:relative}.fontcard-back:hover{color:var(--fc-accent)}.fontcard-root *,.fontcard-root :before,.fontcard-root :after{box-sizing:border-box}.fontcard-root button,.fontcard-root textarea{font:inherit}.fontcard-root :focus-visible{outline:3px solid var(--fc-accent);outline-offset:3px}.fontcard-atmosphere{pointer-events:none;opacity:.55;background-image:linear-gradient(#1c15240a 1px,#0000 1px),linear-gradient(90deg,#1c15240a 1px,#0000 1px);background-size:56px 56px;position:absolute;inset:0}.fontcard-topbar{z-index:1;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:28px;display:flex;position:relative}.fontcard-brand{align-items:flex-start;gap:12px;max-width:520px;display:flex}.fontcard-brand-mark{border:2px solid var(--fc-accent);width:44px;height:44px;font-family:var(--fc-display);color:var(--fc-accent);background:0 0;flex-shrink:0;place-items:center;font-size:22px;line-height:1;display:grid}.fontcard-brand h1{font-family:var(--fc-display);letter-spacing:.01em;text-transform:uppercase;color:var(--fc-accent);margin:0;font-size:clamp(26px,3.6vw,38px);font-weight:400;line-height:.95}.fontcard-brand p{color:var(--fc-text-soft);letter-spacing:.12em;text-transform:uppercase;margin:8px 0 0;font-size:11px;font-weight:700}.fontcard-tabs{border:2px solid var(--fc-line-strong);background:0 0;display:inline-flex}.fontcard-tabs button{appearance:none;min-height:44px;color:var(--fc-text);cursor:pointer;letter-spacing:.1em;text-transform:uppercase;background:0 0;border:0;padding:0 22px;font-size:12px;font-weight:700}.fontcard-tabs button.active{background:var(--fc-accent);color:#fff8f4}.fontcard-workspace{z-index:1;grid-template-columns:minmax(260px,320px) minmax(0,1fr);align-items:start;gap:24px;display:grid;position:relative}.fontcard-font-panel,.fontcard-controls{border:2px solid var(--fc-line-strong);background:var(--fc-panel)}.fontcard-font-panel{flex-direction:column;max-height:calc(100vh - 180px);padding:16px 12px 14px;display:flex}.fontcard-panel-head{border-bottom:2px solid var(--fc-line-strong);justify-content:space-between;align-items:baseline;padding:0 8px 12px;display:flex}.fontcard-panel-head h2{font-family:var(--fc-display);letter-spacing:.04em;text-transform:uppercase;color:var(--fc-text);margin:0;font-size:16px;font-weight:400}.fontcard-panel-head span{color:var(--fc-text-soft);letter-spacing:.08em;text-transform:uppercase;font-size:11px;font-weight:700}.fontcard-font-list{flex-direction:column;flex:1;gap:4px;margin:12px 0 0;padding:0;list-style:none;display:flex;overflow:auto}.fontcard-font-row{grid-template-columns:minmax(0,1fr) auto;align-items:stretch;gap:6px;display:grid}.fontcard-font-item{text-align:left;cursor:pointer;width:100%;min-height:44px;color:var(--fc-text);background:0 0;border:2px solid #0000;gap:3px;padding:12px 10px;display:grid}.fontcard-font-item:hover{border-color:var(--fc-line);background:#fff6}.fontcard-font-item.active{background:var(--fc-surface);border-color:var(--fc-accent)}.fontcard-font-dl{appearance:none;border:2px solid var(--fc-line-strong);color:var(--fc-text);cursor:pointer;letter-spacing:.04em;white-space:nowrap;background:0 0;align-self:center;min-height:44px;padding:0 12px;font-size:11px;font-weight:700}.fontcard-font-dl:hover:not(:disabled){background:var(--fc-accent);border-color:var(--fc-accent);color:#fff8f4}.fontcard-font-dl:disabled{opacity:.5;cursor:wait}.fontcard-font-item-name{font-size:15px;font-weight:800}.fontcard-font-item-desc,.fontcard-font-item-license{color:var(--fc-text-soft);font-size:11px;font-weight:600}.fontcard-preview-panel{grid-template-columns:minmax(240px,300px) minmax(0,1fr);align-items:start;gap:20px;display:grid}.fontcard-controls{gap:18px;padding:18px;display:grid}.fontcard-field{gap:8px;display:grid}.fontcard-field>span{letter-spacing:.12em;text-transform:uppercase;color:var(--fc-text);font-size:11px;font-weight:700}.fontcard-field textarea{resize:vertical;border:2px solid var(--fc-line-strong);background:var(--fc-surface);width:100%;min-height:96px;color:var(--fc-text);outline:none;padding:12px;font-weight:600}.fontcard-field textarea:focus{box-shadow:0 0 0 3px #e6350033}.fontcard-swatch-list{flex-wrap:wrap;gap:10px;display:flex}.fontcard-swatch{border:2px solid var(--fc-line);cursor:pointer;background:0 0;border-radius:0;grid-template-rows:28px auto;width:48px;min-height:48px;padding:0;display:grid;overflow:hidden}.fontcard-swatch-chip{width:100%;height:28px;display:block}.fontcard-swatch-label{letter-spacing:.02em;color:var(--fc-text);background:var(--fc-surface);text-align:center;padding:3px 2px;font-size:9px;font-weight:700;line-height:1.2;display:block}.fontcard-swatch.active{border-color:var(--fc-accent);box-shadow:0 0 0 2px #e6350040}.fontcard-color-readout{color:var(--fc-text-soft);letter-spacing:.02em;margin:0;font-size:11px;font-weight:600}.fontcard-actions{grid-template-columns:1fr 1fr;gap:10px;display:grid}.fontcard-btn{appearance:none;border:2px solid var(--fc-line-strong);cursor:pointer;letter-spacing:.06em;text-transform:uppercase;min-height:48px;padding:12px 14px;font-size:12px;font-weight:800}.fontcard-btn:disabled{opacity:.5;cursor:not-allowed}.fontcard-btn.primary{background:var(--fc-accent);border-color:var(--fc-accent);color:#fff8f4}.fontcard-btn.primary:hover:not(:disabled){background:var(--fc-accent-deep)}.fontcard-btn.ghost{color:var(--fc-text);background:0 0}.fontcard-btn.ghost:hover:not(:disabled){background:#fff6}.fontcard-feedback{margin:0;font-size:12px;font-weight:700}.fontcard-feedback.ok{color:var(--fc-accent-deep)}.fontcard-feedback.err{color:#9b1c00}.fontcard-stage{perspective:1200px;justify-items:center;gap:14px;min-height:400px;padding:12px 4px;display:grid}.fontcard-card{aspect-ratio:3/2;width:min(100%,560px);box-shadow:var(--fc-shadow);will-change:transform, box-shadow;border:1px solid #14122814;place-items:center;padding:clamp(24px,5vw,48px);display:grid;position:relative;overflow:hidden}.fontcard-card-grain{opacity:.12;mix-blend-mode:multiply;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");position:absolute;inset:0}.fontcard-card.dark .fontcard-card-grain{mix-blend-mode:screen;opacity:.2}.fontcard-card-text{z-index:1;text-align:center;letter-spacing:.04em;opacity:.35;word-break:break-word;max-width:90%;margin:0;font-size:clamp(28px,5.2vw,56px);line-height:1.25;transition:opacity .35s;position:relative}.fontcard-card-text.ready{opacity:1}.fontcard-card-text.loading{opacity:.45}.fontcard-card-meta{z-index:1;letter-spacing:.04em;opacity:.78;justify-content:space-between;gap:12px;font-size:10px;font-weight:700;display:flex;position:absolute;bottom:14px;left:18px;right:18px}.fontcard-card-meta>span:first-child{text-transform:uppercase;letter-spacing:.08em}.fontcard-card-meta>span:last-child{text-transform:none;font-weight:600}.fontcard-stage-hint{color:var(--fc-text-soft);letter-spacing:.1em;text-transform:uppercase;margin:0;font-size:11px;font-weight:700}.fontcard-mobile-dock{display:none}@media (max-width:980px){.fontcard-workspace,.fontcard-preview-panel{grid-template-columns:1fr}.fontcard-preview-panel{flex-direction:column;display:flex}.fontcard-stage{order:-1;min-height:auto}.fontcard-font-panel{order:2;max-height:280px}.fontcard-controls{order:1}.fontcard-mobile-dock{z-index:5;border:2px solid var(--fc-line-strong);background:color-mix(in srgb, var(--fc-surface) 92%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);gap:8px;padding:12px;display:grid;position:sticky;bottom:12px}.fontcard-actions-desktop{display:none}}@media (max-width:640px){.fontcard-topbar{flex-direction:column;align-items:flex-start}.fontcard-actions,.fontcard-mobile-dock{grid-template-columns:1fr}.fontcard-card{width:100%}}