:root{--color-bg: #f5f5f7;--color-bg-elevated: #ffffff;--color-surface: #fbfbfd;--color-border: #d2d2d7;--color-border-subtle: #e8e8ed;--color-text: #1d1d1f;--color-muted: #6e6e73;--color-muted-soft: #86868b;--color-accent: #0a84ff;--color-accent-soft: #eef6ff;--color-success: #2e7d32;--color-warning: #c2410c;--color-danger: #d70015;--button-gradient: linear-gradient(135deg, #0a84ff, #0d9488);color:var(--color-text);background:var(--color-bg);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}:root.dark{--color-bg: #0b0b0f;--color-bg-elevated: #1d1d1f;--color-surface: #17171a;--color-border: #2d2d30;--color-border-subtle: #343438;--color-text: #f5f5f7;--color-muted: #a1a1a6;--color-muted-soft: #86868b;--color-accent: #64d2ff;--color-accent-soft: #063f75;--color-success: #30d158;--color-warning: #ff9f0a;--color-danger: #ff453a;--button-gradient: linear-gradient(135deg, #0a84ff, #14b8a6);color:var(--color-text);background:linear-gradient(180deg,#000000 0%,var(--color-bg-elevated) 100%)}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0;background:inherit}a{color:inherit;text-decoration:none}button{font:inherit}.navbar{position:sticky;top:0;z-index:10;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;min-height:64px;padding:0 24px;border-bottom:1px solid var(--color-border);background:color-mix(in srgb,var(--color-bg) 88%,transparent);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.dark .navbar{border-bottom-color:var(--color-border);background:color-mix(in srgb,#000000 78%,transparent)}.brand{display:inline-flex;align-items:center;gap:10px;width:fit-content;font-weight:700}.brand-mark{display:grid;width:32px;height:32px;place-items:center;border-radius:8px;color:var(--color-bg-elevated);background:linear-gradient(135deg,#8e8e93,var(--color-muted))}.nav-links{display:inline-flex;align-items:center;gap:6px;padding:4px;border:1px solid var(--color-border);border-radius:8px;background:var(--color-bg-elevated)}.dark .nav-links{border-color:var(--color-border);background:var(--color-text)}.nav-links a{min-width:96px;padding:8px 12px;border-radius:6px;color:var(--color-muted);text-align:center}.nav-links a[aria-current=page]{color:var(--color-text);background:var(--color-bg)}.dark .nav-links a{color:var(--color-muted)}.dark .nav-links a[aria-current=page]{color:var(--color-bg);background:var(--color-border)}.icon-button{justify-self:end;display:inline-grid;width:36px;height:36px;place-items:center;border:1px solid var(--color-border);border-radius:6px;color:inherit;background:var(--color-bg-elevated);cursor:pointer}.dark .icon-button{border-color:var(--color-border);background:var(--color-text)}.app-shell{width:min(1120px,calc(100% - 32px));margin:0 auto;padding:48px 0}.workspace{padding:32px;border:1px solid var(--color-border);border-radius:8px;background:var(--color-bg-elevated)}.dark .workspace{border-color:var(--color-border);background:var(--color-text)}.eyebrow{margin:0 0 8px;color:var(--color-muted-soft);font-size:.875rem;font-weight:700}h1{margin:0;font-size:2.25rem;letter-spacing:0}.lead{max-width:560px;margin:12px 0 0;color:var(--color-muted-soft);line-height:1.7}.changelog-list{display:grid;gap:16px;padding:0;margin:28px 0 0;list-style:none}.changelog-entry{display:grid;gap:12px;padding:20px;border:1px solid var(--color-border);border-radius:8px;background:var(--color-surface)}.changelog-entry-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.changelog-entry h2{margin:4px 0 0;font-size:1.125rem;letter-spacing:0}.changelog-meta{display:flex;flex-wrap:wrap;gap:8px;margin:0;color:var(--color-muted);font-size:.8125rem;font-weight:700}.changelog-badge{flex:0 0 auto;padding:4px 8px;border:1px solid var(--color-accent);border-radius:999px;color:var(--color-accent);background:var(--color-accent-soft);font-size:.8125rem;font-weight:700}.changelog-summary{margin:0;color:var(--color-muted-soft);line-height:1.7}.changelog-changes{display:grid;gap:8px;padding-left:20px;margin:0;color:var(--color-text);line-height:1.6}@media (max-width: 720px){.navbar{grid-template-columns:1fr auto;padding:10px 16px}.nav-links{grid-column:1 / -1;width:100%}.nav-links a{flex:1;min-width:0}}.file-workflow{display:grid;gap:16px;margin-top:28px}.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:0;margin:24px 0 0;list-style:none}.steps li{display:flex;align-items:center;gap:8px;min-width:0;padding:10px 12px;border:1px solid var(--color-border);border-radius:8px;color:var(--color-muted);font-size:.875rem;white-space:nowrap}.steps li span{display:inline-grid;flex:0 0 24px;width:24px;height:24px;place-items:center;border-radius:999px;background:var(--color-border-subtle);color:var(--color-text);font-size:.75rem;font-weight:700}.steps li.active{border-color:var(--color-accent);color:var(--color-text);background:var(--color-accent-soft)}.steps li.active span{color:var(--color-bg-elevated);background:var(--color-accent)}.drop-zone-shell{display:grid}.drop-zone{display:flex;align-items:center;justify-content:center;gap:10px;min-height:112px;border:1px dashed var(--color-muted-soft);border-radius:8px;color:var(--color-text);background:var(--color-surface);cursor:pointer}.drop-zone:disabled{color:var(--color-muted-soft);cursor:wait}.drop-zone-input{display:none}.tool-panel{padding:20px;border:1px solid var(--color-border);border-radius:8px;background:var(--color-surface)}.panel-header,.download-bar,.download-actions{display:flex;align-items:center}.panel-header,.download-bar{justify-content:space-between;gap:16px}.panel-header h2{margin:0;font-size:1rem;letter-spacing:0}.selection-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px}.selection-toolbar select{min-height:30px;padding:0 8px}.custom-n-input{width:88px;min-height:30px;padding:0 8px}button,input,select{min-height:36px;border:1px solid var(--color-border);border-radius:6px;color:inherit;background:var(--color-bg-elevated)}button{padding:0 14px;font-weight:700;cursor:pointer}button:not(:disabled):hover{border-color:var(--color-accent);color:var(--color-accent)}button:disabled{color:var(--color-muted-soft);cursor:not-allowed;background:var(--color-bg)}.secondary-button,.text-button{color:var(--color-muted);background:transparent}.text-button{justify-self:start;min-height:30px;padding:0 10px;font-size:.8125rem}.rule-list{display:grid;gap:12px;margin-top:16px}.rule-grid{display:grid;grid-template-columns:repeat(3,minmax(160px,1fr));gap:12px;padding:16px;border:1px solid var(--color-border-subtle);border-radius:8px}.rule-grid legend{padding:0 6px;font-weight:700}.rule-grid label{display:grid;gap:6px;color:var(--color-muted);font-size:.8125rem}.rule-grid input,.rule-grid select,.table-wrap input{width:100%;padding:0 10px}.checkbox-row{display:inline-flex!important;align-items:center;gap:8px;align-self:end}.checkbox-row input,.select-col input{width:16px;min-height:16px}.table-wrap{overflow-x:auto;margin-top:16px}table{width:100%;border-collapse:collapse;table-layout:fixed}th,td{padding:10px 8px;border-bottom:1px solid var(--color-border-subtle);text-align:left;vertical-align:top}th{color:var(--color-muted);font-size:.8125rem;font-weight:700}.select-col{width:64px}.size-col{width:96px;color:var(--color-muted)}.path-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.conflict{background:#fff4f2}.error-text{display:block;margin-top:6px;color:var(--color-danger);font-size:.8125rem}.muted{color:var(--color-muted-soft)}.download-bar{position:sticky;bottom:16px;padding:14px 16px;border:1px solid var(--color-border);border-radius:8px;background:color-mix(in srgb,var(--color-bg-elevated) 92%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.download-actions{gap:8px}.dark .steps li,.dark .tool-panel,.dark .changelog-entry,.dark .download-bar,.dark button,.dark input,.dark select,.dark .rule-grid,.dark th,.dark td{border-color:var(--color-border)}.dark .steps li,.dark .tool-panel,.dark .changelog-entry,.dark .drop-zone,.dark button,.dark input,.dark select,.dark .download-bar{background:var(--color-text)}.dark .steps li.active{color:var(--color-bg);background:#063f75}.dark .drop-zone,.dark .path-cell{color:var(--color-bg)}.dark button:disabled{background:var(--color-border)}.dark .conflict{background:#3a1714}@media (max-width: 720px){.app-shell{width:min(100% - 20px,1120px);padding:24px 0}.workspace{padding:20px}.steps{grid-template-columns:repeat(2,minmax(0,1fr))}.rule-grid{grid-template-columns:1fr}.panel-header,.download-bar{align-items:stretch;flex-direction:column}.download-actions{width:100%}.download-actions button{flex:1}}.convert-layout{display:grid;grid-template-columns:minmax(280px,360px) minmax(0,1fr);gap:16px;align-items:start;margin-top:28px}.convert-input-panel,.convert-result-panel{min-width:0}.textarea-field{display:grid;gap:8px;margin-top:16px;color:var(--color-muted);font-size:.875rem}.textarea-field textarea{width:100%;min-height:220px;padding:12px;border:1px solid var(--color-border);border-radius:6px;color:inherit;background:var(--color-bg-elevated);font:inherit;line-height:1.6;resize:vertical}.style-options{padding:14px 0 0;margin:16px 0 0;border:0;border-top:1px solid var(--color-border-subtle)}.style-options legend{padding:0 0 10px;color:var(--color-muted);font-size:.875rem;font-weight:700}.style-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.result-list{display:grid;gap:18px;margin-top:16px}.result-line{display:grid;gap:10px}.result-source,.result-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.result-source{padding-bottom:8px;border-bottom:1px solid var(--color-border-subtle);font-weight:700}.result-grid{display:grid;gap:8px}.result-row{min-height:48px}.result-row>div{display:grid;gap:4px;min-width:0}.result-style{color:var(--color-muted);font-size:.8125rem}.result-row code{overflow:hidden;color:var(--color-text);font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;text-overflow:ellipsis;white-space:nowrap}.copy-status{min-height:24px;margin:12px 0 0;color:var(--color-success);font-size:.875rem}.dark .textarea-field textarea{border-color:var(--color-border);background:var(--color-text)}.dark .style-options,.dark .result-source{border-color:var(--color-border)}.dark .result-row code{color:var(--color-bg)}.dark .copy-status{color:var(--color-success)}@media (max-width: 860px){.convert-layout{grid-template-columns:1fr}}@media (max-width: 520px){.style-grid{grid-template-columns:1fr}.changelog-entry-header{flex-direction:column}.result-row{align-items:stretch;flex-direction:column}}:focus-visible{outline:3px solid var(--color-accent);outline-offset:2px}@media (prefers-reduced-motion: reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media (max-width: 520px){.table-wrap table{min-width:720px}.workspace h1{font-size:1.75rem}}button,input,select,textarea,a{transition:border-color .18s ease,background-color .18s ease,color .18s ease}.download-actions button:last-child:not(:disabled),.convert-result-panel .panel-header button:not(:disabled){border-color:transparent;color:#fff;background:var(--button-gradient)}.download-actions button:last-child:not(:disabled):hover,.convert-result-panel .panel-header button:not(:disabled):hover{color:#fff;filter:brightness(1.03)}
