:root{--background:#f6f7f9;--foreground:#172033;--muted:#647084;--line:#d8dee8;--panel:#fff;--accent:#2563eb;--accent-strong:#1d4ed8;--danger:#b42318}*{box-sizing:border-box}html,body{min-height:100%}body{background:var(--background);color:var(--foreground);margin:0;font-family:Arial,Microsoft YaHei,PingFang SC,sans-serif}button,input,textarea{font:inherit}.shell{place-items:center;min-height:100vh;padding:32px 18px;display:grid}.appShell{grid-template-columns:280px minmax(0,1fr);min-height:100vh;display:grid}.sidebar{border-right:1px solid var(--line);background:#fff;height:100vh;padding:28px 18px;position:sticky;top:0}.brand{padding:0 8px 24px}.brand h1{margin:0;font-size:30px;line-height:1.1}.toolNav{gap:26px;display:grid}.toolGroup{gap:10px;display:grid}.toolGroup h2{color:var(--muted);letter-spacing:0;margin:0;padding:0 8px;font-size:13px}.toolList{gap:8px;display:grid}.toolTab{width:100%;color:var(--foreground);text-align:left;background:0 0;border:1px solid #0000;gap:5px;padding:12px 14px;display:grid}.toolTab:hover:not(:disabled){border-color:var(--line);color:var(--foreground);background:#f8fafc}.toolTab[aria-current=page]{color:var(--accent-strong);background:#eff5ff;border-color:#bfd1ff}.toolTab span{font-weight:700}.toolTab small{color:var(--muted);font-size:13px}.contentPane{align-items:start;padding:44px;display:grid}.toolPage{border:1px solid var(--line);background:var(--panel);border-radius:8px;width:min(860px,100%);padding:32px;box-shadow:0 20px 50px #17203314}.heading{margin-bottom:28px}.eyebrow{color:var(--accent);text-transform:uppercase;margin:0 0 8px;font-size:13px;font-weight:700}h1{margin:0;font-size:clamp(28px,5vw,42px);line-height:1.1}h2{margin:0;font-size:clamp(26px,4vw,38px);line-height:1.12}.intro{max-width:600px;color:var(--muted);margin:14px 0 0;line-height:1.7}.form{gap:16px;display:grid}.field{gap:10px;display:grid}label{font-weight:700}.inputRow{gap:10px;display:flex}.optionsGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;display:grid}input,textarea{border:1px solid var(--line);width:100%;color:var(--foreground);background:#fff;border-radius:8px}input{min-width:0;padding:13px 14px}textarea{resize:vertical;padding:14px;line-height:1.6}button{background:var(--accent);color:#fff;cursor:pointer;border:0;border-radius:8px;font-weight:700}button:hover:not(:disabled){background:var(--accent-strong)}button:disabled{cursor:not-allowed;opacity:.55}.inputRow button{flex:0 0 104px}.message{margin:16px 0 0;line-height:1.6}.error{color:var(--danger)}.warning{color:#9a5b00}.checkbox{color:var(--muted);align-items:center;gap:10px;font-weight:400;display:flex}.checkbox input{width:18px;height:18px;accent-color:var(--accent)}.result{gap:12px;margin-top:24px;display:grid}.meta{flex-wrap:wrap;gap:8px;display:flex}.meta span{border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:6px 10px;font-size:13px}.copyButton{justify-self:start;padding:11px 16px}@media (max-width:640px){.appShell{grid-template-columns:1fr}.sidebar{z-index:1;border-right:0;border-bottom:1px solid var(--line);height:auto;padding:18px;position:static}.brand{padding:0 0 18px}.brand h1{font-size:26px}.toolNav{gap:18px}.toolList{grid-auto-columns:minmax(180px,1fr);grid-auto-flow:column;padding-bottom:2px;overflow-x:auto}.contentPane{padding:18px}.toolPage{padding:22px}.inputRow{flex-direction:column}.optionsGrid{grid-template-columns:1fr}.inputRow button{flex-basis:auto;padding:13px 14px}}
