body{margin:0;min-width:320px}:root{--color-bg: #f6f8fa;--color-surface: #ffffff;--color-border: #d0d7de;--color-text: #1f2328;--color-text-muted: #57606a;--color-accent: #0969da;--color-accent-hover: #0550ae;--color-success: #1a7f37;--color-error: #cf222e;--font-sans: "Inter", system-ui, -apple-system, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-6: 1.5rem;--space-8: 2rem;--space-12: 3rem;--space-16: 4rem;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--shadow-card: 0 1px 3px rgba(0, 0, 0, .4);--shadow-hover: 0 4px 12px rgba(124, 106, 247, .15);--transition-fast: .12s ease;--transition-base: .2s ease}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased}body{font-family:var(--font-sans);background-color:var(--color-bg);color:var(--color-text);line-height:1.6;min-height:100vh}a{color:var(--color-accent);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-accent-hover)}button{cursor:pointer;font-family:var(--font-sans);border:none;background:none}code,pre{font-family:var(--font-mono)}.dark{--color-bg: #0f0f0f;--color-surface: #1a1a1a;--color-border: #2a2a2a;--color-text: #e8e8e8;--color-text-muted: #9aa0a6;--color-accent: #7c6af7;--color-accent-hover: #9b8cf9;--color-success: #4ade80;--color-error: #f87171}.app{display:flex;flex-direction:column;min-height:100vh}.app-header{border-bottom:1px solid var(--color-border);padding:var(--space-6) var(--space-4)}.app-header__inner{max-width:900px;margin:0 auto}.app-header__top{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);flex-wrap:wrap;margin-bottom:var(--space-2)}.app-nav{display:flex;gap:var(--space-4);align-items:center}.app-nav__link{color:var(--color-text);font-size:var(--text-sm);text-decoration:none;padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);border:1px solid transparent}.app-nav__link:hover{border-color:var(--color-border);background:var(--color-surface)}.app-logo{display:flex;align-items:center;gap:var(--space-3);margin-bottom:0}.app-logo--btn{background:none;border:none;padding:0;cursor:pointer;text-align:left}.app-logo__icon{font-size:var(--text-2xl)}.app-logo__name{font-size:var(--text-xl);font-weight:700;color:var(--color-text);letter-spacing:-.02em}.app-tagline{font-size:var(--text-sm);color:var(--color-text-muted)}.app-main{flex:1;max-width:900px;margin:0 auto;width:100%;padding:var(--space-12) var(--space-4)}.tools-section__title{font-size:var(--text-lg);font-weight:600;margin-bottom:var(--space-1)}.tools-section__sub{font-size:var(--text-sm);color:var(--color-text-muted);margin-bottom:var(--space-6)}.tools-grid{display:grid;grid-template-columns:1fr;gap:var(--space-3)}@media(min-width:640px){.tools-grid{grid-template-columns:1fr 1fr}}.app-search{flex:1;min-width:0;max-width:280px;height:2rem;padding:0 var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);color:var(--color-text);font-size:var(--text-sm);font-family:inherit}.app-search::placeholder{color:var(--color-text-muted)}.app-search:focus{outline:none;border-color:var(--color-accent)}@media(max-width:640px){.app-search{order:100;flex:0 0 100%;max-width:100%}}.app-hamburger{display:none;background:none;border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);cursor:pointer;color:var(--color-text);font-size:var(--text-lg);line-height:1}.app-hamburger-wrap{position:relative}.app-mobile-menu{position:absolute;top:calc(100% + var(--space-2));right:0;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-2);display:flex;flex-direction:column;min-width:160px;z-index:100;box-shadow:0 4px 12px #0000001a}.app-mobile-menu__item{color:var(--color-text);text-decoration:none;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);font-size:var(--text-sm)}.app-mobile-menu__item:hover{background:var(--color-bg)}@media(max-width:640px){.app-nav{display:none}.app-hamburger{display:flex;align-items:center;justify-content:center}}@media(max-width:420px){.app-header{padding:var(--space-4) var(--space-3)}.app-header__top{gap:var(--space-3)}.app-nav{gap:var(--space-2)}.app-main{padding-top:var(--space-6);padding-bottom:var(--space-6)}}.app-footer{border-top:1px solid var(--color-border);padding:var(--space-6) var(--space-4);text-align:center;font-size:var(--text-sm);color:var(--color-text-muted)}.tool-card{display:flex;align-items:flex-start;gap:var(--space-4);padding:var(--space-4) var(--space-6);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);text-align:left;width:100%;transition:border-color var(--transition-base),box-shadow var(--transition-base);cursor:default}.tool-card--ready{cursor:pointer}.tool-card--ready:hover{border-color:var(--color-accent);box-shadow:var(--shadow-hover)}.tool-card__icon{font-size:var(--text-2xl);flex-shrink:0;line-height:1;margin-top:2px}.tool-card__body{flex:1;min-width:0}.tool-card__name{font-size:var(--text-base);font-weight:600;color:var(--color-text);margin-bottom:var(--space-1)}.tool-card__desc{font-size:var(--text-sm);color:var(--color-text-muted);line-height:1.5}.tool-card__badge{font-size:var(--text-xs);color:var(--color-text-muted);background:var(--color-border);padding:2px var(--space-2);border-radius:var(--radius-sm);white-space:nowrap;flex-shrink:0;align-self:center}.tool-card--ready .tool-card__badge{background:color-mix(in srgb,var(--color-accent) 20%,transparent);color:var(--color-accent-hover)}.tool-page{display:flex;flex-direction:column;gap:var(--space-8)}.tool-page__header{display:flex;flex-direction:column;gap:var(--space-2)}.tool-page__back{align-self:flex-start;font-size:var(--text-sm);color:var(--color-text-muted);cursor:pointer;background:none;border:none;padding:0;transition:color var(--transition-fast);margin-bottom:var(--space-2)}.tool-page__back:hover{color:var(--color-accent)}.tool-page__title-row{display:flex;align-items:center;gap:var(--space-3)}.tool-page__icon{font-size:var(--text-3xl);line-height:1}.tool-page__title{font-size:var(--text-2xl);font-weight:700;letter-spacing:-.02em}.tool-page__desc{font-size:var(--text-sm);color:var(--color-text-muted);margin-left:0}.tool-page__body{display:flex;flex-direction:column;gap:var(--space-6)}.tool-page__footer{display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap}.tool-page__hint{font-size:var(--text-xs);color:var(--color-text-muted);opacity:.7}.tool-page__reset{font-size:var(--text-xs);color:var(--color-text-muted);background:none;border:none;padding:0;cursor:pointer;text-decoration:underline;transition:color var(--transition-fast)}.tool-page__reset:hover{color:var(--color-error)}@media(max-width:420px){.tool-page{gap:var(--space-6)}.tool-page__title{font-size:var(--text-xl)}.tool-page__icon{font-size:var(--text-2xl)}}