.ft-app-header{z-index:30;min-height:var(--header-h);border-bottom:1px solid var(--tool-line);background:color-mix(in srgb, var(--tool-surface) 92%, transparent);box-shadow:var(--tool-shadow);-webkit-backdrop-filter:blur(18px);justify-content:space-between;align-items:center;gap:.75rem;padding:.75rem 1rem;display:flex;position:fixed;top:0;left:0;right:0}.ft-header-logo-link{align-items:center;line-height:0;display:inline-flex}.ft-header-logo{width:128px;height:42px;color:var(--header-logo);background:currentColor;display:block;-webkit-mask:url(/flex-name-tag/logo-wordmark.svg) 50%/contain no-repeat;mask:url(/flex-name-tag/logo-wordmark.svg) 50%/contain no-repeat}.ft-header-actions{justify-content:flex-end;align-items:center;gap:.5rem;min-width:0;display:flex}.ft-theme-toggle{width:2.35rem;padding-inline:0}.ft-mobile-controls-handle{display:none}.ft-panel{top:calc(var(--header-h) + 16px);border-radius:var(--radius-card);width:min(332px,100vw - 32px);color:var(--tool-text);background:color-mix(in srgb, var(--tool-surface) 94%, transparent);border:1px solid var(--tool-line);box-shadow:var(--tool-shadow-lg);-webkit-backdrop-filter:blur(18px);z-index:20;pointer-events:auto;scrollbar-width:thin;flex-direction:column;gap:1rem;padding:1rem;display:flex;position:fixed;bottom:16px;left:16px;overflow:hidden auto}.ft-glass{border-radius:var(--radius-card);background:var(--tool-surface);border:1px solid var(--tool-line);box-shadow:var(--tool-shadow);padding:12px}.ft-panel-header{border-bottom:1px solid var(--tool-line);justify-content:space-between;align-items:center;gap:8px;padding-bottom:.85rem;display:flex}.ft-panel-header h1{color:var(--tool-text);letter-spacing:0;margin:0;font-size:1.35rem;font-weight:700}.ft-panel-header p{color:var(--tool-text-secondary);margin:0;font-size:.85rem}.ft-panel-close{border:1px solid var(--tool-line);border-radius:var(--radius-md);background:var(--inkiri-paper-bright);width:36px;height:36px;color:var(--tool-text-secondary);font:inherit;cursor:pointer;font-size:1.3rem;line-height:1;display:none}.ft-section{border:1px solid var(--tool-line);border-radius:var(--radius-card);background:color-mix(in srgb, var(--tool-surface) 68%, transparent);flex-direction:column;flex-shrink:0;display:flex;overflow:hidden}.ft-section-header{width:100%;min-height:2.6rem;color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:none;justify-content:space-between;align-items:center;gap:8px;margin:0;padding:.85rem;display:flex}.ft-section-header:hover .ft-section-title{color:var(--tool-accent-hover)}.ft-section-header:focus-visible{outline:2px solid var(--tool-accent);outline-offset:-2px}.ft-section-title{color:var(--tool-accent);letter-spacing:0;margin:0;font-size:.85rem;font-weight:700}.ft-section-chevron{color:var(--tool-text-muted);transition:transform var(--transition);flex-shrink:0;display:flex}.ft-section-open .ft-section-chevron{transform:rotate(180deg)}.ft-section-body{flex-direction:column;gap:.55rem;padding:0 .85rem .85rem;display:flex}.ft-field{margin-bottom:0}.ft-field-label{color:var(--tool-text-secondary);margin-bottom:.25rem;font-size:.85rem;display:block}.ft-input{border-radius:var(--radius-md);border:1px solid var(--tool-input-border);background:var(--tool-input-bg);width:100%;color:var(--tool-text);transition:border-color var(--transition), background var(--transition), box-shadow var(--transition);box-sizing:border-box;outline:none;padding:.45rem .6rem;font-family:inherit;font-size:.85rem;box-shadow:inset 0 1px #ffffff2e,0 0 0 1px #7c6e5e0f}.ft-input:focus{border-color:var(--tool-accent);background:var(--tool-surface);box-shadow:0 0 0 3px #2e7c831f}.ft-input[type=range]{-webkit-appearance:none;background:var(--tool-line);height:4px;box-shadow:none;border:none;border-radius:2px;padding:0}.ft-input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--tool-accent);border:2px solid var(--inkiri-paper-bright);cursor:pointer;border-radius:50%;width:14px;height:14px;box-shadow:0 1px 3px #2e2b2633}.ft-input-row{align-items:center;gap:8px;display:flex}.ft-input-row .ft-input{flex:1}.ft-input-number{flex:none!important;width:60px!important}.ft-input-unit{color:var(--tool-text-muted);font-size:11px}.ft-select{border-radius:var(--radius-md);border:1px solid var(--tool-input-border);background:var(--tool-input-bg);width:100%;color:var(--tool-text);cursor:pointer;outline:none;padding:.45rem .6rem;font-family:inherit;font-size:13px;box-shadow:inset 0 1px #ffffff2e,0 0 0 1px #7c6e5e0f}.ft-color-row{align-items:center;gap:8px;display:flex}.ft-color-swatch{border-radius:var(--radius-md);cursor:pointer;width:28px;height:28px;box-shadow:inset 0 0 0 2px color-mix(in srgb, var(--tool-surface) 85%, transparent), var(--tool-shadow);border:1px solid #2e2b262e;flex-shrink:0}.ft-color-swatch.ft-color-swatch-disabled{cursor:not-allowed;opacity:.35;filter:grayscale(60%)}.ft-color-swatch input[type=color]{opacity:0;width:0;height:0;position:absolute}.ft-color-label{color:var(--tool-text-secondary);flex:1;font-size:12px}.ft-color-hex{color:var(--tool-text-muted);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:11px}.ft-btn{border-radius:var(--radius-md);border:1px solid var(--tool-line);background:var(--tool-surface);min-height:2.35rem;color:var(--tool-text);cursor:pointer;transition:background-color var(--transition), border-color var(--transition), color var(--transition), transform var(--transition);justify-content:center;align-items:center;gap:6px;padding:.55rem .7rem;font-family:inherit;font-size:13px;font-weight:600;display:inline-flex}.ft-btn:hover{background:var(--tool-surface-2);border-color:var(--tool-line-hover);color:var(--tool-accent-hover);transform:translateY(-1px)}.ft-btn:active{transform:translateY(0)}.ft-btn:disabled{cursor:not-allowed;opacity:.52;transform:none}.ft-btn-primary{background:var(--inkiri-gold);border-color:var(--inkiri-gold);color:#fff}.ft-btn-primary:hover{color:#fff;background:#a8791f;border-color:#a8791f}.ft-btn-full{width:100%}.ft-btn-group{gap:8px;display:flex}.ft-btn-group .ft-btn{flex:1}.ft-hint{color:var(--tool-text-muted);margin-top:4px;font-size:11px;line-height:1.4}.ft-hint-inactive{color:#a29580}.ft-hint-error{color:#b91c1c}.ft-badge{border-radius:var(--radius-sm);color:var(--tool-accent);background:#2e7c831a;padding:2px 6px;font-size:11px;font-weight:500;display:inline-block}.ft-progress{background:var(--tool-line);border-radius:2px;width:100%;height:4px;overflow:hidden}.ft-progress-bar{background:var(--tool-accent);border-radius:2px;height:100%;transition:width .3s}.ft-footer{border-top:1px solid var(--tool-line);margin-top:auto;padding-top:8px}@media (width<=760px){.ft-app-header{min-height:58px;padding:.45rem .6rem}.ft-header-logo{width:104px;height:34px}.ft-header-actions{gap:.35rem}.ft-header-actions .ft-btn{min-height:36px;padding-inline:.6rem;font-size:.78rem}.ft-panel{top:auto;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:35;width:auto;max-height:min(42vh,360px);transform:translateY(calc(100% + 16px + env(safe-area-inset-bottom)));transition:transform var(--transition);padding:.85rem;left:10px}.ft-panel.ft-panel-open{transform:translateY(0)}.ft-mobile-controls-handle{left:50%;bottom:calc(14px + env(safe-area-inset-bottom));z-index:32;border:1px solid var(--tool-line);background:color-mix(in srgb, var(--tool-surface) 94%, transparent);width:48px;height:48px;color:var(--tool-text);box-shadow:var(--tool-shadow-lg);-webkit-backdrop-filter:blur(18px);cursor:pointer;border-radius:999px;place-items:center;display:grid;position:fixed;transform:translate(-50%)}.ft-mobile-controls-handle[aria-expanded=true]{display:none}.ft-panel-close{place-items:center;display:inline-grid}.ft-input,.ft-select,.ft-input-number,.ft-btn{min-height:44px}.ft-color-swatch{width:38px;height:38px}.ft-input[type=range]::-webkit-slider-thumb{width:22px;height:22px}}@media (prefers-reduced-motion:reduce){.ft-btn,.ft-input,.ft-select,.ft-progress-bar,.ft-section-chevron{transition-duration:.01ms!important}}@font-face{font-family:Be Vietnam Pro;src:url(/flex-name-tag/fonts/BeVietnamPro-Regular.ttf)format("truetype");font-weight:400 800;font-display:swap}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--inkiri-ivory:#f3eee3;--inkiri-paper:#fbf8f2;--inkiri-paper-bright:#fffdf8;--inkiri-paper-soft:#f7f2ea;--inkiri-ink:#2e2b26;--inkiri-slate:#5f6875;--inkiri-taupe:#6b6055;--inkiri-line:#cfc4ac;--inkiri-line-soft:#e3daca;--inkiri-teal:#2e7c83;--inkiri-teal-dark:#22636a;--inkiri-gold:#c7942e;--inkiri-olive:#878a3e;--bg:#ece8df;--surface:#fbf8f2;--surface-2:#f1ece3;--surface-3:#e4dccd;--line:#d4c8b6;--line-hover:#bfae92;--text:#16181d;--text-secondary:#5f6875;--text-muted:#8f8067;--accent:#2e7c83;--accent-hover:#22636a;--accent-muted:#2e7c831a;--input-bg:#fffefc;--input-border:#cdbb9c;--shadow:0 1px 3px #2e2b2614, 0 1px 2px #2e2b260f;--shadow-lg:0 16px 36px #2e2b261f;--tool-bg:var(--bg);--tool-surface:var(--surface);--tool-surface-2:var(--surface-2);--tool-surface-3:var(--surface-3);--tool-line:var(--line);--tool-line-hover:var(--line-hover);--tool-text:var(--text);--tool-text-secondary:var(--text-secondary);--tool-text-muted:var(--text-muted);--tool-accent:var(--accent);--tool-accent-hover:var(--accent-hover);--tool-accent-muted:var(--accent-muted);--tool-input-bg:var(--input-bg);--tool-input-border:var(--input-border);--tool-shadow:var(--shadow);--tool-shadow-lg:var(--shadow-lg);--viewport-bg:#0c1117;--header-logo:var(--accent);--header-h:67px;--radius-sm:3px;--radius-md:6px;--radius-card:8px;--transition:.18s ease}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0b1018;--surface:#121a26;--surface-2:#182333;--surface-3:#223149;--line:#25344a;--line-hover:#3a4d68;--text:#edf3f8;--text-secondary:#aab8c7;--text-muted:#6f8093;--accent:#4dd0e1;--accent-hover:#7de0ec;--accent-muted:#4dd0e124;--input-bg:#1a2638;--input-border:#354963;--shadow:0 1px 3px #00000057, 0 1px 2px #00000038;--shadow-lg:0 6px 22px #00000057;--header-logo:var(--accent)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{background:var(--viewport-bg);width:100%;height:100%;color:var(--tool-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Be Vietnam Pro,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow:hidden}:focus-visible{outline:2px solid var(--tool-accent);outline-offset:3px}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#2e2b262e;border-radius:2px}::-webkit-scrollbar-thumb:hover{background:#2e2b2647}
