:root{--color-bg-primary:#fff;--color-bg-secondary:#f8fafc;--color-bg-tertiary:#f1f5f9;--color-text-primary:#0f172a;--color-text-secondary:#475569;--color-border:#e2e8f0;--color-primary:#3b82f6;--color-primary-dark:#2563eb;--color-success:#22c55e;--color-error:#ef4444;--color-warning:#f59e0b;--theme-transition:background-color 0.3s ease,color 0.3s ease,border-color 0.3s ease,box-shadow 0.3s ease}[data-theme=dark]{--color-bg-primary:#0f172a;--color-bg-secondary:#1e293b;--color-bg-tertiary:#334155;--color-text-primary:#f1f5f9;--color-text-secondary:#94a3b8;--color-border:#475569;--color-primary:#60a5fa;--color-primary-dark:#3b82f6}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans KR,sans-serif;background-color:var(--color-bg-primary);color:var(--color-text-primary);line-height:1.6;min-height:100vh}.container,.footer,.header,.tool-btn,.tool-card,.tool-input,.tool-select,.tool-textarea,body,main{transition:var(--theme-transition)}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer;border:none;background:none}input,select,textarea{font-family:inherit;font-size:1rem}.skip-link{position:absolute;top:-100%;left:0;background:var(--color-primary);color:#fff;padding:.5rem 1rem;z-index:9999;transition:top .3s}.skip-link:focus{top:0}.container{max-width:1280px;margin:0 auto;padding:0 1rem}.header{position:-webkit-sticky;position:sticky;top:0;background:var(--color-bg-primary);border-bottom:1px solid var(--color-border);z-index:100;transition:background-color .3s}.header .container{justify-content:space-between;height:64px}.header .container,.logo{display:flex;align-items:center}.logo{gap:.5rem;font-weight:700;font-size:1.25rem}.logo-icon{font-size:1.5rem}.nav-menu{display:flex;list-style:none;gap:2rem}.nav-link{color:var(--color-text-secondary);font-weight:500;transition:color .2s}.nav-link:hover{color:var(--color-primary)}.nav-toggle{display:none;width:24px;height:24px;position:relative}.hamburger,.hamburger:after,.hamburger:before{width:24px;height:2px;background:var(--color-text-primary);position:absolute;transition:all .3s}.hamburger:after,.hamburger:before{content:""}.hamburger:before{top:-8px}.hamburger:after{top:8px}.hamburger{top:50%;transform:translateY(-50%)}.theme-toggle{padding:.5rem;border-radius:.5rem;transition:background-color .2s}.theme-toggle:hover{background:var(--color-bg-tertiary)}.theme-icon{font-size:1.25rem}@media (max-width:768px){.nav-toggle{display:block}.nav-menu{position:absolute;top:64px;left:0;right:0;background:var(--color-bg-primary);flex-direction:column;padding:1rem;gap:0;border-bottom:1px solid var(--color-border);display:none}.nav-menu.active{display:flex}.nav-menu li{padding:.75rem 0;border-bottom:1px solid var(--color-border)}.nav-menu li:last-child{border-bottom:none}}.hero{padding:4rem 0;text-align:center;background:linear-gradient(135deg,var(--color-bg-secondary),var(--color-bg-tertiary))}.hero h1{font-size:2.5rem;margin-bottom:1rem;line-height:1.2}.hero p{color:var(--color-text-secondary);font-size:1.125rem;max-width:600px;margin:0 auto}.search-container{max-width:600px;margin:2rem auto 0}.search-input{width:100%;padding:1rem 1.5rem;border:2px solid var(--color-border);border-radius:9999px;font-size:1rem;background:var(--color-bg-primary);color:var(--color-text-primary);transition:border-color .2s,box-shadow .2s}.search-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(59,130,246,.2)}.search-input::placeholder{color:var(--color-text-secondary)}.categories{padding:3rem 0}.section-title{font-size:1.5rem;margin-bottom:1.5rem;text-align:center}.category-filters{display:flex;justify-content:center;gap:.5rem;flex-wrap:wrap;margin-bottom:2rem}.category-btn{padding:.5rem 1.25rem;border-radius:9999px;font-weight:500;background:var(--color-bg-tertiary);color:var(--color-text-secondary);transition:all .2s;border:1px solid transparent}.category-btn:hover{background:var(--color-bg-secondary);border-color:var(--color-border)}.category-btn.active{background:var(--color-primary);color:#fff}.tools-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));grid-gap:1.5rem;gap:1.5rem}.tool-card{background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:1rem;padding:1.5rem;transition:transform .2s,box-shadow .2s,border-color .2s;display:flex;flex-direction:column}.tool-card:hover{transform:translateY(-4px);box-shadow:0 12px 24px rgba(0,0,0,.1);border-color:var(--color-primary)}.tool-icon{font-size:2.5rem;margin-bottom:1rem}.tool-title{font-size:1.125rem;font-weight:600;margin-bottom:.5rem}.tool-description{color:var(--color-text-secondary);font-size:.875rem;flex-grow:1}.tool-category-tag{display:inline-block;margin-top:1rem;padding:.25rem .75rem;background:var(--color-bg-tertiary);border-radius:9999px;font-size:.75rem;color:var(--color-text-secondary)}.tool-page{padding:2rem 0 4rem}.breadcrumb{margin-bottom:2rem;color:var(--color-text-secondary);font-size:.875rem}.breadcrumb a{color:var(--color-primary)}.breadcrumb a:hover{text-decoration:underline}.breadcrumb-separator{margin:0 .5rem}.tool-header{text-align:center;margin-bottom:2rem}.tool-header h1{font-size:2rem;margin-bottom:.5rem}.tool-header p{color:var(--color-text-secondary)}.tool-container{background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:1rem;padding:2rem}.tool-section{margin-bottom:1.5rem}.tool-section:last-child{margin-bottom:0}.tool-label{display:block;font-weight:600;margin-bottom:.5rem}.tool-input,.tool-select,.tool-textarea{width:100%;padding:.75rem 1rem;border:1px solid var(--color-border);border-radius:.5rem;background:var(--color-bg-primary);color:var(--color-text-primary);transition:border-color .2s}.tool-input:focus,.tool-select:focus,.tool-textarea:focus{outline:none;border-color:var(--color-primary)}.tool-textarea{min-height:150px;resize:vertical;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace}.tool-btn-group{display:flex;gap:.75rem;flex-wrap:wrap}.tool-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.5rem;background:var(--color-primary);color:#fff;border-radius:.5rem;font-weight:500;transition:background-color .2s}.tool-btn:hover{background:var(--color-primary-dark)}.tool-btn-secondary{background:var(--color-bg-tertiary);color:var(--color-text-primary)}.tool-btn-secondary:hover{background:var(--color-border)}.tool-info{margin-top:2rem;padding:1.5rem;background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:1rem}.tool-info h3{margin-bottom:1rem}.tool-info ul{padding-left:1.5rem;color:var(--color-text-secondary)}.tool-info li{margin-bottom:.5rem}.tool-info p{margin-top:1rem;color:var(--color-text-secondary)}.footer{background:var(--color-bg-secondary);border-top:1px solid var(--color-border);padding:2rem 0;margin-top:auto}.footer-bottom{text-align:center;color:var(--color-text-secondary);font-size:.875rem}.toast{position:fixed;bottom:2rem;right:2rem;padding:1rem 1.5rem;background:var(--color-text-primary);color:var(--color-bg-primary);border-radius:.5rem;box-shadow:0 4px 12px rgba(0,0,0,.15);z-index:1000;animation:slideIn .3s ease}.toast.success{background:var(--color-success);color:#fff}.toast.error{background:var(--color-error);color:#fff}@keyframes slideIn{0%{transform:translateX(100%);opacity:0}to{transform:translateX(0);opacity:1}}.no-results{text-align:center;padding:3rem;color:var(--color-text-secondary)}.no-results-icon{font-size:3rem;margin-bottom:1rem}@media (max-width:640px){.hero h1{font-size:1.75rem}.hero p{font-size:1rem}.tool-container{padding:1.5rem}.tool-btn-group{flex-direction:column}.tool-btn{width:100%}}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@media print{.footer,.header,.nav-toggle,.theme-toggle,.tool-btn{display:none!important}.tool-container{box-shadow:none;border:1px solid #ccc}}@media (forced-colors:active){.tool-btn,.tool-card{border:2px solid}}