:root{--bg:#0a0b10;--surface:#14161e;--surface-elevated:#1a1d27;--border:#2a2e3d;--border-subtle:#1f2230;--text:#e9eaef;--text-muted:#9ea3b3;--text-faint:#5d6276;--danger:#ef4444;--warning:#f59e0b;--success:#4ade80;--glass-bg:color-mix(in oklab, var(--surface) 65%, transparent);--glass-bg-strong:color-mix(in oklab, var(--surface-elevated) 80%, transparent);--glass-border:oklab(100% 0 5.96046e-8/.08);--glass-highlight:oklab(100% 0 5.96046e-8/.07);--glass-blur:saturate(180%) blur(20px);--glass-blur-strong:saturate(200%) blur(32px);--shadow-sm:0 1px 2px #0006;--shadow-md:0 4px 12px #00000059, 0 1px 2px #0006;--shadow-lg:0 12px 40px #00000073, 0 2px 6px #0000004d;--shadow-xl:0 24px 80px #00000080, 0 4px 12px #00000059;--radius-sm:6px;--radius:10px;--radius-lg:16px;--radius-xl:24px;--radius-2xl:32px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:56px;--dur-fast:.12s;--dur-base:.2s;--dur-slow:.4s;--ease-out:cubic-bezier(.16, 1, .3, 1);--ease-spring:cubic-bezier(.34, 1.56, .64, 1);--ease-in-out:cubic-bezier(.4, 0, .2, 1);--transition:.15s ease;--font-sans:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-mono:"Geist Mono", ui-monospace, "JetBrains Mono", "Fira Code", Consolas, monospace;font-feature-settings:"ss01", "cv11", "tnum"}:root[data-theme=light]{--bg:#f7f8fb;--surface:#fff;--surface-elevated:#f4f5f8;--border:#e1e4eb;--border-subtle:#ebedf2;--text:#1a1d27;--text-muted:#5d6276;--text-faint:#9ea3b3;--glass-bg:color-mix(in oklab, var(--surface) 75%, transparent);--glass-bg-strong:color-mix(in oklab, var(--surface) 90%, transparent);--glass-border:oklab(0% none none/.06);--glass-highlight:oklab(100% 0 5.96046e-8/.6);--shadow-sm:0 1px 2px #141e3c14;--shadow-md:0 4px 12px #141e3c14, 0 1px 2px #141e3c0f;--shadow-lg:0 12px 40px #141e3c1a, 0 2px 6px #141e3c0f;--shadow-xl:0 24px 80px #141e3c1f, 0 4px 12px #141e3c14}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}:root[data-app=web]{--accent:#4ade80}:root[data-app=json-xml]{--accent:#7c8cf5}:root[data-app=qrcode]{--accent:#22d3ee}:root[data-app=hashgen]{--accent:#f59e0b}:root{--accent-hover:color-mix(in oklch, var(--accent) 85%, white);--accent-active:color-mix(in oklch, var(--accent) 70%, black);--accent-muted:color-mix(in oklch, var(--accent) 30%, transparent);--accent-soft:color-mix(in oklch, var(--accent) 12%, transparent);--accent-glow:color-mix(in oklch, var(--accent) 55%, transparent);--accent-ring:color-mix(in oklch, var(--accent) 35%, transparent)}body.aliv-ambient{background:radial-gradient(ellipse 70% 50% at 50% -10%, var(--accent-soft), transparent 60%), radial-gradient(ellipse 100% 60% at 100% 100%, color-mix(in oklab, var(--accent) 6%, transparent), transparent 60%), var(--bg);background-attachment:fixed;min-height:100vh}.aliv-shell{min-height:100vh;color:var(--text);font-family:var(--font-sans);font-feature-settings:"ss01", "cv11", "tnum";-webkit-font-smoothing:antialiased;z-index:0;flex-direction:column;display:flex;position:relative}.glass{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);box-shadow:inset 0 1px 0 var(--glass-highlight), var(--shadow-md)}.glass-strong{background:var(--glass-bg-strong);-webkit-backdrop-filter:var(--glass-blur-strong);border:1px solid var(--glass-border);box-shadow:inset 0 1px 0 var(--glass-highlight), var(--shadow-lg)}.aliv-shell-header{justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-5);z-index:50;background:var(--glass-bg);height:60px;-webkit-backdrop-filter:var(--glass-blur);background-image:linear-gradient(var(--glass-bg), var(--glass-bg)), linear-gradient(90deg, transparent 0%, var(--border) 30%, var(--border) 70%, transparent 100%);box-shadow:inset 0 1px 0 var(--glass-highlight);background-origin:border-box;background-clip:padding-box,border-box;border-bottom:1px solid #0000;flex-shrink:0;display:flex;position:sticky;top:0}.aliv-shell-brand{align-items:center;gap:var(--space-3);display:flex}.aliv-brand-link{align-items:center;gap:var(--space-2);color:var(--accent);filter:drop-shadow(0 0 #0000);transition:filter var(--dur-base) var(--ease-out), color var(--dur-fast);text-decoration:none;display:flex}.aliv-brand-link:hover{color:var(--accent-hover);filter:drop-shadow(0 0 14px var(--accent-glow))}.aliv-wordmark{letter-spacing:-.02em;color:var(--text);font-size:1.05rem;font-weight:700}.aliv-brand-divider{color:var(--text-faint);-webkit-user-select:none;user-select:none;font-weight:300}.aliv-app-name{color:var(--text-muted);letter-spacing:-.005em;font-size:.95rem;font-weight:500}.aliv-shell-actions{align-items:center;gap:2px;display:flex}.aliv-shell-main{flex-direction:column;flex:1;min-height:0;display:flex}.aliv-shell-footer{border-top:1px solid var(--border-subtle);padding:var(--space-3) var(--space-5);color:var(--text-muted);background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);font-size:.85rem}.aliv-btn{justify-content:center;align-items:center;gap:var(--space-2);height:36px;padding:0 var(--space-4);border-radius:var(--radius);font:inherit;letter-spacing:-.005em;cursor:pointer;transition:background var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-spring), box-shadow var(--dur-base) var(--ease-out);white-space:nowrap;border:1px solid #0000;font-size:.9rem;font-weight:500;display:inline-flex}.aliv-btn:active:not(:disabled){transform:scale(.97)}.aliv-btn:disabled{opacity:.4;cursor:not-allowed}.aliv-btn:focus-visible{outline:2px solid var(--accent-ring);outline-offset:2px}.aliv-btn-primary{background:linear-gradient(180deg, var(--accent-hover), var(--accent));color:#0a0b10;box-shadow:inset 0 1px 0 #ffffff40, 0 1px 2px #0006, 0 0 0 0 var(--accent-glow)}.aliv-btn-primary:hover:not(:disabled){box-shadow:inset 0 1px 0 #ffffff40, 0 4px 16px var(--accent-glow), 0 1px 2px #0006}.aliv-btn-secondary{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);color:var(--text);border-color:var(--glass-border);box-shadow:inset 0 1px 0 var(--glass-highlight)}.aliv-btn-secondary:hover:not(:disabled){background:var(--surface-elevated);border-color:var(--border)}.aliv-btn-ghost{color:var(--text-muted);background:0 0}.aliv-btn-ghost:hover:not(:disabled){background:var(--surface-elevated);color:var(--text)}.aliv-icon-btn{width:36px;height:36px;color:var(--text-muted);border-radius:var(--radius);cursor:pointer;transition:background var(--dur-fast) var(--ease-out), color var(--dur-fast), transform var(--dur-fast) var(--ease-spring);background:0 0;border:1px solid #0000;justify-content:center;align-items:center;display:inline-flex}.aliv-icon-btn:hover{background:var(--surface-elevated);color:var(--text)}.aliv-icon-btn:active{transform:scale(.92)}.aliv-icon-btn:focus-visible{outline:2px solid var(--accent-ring);outline-offset:2px}.aliv-icon-btn svg{stroke-width:1.75px;width:18px;height:18px}.aliv-drawer-root,.aliv-modal-root,.aliv-popover-root{z-index:100;position:fixed;inset:0}.aliv-drawer-backdrop,.aliv-modal-backdrop,.aliv-popover-backdrop{-webkit-backdrop-filter:blur(6px);animation:aliv-fade-in var(--dur-base) var(--ease-out);background:#0000008c;position:absolute;inset:0}@keyframes aliv-fade-in{0%{opacity:0}to{opacity:1}}.aliv-drawer{background:var(--glass-bg-strong);width:min(420px,100vw);-webkit-backdrop-filter:var(--glass-blur-strong);border-left:1px solid var(--glass-border);padding:var(--space-6);animation:aliv-drawer-in var(--dur-slow) var(--ease-out);box-shadow:var(--shadow-xl);position:absolute;top:0;bottom:0;overflow-y:auto}.aliv-drawer-right{right:0}.aliv-drawer-left{border-left:none;border-right:1px solid var(--glass-border);left:0}@keyframes aliv-drawer-in{0%{opacity:0;transform:translate(40px)}to{opacity:1;transform:translate(0)}}.aliv-modal{background:var(--glass-bg-strong);-webkit-backdrop-filter:var(--glass-blur-strong);border:1px solid var(--glass-border);border-radius:var(--radius-xl);padding:var(--space-6);min-width:360px;max-width:90vw;max-height:80vh;box-shadow:inset 0 1px 0 var(--glass-highlight), var(--shadow-xl);animation:aliv-modal-in var(--dur-slow) var(--ease-spring);position:absolute;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%)}@keyframes aliv-modal-in{0%{opacity:0;transform:translate(-50%,-48%)scale(.96)}to{opacity:1;transform:translate(-50%,-50%)scale(1)}}.aliv-shortcuts-modal h2{margin:0 0 var(--space-5) 0;letter-spacing:-.01em;font-size:1.15rem;font-weight:600}.aliv-shortcuts-list{margin:0;padding:0;list-style:none}.aliv-shortcuts-list li{padding:var(--space-3) 0;border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;display:flex}.aliv-shortcuts-list li:last-child{border-bottom:none}.aliv-shortcuts-list kbd{font-family:var(--font-mono);padding:3px var(--space-2);background:var(--surface-elevated);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);letter-spacing:0;font-feature-settings:"tnum";border-bottom-width:2px;font-size:.78rem}.aliv-shortcuts-list span{color:var(--text-muted)}.aliv-app-switcher{right:var(--space-4);background:var(--glass-bg-strong);-webkit-backdrop-filter:var(--glass-blur-strong);border:1px solid var(--glass-border);border-radius:var(--radius-xl);padding:var(--space-5);min-width:380px;max-width:90vw;box-shadow:inset 0 1px 0 var(--glass-highlight), var(--shadow-xl);animation:aliv-popover-in var(--dur-base) var(--ease-spring);position:absolute;top:68px}@keyframes aliv-popover-in{0%{opacity:0;transform:translateY(-8px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.aliv-app-switcher h3{margin:0 0 var(--space-4) 0;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);font-size:.78rem;font-weight:600}.aliv-app-grid{gap:var(--space-2);grid-template-columns:repeat(3,1fr);display:grid}@media (width<=480px){.aliv-app-grid{grid-template-columns:repeat(2,1fr)}.aliv-app-switcher{right:var(--space-2);left:var(--space-2);min-width:0}}.aliv-app-tile{align-items:center;gap:var(--space-2);padding:var(--space-4) var(--space-3);border-radius:var(--radius-lg);color:inherit;transition:background var(--dur-fast) var(--ease-out), border-color var(--dur-fast), transform var(--dur-fast) var(--ease-spring), box-shadow var(--dur-base);border:1px solid #0000;flex-direction:column;text-decoration:none;display:flex;position:relative}.aliv-app-tile:hover{background:var(--surface-elevated);box-shadow:0 0 0 1px var(--glass-border), 0 8px 24px #0000004d;transform:translateY(-2px)}.aliv-app-tile.is-current{box-shadow:0 0 24px var(--accent-glow);border-color:currentColor}.aliv-app-tile.is-coming-soon{opacity:.5;cursor:not-allowed}.aliv-app-tile.is-coming-soon:hover{box-shadow:none;transform:none}.aliv-app-tile-name{color:var(--text);font-size:.9rem;font-weight:600}.aliv-app-tile-tagline{color:var(--text-faint);text-align:center;font-size:.72rem;line-height:1.25}.aliv-app-tile-badge{top:var(--space-2);right:var(--space-2);background:var(--surface-elevated);color:var(--text-muted);border-radius:var(--radius-sm);text-transform:uppercase;letter-spacing:.06em;padding:2px 6px;font-size:.6rem;font-weight:600;position:absolute}@media (width<=600px){.aliv-shell-header{padding:var(--space-2) var(--space-3);height:56px}.aliv-brand-divider,.aliv-app-name{display:none}}.aliv-surface{border-radius:var(--radius-lg)}.aliv-surface-glass{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);box-shadow:inset 0 1px 0 var(--glass-highlight), var(--shadow-md)}.aliv-surface-panel{background:var(--surface);border:1px solid var(--border)}.aliv-surface-elevated{background:var(--surface-elevated);border:1px solid var(--border);box-shadow:var(--shadow-lg)}.aliv-slider{gap:var(--space-2);flex-direction:column;display:flex}.aliv-slider-label{justify-content:space-between;align-items:baseline;gap:var(--space-2);display:flex}.aliv-slider-label label{color:var(--text);font-size:.85rem}.aliv-slider-value{font-family:var(--font-mono);color:var(--text-muted);font-feature-settings:"tnum";font-size:.78rem}.aliv-slider-track{align-items:center;height:28px;display:flex;position:relative}.aliv-slider-track:before{content:"";background:linear-gradient(90deg, var(--accent) 0%, var(--accent) var(--aliv-slider-pct), var(--border) var(--aliv-slider-pct), var(--border) 100%);pointer-events:none;border-radius:999px;position:absolute;inset:12px 0}.aliv-slider-input{appearance:none;z-index:1;cursor:pointer;background:0 0;width:100%;height:28px;margin:0;position:relative}.aliv-slider-input::-webkit-slider-thumb{appearance:none;border:1px solid var(--accent);width:18px;height:18px;box-shadow:0 0 0 0 var(--accent-ring), 0 1px 4px #0006;cursor:grab;transition:box-shadow var(--dur-base) var(--ease-out), transform var(--dur-fast) var(--ease-spring);background:#fff;border-radius:50%}.aliv-slider-input::-moz-range-thumb{border:1px solid var(--accent);width:18px;height:18px;box-shadow:0 0 0 0 var(--accent-ring), 0 1px 4px #0006;cursor:grab;transition:box-shadow var(--dur-base) var(--ease-out), transform var(--dur-fast) var(--ease-spring);background:#fff;border-radius:50%}.aliv-slider-input:hover::-webkit-slider-thumb{box-shadow:0 0 0 6px var(--accent-soft), 0 1px 4px #0006}.aliv-slider-input:hover::-moz-range-thumb{box-shadow:0 0 0 6px var(--accent-soft), 0 1px 4px #0006}.aliv-slider-input:active::-webkit-slider-thumb{cursor:grabbing;box-shadow:0 0 0 8px var(--accent-ring), 0 1px 4px #0006;transform:scale(1.15)}.aliv-slider-input:active::-moz-range-thumb{cursor:grabbing;box-shadow:0 0 0 8px var(--accent-ring), 0 1px 4px #0006;transform:scale(1.15)}.aliv-slider-input:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 6px var(--accent-ring), 0 1px 4px #0006;outline:none}.aliv-slider-input:focus{outline:none}.aliv-seg{background:var(--bg);border:1px solid var(--border-subtle);border-radius:var(--radius);gap:2px;padding:3px;display:inline-flex;position:relative}.aliv-seg-full{width:100%;display:flex}.aliv-seg-indicator{background:var(--surface-elevated);border-radius:calc(var(--radius) - 3px);height:calc(100% - 6px);box-shadow:inset 0 1px 0 var(--glass-highlight), 0 1px 2px #0000004d;transition:transform var(--dur-base) var(--ease-out), width var(--dur-base) var(--ease-out);z-index:0;pointer-events:none;position:absolute;top:3px;left:0}.aliv-seg button{z-index:1;padding:var(--space-2) var(--space-3);color:var(--text-muted);cursor:pointer;border-radius:calc(var(--radius) - 3px);font:inherit;transition:color var(--dur-fast) var(--ease-out);justify-content:center;align-items:center;gap:var(--space-1);white-space:nowrap;background:0 0;border:none;flex:1;font-size:.85rem;font-weight:500;display:inline-flex;position:relative}.aliv-seg button.is-active,.aliv-seg button:hover:not(.is-active):not(:disabled){color:var(--text)}.aliv-seg button:disabled{opacity:.4;cursor:not-allowed}.aliv-seg button:focus-visible{outline:2px solid var(--accent-ring);outline-offset:2px}.aliv-seg-sm button{padding:var(--space-1) var(--space-2);font-size:.78rem}.aliv-seg button svg{stroke-width:2px;width:14px;height:14px}.aliv-banner{align-items:flex-start;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius);border:1px solid var(--glass-border);background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);box-shadow:inset 0 1px 0 var(--glass-highlight), var(--shadow-sm);color:var(--text);animation:aliv-banner-in var(--dur-slow) var(--ease-spring);font-size:.875rem;display:flex}.aliv-banner-icon{stroke-width:1.75px;flex-shrink:0;width:18px;height:18px;margin-top:1px}.aliv-banner-body{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.aliv-banner-body strong{letter-spacing:-.005em;font-size:.85rem;font-weight:600}.aliv-banner-body span{color:var(--text-muted)}.aliv-banner-action{flex-shrink:0}.aliv-banner-info{color:var(--text)}.aliv-banner-info .aliv-banner-icon{color:var(--accent)}.aliv-banner-success .aliv-banner-icon{color:var(--success)}.aliv-banner-warn .aliv-banner-icon{color:var(--warning)}.aliv-banner-warn{background:color-mix(in oklab, var(--warning) 6%, var(--glass-bg));border-color:color-mix(in oklab, var(--warning) 30%, var(--glass-border))}.aliv-banner-fail .aliv-banner-icon{color:var(--danger)}.aliv-banner-fail{background:color-mix(in oklab, var(--danger) 6%, var(--glass-bg));border-color:color-mix(in oklab, var(--danger) 30%, var(--glass-border))}@keyframes aliv-banner-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{overscroll-behavior:none}:root{--bg:#0c0d12;--surface:#14161e;--surface-2:#1a1d28;--border:#232736;--border-hover:#2f3447;--text:#a0a6b6;--text-h:#e8eaf0;--text-muted:#565c6e;--accent:#7c8cf5;--accent-hover:#9aa4f8;--accent-glow:#7c8cf526;--accent-bg:#7c8cf51f;--error:#f87171;--error-bg:#f871711a;--success:#4ade80;--warning:#fbbf24;--warning-bg:#fbbf241a;--json-color:#fbbf24;--xml-color:#7c8cf5;--editor-bg:#0e1018;--gutter-bg:#12141c;--gutter-text:#3a3f50;--active-line:#151821;--selection:#253055;--shadow:0 2px 8px #0000004d;--shadow-lg:0 8px 32px #00000080;--radius:8px;--radius-sm:6px;--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"Fira Code", "Cascadia Code", "JetBrains Mono", Consolas, monospace;font-family:var(--font-sans);color:var(--text);background:var(--bg);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:root[data-theme=light]{--bg:#f0f1f5;--surface:#fff;--surface-2:#f6f7f9;--border:#dcdfe5;--border-hover:#c5c9d2;--text:#3a3f4a;--text-h:#1a1d23;--text-muted:#8b919d;--accent:#5b6cf0;--accent-hover:#4a5ad8;--accent-glow:#5b6cf01a;--accent-bg:#5b6cf014;--error:#e5484d;--error-bg:#e5484d14;--success:#30a46c;--warning:#e5a00d;--warning-bg:#e5a00d14;--json-color:#d97706;--xml-color:#5b6cf0;--editor-bg:#fff;--gutter-bg:#f6f7f9;--gutter-text:#bcc0c8;--active-line:#f3f5f8;--selection:#d0d8f8;--shadow:0 2px 8px #0000000f;--shadow-lg:0 8px 32px #0000001a;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:light){:root:not([data-theme=dark]){--bg:#f0f1f5;--surface:#fff;--surface-2:#f6f7f9;--border:#dcdfe5;--border-hover:#c5c9d2;--text:#3a3f4a;--text-h:#1a1d23;--text-muted:#8b919d;--accent:#5b6cf0;--accent-hover:#4a5ad8;--accent-glow:#5b6cf01a;--accent-bg:#5b6cf014;--error:#e5484d;--error-bg:#e5484d14;--success:#30a46c;--warning:#e5a00d;--warning-bg:#e5a00d14;--json-color:#d97706;--xml-color:#5b6cf0;--editor-bg:#fff;--gutter-bg:#f6f7f9;--gutter-text:#bcc0c8;--active-line:#f3f5f8;--selection:#d0d8f8;--shadow:0 2px 8px #0000000f;--shadow-lg:0 8px 32px #0000001a;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}}html,body,#root{width:100%;height:100%}body{margin:0}.app-body{background:var(--bg);flex-direction:column;flex:1;min-height:0;display:flex;overflow:hidden}.toolbar{background:var(--surface-2);border-bottom:1px solid var(--border);flex-direction:column;flex-shrink:0;display:flex}.toolbar-row{align-items:center;gap:12px;height:44px;padding:0 16px;display:flex}.toolbar-row:first-child{border-bottom:1px solid var(--border)}.toolbar-left{flex:1;align-items:center;gap:14px;display:flex}.toolbar-brand{color:var(--text-h);letter-spacing:-.3px;white-space:nowrap;align-items:center;gap:8px;font-size:15px;font-weight:700;display:flex}.brand-icon{flex-shrink:0}.direction-toggle{background:var(--bg);border-radius:var(--radius-sm);gap:2px;padding:3px;display:flex;position:relative}.direction-btn{color:var(--text-muted);cursor:pointer;white-space:nowrap;font-size:13px;font-weight:500;font-family:var(--font-sans);z-index:1;background:0 0;border:none;border-radius:4px;padding:5px 14px;transition:color .15s;position:relative}.direction-btn:hover{color:var(--text)}.direction-btn.active{background:var(--surface-2);color:var(--accent);box-shadow:0 1px 4px #0003}.toolbar-right{align-items:center;gap:6px;display:flex}.toolbar-actions{flex:1;align-items:center;gap:6px;display:flex}.toolbar-actions-right{align-items:center;gap:6px;margin-left:auto;display:flex}.btn{border-radius:var(--radius-sm);height:32px;font-size:13px;font-weight:500;font-family:var(--font-sans);cursor:pointer;white-space:nowrap;border:1px solid #0000;justify-content:center;align-items:center;gap:6px;padding:0 12px;transition:all .15s;display:inline-flex;position:relative}.btn:active{transform:translateY(0)}.btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.btn:disabled{opacity:.35;cursor:not-allowed;pointer-events:none}.btn-primary{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.btn-primary:hover{background:var(--accent-hover);border-color:var(--accent-hover);transform:translateY(-1px)}.btn-secondary{color:var(--text);border-color:var(--border);background:0 0}.btn-secondary:hover{background:var(--surface-2);border-color:var(--border-hover);transform:translateY(-1px)}.btn-ghost{color:var(--text-muted);background:0 0;border:none;padding:0 8px}.btn-ghost:hover{background:var(--surface-2);color:var(--text)}.btn-icon{width:32px;padding:0 6px}.btn-icon-sm{border-radius:4px;width:26px;height:26px;min-height:26px;padding:0 4px}.btn svg{flex-shrink:0}.btn-copied{color:var(--success)!important;border-color:var(--success)!important}kbd{font-size:10px;font-family:var(--font-sans);background:var(--bg);color:var(--text-muted);border:1px solid var(--border);border-radius:3px;margin-left:4px;padding:1px 4px;display:none}.btn:hover kbd{display:inline}.btn-format-badge{background:var(--surface);color:var(--text-muted);letter-spacing:.3px;border-radius:3px;padding:1px 4px;font-size:9px;font-weight:700}.editor-container{flex:1;min-height:0;display:flex;position:relative;overflow:hidden}.panel{flex-direction:column;flex:1;min-width:0;display:flex;overflow:hidden}.panel-output{background:var(--surface)}.panel-output .panel-header{background:var(--surface-2)}.readonly-badge{text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);background:var(--surface-2);border-radius:3px;padding:2px 6px;font-size:9px;font-weight:600}.panel{position:relative}.panel-header{background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;height:36px;padding:0 16px;display:flex}.panel-label{text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted);align-items:center;gap:8px;font-size:11px;font-weight:700;display:flex}.panel-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px}.panel-dot.json{background:var(--json-color)}.panel-dot.xml{background:var(--xml-color)}.panel-dot.unknown{background:var(--text-muted)}.panel-dot.error{background:var(--error)}.panel-format{letter-spacing:.5px;border-radius:10px;padding:2px 8px;font-size:10px;font-weight:700}.panel-format.json{color:var(--json-color);background:var(--warning-bg)}.panel-format.xml{color:var(--xml-color);background:var(--accent-bg)}.panel-actions{align-items:center;gap:4px;display:flex}.editor-panel{flex:1;overflow:hidden}.editor-panel .cm-editor{height:100%}.center-divider{background:var(--border);cursor:col-resize;flex-shrink:0;justify-content:center;align-items:center;width:5px;transition:background .15s;display:flex;position:relative}.center-divider:hover{background:var(--accent)}.swap-btn{z-index:10;border:1px solid var(--border);background:var(--surface-2);width:30px;height:30px;color:var(--text-muted);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;transition:all .2s;display:flex;position:absolute}.swap-btn:hover{border-color:var(--accent);color:var(--accent);background:var(--surface);transform:rotate(180deg)}.status-bar{background:var(--surface);border-top:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;height:28px;min-height:28px;padding:0 16px;font-size:11px;display:flex}.status-left{align-items:center;min-width:0;display:flex;overflow:hidden}.status-error{color:var(--error);white-space:nowrap;text-overflow:ellipsis;align-items:center;gap:5px;display:flex;overflow:hidden}.error-location{color:var(--text-muted)}.status-ok{color:var(--success)}.status-right{align-items:center;gap:10px;display:flex}.format-badge{letter-spacing:.3px;border-radius:3px;padding:1px 6px;font-size:10px;font-weight:700}.format-badge.json{color:var(--json-color);background:var(--warning-bg)}.format-badge.xml{color:var(--xml-color);background:var(--accent-bg)}.format-badge.unknown{color:var(--text-muted);background:var(--surface-2)}.size-badge,.timing-badge{color:var(--text-muted)}.settings-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;opacity:0;pointer-events:none;background:#00000080;transition:opacity .2s;position:fixed;inset:0}.settings-overlay.visible{opacity:1;pointer-events:auto}.settings-drawer{background:var(--surface);border-left:1px solid var(--border);z-index:101;width:360px;max-width:90vw;box-shadow:var(--shadow-lg);flex-direction:column;transition:transform .25s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;top:0;bottom:0;right:0;transform:translate(100%)}.settings-drawer.open{transform:translate(0)}.settings-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.settings-header h2{color:var(--text-h);margin:0;font-size:16px;font-weight:600}.close-btn{border-radius:var(--radius-sm);width:30px;height:30px;color:var(--text-muted);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;transition:all .15s;display:flex}.close-btn:hover{background:var(--surface-2);color:var(--text)}.settings-body{flex:1;padding:16px 20px;overflow-y:auto}.settings-body fieldset{border:none;margin-bottom:28px}.settings-body fieldset+fieldset{border-top:1px solid var(--border);padding-top:20px}.settings-body legend{text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted);margin-bottom:14px;font-size:11px;font-weight:700}.setting-row{color:var(--text);cursor:pointer;justify-content:space-between;align-items:flex-start;gap:12px;padding:10px 0;font-size:13px;display:flex}.setting-info{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.setting-label{color:var(--text-h);font-weight:500}.setting-hint{color:var(--text-muted);font-size:11px;line-height:1.4}.toggle-track{flex-shrink:0;width:36px;height:20px;margin-top:1px;position:relative}.toggle-track input{opacity:0;width:0;height:0;position:absolute}.toggle-slider{background:var(--border);cursor:pointer;border-radius:10px;transition:background .2s;position:absolute;inset:0}.toggle-slider:after{content:"";background:#fff;border-radius:50%;width:16px;height:16px;transition:transform .2s;position:absolute;top:2px;left:2px}.toggle-track input:checked+.toggle-slider{background:var(--accent)}.toggle-track input:checked+.toggle-slider:after{transform:translate(16px)}.toggle-track input:focus-visible+.toggle-slider{outline:2px solid var(--accent);outline-offset:2px}.toggle-disabled{opacity:.4;pointer-events:none}.setting-row-disabled .setting-label{opacity:.5}.setting-row-disabled .setting-hint{opacity:.7;color:var(--text-muted)}.setting-row select,.setting-input-small{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-2);color:var(--text-h);font-size:13px;font-family:var(--font-sans);cursor:pointer;flex-shrink:0;padding:5px 10px;transition:border-color .15s}.setting-row select:focus,.setting-input-small:focus{border-color:var(--accent);outline:none}.setting-input-small{width:64px;font-family:var(--font-mono);text-align:center}.toast{background:var(--surface-2);color:var(--success);z-index:200;box-shadow:var(--shadow-lg);border:1px solid var(--border);border-radius:20px;padding:8px 20px;font-size:13px;font-weight:500;animation:.2s ease-out toast-in,.2s ease-in 1.2s forwards toast-out;position:fixed;bottom:48px;left:50%;transform:translate(-50%)}@keyframes toast-in{0%{opacity:0;transform:translate(-50%)translateY(8px)}to{opacity:1;transform:translate(-50%)translateY(0)}}@keyframes toast-out{0%{opacity:1;transform:translate(-50%)translateY(0)}to{opacity:0;transform:translate(-50%)translateY(8px)}}@keyframes output-flash{0%{background:var(--accent-glow)}to{background:0 0}}.panel-output .editor-panel{position:relative}.output-flash:after{content:"";pointer-events:none;animation:.3s ease-out output-flash;position:absolute;inset:0}.error-banner{background:var(--error-bg);border-left:3px solid var(--error);color:var(--error);flex-shrink:0;align-items:center;gap:8px;padding:8px 12px;font-size:12px;display:flex}.error-banner-icon{flex-shrink:0}.error-banner-msg{flex:1;line-height:1.4}.error-banner-loc{color:var(--text-muted);white-space:nowrap;font-size:11px}.error-banner-close{color:var(--error);cursor:pointer;opacity:.6;background:0 0;border:none;justify-content:center;align-items:center;padding:2px;transition:opacity .15s;display:flex}.error-banner-close:hover{opacity:1}.empty-state{z-index:5;pointer-events:none;flex-direction:column;justify-content:center;align-items:center;gap:10px;display:flex;position:absolute;inset:0}.empty-state>*{pointer-events:auto}.empty-state-icon{color:var(--text-muted);opacity:.3}.empty-state-title{color:var(--text-h);font-size:15px;font-weight:600}.empty-state-hint{color:var(--text-muted);font-size:13px}.empty-state-actions{gap:8px;margin-top:4px;display:flex}.status-pending{color:var(--text-muted);align-items:center;gap:6px;display:flex}.pending-dot{background:var(--accent);border-radius:50%;width:6px;height:6px;animation:.8s ease-in-out infinite alternate pulse}@keyframes pulse{0%{opacity:.3}to{opacity:1}}@keyframes swap-flash{0%{opacity:1}40%{opacity:.3}to{opacity:1}}.panel-swapping .editor-panel{animation:.3s swap-flash}:root.theme-transitioning,:root.theme-transitioning *,:root.theme-transitioning :before,:root.theme-transitioning :after{transition:background-color .3s,color .3s,border-color .3s,box-shadow .3s!important}.shortcuts-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:200;background:#00000080;position:fixed;inset:0}.shortcuts-modal{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);z-index:201;min-width:320px;max-width:90vw;box-shadow:var(--shadow-lg);padding:24px;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.shortcuts-modal h3{color:var(--text-h);margin-bottom:16px;font-size:15px;font-weight:600}.shortcuts-modal table{border-collapse:collapse;width:100%}.shortcuts-modal tr+tr td{padding-top:8px}.shortcuts-modal td{vertical-align:middle}.shortcut-key{font-size:11px;font-family:var(--font-mono);background:var(--surface-2);color:var(--text-h);border:1px solid var(--border);white-space:nowrap;border-radius:4px;padding:3px 8px;display:inline-block!important}.shortcut-action{color:var(--text);padding-left:16px;font-size:13px}.shortcuts-close{width:100%;margin-top:16px}.settings-footer{border-top:1px solid var(--border);text-align:center;margin-top:8px;padding:16px 0}.settings-reset-btn{width:100%;color:var(--text-muted)!important;font-size:12px!important}.settings-reset-btn:hover{color:var(--error)!important}.settings-about{color:var(--text-muted);font-size:12px;line-height:1.6}.settings-about p+p{margin-top:6px}.settings-about strong{color:var(--text-h)}.mobile-tabs{background:var(--surface);border-bottom:1px solid var(--border);display:none;position:relative}.mobile-tab{color:var(--text-muted);font-size:13px;font-weight:600;font-family:var(--font-sans);cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;flex:1;padding:10px;transition:all .15s}.mobile-tab.active{color:var(--accent);border-bottom-color:var(--accent)}.mobile-file-btn,.mobile-swap-btn{width:44px;height:44px;color:var(--text-muted);cursor:pointer;background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;transition:color .15s;display:none}.mobile-file-btn:hover,.mobile-swap-btn:hover{color:var(--accent)}@media (width<=768px){.app-body{padding-top:env(safe-area-inset-top)}.status-bar{padding-bottom:env(safe-area-inset-bottom)}.toolbar-row:first-child{padding-left:max(12px, env(safe-area-inset-left));padding-right:max(12px, env(safe-area-inset-right))}.mobile-tabs{align-items:center;display:flex}.mobile-file-btn,.mobile-swap-btn{display:flex}.toolbar-row{gap:6px;height:44px;padding:0 10px}.toolbar-brand>span{display:none}.toolbar-brand{gap:0}.direction-btn{padding:6px 10px;font-size:12px}.toolbar-row:last-child{-webkit-overflow-scrolling:touch;scrollbar-width:none;overflow-x:auto;-webkit-mask-image:linear-gradient(90deg,#000 88%,#0000);mask-image:linear-gradient(90deg,#000 88%,#0000)}.toolbar-row:last-child::-webkit-scrollbar{display:none}.btn{min-width:44px;height:44px;padding:0 10px}.btn-icon{width:44px}.btn span:not(.btn-icon-only),.btn-format-badge{display:none}kbd{display:none!important}.error-banner{display:none}.empty-state-icon{width:36px;height:36px}.empty-state-title{font-size:14px}.empty-state-hint{font-size:12px}.editor-container{flex-direction:column;position:relative;overflow:hidden}.panel{will-change:transform;flex:none;width:100%;height:100%;transition:transform .25s,opacity .25s;position:absolute;inset:0;display:flex!important}.panel.mobile-visible{opacity:1;z-index:1;transform:translate(0)}.panel.mobile-hidden-left{opacity:0;pointer-events:none;z-index:0;transform:translate(-30%)}.panel.mobile-hidden-right{opacity:0;pointer-events:none;z-index:0;transform:translate(30%)}.panel+.panel{border-left:none}.center-divider,.panel-header{display:none}.cm-editor{font-size:16px!important}.cm-gutters{display:none!important}.cm-content{padding:8px 0}.cm-line{padding:0 10px}.cm-placeholder{font-size:14px}.settings-drawer{border-left:none;width:100%;max-width:100%}.settings-header{padding-top:calc(16px + env(safe-area-inset-top))}.settings-body{-webkit-overflow-scrolling:touch;padding:16px}.close-btn{width:44px;height:44px}.toggle-track{width:44px;height:24px}.toggle-slider{border-radius:12px}.toggle-slider:after{width:20px;height:20px}.toggle-track input:checked+.toggle-slider:after{transform:translate(20px)}.setting-row{padding:14px 0}.setting-row select{height:40px;font-size:14px}.status-bar{height:auto;min-height:32px;padding:6px 12px;padding-bottom:calc(6px + env(safe-area-inset-bottom));flex-wrap:wrap;gap:4px;font-size:12px}.status-error{white-space:normal;-webkit-line-clamp:2;cursor:pointer;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.status-error.expanded{-webkit-line-clamp:unset;flex-wrap:wrap;display:flex}.toast{bottom:calc(44px + env(safe-area-inset-bottom))}.mobile-tab{padding:14px 10px;font-size:14px}}@media (width>=769px) and (width<=1024px){.toolbar-row{padding:0 12px}kbd{display:none!important}}@media (width<=768px) and (orientation:landscape){.toolbar-row{height:36px}.btn{min-width:36px;height:36px}.mobile-tabs,.mobile-file-btn,.mobile-swap-btn{display:none}.status-bar{min-height:24px;padding:4px 12px;font-size:10px}.editor-container{flex-direction:row}.panel{flex:1;width:auto;height:auto;transition:none;opacity:1!important;pointer-events:auto!important;z-index:auto!important;display:flex!important;position:static!important;transform:none!important}.center-divider{width:3px;display:flex}}