#scaffold-app{
    --navy:#0f1a2d;--orange:#ff7a00;--bg:#f4f6f8;--text:#172033;
    background:var(--bg);color:var(--text);
    font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
}
#scaffold-app *{box-sizing:border-box}

.sc-hero{background:linear-gradient(135deg,#0f1a2d,#09111f);color:#fff;padding:40px 24px 32px}
.sc-inner{max-width:1400px;margin:auto}
.sc-eyebrow{color:#ff9638;font-weight:800;font-size:11px;letter-spacing:1.8px;text-transform:uppercase;margin-bottom:8px}
.sc-hero h1{font-size:clamp(28px,4vw,44px);margin:0 0 10px}
.sc-hero p{max-width:760px;color:#d7e0ec;font-size:15px;line-height:1.55;margin:0}

.sc-wrap{max-width:1400px;margin:auto;padding:24px 16px 48px}

/* lista ścian */
.sc-walls-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}
.sc-wall-tab{
    border:1px solid #d6dde6;background:#fff;border-radius:999px;padding:8px 14px;
    font-size:12px;font-weight:700;cursor:pointer;color:#4a5568
}
.sc-wall-tab.active{border-color:var(--orange);background:#fff7f0;color:#c05600;box-shadow:0 0 0 2px rgba(255,122,0,.15)}
.sc-wall-tab .dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;background:#cbd5e1;vertical-align:middle}
.sc-wall-tab.active .dot{background:var(--orange)}
.sc-wall-tab.has-scaff .dot{background:#22c55e}
.sc-wall-actions{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}

/* layout główny — duży podgląd */
.sc-config{
    display:grid;grid-template-columns:1fr 280px;gap:0;
    background:#fff;border:1px solid #e4e9ef;border-radius:16px;overflow:hidden;
    box-shadow:0 10px 40px rgba(15,26,45,.07);
}
.sc-stage{
    display:flex;flex-direction:column;
    background:linear-gradient(180deg,#eef2f7 0%,#e2e8f0 100%);
    min-height:680px;height:680px;overflow:hidden;
}
.sc-canvas{position:relative;flex:1;min-height:0}
#scSvg{width:100%;height:100%;display:block;touch-action:none}
.sc-stage-label{position:absolute;top:14px;left:16px;right:16px;z-index:5;display:flex;justify-content:space-between;pointer-events:none}
.sc-pill{background:rgba(255,255,255,.97);border:1px solid #e1e6ec;border-radius:999px;padding:7px 14px;font-size:11px;font-weight:800;box-shadow:0 4px 14px rgba(15,26,45,.1)}
.sc-hint{
    flex-shrink:0;background:#0f1a2d;color:#fff;padding:10px 14px;
    font-size:11px;text-align:center;line-height:1.45
}
.sc-toolbar{
    position:absolute;left:16px;bottom:14px;z-index:9;display:flex;gap:8px;flex-wrap:wrap
}
.sc-toolbar .sc-btn{width:auto;margin:0;padding:9px 14px;font-size:11px}

.sc-panel{display:flex;flex-direction:column;border-left:1px solid #e8edf3;background:#fff;max-height:680px}
.sc-tabs{display:flex;border-bottom:1px solid #e8edf3}
.sc-tab{flex:1;border:0;background:#fafbfd;padding:11px 2px;font-size:9.5px;font-weight:800;text-transform:uppercase;color:#788292;cursor:pointer;border-bottom:2px solid transparent;letter-spacing:-.2px}
.sc-tab.active{background:#fff;color:var(--orange);border-bottom-color:var(--orange)}
.sc-tab-body{flex:1;overflow-y:auto;padding:14px;max-height:620px}
.sc-tab-pane{display:none}.sc-tab-pane.active{display:block}

.sc-control{margin-bottom:12px}
.sc-control>label{display:block;font-size:10px;font-weight:800;text-transform:uppercase;color:#687386;margin-bottom:5px;letter-spacing:.4px}
.sc-roofs{display:grid;gap:5px}
.sc-roof{border:1px solid #d8dfe8;background:#fff;border-radius:8px;padding:8px 10px;font-size:12px;font-weight:700;cursor:pointer;text-align:left}
.sc-roof.active,.sc-roof:hover{border-color:var(--orange);background:#fff7f0;color:#c05600}
.sc-dims{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.sc-number{width:100%;padding:9px 10px;border:1px solid #d6dde6;border-radius:8px;font-size:14px}
/* iPhone: ukryty input, select daje natywne kółko */
.sc-ios-src{display:none !important}
.sc-ios-wheel{
    appearance:none;-webkit-appearance:none;
    font-size:16px;background:#fff;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path fill='%238a93a1' d='M1 1l5 5 5-5'/></svg>");
    background-repeat:no-repeat;background-position:right 10px center;padding-right:28px
}
.sc-days .sc-ios-wheel{flex:1}
.sc-help{font-size:10px;color:#8a93a1;margin-top:2px}

.sc-kpi-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:10px 0}
.sc-kpi{background:#f4f7fb;border:1px solid #e4e9ef;border-radius:8px;padding:8px 10px}
.sc-kpi small{display:block;font-size:9px;color:#788292;text-transform:uppercase}
.sc-kpi strong{font-size:14px;color:var(--navy)}

.sc-btn{border:0;border-radius:8px;padding:11px;background:var(--orange);color:#fff;font-size:12px;font-weight:800;cursor:pointer;width:100%}
.sc-btn:hover{background:#e96700}
.sc-btn.gray{background:#eef1f5;color:var(--navy)}
.sc-btn.red{background:#fff0ef;color:#94261d;border:1px solid #f0c2bc}
.sc-btn.green{background:#e9f8ee;color:#176938;border:1px solid #bde7c9}
.sc-btn:disabled{opacity:.45;cursor:not-allowed}

.sc-edit-list{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:8px}
.sc-edit-chip{border:1px solid #d6dde6;background:#fff;border-radius:999px;padding:5px 9px;font-size:10px;font-weight:700;cursor:pointer}
.sc-edit-chip.removed{background:#fff0ef;border-color:#f0c2bc;color:#94261d;text-decoration:line-through}
.sc-edit-chip:hover{border-color:var(--orange)}

.sc-price{background:var(--navy);color:#fff;border-radius:12px;padding:12px;margin-top:8px}
.sc-price-main{font-size:20px;font-weight:900;margin:4px 0}
.sc-price-sub{font-size:10px;color:#d0d8e4}
.sc-mini-stats{font-size:10px;border-top:1px solid #edf0f3;margin-top:10px;padding-top:8px}
.sc-mini-stats div{display:flex;justify-content:space-between;padding:2px 0;color:#5f6978}

/* czas wynajmu */
.sc-days{display:flex;align-items:center;gap:8px}
.sc-days .sc-number{flex:1}
.sc-days-unit{font-size:11px;font-weight:800;color:#687386}
.sc-presets{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.sc-presets button{
    border:1px solid #dbe2ea;background:#fff;border-radius:999px;padding:4px 9px;
    font-size:9.5px;font-weight:700;color:#5f6978;cursor:pointer;white-space:nowrap
}
.sc-presets button:hover{border-color:var(--orange);color:#c05600}
.sc-presets button.active{border-color:var(--orange);background:#fff7f0;color:#c05600;
    box-shadow:0 0 0 2px rgba(255,122,0,.12)}
.sc-days-info{display:flex;align-items:center;gap:6px;margin-top:7px;flex-wrap:wrap}
#daysHint{color:#78849a}

/* plakietka rabat / doplata */
.sc-badge{
    display:inline-block;border-radius:999px;padding:2px 7px;
    font-size:9px;font-weight:800;letter-spacing:.2px;white-space:nowrap;
    background:#eef1f5;color:#6b7684;border:1px solid #dde3ea
}
.sc-badge.good{background:#e8f8ee;color:#1a7f43;border-color:#bde8cd}
.sc-badge.up{background:#fff1e8;color:#c0560a;border-color:#ffd3b4}
.sc-badge.hidden{display:none !important}

/* przelacznik uslug dodatkowych */
.sc-switch{
    display:flex;align-items:flex-start;gap:8px;cursor:pointer;
    border:1px solid #dbe2ea;border-radius:10px;padding:10px;background:#fff;
    font-size:11px;color:#3a4757;line-height:1.35
}
.sc-switch:hover{border-color:var(--orange)}
.sc-switch input{margin-top:1px;accent-color:var(--orange);width:15px;height:15px;flex-shrink:0}
.sc-switch b{color:#c05600}
.sc-switch.on{border-color:var(--orange);background:#fff8f2}
.sc-control .sc-switch + .sc-switch{margin-top:6px}

/* pop-up montazu */
.sc-modal{
    display:none;position:fixed;inset:0;z-index:9999;
    background:rgba(10,17,28,.6);align-items:center;justify-content:center;padding:20px
}
.sc-modal.visible{display:flex}
.sc-modal-box{
    background:#fff;border-radius:16px;padding:28px 26px;max-width:380px;width:100%;
    text-align:center;box-shadow:0 24px 70px rgba(10,17,28,.35);
    animation:scPop .18s ease-out
}
@keyframes scPop{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
.sc-modal-ico{font-size:34px;line-height:1;margin-bottom:10px}
.sc-modal-box h3{margin:0 0 10px;font-size:19px;color:#0f1a2d}
.sc-modal-box p{margin:0 0 14px;font-size:13px;color:#4a5766;line-height:1.6}
.sc-modal-price{
    background:#fff7f0;border:1px solid #ffd3b4;border-radius:10px;
    padding:10px;font-size:13px;font-weight:800;color:#c05600;margin-bottom:16px
}
.sc-modal-box .sc-btn{width:100%}
.sc-modal-box.ok{border-top:5px solid #176938}
.sc-modal-box.err{border-top:5px solid #c0392b}
.sc-modal-box.ok h3{color:#176938}
.sc-modal-box.err h3{color:#94261d}
.sc-modal-box.ok .sc-btn{background:#176938}
.sc-modal-box.err .sc-btn{background:#c0392b}
#resultModalBox{max-width:420px}
#resultModalText{white-space:pre-wrap;text-align:left}

/* zestawienie elementow rusztowania */
.sc-elements{font-size:10.5px}
.sc-el-head{display:flex;align-items:flex-end;padding:0 5px 5px;border-bottom:1px solid #e4e9ef;
    font-size:9px;font-weight:800;text-transform:uppercase;color:#8a94a2;letter-spacing:.2px}
.sc-el-row{display:flex;align-items:center;padding:5px;border-radius:5px}
.sc-el-row:nth-child(even){background:#f6f8fb}
.sc-el-row.sc-el-anchor{background:#fff6ef}
.sc-el-row .nr{width:15px;color:#a3acb8;font-weight:700}
.sc-el-row .nm,.sc-el-head .nm{flex:1;color:#31404f;line-height:1.25;padding-right:4px}
.sc-el-row .q,.sc-el-head .q{width:40px;text-align:right;font-weight:800;color:#0f1a2d}
.sc-el-row .qt,.sc-el-head .qt{width:40px;text-align:right;font-weight:800;color:#d95f00}
.sc-el-note{margin-top:8px;padding:7px 8px;background:#f2f6fb;border-radius:6px;
    font-size:9.5px;color:#5f6978;line-height:1.45}

.sc-step-bar{display:flex;gap:8px;margin-bottom:14px}
.sc-step{flex:1;border:1px solid #e0e6ed;border-radius:8px;padding:8px;font-size:11px;font-weight:700;color:#788292;background:#fafbfd}
.sc-step.active{border-color:var(--orange);background:#fff7f0;color:#d55d00}

.sc-title{margin-bottom:14px}.sc-title h2{font-size:24px;margin:0 0 5px;color:var(--navy)}
.sc-title p{margin:0;color:#697486;font-size:13px}
.sc-card{background:#fff;border:1px solid #e4e9ef;border-radius:16px;box-shadow:0 8px 30px rgba(15,26,45,.06)}
.sc-form{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;padding:22px}
.sc-field{display:flex;flex-direction:column;gap:5px}.sc-field.full{grid-column:1/-1}
.sc-field label{font-size:12px;font-weight:800}.sc-field input,.sc-field select,.sc-field textarea{padding:10px 12px;border:1px solid #d6dde6;border-radius:8px;font-size:14px;width:100%}
.sc-field textarea{min-height:88px;resize:vertical}
.sc-required{color:var(--orange)}

.sc-final{margin-top:32px}
.sc-checkout{
    display:grid;grid-template-columns:340px 1fr;gap:0;
    background:#fff;border:1px solid #e4e9ef;border-radius:16px;overflow:hidden;
    box-shadow:0 10px 40px rgba(15,26,45,.07);
}
.sc-checkout-sum{
    background:linear-gradient(180deg,#0f1a2d 0%,#15253f 100%);
    color:#fff;padding:26px 22px;
    display:flex;flex-direction:column;align-self:stretch
}
.sc-checkout-kicker{
    color:#ff9638;font-weight:800;font-size:10px;letter-spacing:1.6px;
    text-transform:uppercase;margin-bottom:6px
}
.sc-checkout-sum h3{margin:0 0 18px;font-size:20px;font-weight:800}
.sc-sum-row{
    display:flex;justify-content:space-between;align-items:center;gap:12px;
    padding:8px 0;border-bottom:1px solid rgba(255,255,255,.1);
    font-size:12px;color:#c5d0de
}
.sc-sum-row strong{color:#fff;font-size:13px;text-align:right}
.sc-sum-row .sc-badge{vertical-align:middle}
.sc-sum-pay{
    margin:16px 0 10px;padding:14px 14px 12px;border-radius:12px;
    background:#ff7a00;text-align:center
}
.sc-sum-pay span{display:block;font-size:10px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;opacity:.9}
.sc-sum-pay strong{display:block;font-size:26px;letter-spacing:-.4px;margin:4px 0 2px}
.sc-sum-pay small{display:block;font-size:10px;opacity:.9}
.sc-sum-deposit{border-bottom:0;padding-top:10px;color:#9eacbf;margin-top:auto}
.sc-sum-deposit strong{color:#ffe0c2}

.sc-checkout-main{padding:24px 26px 22px}
.sc-checkout-main h3{margin:0 0 12px;font-size:16px;color:var(--navy)}
.sc-principles{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:18px}
.sc-principle{
    border:1px solid #e4e9ef;border-left:3px solid var(--orange);
    border-radius:12px;padding:12px 14px;background:#fafbfd
}
.sc-principle strong{display:block;font-size:13px;color:var(--navy);margin-bottom:4px}
.sc-principle span{font-size:12px;color:#5f6978;line-height:1.4}

#scaffoldOrder{display:block;width:100%;align-items:stretch;text-align:left}
#scaffoldOrder .sc-field{width:100%}
#scaffoldOrder textarea{width:100%;min-height:88px}

.sc-checks{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}
.sc-check{
    display:flex;flex-direction:row;align-items:flex-start;gap:8px;
    border:1px solid #e0e6ed;border-radius:8px;padding:10px 12px;
    font-size:12px;line-height:1.4;background:#fafbfd;color:#3a4757
}
.sc-check input{margin:2px 0 0;flex-shrink:0;accent-color:var(--orange);width:15px;height:15px}
.sc-submit{border-top:1px solid #edf0f3;padding-top:14px;display:flex;justify-content:space-between;align-items:center;gap:14px}
.sc-submit-btns{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.sc-submit .sc-btn{width:auto;min-width:180px}
.sc-quote-actions{display:flex;gap:8px}
.sc-quote-actions .sc-btn{flex:1;width:auto}
#quoteModalBox{max-width:420px}
#quoteModalBox .sc-field label{display:block;font-size:12px;font-weight:700;color:#3a4757;margin-bottom:6px}
#quoteModalBox .sc-field input{
    width:100%;border:1px solid #d6dde6;border-radius:8px;padding:10px 12px;font-size:14px
}

.sc-alert{max-width:1400px;margin:14px auto 0;padding:12px 16px;border-radius:10px;font-weight:700;display:none}
.sc-alert.visible{display:block}
.sc-alert.ok{background:#e9f8ee;border:1px solid #bde7c9;color:#176938}
.sc-alert.err{background:#fff0ef;border:1px solid #f0c2bc;color:#94261d}

.sc-total-bar{
    margin-top:12px;padding:12px 16px;background:#fff;border:1px solid #e4e9ef;border-radius:12px;
    display:flex;flex-wrap:wrap;gap:16px;align-items:center;font-size:13px
}
.sc-total-bar strong{color:var(--navy);font-size:16px}
.sc-pay-bar{
    margin-top:8px;padding:16px 20px;background:var(--navy);color:#fff;border-radius:12px;
    display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:center;
    font-size:15px;font-weight:700;text-align:center
}
.sc-pay-bar strong{font-size:28px;color:#fff;letter-spacing:-.4px;line-height:1}
.sc-pay-bar span:first-child{opacity:.85}
.sc-pay-bar .sc-badge{font-size:11px;padding:4px 10px}

@media(max-width:960px){
    .sc-config{grid-template-columns:1fr}
    .sc-stage{min-height:520px;height:520px}
    .sc-panel{max-height:none;border-left:0;border-top:1px solid #e8edf3}
    .sc-wall-actions{margin-left:0;width:100%}
    .sc-checkout{grid-template-columns:1fr}
}
@media(max-width:600px){
    .sc-form,.sc-checks,.sc-principles{grid-template-columns:1fr}
    .sc-submit{display:block}.sc-submit-btns{display:block}.sc-submit .sc-btn{width:100%;margin-top:10px}
}