:root{--bg:#f6f1e7;--card:#fffdf8;--ink:#2f3a2f;--muted:#6b7566;--leaf:#5b8c5a;--leaf-d:#3f6b3f;--sun:#f2b84b;--sky:#cfe6e3;--line:#e6dccb;--warn:#fff3d6;--r:16px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;font:16px/1.55 ui-rounded,"SF Pro Rounded","Nunito","Segoe UI",system-ui,sans-serif;color:var(--ink);background:var(--bg)}
a{color:var(--leaf-d)}
.wrap{max-width:1080px;margin:0 auto;padding:0 16px}
header.site{background:linear-gradient(160deg,var(--sky),#e9f3df 60%,var(--bg));padding:28px 0 22px;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.logo{width:44px;height:44px;border-radius:14px;background:var(--leaf);display:grid;place-items:center;color:#fff;font-size:24px;box-shadow:0 3px 0 var(--leaf-d)}
h1{font-size:clamp(1.5rem,4vw,2.2rem);margin:0;letter-spacing:-.01em}
.tagline{margin:.4rem 0 0;color:var(--muted);max-width:720px}
nav.top{margin-top:10px;font-size:.95rem}nav.top a{margin-right:14px;text-decoration:none;font-weight:600}
.badge{display:inline-block;background:var(--warn);border:1px solid #f0d58f;color:#7a5a12;border-radius:999px;padding:3px 10px;font-size:.82rem;font-weight:700}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px;box-shadow:0 2px 0 rgba(60,50,30,.05)}
.grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:18px;margin:20px 0}
@media (max-width:820px){.grid{grid-template-columns:minmax(0,1fr)}}
.card{min-width:0}
@media (max-width:520px){.card{padding:14px}td,th{padding:6px 4px}td input[type=number]{width:60px}.stat b{font-size:1.15rem}}
h2{font-size:1.2rem;margin:0 0 12px}h3{font-size:1.02rem;margin:16px 0 8px}
label.small{font-size:.82rem;color:var(--muted);font-weight:600;display:block;margin-bottom:4px}
input[type=search],input[type=number],select{font:inherit;border:1.5px solid var(--line);border-radius:12px;padding:10px 12px;background:#fff;color:var(--ink);width:100%}
input:focus,select:focus,button:focus-visible{outline:3px solid #b9d8b4;outline-offset:1px;border-color:var(--leaf)}
.picker{position:relative}
.results{position:absolute;z-index:5;left:0;right:0;top:100%;margin-top:4px;background:#fff;border:1px solid var(--line);border-radius:12px;max-height:300px;overflow:auto;box-shadow:0 10px 24px rgba(40,40,20,.12);display:none}
.results.open{display:block}
.results button{display:flex;justify-content:space-between;gap:8px;width:100%;text-align:left;border:0;background:none;padding:9px 12px;font:inherit;cursor:pointer;color:var(--ink)}
.results button:hover,.results button.active{background:#eef6ea}
.results small{color:var(--muted)}
.row{display:flex;gap:8px;align-items:end}.row>*{flex:1}.row .qty{flex:0 0 96px}
.btn{font:inherit;font-weight:700;border:0;border-radius:12px;padding:10px 14px;background:var(--leaf);color:#fff;cursor:pointer;box-shadow:0 3px 0 var(--leaf-d)}
.btn:active{transform:translateY(2px);box-shadow:0 1px 0 var(--leaf-d)}
.btn.ghost{background:#fff;color:var(--leaf-d);border:1.5px solid var(--line);box-shadow:none}
.btn.tiny{padding:4px 9px;font-size:.85rem;box-shadow:none}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}
.chip{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:5px 11px;font:inherit;font-size:.88rem;cursor:pointer;color:var(--ink)}
.chip:hover{border-color:var(--leaf)}
ul.targets{list-style:none;padding:0;margin:12px 0 0}
ul.targets li{display:flex;align-items:center;gap:8px;padding:8px 0;border-top:1px dashed var(--line)}
ul.targets li .name{flex:1;font-weight:600}
ul.targets input{width:84px;padding:6px 8px}
.empty{color:var(--muted);font-size:.95rem}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin-bottom:14px}
.stat{background:#f3f8ef;border-radius:12px;padding:10px 12px}.stat b{display:block;font-size:1.35rem}.stat span{font-size:.8rem;color:var(--muted)}
table{width:100%;border-collapse:collapse;font-size:.94rem}
th,td{text-align:left;padding:7px 6px;border-bottom:1px solid var(--line);vertical-align:middle}
th{font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
td input[type=number]{width:76px;padding:5px 7px;text-align:right}
.ok{color:var(--leaf-d);font-weight:700}.need{color:#a3501d;font-weight:700}
.station-pill{display:inline-block;font-size:.76rem;font-weight:700;border-radius:999px;padding:2px 8px;background:#eef1fb;color:#3e4f8a;white-space:nowrap}
.st-refining{background:#fdf0e2;color:#8a4f12}.st-cooking{background:#fde8ea;color:#8a2f3d}.st-tailoring{background:#f1e9fb;color:#5b3e8a}.st-carpentry{background:#eaf4e4;color:#3f6b3f}
.tree{font-size:.92rem}.tree ul{list-style:none;padding-left:18px;margin:2px 0;border-left:2px dotted var(--line)}.tree>ul{border:0;padding-left:0}
.tree li{margin:3px 0}.tree .q{font-weight:700;font-variant-numeric:tabular-nums}
.notice{background:var(--warn);border:1px solid #f0d58f;border-radius:12px;padding:10px 12px;font-size:.9rem;margin:12px 0}
.tablewrap{overflow-x:auto}
section.content{margin:28px 0}
details{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 14px;margin:8px 0}
summary{cursor:pointer;font-weight:700}
footer{border-top:1px solid var(--line);padding:22px 0 40px;color:var(--muted);font-size:.88rem}
.toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);background:var(--ink);color:#fff;padding:9px 16px;border-radius:999px;font-size:.9rem;opacity:0;transition:opacity .2s;pointer-events:none}
.toast.show{opacity:1}
.muted{color:var(--muted)}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.kbd{font-family:ui-monospace,monospace;font-size:.85em;background:#efe8da;border-radius:6px;padding:1px 5px}
.sr{position:absolute;left:-9999px}
.lang{margin-left:auto;display:inline-flex;gap:4px;border:1.5px solid var(--line);border-radius:999px;padding:3px;background:#fff}
.lang-btn{text-decoration:none;font-weight:700;font-size:.82rem;padding:4px 10px;border-radius:999px;color:var(--muted)}
.lang-btn.active,.lang-btn:hover{background:var(--leaf);color:#fff}
.brand{width:100%}
