:root{color:#152233;font-synthesis:none;background:#e6e8e3;font-family:Arial,PingFang SC,Microsoft YaHei,sans-serif}*{box-sizing:border-box}body{min-width:320px;margin:0}.app{background:linear-gradient(90deg,#0000 49.8%,#1522330f 50%,#0000 50.2%),#e6e8e3;min-height:100vh}header{color:#fff;background:#152233;border-bottom:6px solid #ff5b22;justify-content:space-between;align-items:center;height:90px;padding:0 clamp(20px,5vw,76px);display:flex}.brand{align-items:center;gap:14px;display:flex}.brand .mark{text-align:center;color:#ff5b22;border:2px solid #ff5b22;width:50px;height:50px;font:900 15px/48px monospace}.brand strong{font:800 22px/1 monospace;display:block}.brand small{color:#9ea9b5;letter-spacing:.16em;margin-top:7px;display:block}.summary{align-items:baseline;gap:7px;display:flex}.summary span{letter-spacing:.1em;color:#aeb8c2;font-size:12px}.summary b{color:#ff6d38;font:900 38px/1 monospace}.summary em{font-size:12px;font-style:normal}main{grid-template-columns:minmax(0,1.1fr) minmax(390px,.9fr);max-width:1480px;margin:auto;display:grid}.workbench{border-right:1px solid #b8bdb9;padding:clamp(30px,5vw,70px)}.section-title{gap:24px;margin-bottom:38px;display:flex}.section-title>span,.section-title h1{font-family:Impact,Arial Black,sans-serif}.section-title>span{color:#ff5b22;border-top:5px solid;padding-top:8px;font-size:14px}.section-title h1{letter-spacing:-.02em;text-transform:uppercase;margin:0;font-size:clamp(36px,4vw,66px);line-height:.98}.section-title p{color:#59636e;max-width:430px;line-height:1.6}.item-panel,.shelf-editor{background:#f7f7f3;border:1px solid #aeb3af;margin-bottom:26px;padding:24px;box-shadow:8px 8px #cbd0cb}.item-panel{grid-template-columns:1.8fr repeat(3,1fr);gap:14px;padding-top:46px;display:grid;position:relative}.panel-label{letter-spacing:.18em;color:#58616a;font:700 11px monospace}.item-panel>.panel-label{position:absolute;top:17px;left:24px}.item-panel label,.shelf-row label{color:#65707a;flex-direction:column;gap:7px;font-size:11px;display:flex}.item-panel input,.shelf-row input,.savebar input{color:#152233;background:#fff;border:1px solid #9fa6a3;border-radius:0;min-width:0;height:43px;padding:0 12px;font:700 15px monospace}.item-panel input:focus,.shelf-row input:focus,.savebar input:focus{border-color:#ff5b22;outline:3px solid #ff5b2240}.toggle{cursor:pointer;align-items:center;flex-direction:row!important;grid-column:1/-1!important}.toggle input{opacity:0;position:absolute}.toggle span{background:#adb3af;width:38px;height:20px;position:relative}.toggle span:after{content:"";background:#fff;width:14px;height:14px;transition:all .2s;position:absolute;top:3px;left:3px}.toggle input:checked+span{background:#ff5b22}.toggle input:checked+span:after{left:21px}.panel-head{justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.panel-head button{color:#d9410a;cursor:pointer;background:0 0;border:0;font-weight:800}.shelf-row{border-top:1px solid #d7dad6;grid-template-columns:35px 1.25fr repeat(3,1fr) 32px;align-items:end;gap:10px;padding:14px 0;display:grid}.shelf-row .index{color:#ff5b22;align-self:center;font:800 13px monospace}.shelf-row label{position:relative}.shelf-row label input{width:100%;padding-right:32px}.shelf-row label i{color:#8e9691;font:10px monospace;position:absolute;bottom:14px;right:8px}.shelf-name{width:100%}.remove,.trash{color:#7f8984;cursor:pointer;background:0 0;border:0;height:43px;font-size:26px}.remove:disabled{opacity:.2}.savebar{grid-template-columns:minmax(120px,1fr) auto;align-items:center;gap:10px;display:grid}.savebar .primary{color:#fff;cursor:pointer;background:#152233;border:0;height:43px;padding:0 22px;font-weight:800}.savebar span{color:#c13a0c;grid-column:1/-1;min-height:18px;font-size:12px}.results{background:#d9dcd6;min-width:0;padding:clamp(30px,4vw,60px)}.results-head{border-bottom:5px solid #152233;justify-content:space-between;align-items:end;margin-bottom:24px;padding-bottom:12px;display:flex}.results-head span{color:#d94510;font:700 11px monospace}.results-head h2{margin:0;font:900 32px/1 Impact,Arial Black,sans-serif}.result-list{gap:18px;display:grid}.result-list article{background:#fff;border:1px solid #afb5b0;padding:20px}.result-list article.fit{border-top:6px solid #152233}.result-list article.no-fit{background:#ede8e3;border-top:6px solid #ff5b22}.card-top{justify-content:space-between;align-items:start;display:flex}.card-top h3{margin:4px 0 16px;font-size:20px}.card-top small{color:#717b75;font:10px monospace}.card-top>strong{font:900 40px/1 monospace}.card-top>strong small{font-size:12px}.grid-preview{grid-template-columns:repeat(var(--cols),1fr);grid-template-rows:repeat(var(--rows),1fr);background:#e1e3de;border:7px solid #152233;gap:2px;height:88px;padding:3px;display:grid;overflow:hidden}.grid-preview i{background:#ff6530;min-width:2px;min-height:2px}.metrics{grid-template-columns:1.3fr 1fr 1fr;gap:8px;margin-top:14px;display:grid}.metrics span{color:#777f7a;font-size:10px}.metrics b{color:#152233;margin-top:3px;font:700 12px monospace;display:block}.orientation{color:#59635d;margin:14px 0 0;font-size:11px}.reason{padding:28px 4px 12px}.reason b{color:#d53f0a;font-size:20px}.reason p{color:#6d625d}.saved{border-top:1px solid #a9afa9;margin-top:35px;padding-top:20px}.saved h3{letter-spacing:.08em;font-size:13px}.saved h3 span{float:right;color:#767e79;font:11px monospace}.empty{color:#777f79;font-size:12px}.saved-row{background:#cdd1cb;grid-template-columns:1fr 34px;margin-top:7px;display:grid}.saved-row button{text-align:left;cursor:pointer;background:0 0;border:0;min-width:0;padding:11px}.saved-row b,.saved-row small{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.saved-row small{color:#707771;margin-top:4px;font-size:10px}.saved-row .trash{text-align:center;padding:0}footer{color:#9aa5af;text-align:center;letter-spacing:.05em;background:#152233;padding:18px;font-size:11px}@media (width<=900px){main{grid-template-columns:1fr}.workbench{border-right:0}.results{border-top:1px solid #afb4b0}.app{background:#e6e8e3}}@media (width<=620px){header{height:78px;padding:0 16px}.brand small,.summary span{display:none}.summary b{font-size:28px}.workbench,.results{padding:26px 16px}.section-title{gap:12px}.section-title h1{font-size:38px}.item-panel{grid-template-columns:repeat(3,1fr)}.item-panel .wide{grid-column:1/-1}.shelf-row{grid-template-columns:30px 1fr 30px}.shelf-row .shelf-name{grid-column:2}.shelf-row label{grid-row:2}.shelf-row label:first-of-type{grid-column:1/2}.shelf-row label:nth-of-type(2){grid-column:2/3}.shelf-row label:nth-of-type(3){grid-column:3/4}.shelf-row .remove{grid-area:1/3}.savebar{grid-template-columns:1fr}.metrics{grid-template-columns:1fr 1fr}.metrics span:first-child{grid-column:1/-1}}
