:root{--ink:#18333a;--muted:#718087;--paper:#f5f3ed;--card:#fff;--line:#dfe3df;--accent:#d76d38;--teal:#1e5962;--soft:#edf3f1}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Microsoft YaHei",Inter,sans-serif}button,input,select{font:inherit}button{border:1px solid var(--line);background:#fff;border-radius:10px;padding:10px 14px;cursor:pointer;color:var(--ink)}button:hover{border-color:var(--teal)}button.primary{background:var(--teal);color:#fff;border-color:var(--teal);font-weight:700}header{height:72px;background:#163b42;color:#fff;display:flex;align-items:center;padding:0 32px;gap:40px;position:sticky;top:0;z-index:20;box-shadow:0 6px 25px #18333a20}header>div{display:flex;flex-direction:column;min-width:230px}header b{font-size:20px}header span{font-size:10px;letter-spacing:2px;opacity:.65}nav{display:flex;gap:8px;flex:1}nav button{border:0;background:transparent;color:#c7d5d4}nav button.active{background:#ffffff18;color:#fff}header i{font-style:normal;font-size:12px;color:#a9d6c8}main{max-width:1520px;margin:auto;padding:28px}.view{display:none}.view.active{display:block}.hero,.page-title{display:flex;justify-content:space-between;align-items:end;margin-bottom:22px}.hero small{color:var(--accent);font-weight:800;letter-spacing:2px}.hero h1,.page-title h1{font-size:30px;margin:7px 0}.hero p,.page-title p{margin:0;color:var(--muted)}.layout{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:20px;align-items:start}article,aside,.history-list{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:22px;box-shadow:0 10px 35px #18333a0b}.left{display:grid;gap:18px}h2{font-size:17px;margin:0 0 18px}.article-head{display:flex;justify-content:space-between}.article-head span{color:var(--muted);font-size:13px}.form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.field{display:flex;flex-direction:column;gap:7px}.field span{font-size:12px;color:var(--muted)}input,select{width:100%;border:1px solid var(--line);border-radius:9px;padding:10px 11px;background:#fbfcfa;color:var(--ink);outline:none}input:focus,select:focus{border-color:var(--teal);box-shadow:0 0 0 3px #1e596218}.bom-row{border:1px solid var(--line);border-radius:14px;padding:16px;margin-top:12px;background:#fcfcfa}.row-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px}.row-head b{color:var(--teal)}.row-head button{padding:5px 9px;color:#a34c36}.bom-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:11px}.bom-grid .wide{grid-column:span 2}aside{position:sticky;top:94px}.empty{padding:45px 10px;text-align:center;color:var(--muted);background:var(--soft);border-radius:12px}.result-line{display:grid;grid-template-columns:1fr auto;gap:5px;border-bottom:1px solid var(--line);padding:12px 0}.result-line small{color:var(--muted)}.result-line b{color:var(--accent)}.totals{margin-top:16px;display:grid;gap:10px}.totals span,.totals strong{display:flex;justify-content:space-between}.totals strong{padding-top:14px;border-top:2px solid var(--ink)}.totals em{font-style:normal;font-size:25px;color:var(--accent)}.actions{display:grid;gap:10px;margin-top:20px}.actions>div{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}#message{font-size:13px;color:#b25232}.history-list{display:grid;gap:10px}.history-item{display:grid;grid-template-columns:1.4fr 1fr 1fr auto;align-items:center;gap:12px;padding:14px;border:1px solid var(--line);border-radius:12px}.history-item span{color:var(--muted);font-size:12px}.history-item b{display:block}.settings-card{max-width:900px}.settings-card button{margin-top:18px}@media(max-width:1000px){header{padding:0 16px}header>div{min-width:auto}header span{display:none}.layout{grid-template-columns:1fr}aside{position:static}.bom-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:680px){header{height:auto;padding:14px;display:grid;gap:10px}header i{display:none}nav{overflow:auto}nav button{white-space:nowrap;padding:8px}main{padding:15px}.hero{align-items:start;gap:14px}.hero h1{font-size:23px}.hero p{font-size:13px}.form-grid,.bom-grid{grid-template-columns:1fr 1fr}.bom-grid .wide{grid-column:span 2}.layout{display:block}.left{margin-bottom:15px}article,aside,.history-list{padding:15px;border-radius:14px}.history-item{grid-template-columns:1fr 1fr}.history-item button{grid-column:span 2}}