:root{--primary: #2563eb;--primary-dark: #1d4ed8;--text: #1e293b;--text-light: #64748b;--bg: #ffffff;--bg-soft: #f8fafc;--border: #e2e8f0;--radius: 12px;--max-width: 1100px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;color:var(--text);background:var(--bg);line-height:1.7;-webkit-font-smoothing:antialiased}a{color:var(--primary);text-decoration:none;transition:color .2s}a:hover{color:var(--primary-dark)}img{max-width:100%;height:auto}nav{max-width:var(--max-width);margin:0 auto;padding:1rem 1.5rem;display:flex;align-items:center;gap:2rem;border-bottom:1px solid var(--border)}nav a:first-child{font-size:1.35rem;font-weight:700;color:var(--text);margin-right:auto}nav a:not(:first-child){font-size:.95rem;color:var(--text-light);font-weight:500}nav a:not(:first-child):hover{color:var(--primary)}main{max-width:var(--max-width);margin:0 auto;padding:0 1.5rem 3rem}section:first-of-type{text-align:center;padding:4rem 1rem 3rem}section:first-of-type h1{font-size:2.5rem;font-weight:800;line-height:1.2;margin-bottom:1rem;background:linear-gradient(135deg,var(--primary),#7c3aed);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}section:first-of-type p{font-size:1.15rem;color:var(--text-light);max-width:640px;margin:0 auto}section:not(:first-of-type){background:var(--bg-soft);border:1px solid var(--border);border-radius:var(--radius);padding:2rem;margin-bottom:1.5rem}section:not(:first-of-type) h2{font-size:1.4rem;font-weight:700;margin-bottom:.5rem}section:not(:first-of-type)>p{color:var(--text-light);margin-bottom:1.25rem;font-size:.95rem}main>section ul{list-style:none;display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.25rem}main>section ul li a{display:block;padding:.75rem 1rem;background:var(--bg);border:1px solid var(--border);border-radius:8px;font-weight:500;transition:all .2s}main>section ul li a:hover{border-color:var(--primary);box-shadow:0 2px 8px #2563eb1a;transform:translateY(-1px)}section>a:last-child{display:inline-block;font-weight:600;font-size:.9rem}article{max-width:720px;margin:2rem auto;padding:0 1rem}article h1{font-size:2rem;font-weight:800;line-height:1.3;margin-bottom:1.5rem}article h2{font-size:1.4rem;font-weight:700;margin:2rem 0 .75rem}article h3{font-size:1.15rem;font-weight:600;margin:1.5rem 0 .5rem}article p{margin-bottom:1rem}article ul,article ol{margin:0 0 1rem 1.5rem;list-style:disc}article ol{list-style:decimal}article li{margin-bottom:.4rem}article li a{display:inline;padding:0;background:none;border:none}article li a:hover{text-decoration:underline;box-shadow:none;transform:none}article blockquote{border-left:3px solid var(--primary);padding:.75rem 1.25rem;margin:1.5rem 0;background:var(--bg-soft);border-radius:0 8px 8px 0;color:var(--text-light)}article code{background:var(--bg-soft);padding:.15rem .4rem;border-radius:4px;font-size:.9em}footer{max-width:var(--max-width);margin:0 auto;padding:2rem 1.5rem;border-top:1px solid var(--border);text-align:center;color:var(--text-light);font-size:.85rem}@media(max-width:768px){nav{gap:1rem;flex-wrap:wrap}nav a:first-child{width:100%;text-align:center;margin-right:0}nav a:not(:first-child){font-size:.85rem}section:first-of-type h1{font-size:1.75rem}section:first-of-type{padding:2.5rem .5rem 2rem}section:not(:first-of-type){padding:1.5rem}article h1{font-size:1.5rem}}.tool-page{max-width:800px;margin:2rem auto;padding:0 1rem}.tool-box{background:var(--bg-soft);border:2px solid var(--primary);border-radius:var(--radius);padding:2rem;margin:1.5rem 0}.tool-box h2{font-size:1.3rem;margin-bottom:1rem;color:var(--primary)}.tool-box label{display:block;font-weight:600;margin:.75rem 0 .25rem;font-size:.95rem}.tool-box input,.tool-box select{width:100%;padding:.6rem .8rem;border:1px solid var(--border);border-radius:8px;font-size:1rem;margin-bottom:.5rem}.tool-box button{background:var(--primary);color:#fff;border:none;padding:.75rem 1.5rem;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;margin-top:1rem;transition:background .2s}.tool-box button:hover{background:var(--primary-dark)}.result-box{background:#f0fdf4;border:1px solid #86efac;border-radius:8px;padding:1.25rem;margin-top:1rem;font-size:1.1rem}.result-box strong{color:#16a34a}