.page-wrapper{min-height:100vh;padding-top:var(--header-h);flex-direction:column;display:flex}.header{height:var(--header-h);padding:0 var(--sp-lg);background:color-mix(in srgb, var(--bg) 80%, transparent);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--rule);z-index:var(--z-sticky);justify-content:space-between;align-items:center;display:flex;position:fixed;top:0;left:0;right:0}.header-left{align-items:center;gap:var(--sp-md);min-width:0;display:flex}.header-logo{align-items:center;gap:var(--sp-sm);color:var(--ink);font-weight:700;font-size:var(--fs-lg);text-decoration:none;display:flex}.header-logo-icon{border-radius:var(--radius);background:var(--accent);justify-content:center;align-items:center;width:32px;height:32px;display:flex}.header-logo-icon svg{width:18px;height:18px;stroke:var(--accent-ink)}.header-search{width:320px;margin-left:var(--sp-xl);position:relative}.header-search-input{width:100%;padding:var(--sp-sm) var(--sp-md) var(--sp-sm) var(--sp-2xl);font-family:var(--display);font-size:var(--fs-sm);color:var(--ink);background:var(--bg-card);border:1px solid var(--rule);border-radius:var(--radius);transition:all var(--dur-fast);outline:none}.header-search-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 10%, transparent);background:var(--bg-2)}.header-search-input::placeholder{color:var(--ink-3)}.header-search-icon{width:16px;height:16px;color:var(--ink-3);pointer-events:none;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.header-search-kbd{padding:2px var(--sp-xs);font-size:var(--fs-xs);font-family:var(--display);color:var(--ink-3);background:var(--bg-2);border:1px solid var(--rule);pointer-events:none;border-radius:4px;position:absolute;top:50%;right:10px;transform:translateY(-50%)}.header-right{align-items:center;gap:var(--sp-md);justify-content:flex-end;min-width:0;max-width:100%;display:flex}.header-nav-link{align-items:center;gap:var(--sp-xs);padding:var(--sp-sm) var(--sp-md);border-radius:var(--radius);border:1px solid color-mix(in srgb, var(--ink) 12%, transparent);background:color-mix(in srgb, var(--ink) 3%, transparent);color:var(--ink-2);font-size:var(--fs-sm);transition:all var(--dur-fast);font-weight:600;text-decoration:none;display:inline-flex}.header-nav-link:hover{color:var(--ink);border-color:color-mix(in srgb, var(--accent) 35%, transparent);background:color-mix(in srgb, var(--accent) 8%, transparent)}.header-nav-link.active{color:var(--warn-text);border-color:color-mix(in srgb, var(--accent) 45%, transparent);background:color-mix(in srgb, var(--accent) 12%, transparent)}.header-nav-link-feature{border:1px solid color-mix(in srgb, var(--good) 35%, transparent);background:color-mix(in srgb, var(--good) 12%, transparent);color:var(--good-text)}.header-nav-link-feature:hover{background:color-mix(in srgb, var(--good) 20%, transparent);border-color:color-mix(in srgb, var(--good) 60%, transparent);color:color-mix(in srgb, var(--good-text) 55%, white)}.header-nav-link-feature.active{color:var(--good-text);border-color:color-mix(in srgb, var(--good) 60%, transparent);background:color-mix(in srgb, var(--good) 18%, transparent);box-shadow:0 0 0 2px color-mix(in srgb, var(--good) 25%, transparent)}.header-menu-btn{padding:var(--sp-sm);color:var(--ink);cursor:pointer;background:0 0;border:none;display:none}.sidebar{top:var(--header-h);width:var(--sidebar-w);height:calc(100vh - var(--header-h));background:var(--bg);border-right:1px solid var(--rule);padding:var(--sp-md) 0;z-index:var(--z-dropdown);transition:transform var(--dur-base), left var(--dur-base), visibility var(--dur-base);position:fixed;left:0;overflow-y:auto}.sidebar-section{margin-bottom:var(--sp-sm)}.sidebar-section-title{padding:var(--sp-sm) var(--sp-lg);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--ink-3);font-weight:600}.sidebar-link{align-items:center;gap:var(--sp-sm);padding:var(--sp-sm) var(--sp-lg);font-size:var(--fs-sm);color:var(--ink-2);transition:all var(--dur-fast);border-left:2px solid #0000;text-decoration:none;display:flex}.sidebar-link:hover{color:var(--ink);background:var(--bg-card)}.sidebar-link.active{color:var(--accent-text);background:color-mix(in srgb, var(--accent) 5%, transparent);border-left-color:var(--accent)}.sidebar-link-feature{color:var(--good-text)}.sidebar-link-feature:hover{background:color-mix(in srgb, var(--good) 8%, transparent)}.sidebar-link-feature.active{color:var(--good-text);background:color-mix(in srgb, var(--good) 12%, transparent);border-left-color:var(--good)}.sidebar-link-feature-tag{color:var(--good-text);background:color-mix(in srgb, var(--good) 14%, transparent);border:1px solid color-mix(in srgb, var(--good) 35%, transparent);padding:3px var(--sp-xs);border-radius:var(--radius-pill);text-transform:uppercase;letter-spacing:.04em;margin-left:auto;font-size:10px;font-weight:700;line-height:1}.sidebar-link svg{flex-shrink:0;width:16px;height:16px}.sidebar-link-count{font-size:var(--fs-xs);color:var(--ink-3);background:var(--bg-2);padding:1px var(--sp-xs);border-radius:var(--radius-pill);margin-left:auto}.sidebar-search{display:none}.sidebar-search-box{align-items:center;gap:var(--sp-sm);margin:var(--sp-sm) var(--sp-lg) var(--sp-xs);padding:var(--sp-sm);background:var(--bg-card);border:1px solid var(--rule);border-radius:var(--radius);display:flex}.sidebar-search-box svg{width:16px;height:16px;color:var(--ink-3);flex-shrink:0}.sidebar-search-box:focus-within{border-color:var(--accent)}.sidebar-search-input{min-width:0;color:var(--ink);font-size:var(--fs-sm);background:0 0;border:none;outline:none;flex:1}.sidebar-search-input::placeholder{color:var(--ink-3)}.sidebar-search-results{margin:0 var(--sp-sm) var(--sp-sm);max-height:50vh;overflow-y:auto}.sidebar-search-result{align-items:center;gap:var(--sp-sm);padding:var(--sp-sm);border-radius:var(--radius);color:var(--ink-2);font-size:var(--fs-sm);text-decoration:none;display:flex}.sidebar-search-result:active{background:var(--bg-card);color:var(--accent-text)}.sidebar-search-result-icon{color:var(--ink-3);flex-shrink:0;display:flex}.sidebar-search-result-icon svg{width:16px;height:16px}.sidebar-search-result-label{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.sidebar-search-result-category{font-size:var(--fs-xs);color:var(--ink-3);flex-shrink:0}.sidebar-search-empty{padding:var(--sp-md) var(--sp-sm);text-align:center;color:var(--ink-3);font-size:var(--fs-sm)}.main-content{margin-left:var(--sidebar-w);padding:var(--sp-xl);flex:1;min-width:0;max-width:100%}.main-content-full{margin-left:0}.footer{margin-left:var(--sidebar-w);padding:var(--sp-2xl) var(--sp-xl);border-top:1px solid var(--rule);color:var(--ink-3);font-size:var(--fs-sm)}.footer-inner{max-width:var(--maxw);justify-content:space-between;align-items:center;gap:var(--sp-md);flex-wrap:wrap;margin:0 auto;display:flex}.footer-links{gap:var(--sp-lg);flex-wrap:wrap;min-width:0;max-width:100%;display:flex}.footer-contact{font-size:var(--fs-sm);color:var(--ink-3)}.footer-contact a{color:var(--ink-2);text-decoration:underline;-webkit-text-decoration-color:color-mix(in srgb, var(--ink) 10%, transparent);text-decoration-color:color-mix(in srgb, var(--ink) 10%, transparent);text-underline-offset:4px;transition:all var(--dur-fast);font-weight:500}.footer-contact a:hover{color:var(--accent-text);-webkit-text-decoration-color:var(--accent);text-decoration-color:var(--accent)}.footer-links a{color:var(--ink-3);transition:color var(--dur-fast)}.footer-links a:hover{color:var(--ink-2)}.breadcrumbs{align-items:center;gap:var(--sp-sm);font-size:var(--fs-sm);color:var(--ink-3);margin-bottom:var(--sp-lg);display:flex}.breadcrumbs a{color:var(--ink-2)}.breadcrumbs a:hover{color:var(--accent-text)}.breadcrumbs-separator{color:var(--ink-3);font-size:var(--fs-xs)}.search-results{background:var(--bg-card);border:1px solid var(--rule);border-radius:var(--radius);max-height:400px;box-shadow:var(--shadow);z-index:var(--z-dropdown);display:none;position:absolute;top:calc(100% + 8px);left:0;right:0;overflow-y:auto}.search-results.visible{animation:slideDown var(--dur-fast) ease;display:block}.search-result-item{align-items:center;gap:var(--sp-sm);padding:var(--sp-sm) var(--sp-md);font-size:var(--fs-sm);color:var(--ink);cursor:pointer;transition:background var(--dur-fast);text-decoration:none;display:flex}.search-result-item:hover,.search-result-item.highlighted{background:var(--bg-2)}.search-result-category{font-size:var(--fs-xs);color:var(--ink-3);margin-left:auto}.search-result-group{padding:var(--sp-sm) var(--sp-md) var(--sp-xs);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--ink-3);font-weight:600}.search-result-group:first-child{padding-top:var(--sp-md)}@media (width<=1500px){.header{padding:0 var(--sp-md)}.header-right{gap:var(--sp-sm)}.header-nav-link{padding:var(--sp-sm)}.header-dropzone-hint{display:none}}@media (width<=1024px){.header-search{width:240px}}@media (width<=860px){.header-search{display:none}.sidebar-search{display:block}.header-right .header-nav-link,.header-right .header-dropzone-wrapper{display:none}.header-menu-btn{display:flex}.sidebar{left:calc(-1 * var(--sidebar-w) - 2px);visibility:hidden;pointer-events:none;display:none;transform:none}.sidebar.open{visibility:visible;pointer-events:auto;display:block;left:0}.main-content{padding:var(--sp-md);margin-left:0}.footer{padding:var(--sp-lg) var(--sp-md);margin-left:0}}@media (width<=480px){.header{padding:0 var(--sp-md)}.footer-links{gap:var(--sp-sm) var(--sp-md)}}.tool-page{width:100%;max-width:960px;min-height:1px}.tool-header{margin-bottom:var(--sp-xl)}.tool-title{font-size:var(--fs-3xl);margin-bottom:var(--sp-sm);font-weight:800;line-height:1.2}.tool-description{font-size:var(--fs-base);color:var(--ink-2);max-width:640px;line-height:1.6}.tool-privacy-note{align-items:center;gap:var(--sp-sm);margin-top:var(--sp-md);font-family:var(--mono);font-size:var(--fs-xs);color:var(--ink-3);letter-spacing:.01em;display:inline-flex}.tool-privacy-dot{border-radius:var(--radius-pill);background:var(--good);width:7px;height:7px;box-shadow:0 0 8px color-mix(in oklab, var(--good), transparent 40%);flex-shrink:0}.tool-body{gap:var(--sp-lg);flex-direction:column;display:flex}.tool-panels{gap:var(--sp-lg);grid-template-columns:1fr 1fr;display:grid}.tool-actions{align-items:center;gap:var(--sp-sm);flex-wrap:wrap;display:flex}.tool-options{gap:var(--sp-md);padding:var(--sp-md);background:var(--bg-card);border:1px solid var(--rule);border-radius:var(--radius);flex-wrap:wrap;display:flex}.tool-option{align-items:center;gap:var(--sp-sm);display:flex}.tool-option label{font-size:var(--fs-sm);color:var(--ink-2);white-space:nowrap}.tool-option .select,.tool-option .input{width:auto;min-width:120px}.tool-stats{gap:var(--sp-md);grid-template-columns:repeat(auto-fit,minmax(150px,1fr));display:grid}.tool-stat{padding:var(--sp-md) var(--sp-lg);background:var(--bg-card);border:1px solid var(--rule);border-radius:var(--radius);flex-direction:column;align-items:center;min-width:120px;display:flex}.tool-stat-value{font-size:var(--fs-2xl);color:var(--ink);font-variant-numeric:tabular-nums;font-weight:700}.tool-stat-label{font-size:var(--fs-xs);color:var(--ink-3);text-transform:uppercase;letter-spacing:.05em;margin-top:var(--sp-xs)}.tool-panel-full{grid-column:1/-1}.related-tools{margin-top:var(--sp-3xl)}.related-tools-title{font-size:var(--fs-lg);margin-bottom:var(--sp-md);font-weight:700}.related-tools-grid{gap:var(--sp-md);grid-template-columns:repeat(auto-fill,minmax(260px,1fr));display:grid}.workflow-links{margin-top:var(--sp-xl)}.workflow-links-grid{gap:var(--sp-md);grid-template-columns:repeat(auto-fill,minmax(260px,1fr));display:grid}.workflow-link-card{padding:var(--sp-lg);border:1px solid var(--rule);border-radius:var(--radius);color:var(--ink);background:var(--bg-card);transition:all var(--dur-base);text-decoration:none;display:block}.workflow-link-card:hover{border-color:var(--rule-2);box-shadow:var(--shadow);transform:translateY(-2px)}.workflow-link-title{font-size:var(--fs-base);margin-bottom:var(--sp-xs);font-weight:700}.workflow-link-desc{color:var(--ink-2);font-size:var(--fs-sm);line-height:1.55}.tool-info{margin-top:var(--sp-3xl);padding:var(--sp-xl);background:var(--bg-card);border:1px solid var(--rule);border-radius:var(--radius)}.tool-info h2{font-size:var(--fs-lg);margin-bottom:var(--sp-md);font-weight:700}.tool-info p{color:var(--ink-2);margin-bottom:var(--sp-md);line-height:1.7}.tool-info ul,.tool-info ol{color:var(--ink-2);padding-left:var(--sp-lg);margin-bottom:var(--sp-md)}.tool-info li{margin-bottom:var(--sp-sm)}.use-case-steps{color:var(--ink-2);padding-left:var(--sp-lg)}.use-case-steps li{margin-bottom:var(--sp-sm)}@media (width<=768px){.tool-panels{grid-template-columns:1fr}.tool-title{font-size:var(--fs-2xl)}.tool-stats{grid-template-columns:repeat(2,1fr);display:grid}}.actions-bar{align-items:center;gap:var(--sp-sm);padding:var(--sp-sm) 0;margin-bottom:var(--sp-md);border-bottom:1px solid var(--rule);flex-wrap:wrap;display:flex}.actions-bar-btn{padding:var(--sp-xs) var(--sp-md);font-size:var(--fs-sm);font-weight:500;font-family:var(--display);color:var(--ink-2);background:var(--bg-card);border:1px solid var(--rule);border-radius:var(--radius);cursor:pointer;transition:all var(--dur-fast);white-space:nowrap;align-items:center;gap:6px;display:inline-flex}.actions-bar-btn:hover{color:var(--ink);background:var(--bg-2);border-color:var(--rule-2)}.actions-bar-btn.active,.actions-bar-btn.favorited{color:var(--star);border-color:color-mix(in srgb, var(--star) 30%, transparent)}.actions-bar-btn.copied{color:var(--good-text);border-color:color-mix(in srgb, var(--good) 30%, transparent)}.actions-bar-btn:disabled{opacity:.4;cursor:not-allowed;pointer-events:none}.actions-bar-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.actions-bar-spacer{flex:1}.autosave-indicator{font-size:var(--fs-xs);font-family:var(--display);color:var(--ink-3);opacity:0;transition:opacity var(--dur-fast), color var(--dur-fast), transform var(--dur-fast);white-space:nowrap;margin-right:var(--sp-sm);align-items:center;gap:6px;display:inline-flex;transform:translateY(-2px)}.autosave-indicator.visible{opacity:1;transform:translateY(0)}.autosave-indicator:before{content:"";background:var(--ink-3);width:7px;height:7px;transition:background var(--dur-fast);border-radius:50%}.autosave-indicator.restored{color:var(--accent-ink,var(--accent))}.autosave-indicator.restored:before{background:var(--accent)}.autosave-indicator:not(.restored).visible:before{background:var(--good)}.keyboard-shortcuts-overlay{z-index:var(--z-modal);background:var(--scrim-strong);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);opacity:0;visibility:hidden;transition:opacity var(--dur-base), visibility var(--dur-base);justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.keyboard-shortcuts-overlay.visible{opacity:1;visibility:visible}.keyboard-shortcuts-modal{background:var(--bg-2);border:1px solid var(--rule);border-radius:var(--radius);width:90%;max-width:480px;max-height:80vh;box-shadow:var(--shadow);transition:transform var(--dur-base);overflow-y:auto;transform:scale(.95)}.keyboard-shortcuts-overlay.visible .keyboard-shortcuts-modal{transform:scale(1)}.keyboard-shortcuts-header{padding:var(--sp-lg) var(--sp-lg) var(--sp-md);border-bottom:1px solid var(--rule);justify-content:space-between;align-items:center;display:flex}.keyboard-shortcuts-title{align-items:center;gap:var(--sp-sm);font-size:var(--fs-lg);color:var(--ink);font-weight:600;display:flex}.keyboard-shortcuts-close{border:1px solid var(--rule);border-radius:var(--radius);width:32px;height:32px;color:var(--ink-2);cursor:pointer;transition:all var(--dur-fast);background:0 0;justify-content:center;align-items:center;display:flex}.keyboard-shortcuts-close:hover{color:var(--ink);background:var(--bg-2)}.keyboard-shortcuts-body{padding:var(--sp-md) var(--sp-lg) var(--sp-lg)}.keyboard-shortcuts-group{margin-bottom:var(--sp-lg)}.keyboard-shortcuts-group:last-child{margin-bottom:0}.keyboard-shortcuts-group-title{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--ink-3);margin-bottom:var(--sp-sm);font-weight:600}.keyboard-shortcut-row{padding:var(--sp-sm) 0;border-bottom:1px solid var(--rule);justify-content:space-between;align-items:center;display:flex}.keyboard-shortcut-row:last-child{border-bottom:none}.keyboard-shortcut-desc{font-size:var(--fs-sm);color:var(--ink)}.keyboard-shortcut-keys{align-items:center;gap:4px;display:flex}.keyboard-shortcut-keys kbd{min-width:28px;height:26px;padding:0 var(--sp-xs);font-family:var(--display);font-size:var(--fs-xs);color:var(--ink);background:var(--bg-card);border:1px solid var(--rule);border-radius:var(--radius);box-shadow:0 1px 0 var(--bg-2);justify-content:center;align-items:center;font-weight:600;display:inline-flex}.keyboard-shortcut-plus{font-size:var(--fs-xs);color:var(--ink-3)}.my-toolkit-section,.recent-tools-section{margin-bottom:var(--sp-xl)}.my-toolkit-section .section-header,.recent-tools-section .section-header{margin-bottom:var(--sp-md)}.my-toolkit-grid,.recent-tools-grid{gap:var(--sp-md);grid-template-columns:repeat(auto-fill,minmax(240px,1fr));display:grid}.sidebar-favorites{padding-bottom:var(--sp-sm);margin-bottom:var(--sp-sm);border-bottom:1px solid var(--rule)}.sidebar-favorites .sidebar-section-title{color:var(--star);align-items:center;gap:6px;display:flex}.install-banner{bottom:var(--sp-md);z-index:var(--z-toast);justify-content:space-between;align-items:center;gap:var(--sp-md);width:90%;max-width:480px;padding:var(--sp-sm) var(--sp-md);background:var(--bg-2);border:1px solid var(--rule);border-radius:var(--radius);box-shadow:var(--shadow);opacity:0;visibility:hidden;transition:all var(--dur-base) cubic-bezier(.34, 1.56, .64, 1);display:flex;position:fixed;left:50%;transform:translate(-50%)translateY(100px)}.install-banner.visible{opacity:1;visibility:visible;transform:translate(-50%)translateY(0)}.install-banner-content{align-items:center;gap:var(--sp-sm);display:flex}.install-banner-icon{background:var(--bg-card);border-radius:var(--radius);width:40px;height:40px;color:var(--accent-text);justify-content:center;align-items:center;display:flex}.install-banner-text{flex-direction:column;display:flex}.install-banner-text strong{font-size:var(--fs-sm);color:var(--ink);font-weight:600}.install-banner-text p{font-size:var(--fs-xs);color:var(--ink-3);margin:0}.install-banner-actions{align-items:center;gap:var(--sp-xs);display:flex}