
:root{--bg:#f7f7f3;--surface:#ffffff;--ink:#111312;--muted:#66706a;--line:#dde2de;--accent:#176b52;--accent2:#0f4e3d;--soft:#e7f2ed;--warn:#fff4d7;--radius:18px;--shadow:0 10px 30px rgba(18,35,28,.07)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--ink);line-height:1.55}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}.wrap{width:min(1120px,calc(100% - 32px));margin:auto}.site-header{position:sticky;top:0;z-index:50;background:rgba(247,247,243,.92);backdrop-filter:blur(12px);border-bottom:1px solid rgba(221,226,222,.8)}.nav{height:68px;display:flex;align-items:center;justify-content:space-between;gap:18px}.brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:-.02em}.brand-mark{width:34px;height:34px;border-radius:10px;background:var(--ink);color:#fff;display:grid;place-items:center;font-size:14px}.nav-links{display:flex;gap:18px;align-items:center;color:var(--muted);font-size:14px}.nav-links a:hover{color:var(--ink)}.hero{padding:72px 0 34px}.eyebrow{display:inline-flex;gap:8px;align-items:center;font-size:13px;font-weight:700;color:var(--accent);background:var(--soft);padding:7px 10px;border-radius:999px}.hero h1{font-size:clamp(42px,7vw,74px);line-height:.96;letter-spacing:-.055em;margin:20px 0 18px;max-width:850px}.hero p{font-size:19px;color:var(--muted);max-width:690px;margin:0}.hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}.btn{border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:11px 16px;border-radius:12px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px}.btn:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(20,35,30,.08)}.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn.primary:hover{background:var(--accent2)}.btn.small{padding:8px 11px;font-size:13px}.trust-row{margin-top:28px;display:flex;gap:16px;flex-wrap:wrap;color:var(--muted);font-size:13px}.trust-row span{display:flex;gap:7px;align-items:center}.section{padding:36px 0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:18px}.section-head h2{font-size:30px;letter-spacing:-.03em;margin:0}.section-head p{margin:0;color:var(--muted)}.search{width:100%;border:1px solid var(--line);background:var(--surface);padding:14px 16px;border-radius:14px;outline:none}.search:focus{border-color:#7aa797;box-shadow:0 0 0 4px rgba(23,107,82,.09)}.tool-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px}.tool-card{display:block;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px;min-height:176px;transition:.18s ease}.tool-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#c6d2cb}.tool-icon{width:42px;height:42px;border-radius:12px;background:var(--soft);color:var(--accent2);display:grid;place-items:center;font-weight:900;font-size:12px;margin-bottom:26px}.tool-card h3{margin:0 0 6px;font-size:17px;letter-spacing:-.015em}.tool-card p{margin:0;color:var(--muted);font-size:14px}.tag{display:inline-block;margin-top:12px;color:var(--muted);font-size:12px}.callout{background:var(--ink);color:#fff;border-radius:24px;padding:28px;display:grid;grid-template-columns:1.5fr .5fr;gap:30px;align-items:center}.callout p{color:#bdc7c1}.callout .btn{justify-self:end}.footer{margin-top:70px;border-top:1px solid var(--line);padding:34px 0 46px;color:var(--muted);font-size:13px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:28px}.footer h4{color:var(--ink);margin:0 0 10px}.footer a{display:block;margin:6px 0}.tool-page{padding:48px 0}.breadcrumb{font-size:13px;color:var(--muted);margin-bottom:18px}.tool-title{display:flex;gap:18px;align-items:flex-start}.tool-title .tool-icon{margin:4px 0 0;flex:0 0 auto}.tool-title h1{font-size:clamp(34px,5vw,52px);letter-spacing:-.045em;line-height:1;margin:0 0 12px}.tool-title p{color:var(--muted);font-size:17px;margin:0;max-width:720px}.workbench{margin-top:26px;background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:22px;box-shadow:var(--shadow)}.field{margin-bottom:14px}.field label{display:block;font-size:13px;font-weight:800;margin-bottom:6px}.field small{color:var(--muted)}textarea,input[type=text],input[type=number],input[type=date],input[type=file],select{width:100%;border:1px solid var(--line);border-radius:12px;padding:12px 13px;background:#fff;outline:none}textarea{min-height:180px;resize:vertical}textarea:focus,input:focus,select:focus{border-color:#7aa797;box-shadow:0 0 0 4px rgba(23,107,82,.08)}.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.row.three{grid-template-columns:repeat(3,1fr)}.actions{display:flex;gap:9px;flex-wrap:wrap;margin:12px 0}.result{background:#f5f7f5;border:1px solid var(--line);border-radius:14px;padding:15px;min-height:54px;white-space:pre-wrap;word-break:break-word}.metric-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.metric{border:1px solid var(--line);border-radius:13px;padding:12px;background:#fafbf9}.metric strong{display:block;font-size:21px}.metric span{font-size:12px;color:var(--muted)}.explain{display:grid;grid-template-columns:1.4fr .6fr;gap:24px;margin-top:34px}.article-card,.side-card{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:22px}.article-card h2{font-size:24px;letter-spacing:-.025em;margin-top:0}.article-card h3{margin-top:26px}.article-card p,.article-card li{color:#4f5b55}.side-card h3{margin-top:0}.privacy-chip{display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border-radius:999px;background:var(--soft);color:var(--accent2);font-size:12px;font-weight:800}.ad-slot{border:1px dashed #bac4be;border-radius:14px;min-height:90px;display:grid;place-items:center;color:#8a948f;font-size:12px;margin:22px 0;background:rgba(255,255,255,.35)}.notice{background:var(--warn);border:1px solid #ead799;border-radius:14px;padding:12px 14px;font-size:13px}.range-line{display:flex;align-items:center;gap:12px}.range-line input{flex:1}.preview-img{max-width:100%;max-height:360px;border-radius:12px;border:1px solid var(--line);display:block;margin-top:12px}.hidden{display:none!important}.guide-list{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.guide-card{border:1px solid var(--line);border-radius:18px;background:var(--surface);padding:20px}.guide-card h3{margin:0 0 8px}.guide-card p{color:var(--muted);font-size:14px}.pro-banner{background:linear-gradient(135deg,#123d31,#0d221b);color:#fff;border-radius:18px;padding:18px 20px;display:flex;justify-content:space-between;gap:16px;align-items:center;margin-top:16px}.pro-banner p{margin:4px 0 0;color:#c8d8d1;font-size:13px}.status{font-size:12px;color:var(--muted)}
@media(max-width:850px){.tool-grid,.guide-list{grid-template-columns:repeat(2,1fr)}.explain{grid-template-columns:1fr}.metric-grid{grid-template-columns:repeat(3,1fr)}.callout{grid-template-columns:1fr}.callout .btn{justify-self:start}.footer-grid{grid-template-columns:1fr 1fr}.nav-links a:nth-child(2){display:none}}
@media(max-width:560px){.tool-grid,.guide-list{grid-template-columns:1fr}.row,.row.three{grid-template-columns:1fr}.metric-grid{grid-template-columns:repeat(2,1fr)}.nav-links a:not(.btn){display:none}.hero{padding-top:48px}.footer-grid{grid-template-columns:1fr}.workbench{padding:16px}.tool-title{gap:12px}}
