*{box-sizing:border-box}body{margin:0;background:#f3f5fa;color:#202a4e;font:16px system-ui,sans-serif}header{background:#202a4e;color:white;padding:22px 5%;display:flex;justify-content:space-between;gap:16px}header b{letter-spacing:2px}header span{display:block;font-size:10px;letter-spacing:2.5px;margin-top:5px}main{max-width:1100px;margin:auto;padding:28px 22px}.intro{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:10px 0 30px}h1{font-size:clamp(30px,5vw,48px);line-height:1.1;letter-spacing:-1.8px;margin:12px 0}h2{font-size:24px}.eyebrow{font-size:11px;letter-spacing:2px;color:#e02536}.badge{border-left:3px solid #e02536;padding:16px;font-size:11px;line-height:2}.badge strong{font-size:14px}nav{display:flex;gap:6px;margin-bottom:18px}button,.file{border:1px solid #c9d1e2;background:white;color:#202a4e;padding:12px 16px;border-radius:9px;font:inherit;cursor:pointer;min-height:44px}button.active,button:hover{background:#202a4e;color:white}button:disabled{opacity:.5;cursor:not-allowed}.panel{background:white;border:1px solid #dbe1ed;border-radius:16px;padding:26px;box-shadow:0 8px 24px #202a4e06}.fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin:20px 0}label{display:block;font-size:14px}input:not([type=checkbox]),select,textarea{display:block;width:100%;margin-top:7px;padding:12px;border:1px solid #c9d1e2;border-radius:7px;background:#ffffff;color:#202a4e;font:inherit}input[type=checkbox]{width:20px;height:20px;vertical-align:middle}canvas{width:100%;max-height:65vh;aspect-ratio:5/4;object-fit:contain;border:1px solid #c9d1e2;border-radius:10px;touch-action:none;background:#fafcfb;display:block;margin:16px 0}.row{display:flex;align-items:center;gap:10px;justify-content:space-between}.wrap{flex-wrap:wrap;justify-content:flex-start}.tools{margin-top:18px}.tools button{font-size:14px}small,.muted{color:#65708b;font-size:13px}.notice{background:#fff4db;padding:20px;border-radius:10px}.danger{color:#c32132}footer{padding:26px 0;display:flex;gap:10px;flex-wrap:wrap}footer p{width:100%;font-size:13px}.file input{max-width:220px;font-size:12px}#message{position:sticky;bottom:15px;background:#202a4e;color:white;border-radius:8px;padding:12px}#message:empty{display:none}.article{padding:15px 0;border-bottom:1px solid #ddd;display:flex;justify-content:space-between;gap:12px}[hidden]{display:none!important}@media(max-width:600px){header{flex-direction:column;padding:16px}.intro{display:block}.badge{margin-top:20px}main{padding:16px 12px}.panel{padding:16px}nav{display:grid;grid-template-columns:1fr 1fr}nav button{font-size:14px}h2{font-size:20px}.row h2{width:100%}.tools{gap:6px}.tools button{padding:10px}.fields{grid-template-columns:1fr 1fr}}

.angle-option{margin-top:16px}#sketch{cursor:crosshair}button.active{box-shadow:inset 0 0 0 2px #e02536}button:not(.active):hover{background:#edf0f8;color:#202a4e}

.project-library{margin-top:22px}.project-library label{min-width:230px;flex:1}details{margin:20px 0}summary{cursor:pointer;padding:12px 0}

#lengths button{font-size:13px;padding:7px 10px;margin-top:6px;min-height:36px}

#hint{min-height:4.5em;line-height:1.5}

.article{align-items:center;flex-wrap:wrap}.article-info{flex:1;min-width:240px;line-height:1.6}.article-controls{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.article-controls select{width:68px;margin:0;padding:9px}.article-controls button{padding:9px 12px}.option-check{white-space:nowrap;font-weight:600;margin-right:6px}.alt-badge{display:inline-block;background:#fff0ca;color:#815617;padding:2px 9px;border-radius:5px;margin:5px 8px;font-size:12px}@media(max-width:600px){.article-info{min-width:100%}.article-controls{width:100%}}

.material-group{border-left:2px solid #d0d7e8;padding-left:14px}.material-group>summary{font-weight:650}.material-row{display:grid;grid-template-columns:minmax(180px,1fr) 85px 65px 82px;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #e2e6f0}.material-row>input{margin:0}.material-row>input:not([type=number]){grid-column:1/-1}.material-row label{line-height:1.5}@media(max-width:600px){.material-row{grid-template-columns:1fr 72px 45px}.material-row .option-check{grid-column:1/-1}.material-group{padding-left:8px}}

.material-group>summary{position:relative;padding:12px 130px 12px 0;min-height:58px}.material-group>summary>button{position:absolute;right:0;top:6px;min-height:42px;font-size:13px;padding:8px 12px}.material-group>summary>span{line-height:1.5}

/* Original Klima-Pol letterhead palette: navy #202a4e, red #e02536. */
header{background:#fff;color:#202a4e;border-bottom:4px solid #e02536;align-items:center;padding-top:16px;padding-bottom:16px}.brand{display:flex;flex-direction:column;align-items:flex-start;gap:5px}.brand-logo{display:block;width:228px;height:57px;object-fit:contain}.brand span{font-size:10px;letter-spacing:2px;margin-left:5px}.brand+small{color:#65708b}button.active{box-shadow:inset 0 -3px 0 #e02536}.eyebrow{font-weight:650}.danger{color:#c32132}#message{background:#202a4e}@media(max-width:600px){header{align-items:flex-start;gap:10px}.brand-logo{width:190px;height:48px}.brand span{font-size:9px;letter-spacing:1.5px}}
