*{box-sizing:border-box}html{scroll-behavior:smooth}
:root{--bg:#fff8ee;--ink:#2a1d15;--mute:#6e5d50;--card:#fff;--line:#ead9c3;--acc:#c8552b;--acc2:#a8431f;--soft:#fbe9d6;--hero:#f6dcc0}
@media(prefers-color-scheme:dark){:root{--bg:#1b1511;--ink:#f3e8da;--mute:#b9a793;--card:#261d17;--line:#3b2e24;--acc:#e8794d;--acc2:#f19468;--soft:#2f231a;--hero:#2c1f16}}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.65 system-ui,-apple-system,"Segoe UI",sans-serif}
.w{max-width:820px;margin:0 auto;padding:0 20px}
.top{border-bottom:1px solid var(--line)}.top .w{display:flex;align-items:center;justify-content:space-between;padding-top:14px;padding-bottom:14px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink);font:700 20px Georgia,serif}
nav a{color:var(--mute);text-decoration:none;font-size:15px;margin-left:18px}nav a:hover{color:var(--acc)}
.hero{background:var(--hero);padding:42px 0 70px}
h1{font:700 clamp(32px,6vw,48px)/1.1 Georgia,serif;margin:0 0 12px;letter-spacing:-.01em}
.hero p{font-size:19px;color:var(--mute);max-width:60ch;margin:0}
h2{font:700 26px Georgia,serif;margin:44px 0 12px}
p{max-width:68ch}main{padding-bottom:50px}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:24px;margin:-48px 0 28px;box-shadow:0 10px 30px rgba(120,60,20,.12)}
.row{display:flex;flex-wrap:wrap;gap:14px;align-items:end}
label{display:flex;flex-direction:column;font:600 13px system-ui;gap:6px;color:var(--mute);text-transform:uppercase;letter-spacing:.05em;flex:1;min-width:130px}
input,select{font:17px system-ui;padding:12px;border:1.5px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);width:100%}
input:focus,select:focus{border-color:var(--acc);outline:none}
button{font:600 15px system-ui;cursor:pointer}
#sw{flex:0 0 auto;width:46px;height:46px;border-radius:50%;border:1.5px solid var(--line);background:var(--soft);color:var(--acc);font-size:20px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.chips button{border:1px solid var(--line);background:var(--soft);color:var(--ink);padding:7px 14px;border-radius:99px}
.chips button:hover{border-color:var(--acc);color:var(--acc)}
.res{font:700 clamp(26px,5vw,36px)/1.2 Georgia,serif;color:var(--acc);margin-top:20px;padding-top:18px;border-top:1px dashed var(--line)}
table{border-collapse:collapse;width:100%;background:var(--card);border-radius:12px;overflow:hidden;border:1px solid var(--line)}
th{background:var(--acc);color:#fff;text-align:left;font-weight:600}td,th{padding:11px 14px}tr:nth-child(even) td{background:var(--soft)}
.grid{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px}
.grid a{display:block;padding:12px 14px;background:var(--card);border:1px solid var(--line);border-radius:10px;text-decoration:none;color:var(--ink);font-weight:500}
.grid a:hover{border-color:var(--acc);color:var(--acc)}
a{color:var(--acc2)}.ad{min-height:90px;margin:20px 0}
footer{background:var(--soft);border-top:1px solid var(--line);padding:26px 0;font-size:14px;color:var(--mute)}footer a{color:var(--mute);margin-right:16px}
a:focus-visible,button:focus-visible{outline:3px solid var(--acc);outline-offset:2px}
@media(max-width:560px){nav a{margin-left:11px;font-size:14px}.brand{font-size:17px}}