:root{
  --ink:#0d2743;--ink-2:#173955;--muted:#6a7c8b;--muted-2:#8a98a3;
  --line:#dfe6e5;--bg:#f2f5f2;--card:#fff;--soft:#eaf0ed;
  --yellow:#ffd44f;--green:#45c878;--green-d:#1c9d58;--red:#bd2437;--warn:#8c6200;
  --shadow:0 18px 55px rgba(13,39,67,.08);--radius:28px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font:16px/1.5 Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased}
button,input,select{font:inherit}.wrap{width:min(calc(100% - 48px),1280px);margin:0 auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(242,245,242,.9);backdrop-filter:blur(18px);border-bottom:1px solid rgba(13,39,67,.06)}
.bar{height:78px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brandlock{display:flex;align-items:center;gap:12px}.brand-logo{width:166px;display:block}.brand-fallback{font-weight:900;letter-spacing:-.03em}.brand-logo:not([style*="display: none"])+.brand-fallback{display:none}.header-actions{display:flex;align-items:center;gap:22px}.navlink{color:var(--ink);font-weight:800;text-decoration:none;font-size:13px}.secure-badge{font-size:12px;font-weight:800;color:#627684;display:flex;align-items:center;gap:8px}.secure-badge i{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 5px rgba(69,200,120,.12)}
.hero{padding:70px 0 76px;background:linear-gradient(180deg,#f4f7f3 0%,#edf2ef 100%);overflow:hidden}.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(440px,.9fr);gap:70px;align-items:center}.eyebrow,.micro{font-size:11px;font-weight:900;letter-spacing:.17em;text-transform:uppercase;color:#788b98}.eyebrow.dark{color:#718391;margin:0 0 8px}.hero h1{margin:14px 0 22px;font-size:clamp(46px,5.8vw,78px);line-height:.98;letter-spacing:-.055em}.lead{font-size:18px;line-height:1.6;color:var(--muted);max-width:690px;margin:0}.hero-points{display:flex;flex-wrap:wrap;gap:10px;margin:30px 0}.hero-points span{display:flex;gap:8px;align-items:center;padding:9px 12px;background:rgba(255,255,255,.7);border:1px solid rgba(13,39,67,.05);border-radius:999px;font-size:12px;font-weight:800;color:#607482}.hero-points b{color:var(--ink);font-size:10px}.btn{appearance:none;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:999px;min-height:44px;padding:0 17px;display:inline-flex;align-items:center;justify-content:center;gap:10px;font-weight:850;font-size:13px;cursor:pointer;text-decoration:none;transition:.2s ease}.btn:hover{transform:translateY(-1px);border-color:#c8d4d2}.btn.primary{background:var(--ink);color:#fff;border-color:var(--ink);padding:0 22px;min-height:50px}.btn.primary span{color:var(--yellow)}.btn.ghost{background:rgba(255,255,255,.68)}.btn[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.hero-art{position:relative;height:500px;border-radius:42px;background:#dfe8e4;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(13,39,67,.04)}.sun{position:absolute;left:70px;top:62px;width:110px;height:110px;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 30px rgba(255,212,79,.24)}.house-card{position:absolute;right:72px;bottom:80px;width:285px;height:225px}.roof{position:absolute;left:28px;top:0;width:232px;height:105px;background:var(--ink);clip-path:polygon(50% 0,100% 75%,88% 86%,50% 29%,12% 86%,0 75%)}.pv-grid{position:absolute;left:52px;top:38px;width:130px;height:46px;display:grid;grid-template-columns:repeat(3,1fr);gap:3px;transform:skewX(-13deg)}.pv-grid i{background:#315f83;border-radius:2px;box-shadow:inset 0 0 0 1px rgba(164,204,228,.35)}.house-body{position:absolute;left:48px;top:82px;width:190px;height:143px;background:#fff9ef;border-radius:18px 18px 26px 26px}.window{position:absolute;left:30px;top:38px;width:48px;height:43px;border-radius:9px;background:#cedce3}.window.second{left:111px}.door{position:absolute;left:82px;bottom:0;width:32px;height:58px;border-radius:8px 8px 0 0;background:#c4d0d5}.battery-card{position:absolute;right:38px;bottom:62px;width:70px;height:132px;border-radius:20px;background:var(--ink-2);box-shadow:var(--shadow)}.battery-top{position:absolute;left:25px;top:-10px;width:20px;height:10px;border-radius:5px 5px 0 0;background:#9bb0bc}.battery-level{position:absolute;left:17px;right:17px;bottom:20px;height:76px;border-radius:10px;background:var(--green)}.energy-line{position:absolute;height:11px;border-radius:99px;background:var(--yellow);transform-origin:left center}.line-a{left:180px;top:150px;width:215px;transform:rotate(24deg)}.line-b{right:97px;bottom:130px;width:105px;background:var(--green);transform:rotate(-4deg)}.hero-caption{position:absolute;left:34px;bottom:28px;font-size:11px;letter-spacing:.14em;font-weight:900;color:#738690}.hero-caption span{color:var(--green);padding:0 8px}
.configurator{padding:54px 0 90px}.toolbar{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:26px}.toolbar h2{margin:0;font-size:clamp(30px,3.5vw,46px);line-height:1;letter-spacing:-.04em}.toolbar-actions{display:flex;gap:10px}.layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(370px,.86fr);gap:24px;align-items:start}.col-main{min-width:0}.col-side{position:sticky;top:98px;display:grid;gap:16px;min-width:0}.panel{background:var(--card);border:1px solid rgba(13,39,67,.06);border-radius:var(--radius);padding:28px;margin:0 0 16px;box-shadow:0 1px 0 rgba(13,39,67,.02)}fieldset.panel{padding-top:20px}fieldset.panel legend{padding:0 8px;display:flex;align-items:center;gap:14px;font-weight:900;font-size:22px;letter-spacing:-.025em}fieldset.panel legend small{display:block;font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:#81929e;margin-bottom:2px}.step{width:40px;height:40px;border-radius:14px;display:grid;place-items:center;background:var(--ink);color:#fff;font-size:11px;letter-spacing:.05em;flex:0 0 auto}.offer-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.offer-choice{position:relative;display:flex!important;align-items:center!important;gap:14px!important;padding:18px!important;min-height:108px;border:1px solid var(--line);border-radius:20px;background:#fbfcfb;cursor:pointer;margin:0!important;transition:.18s ease}.offer-choice:hover{border-color:#bfcfca;transform:translateY(-1px)}.offer-choice:has(input:checked){background:#edf6f0;border-color:#94cbaa;box-shadow:inset 0 0 0 1px #94cbaa}.offer-choice input{position:absolute;right:15px;top:15px;width:18px!important;height:18px!important;accent-color:var(--green-d)}.offer-choice strong{display:block;font-size:15px;color:var(--ink);line-height:1.25}.offer-choice small{display:block;font-size:12px;line-height:1.35;color:var(--muted);font-weight:600;margin-top:5px}.choice-icon{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;flex:0 0 auto;background:#eef2f1;color:var(--ink);font-weight:900;font-size:20px}.offer-choice:has(input:checked) .choice-icon{background:#dbeee1;color:#188347}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:14px 0 0}.span2{grid-column:1/-1}label{display:block;font-size:12px;font-weight:800;color:#667a88;letter-spacing:.01em}input[type=text],select,.readout{display:block;width:100%;margin-top:7px;padding:0 14px;min-height:50px;border:1px solid #ccd8d5;border-radius:14px;background:#fbfcfb;color:var(--ink);font:inherit;font-weight:700;outline:none;transition:.15s ease}.readout{display:flex;align-items:center;background:#eff4f2}.readout:after{content:""}.input:focus,input[type=text]:focus,select:focus{border-color:#89b99a;box-shadow:0 0 0 4px rgba(69,200,120,.1)}input[aria-invalid=true]{border-color:var(--red)!important;box-shadow:0 0 0 4px rgba(189,36,55,.08)}.inverter-panel{display:flex;gap:16px;align-items:flex-start;background:#eef4f2}.mini-icon{width:46px;height:46px;border-radius:15px;background:#d8ece0;display:grid;place-items:center;font-size:20px;flex:0 0 auto}.inverter-panel h3{margin:2px 0 4px;font-size:20px}.inverter-panel p{margin:0;color:var(--muted)}.micro{display:block;color:#7d8f9b}.red{color:var(--red)!important;font-weight:800}.included-strip{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:4px 8px 20px;color:#708390;font-size:12px}.included-strip span{font-weight:900;color:var(--ink)}.included-strip b{font-weight:750;padding:7px 10px;border-radius:999px;background:#e6ece9;color:#5f7280}.switch-row{display:flex!important;align-items:flex-start!important;gap:12px!important;padding:14px 0!important;margin:0!important;color:var(--ink)!important;border-bottom:1px solid #edf1ef}.switch-row:last-of-type{border-bottom:0}.switch-row input{width:20px!important;height:20px!important;margin:2px 0 0;accent-color:var(--green-d)}.switch-row strong{display:block;font-size:14px}.switch-row small{display:block;font-size:12px;line-height:1.4;color:var(--muted);margin-top:4px;font-weight:600}.switch-row.compact{padding-top:4px!important}.nested-fields{padding:16px;border-radius:18px;background:#f5f7f5;margin:14px 0!important}.hint{font-size:12px;color:var(--muted)}.finance-hint{margin:12px 0}.chips{display:flex;flex-wrap:wrap;gap:7px;align-items:end;padding-top:23px}.chips button{min-height:38px;padding:0 11px;border-radius:999px;background:#fff;border:1px solid #cbd8d4;color:var(--ink);font-weight:800;cursor:pointer}.chips button[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}
.summary{padding:0;overflow:hidden;box-shadow:var(--shadow);border:0}.summary-head{padding:26px 26px 18px;display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.summary h3{margin:3px 0 0;font-size:23px;letter-spacing:-.03em}.live-dot{font-size:9px;font-weight:900;letter-spacing:.14em;color:#20874e;background:#e1f2e7;padding:7px 9px;border-radius:999px}.plain{list-style:none;margin:0;padding:0 26px 18px}.plain li{padding:11px 0;border-top:1px solid #edf1ef;font-size:13px;color:#5f7381}.plain li b{color:var(--ink)}#msgs,#supportMsgs,#loanMsgs{padding:0 26px}.msg{padding:10px 12px;border-radius:12px;margin:7px 0;font-size:12px;font-weight:650}.msg.err{background:#fdecef;color:#8f1729}.msg.warn{background:#fff5dd;color:var(--warn)}.msg.info{background:#e7f3ed;color:#15583c}.price-shell{padding:0 26px 24px}table.price{width:100%;border-collapse:collapse}table.price th,table.price td{padding:8px 0;font-size:13px}table.price th{text-align:left;font-weight:700;color:#697c89}table.price td{text-align:right;font-weight:850;font-variant-numeric:tabular-nums;white-space:nowrap}table.price tr.total th,table.price tr.total td{border-top:1px solid #dce4e1;padding-top:17px;font-size:16px;color:var(--ink)}table.price tr.total td{font-size:28px;letter-spacing:-.04em}table.price tr.sub th{padding-left:12px;color:#81919c}.result-section{border-top:1px solid #e7ecea;padding:22px 26px}.result-section #supportMsgs,.result-section #loanMsgs{padding:0}.result-title{display:flex;align-items:center;gap:10px}.result-title h3{font-size:17px;margin:0}.result-icon{width:34px;height:34px;border-radius:11px;background:#eef4f1;display:grid;place-items:center;font-size:13px;font-weight:900}.summary-foot{padding:18px 26px 24px;background:#f6f8f6}.disclaimer{font-size:10.5px;line-height:1.55;color:#7a8b96;margin:0 0 8px}.disclaimer:last-child{margin-bottom:0}.internal{border:1px dashed #d3c080;background:#fffdf5;box-shadow:none;padding:0;overflow:hidden}.internal summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px;padding:18px 20px;cursor:pointer}.internal summary::-webkit-details-marker{display:none}.internal summary span{display:flex;flex-direction:column}.internal summary b{font-size:13px}.internal summary small{font-size:10px;color:#8d8061;margin-top:2px}.internal summary i{font-style:normal;color:#a08f60}.internal-body{padding:0 20px 20px}.internal table{width:100%;border-collapse:collapse;font-size:11px}.internal td,.internal th{padding:6px 3px;border-bottom:1px solid #ece6d5;text-align:left}.internal td:last-child{text-align:right;white-space:nowrap}.internal h4{margin:16px 0 6px;font-size:12px}.internal p,.internal li{font-size:11px;color:#766f5e}.internal ul{padding-left:18px}.footer-inner{display:flex;justify-content:space-between;padding:26px 0 36px;color:#758793;font-size:11px}.footer-inner span{font-weight:900;color:var(--ink)}body.present .internal{display:none}.present .toolbar-actions .btn:last-child{display:none}
:focus-visible{outline:3px solid rgba(69,200,120,.45);outline-offset:2px}
@media(max-width:1000px){.hero-grid{grid-template-columns:1fr}.hero-art{height:410px}.layout{grid-template-columns:1fr}.col-side{position:static}.offer-choices{grid-template-columns:1fr 1fr}.toolbar{align-items:flex-start}}
@media(max-width:700px){.wrap{width:min(calc(100% - 28px),1280px)}.bar{height:68px}.brand-logo{width:142px}.secure-badge{display:none}.navlink{font-size:11px}.hero{padding:48px 0 56px}.hero h1{font-size:46px}.hero-art{height:340px}.sun{width:82px;height:82px;left:38px;top:42px}.house-card{right:32px;bottom:60px;transform:scale(.82);transform-origin:right bottom}.battery-card{right:18px;bottom:52px}.toolbar{flex-direction:column}.toolbar-actions{width:100%}.toolbar-actions .btn{flex:1}.offer-choices{grid-template-columns:1fr}.grid{grid-template-columns:1fr}.span2{grid-column:auto}.panel{border-radius:22px;padding:20px}fieldset.panel legend{font-size:18px}.col-side{gap:12px}.summary-head,.price-shell,.result-section,.summary-foot{padding-left:20px;padding-right:20px}.plain,#msgs,#supportMsgs,#loanMsgs{padding-left:20px;padding-right:20px}.hero-points{gap:7px}}
@media print{body{background:#fff}.no-print,.hero,.internal,.site-header,footer{display:none!important}.configurator{padding:0}.layout{display:block}.col-main{display:none}.col-side{position:static}.summary{box-shadow:none;border:0}.panel{break-inside:avoid}}

/* UI v2 */
.brandlock{display:flex;align-items:center}
.brand-logo{display:block;width:176px;height:auto}
.brand-fallback{display:none!important}
.inverter-copy{flex:1;min-width:0}
.approval-field{display:block;margin-top:16px;padding:15px;border-radius:16px;background:#fff;border:1px solid #d8e1de}
.approval-field>span{display:block;font-size:12px;font-weight:900;color:var(--ink);margin-bottom:4px}
.approval-field small,.field-help,.flow-question small{display:block;margin-top:6px;color:var(--muted);font-size:11px;font-weight:600;line-height:1.45}
.support-flow{display:grid;gap:12px}
.flow-question{display:block;padding:0;margin:0}
.flow-label{display:block;font-size:12px;font-weight:850;color:#5f7482;line-height:1.35}
.compact-question{margin-top:12px}
.input-suffix{position:relative}
.input-suffix input{padding-right:42px}
.input-suffix>span{position:absolute;right:15px;top:50%;transform:translateY(-23%);font-size:13px;font-weight:900;color:#718590}
.tax-person-card{padding:18px;border-radius:18px;background:#fff;border:1px solid #e0e7e4}
.tax-card-head{display:flex;justify-content:space-between;gap:12px;align-items:center}
.tax-card-head strong{font-size:15px;color:var(--ink)}
.tax-card-head small{font-size:11px;color:var(--muted);font-weight:700}
.limit-left{margin-top:12px;padding:10px 12px;border-radius:12px;background:#edf6f0;color:#527161;font-size:12px}
.limit-left strong{color:#188347;font-variant-numeric:tabular-nums}
.price-shell table.price tr.total td{font-size:32px}
.seller-panel{border:1px solid #dfe6e3;background:#fff;box-shadow:none}
.seller-panel summary{background:#f8faf8}
.seller-grid{grid-template-columns:1fr 1fr}
.seller-status{margin-top:16px;border-top:1px solid #edf1ef;padding-top:12px}
.seller-status-row{display:flex;justify-content:space-between;gap:16px;padding:7px 0;font-size:11px;color:#71838f}
.seller-status-row b{color:var(--ink);font-weight:850}
.seller-alert,.seller-ok{margin-top:10px;padding:11px 12px;border-radius:12px;font-size:11px;font-weight:750;line-height:1.4}
.seller-alert{background:#fff4df;color:#8b6417}
.seller-ok{background:#e8f4ec;color:#1e6843}
@media(max-width:700px){.brand-logo{width:148px}.seller-grid{grid-template-columns:1fr}.tax-card-head{align-items:flex-start;flex-direction:column;gap:3px}}

/* UI v3 */
.support-panel{
  overflow:hidden;
}
.support-summary{
  list-style:none;
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:14px;
  align-items:center;
  cursor:pointer;
  padding:20px 22px;
  user-select:none;
}
.support-summary::-webkit-details-marker{display:none}
.support-summary>span:nth-child(2){display:flex;flex-direction:column;gap:2px}
.support-summary small{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:850}
.support-summary .support-chevron{font-size:20px;color:#748892;transition:transform .2s ease}
.support-panel[open] .support-chevron{transform:rotate(180deg)}
.support-body{padding:0 22px 22px}
.support-body>.switch-row{margin-top:10px}
.context-chip{
  display:inline-flex;
  gap:6px;
  align-items:center;
  margin-top:9px;
  padding:8px 10px;
  border-radius:999px;
  background:#f1f5f3;
  color:#6b7d88;
  font-size:11px;
}
.context-chip strong{color:var(--ink)}
.condition-status{
  margin-top:10px;
  padding:10px 12px;
  border-radius:12px;
  font-size:11px;
  font-weight:750;
  line-height:1.4;
}
.condition-status.neutral{background:#f2f4f3;color:#6d7d86}
.condition-status.ok{background:#e8f4ec;color:#1e6843}
.condition-status.bad{background:#fff0ed;color:#a64134}

.se-info{
  display:flex;
  align-items:flex-start;
  gap:16px;
}
.se-info>div:last-child{flex:1}
.se-info h3{margin:5px 0 7px}
.se-info p{margin:0;color:var(--muted);font-size:12px;line-height:1.45}
.se-price-line{
  margin-top:12px;
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:center;
  padding-top:12px;
  border-top:1px solid #e6ece9;
  font-size:12px;
}
.se-price-line span{color:var(--muted)}
.se-price-line strong{font-size:17px;color:var(--ink)}

/* UI v4 - visibility and support controls */
[hidden]{display:none!important}

/* Dwa główne wybory w sekcji wsparcia */
.support-body{
  display:grid;
  gap:12px;
}
.support-choice{
  display:block;
  margin:0;
  cursor:pointer;
}
.support-choice>input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}
.support-choice__box{
  display:grid;
  grid-template-columns:38px 1fr;
  gap:13px;
  align-items:center;
  min-height:76px;
  padding:15px 16px;
  border:1px solid #dfe7e3;
  border-radius:17px;
  background:#fff;
  transition:border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.support-choice__mark{
  width:34px;
  height:34px;
  border-radius:11px;
  display:grid;
  place-items:center;
  border:1px solid #d5dfda;
  background:#f4f7f5;
  color:transparent;
  font-size:16px;
  font-weight:950;
}
.support-choice__box strong{
  display:block;
  font-family:inherit;
  font-size:13px;
  line-height:1.25;
  color:var(--ink);
}
.support-choice__box small{
  display:block;
  margin-top:4px;
  font-family:inherit;
  font-size:11px;
  line-height:1.42;
  color:var(--muted);
  font-weight:600;
}
.support-choice>input:checked + .support-choice__box{
  border-color:#b9d8c6;
  background:#f3faf6;
  box-shadow:0 0 0 3px rgba(69,200,120,.07);
}
.support-choice>input:checked + .support-choice__box .support-choice__mark{
  background:#45c878;
  border-color:#45c878;
  color:#fff;
}
.support-choice>input:focus-visible + .support-choice__box{
  outline:2px solid #183858;
  outline-offset:2px;
}

/* Pytania mają się pojawić dopiero pod konkretnym zaznaczonym wyborem */
.nested-fields.support-flow{
  margin:0 0 6px 51px;
  padding:16px;
  border-left:2px solid #dce7e1;
  border-radius:0 14px 14px 0;
  background:#f8faf9;
}

/* UI v5 - compact calculator handoff hero */
.hero-compact{
  padding:42px 0 46px;
}
.calc-hero{
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(360px,.88fr);
  gap:38px;
  align-items:center;
}
.hero-compact .hero-copy{
  max-width:760px;
}
.hero-compact h1{
  max-width:720px;
  margin-bottom:16px;
  font-size:clamp(44px,5.4vw,70px);
  line-height:.98;
}
.hero-compact .lead{
  max-width:720px;
  margin-bottom:22px;
  font-size:17px;
  line-height:1.55;
}
.compact-points{
  margin-top:22px;
  margin-bottom:0;
}
.calc-hero-card{
  border:1px solid rgba(13,39,67,.08);
  border-radius:28px;
  padding:30px;
  background:#fff;
  box-shadow:0 18px 48px rgba(13,39,67,.08);
}
.calc-hero-card__eyebrow{
  display:block;
  margin-bottom:14px;
  font-size:10px;
  font-weight:900;
  letter-spacing:.16em;
  color:#6f828e;
}
.calc-hero-card strong{
  display:block;
  max-width:420px;
  font-size:29px;
  line-height:1.06;
  letter-spacing:-.035em;
  color:var(--ink);
}
.calc-hero-card p{
  margin:12px 0 22px;
  color:var(--muted);
  font-size:13px;
  line-height:1.5;
}
.calc-flow{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}
.calc-flow span{
  padding:8px 10px;
  border-radius:999px;
  background:#f0f4f2;
  color:#5d7280;
  font-size:10px;
  font-weight:850;
}
.calc-flow i{
  font-style:normal;
  color:#9aabb4;
  font-size:12px;
}

/* UI v5 - logical PV mounting selection */
#roofStructureWrap[hidden]{
  display:none!important;
}

@media(max-width:900px){
  .calc-hero{
    grid-template-columns:1fr;
  }
  .calc-hero-card{
    max-width:720px;
  }
}
@media(max-width:700px){
  .hero-compact{
    padding:34px 0 38px;
  }
  .hero-compact h1{
    font-size:46px;
  }
  .calc-hero-card{
    padding:22px;
    border-radius:22px;
  }
  .calc-hero-card strong{
    font-size:24px;
  }
}

/* UI v6 - step headings fully inside white cards */
.step-panel{
  padding-top:28px!important;
}
.step-heading{
  display:flex;
  align-items:center;
  gap:14px;
  margin:0 0 22px;
}
.step-heading>span:last-child{
  display:flex;
  flex-direction:column;
  min-width:0;
}
.step-heading small{
  display:block;
  margin-bottom:2px;
  font-size:10px;
  line-height:1.25;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:#81929e;
  font-weight:850;
}
.step-heading strong{
  font-size:22px;
  line-height:1.15;
  letter-spacing:-.025em;
  color:var(--ink);
}

/* first card needs a little more breathing room above its three choices */
.choice-panel{
  padding-top:30px!important;
}
.choice-panel .offer-choices{
  margin-top:0;
}

/* Support: explain money inputs instead of presenting them as obvious values */
.support-explainer{
  padding:14px 15px;
  border-radius:14px;
  background:#eef4f1;
  border:1px solid #dde8e2;
  color:#617580;
}
.support-explainer strong{
  display:block;
  margin-bottom:4px;
  font-size:12px;
  color:var(--ink);
}
.support-explainer p{
  margin:0;
  font-size:11px;
  line-height:1.5;
}
.support-context{
  display:grid;
  grid-template-columns:1fr auto;
  gap:3px 12px;
  align-items:center;
  margin-top:10px;
  padding:11px 12px;
  border-radius:13px;
  background:#fff;
  border:1px solid #e1e8e5;
}
.support-context span{
  font-size:11px;
  color:#6b7e89;
  font-weight:700;
}
.support-context strong{
  font-size:13px;
  color:var(--ink);
}
.support-context em{
  grid-column:1/-1;
  font-size:10px;
  line-height:1.35;
  font-style:normal;
  color:#8a99a2;
}
.support-context.compact{
  margin-top:8px;
}

/* Remove default fieldset legend visual rules from the converted cards */
section.step-panel{
  border:1px solid rgba(13,39,67,.06);
}

@media(max-width:700px){
  .step-heading strong{font-size:19px}
}

/* UI v7 */
body{
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.ui-font,
.ui-font *{
  font-family:inherit!important;
}

/* kalkulator starts immediately, no separate hero */
.configurator{
  padding-top:30px;
}

/* support summary and controls use exactly the same typography */
.support-summary,
.support-summary *,
.support-choice__box,
.support-choice__box *{
  font-family:inherit!important;
}

/* cleaner automatic subsidy summary */
.auto-support-card{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.auto-support-card>div{
  padding:13px 14px;
  border-radius:14px;
  background:#fff;
  border:1px solid #e0e8e4;
}
.auto-support-card span{
  display:block;
  margin-bottom:4px;
  font-size:10px;
  font-weight:800;
  color:#738690;
  line-height:1.35;
}
.auto-support-card strong{
  font-size:16px;
  color:var(--ink);
  font-variant-numeric:tabular-nums;
}
.auto-support-card>small{
  grid-column:1/-1;
  color:#778994;
  font-size:10px;
  line-height:1.45;
}

/* inverter selection is a deliberate decision, never a live free-text field */
.approval-field select{
  width:100%;
  margin-top:8px;
}

/* fieldset loan header alignment closer to other step headings */
#loanBlock{
  padding-top:28px;
}
#loanBlock legend{
  float:none;
  width:100%;
  padding:0;
  margin:0 0 22px;
  display:flex;
  align-items:center;
  gap:14px;
}
#loanBlock legend>span:last-child{
  display:flex;
  flex-direction:column;
}
#loanBlock legend small{
  font-family:inherit;
  font-size:10px;
  line-height:1.25;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:#81929e;
  font-weight:850;
}

@media(max-width:700px){
  .auto-support-card{grid-template-columns:1fr}
  .auto-support-card>small{grid-column:auto}
}

/* UI v8 auth */
.seller-identity{
  min-height:64px;
  padding:12px 14px;
  border:1px solid #e0e7e4;
  border-radius:14px;
  background:#f8faf9;
}
.seller-identity__label{
  display:block;
  margin-bottom:5px;
  color:#7a8c96;
  font-size:10px;
  font-weight:850;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.seller-identity strong{
  color:var(--ink);
  font-size:16px;
  letter-spacing:.02em;
}

/* UI v9 - visual cleanup */

/* Cleaner top area */
.header-actions{gap:0}
.toolbar{align-items:flex-start}
.toolbar-copy{
  margin:8px 0 0;
  color:var(--muted);
  font-size:13px;
  font-weight:600;
}
.toolbar h2{font-size:clamp(32px,3.2vw,44px)}

/* Subtle staged entrance */
.entry-reveal{
  opacity:0;
  transform:translateY(12px);
  animation:edpEnter .46s cubic-bezier(.2,.7,.2,1) forwards;
}
.entry-1{animation-delay:.05s}
.entry-2{animation-delay:.14s}
@keyframes edpEnter{
  to{opacity:1;transform:none}
}
@media (prefers-reduced-motion:reduce){
  .entry-reveal{opacity:1;transform:none;animation:none}
}

/* Scope cards: protect text from top-right checkbox */
.offer-choice{
  padding-right:52px!important;
  min-height:118px;
}
.offer-choice>span:last-child{
  min-width:0;
  padding-right:2px;
}
.offer-choice strong{
  max-width:100%;
  overflow-wrap:anywhere;
}
.offer-choice input{
  right:16px;
  top:16px;
}

/* All numbered section headers share the same internal alignment */
.step-panel{
  padding-top:28px!important;
}
.step-heading,
.support-summary{
  min-height:44px;
  margin:0 0 22px;
  padding:0;
  display:flex;
  align-items:center;
  gap:14px;
}
.support-panel{
  padding:28px!important;
}
.support-summary{
  list-style:none;
  cursor:pointer;
}
.support-summary::-webkit-details-marker{display:none}
.support-heading-copy{
  display:flex;
  flex-direction:column;
  min-width:0;
}
.support-heading-copy small,
.step-heading small{
  font:850 10px/1.25 Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  letter-spacing:.13em!important;
  text-transform:uppercase!important;
  color:#81929e!important;
  margin:0 0 2px!important;
}
.support-heading-copy strong,
.step-heading strong{
  font:900 22px/1.15 Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  letter-spacing:-.025em!important;
  color:var(--ink)!important;
}
.support-chevron{
  margin-left:auto;
}
.support-body{
  padding:0;
}

/* Finance matches the same cards */
#loanBlock{
  padding-top:28px!important;
}

/* Summary configuration, more like an offer than a debug log */
.plain{
  display:grid;
  gap:0;
  padding:0 26px 20px;
}
.plain .config-item{
  display:grid;
  grid-template-columns:1fr auto;
  gap:3px 14px;
  align-items:center;
  padding:13px 0;
  border-top:1px solid #edf1ef;
}
.config-item__label{
  font-size:11px;
  font-weight:800;
  color:#738590;
}
.config-item__value{
  font-size:15px;
  line-height:1.2;
  color:var(--ink);
  text-align:right;
}
.config-item small{
  grid-column:1/-1;
  font-size:11px;
  color:#8a99a2;
  font-weight:600;
}

/* The number that matters after support */
.effective-price{
  margin-top:16px;
  padding:18px 18px 16px;
  border-radius:18px;
  background:#eaf5ee;
  border:1px solid #cfe5d7;
}
.effective-price>span{
  display:block;
  color:#517363;
  font-size:11px;
  font-weight:850;
}
.effective-price>strong{
  display:block;
  margin-top:2px;
  color:#176a43;
  font-size:32px;
  line-height:1.05;
  letter-spacing:-.045em;
  font-variant-numeric:tabular-nums;
}
.effective-price>small{
  display:block;
  margin-top:7px;
  color:#6e8378;
  font-size:10px;
  line-height:1.4;
}

/* Support details are collapsed by default in summary */
.support-result-details{
  padding:0!important;
}
.result-details-summary{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:20px 26px;
  cursor:pointer;
}
.result-details-summary::-webkit-details-marker{display:none}
.result-title span:last-child{
  display:flex;
  flex-direction:column;
}
.result-title b{
  font-size:14px;
  color:var(--ink);
}
.result-title small{
  margin-top:2px;
  font-size:10px;
  color:var(--muted);
  font-weight:650;
}
.result-chevron{
  color:#86969e;
  transition:transform .18s ease;
}
.support-result-details[open] .result-chevron{transform:rotate(180deg)}
.result-details-body{
  padding:0 26px 22px;
}
.result-details-body #supportMsgs{
  padding:0;
}

/* Seller panel: identity is a simple line, not a big field */
.seller-id-line{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:2px 0 14px;
  margin-bottom:12px;
  border-bottom:1px solid #ece6d5;
  font-size:11px;
  color:#877c62;
}
.seller-id-line strong{
  color:var(--ink);
  font-size:13px;
}
.seller-markup-field{
  display:block;
}
.seller-panel .internal-body{
  padding-top:0;
}

/* Override old oversized seller identity box */
.seller-identity{display:none!important}

/* Mobile */
@media(max-width:700px){
  .support-panel{padding:20px!important}
  .support-heading-copy strong,
  .step-heading strong{font-size:19px!important}
  .offer-choice{padding-right:48px!important}
  .effective-price>strong{font-size:28px}
}

/* UI v10 */

/* Support question groups: clean full-width cards, no green rail */
.nested-fields.support-flow{
  margin:10px 0 8px!important;
  padding:16px!important;
  border-left:0!important;
  border-radius:16px!important;
  background:#f7f9f8!important;
}

/* Audit values exist for verification, but don't clutter the workflow */
.support-audit{
  margin:0;
  border:1px solid #e1e8e5;
  border-radius:14px;
  background:#fff;
  overflow:hidden;
}
.support-audit>summary{
  list-style:none;
  cursor:pointer;
  padding:12px 14px;
  color:#71838d;
  font-size:11px;
  font-weight:800;
}
.support-audit>summary::-webkit-details-marker{display:none}
.support-audit>summary:after{
  content:"⌄";
  float:right;
  color:#92a0a7;
}
.support-audit[open]>summary:after{transform:rotate(180deg)}
.support-audit .auto-support-card{
  padding:0 14px 14px;
}

/* Panel handlowca: ID i narzut jako dwa spójne, kompaktowe pola */
.seller-compact{
  display:grid;
  gap:12px;
}
.seller-readonly-field,
.seller-markup-field{
  display:block;
  font-size:12px;
  font-weight:800;
  color:#667a88;
  letter-spacing:.01em;
}
.seller-readonly-field>span{
  display:block;
}
.seller-readonly-field>strong{
  display:block;
  margin-top:7px;
  min-height:50px;
  box-sizing:border-box;
  padding:15px 14px;
  border:1px solid #ccd8d5;
  border-radius:14px;
  background:#f4f7f5;
  color:var(--ink);
  font-size:13px;
  line-height:18px;
}
.seller-markup-field small{display:none}
.seller-status{
  margin-top:12px;
}

/* Remove old seller line treatment */
.seller-id-line{display:none!important}

/* SE is represented once, in the offer summary */
.se-info{display:none!important}

/* UI v12 */

.site-header .bar{
  justify-content:flex-start;
}

/* Tylko jeden nagłówek nad kalkulatorem */
.toolbar-minimal{
  min-height:0;
  padding:4px 0 18px;
}
.toolbar-minimal h2{
  margin:0;
}
.toolbar-minimal .eyebrow,
.toolbar-minimal .toolbar-copy,
.toolbar-minimal .toolbar-actions{
  display:none!important;
}

/* Programy + Finansowanie jako równorzędne rozwijane sekcje */
.finance-panel{
  padding:28px!important;
}
.finance-panel .finance-body{
  padding:0;
}
.finance-panel[open] .support-chevron{
  transform:rotate(180deg);
}

/* Czytelny podział: kwoty sprzedażowe i szczegóły techniczne */
.support-main-table tr th{
  font-weight:800;
}
.support-tech-details{
  margin-top:14px;
  border-top:1px solid #e8eeeb;
  padding-top:12px;
}
.support-tech-details>summary{
  list-style:none;
  cursor:pointer;
  color:#71838d;
  font-size:11px;
  font-weight:800;
  padding:4px 0 8px;
}
.support-tech-details>summary::-webkit-details-marker{display:none}
.support-tech-details>summary:after{
  content:"⌄";
  float:right;
  color:#96a4aa;
}
.support-tech-details[open]>summary:after{
  transform:rotate(180deg);
}
.support-tech-table{
  margin-top:4px;
}

/* panel handlowca */
.seller-markup-field input:focus::placeholder{
  color:transparent;
}

/* UI v13 */

/* Panel handlowca bez zbędnego opisu */
.seller-panel summary small{
  display:none!important;
}

/* Finansowanie: tylko gotowe okresy do wyboru */
.loan-period{
  margin-top:4px;
}
.loan-period>.flow-label{
  margin-bottom:10px;
}
.loan-period-options{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
}
.loan-period-options button{
  min-height:42px;
  padding:9px 8px;
  border:1px solid #dbe4e0;
  border-radius:12px;
  background:#fff;
  color:#617681;
  font:800 11px/1.2 Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  cursor:pointer;
  transition:border-color .16s ease,background .16s ease,color .16s ease;
}
.loan-period-options button.is-active,
.loan-period-options button[aria-pressed="true"]{
  border-color:#9bcab0;
  background:#eef8f2;
  color:#176a43;
}
.finance-icon{
  font-size:11px!important;
  letter-spacing:-.02em;
}

/* Końcowy koszt po programach - ten sam język wizualny co cena oferty */
.effective-price-inline{
  margin:0;
  padding:19px 26px 21px;
  border-radius:0;
  border:0;
  border-top:1px solid #dfe9e3;
  background:transparent;
}
.effective-price-inline>span{
  display:block;
  color:#3f795e;
  font-size:13px;
  font-weight:850;
}
.effective-price-inline>strong{
  display:block;
  margin-top:5px;
  color:#16834e;
  font-size:34px;
  line-height:1;
  letter-spacing:-.045em;
  font-variant-numeric:tabular-nums;
}
.effective-price-inline>small{
  display:block;
  margin-top:8px;
  color:#74877d;
  font-size:10px;
  line-height:1.45;
}

/* Programy mają naturalnie poprzedzać końcową cenę */
.support-result-details{
  margin-bottom:0;
}

/* Mobilnie okresy rat w 2 kolumnach */
@media(max-width:700px){
  .loan-period-options{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .effective-price-inline>strong{
    font-size:30px;
  }
}

/* UI v14 */

/* Footer stays at the bottom on short pages, but remains in normal document flow. */
body:not(.login-page){
  min-height:100vh;
  display:flex;
  flex-direction:column;
}
body:not(.login-page)>main{
  flex:1 0 auto;
}
body:not(.login-page)>footer{
  margin-top:auto;
}

/* Programy / Finansowanie - slightly tighter cards and lower visual center. */
.support-panel,
.finance-panel{
  padding:24px 28px 22px!important;
}
.support-panel>.support-summary,
.finance-panel>.support-summary{
  margin:4px 0 18px!important;
  min-height:44px;
}
.support-panel:not([open])>.support-summary,
.finance-panel:not([open])>.support-summary{
  margin-bottom:4px!important;
}

/* Post-support price uses exactly the same left-label / right-value composition as Cena oferty. */
.effective-price-inline{
  margin:0;
  padding:17px 26px 18px;
  border:0;
  border-top:1px solid #dfe9e3;
  border-radius:0;
  background:transparent;
}
.effective-price-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:16px;
  align-items:baseline;
}
.effective-price-row>span{
  color:#3f795e;
  font-size:16px;
  font-weight:800;
}
.effective-price-row>strong{
  color:#16834e;
  text-align:right;
  font-size:28px;
  line-height:1;
  letter-spacing:-.04em;
  font-weight:850;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
.effective-price-inline>small{
  display:block;
  margin-top:7px;
  color:#74877d;
  font-size:10px;
  line-height:1.45;
}

/* Standard scope belongs to the offer summary, not between configuration steps. */
.offer-standard{
  padding:17px 26px 20px;
  border-top:1px solid #e7ecea;
}
.offer-standard__label{
  display:block;
  margin-bottom:10px;
  color:#71838d;
  font-size:10px;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.offer-standard__items{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}
.offer-standard__items span{
  padding:7px 9px;
  border-radius:999px;
  background:#f0f4f2;
  color:#607480;
  font-size:10px;
  font-weight:750;
}

/* Old left-column standard strip no longer participates. */
.included-strip{
  display:none!important;
}

@media(max-width:700px){
  .support-panel,
  .finance-panel{
    padding:21px!important;
  }
  .effective-price-row>strong{
    font-size:26px;
  }
}

/* UI v16 */

/* Header logout */
.site-header .bar{
  justify-content:space-between!important;
}
.logout-btn{
  min-height:34px;
  padding:7px 12px;
  border:1px solid #d5dfda;
  border-radius:10px;
  background:rgba(255,255,255,.7);
  color:#667a86;
  font:800 10px/1 Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  cursor:pointer;
  transition:background .16s ease,border-color .16s ease,color .16s ease;
}
.logout-btn:hover{
  background:#fff;
  border-color:#bdcec5;
  color:#17364f;
}

/* Footer pinned to viewport bottom, like a real application footer */
body:not(.login-page){
  display:block!important;
  min-height:100vh;
  padding-bottom:62px;
}
body:not(.login-page)>footer{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:15;
  margin:0!important;
  background:rgba(242,245,242,.94);
  backdrop-filter:blur(14px);
  border-top:1px solid rgba(13,39,67,.06);
}
.footer-inner{
  padding:14px 0!important;
}

/* Make top and post-program numbers feel like one system */
.price-shell table.price tr.total th{
  font-size:14px!important;
}
.price-shell table.price tr.total td{
  font-size:24px!important;
  font-weight:850!important;
}
.effective-price-row>span{
  font-size:14px!important;
  font-weight:800!important;
}
.effective-price-row>strong{
  font-size:24px!important;
  font-weight:850!important;
}

/* Messages about program rules/call stay visible when Programy is expanded,
   even when Szczegóły wyliczenia remains closed. */
.result-details-body>#supportMsgs{
  margin-top:12px;
}
.support-tech-details+#supportMsgs:empty{
  display:none;
}

/* UI v17 */

/* Biała karta oferty kończy się na kosztach. "W standardzie" jest osobno pod nią. */
.offer-standard-outside{
  margin:14px 2px 18px;
  padding:0;
  border:0;
  background:transparent;
}
.offer-standard-outside .offer-standard__label{
  margin:0 0 9px 2px;
  color:#72848d;
  font-size:10px;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.offer-standard-outside .offer-standard__items{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:6px;
}
.offer-standard-outside .offer-standard__items span{
  min-height:31px;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:7px 7px;
  border:1px solid #dfe7e3;
  border-radius:999px;
  background:rgba(255,255,255,.56);
  color:#607480;
  font-size:9px;
  line-height:1.15;
  font-weight:800;
  text-align:center;
}

/* Na mniejszych ekranach układ kapsuł przechodzi w równą siatkę. */
@media(max-width:920px){
  .offer-standard-outside .offer-standard__items{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}
@media(max-width:560px){
  .offer-standard-outside .offer-standard__items{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* UI v18 - finansowanie header centering */
.finance-panel>.support-summary{
  transform:translateY(-4px);
}

/* UI v19 */

/* "W standardzie" closer to the offer card */
.offer-standard-outside{
  margin-top:7px!important;
}

/* Never show the empty gray summary shell before an offer exists */
.summary-card[hidden]{
  display:none!important;
}

/* UI v20 - Panel handlowca in the visual language of the inverter card */
.seller-panel{
  border:1px solid #dbe5e1!important;
  background:#eef4f2!important;
  box-shadow:none!important;
  overflow:hidden;
}
.seller-panel summary{
  min-height:64px;
  box-sizing:border-box;
  padding:14px 18px!important;
  background:#eef4f2!important;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  border-radius:18px;
}
.seller-panel summary:before{
  content:"";
  width:38px;
  height:38px;
  flex:0 0 38px;
  border-radius:13px;
  background:#d8ece0;
  box-shadow:inset 0 0 0 1px rgba(24,131,71,.04);
}
.seller-panel summary>span{
  flex:1;
  min-width:0;
}
.seller-panel summary b{
  color:var(--ink)!important;
  font-size:14px!important;
  font-weight:900!important;
}
.seller-panel summary i{
  color:#71858f!important;
  font-size:14px;
  transition:transform .18s ease;
}
.seller-panel[open] summary i{
  transform:rotate(180deg);
}
.seller-panel .internal-body{
  background:#fff;
  padding-top:18px;
}

/* UI v21 - discreet seller settings in header */

.header-tools{
  display:flex;
  align-items:center;
  gap:8px;
}

.seller-popover-wrap{
  position:relative;
}

.seller-tool-btn{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border:1px solid #d5dfda;
  border-radius:10px;
  background:rgba(255,255,255,.66);
  color:#74868f;
  cursor:pointer;
  transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease;
}
.seller-tool-btn:hover{
  background:#fff;
  border-color:#bdcec5;
  color:#17364f;
}
.seller-tool-btn[aria-expanded="true"]{
  background:#f3f8f5;
  border-color:#bdd4c6;
  color:#17643f;
}
.sun-icon{
  display:block;
  font-size:18px;
  line-height:1;
  transform:translateY(-.5px);
}

.seller-popover{
  position:absolute;
  top:42px;
  right:0;
  width:260px;
  z-index:50;
  box-sizing:border-box;
  padding:14px;
  border:1px solid #dce5e1;
  border-radius:16px;
  background:#fff;
  box-shadow:0 18px 44px rgba(15,39,61,.12);
}
.seller-popover[hidden]{
  display:none!important;
}

.seller-popover__row,
.seller-popover__field{
  display:block;
}
.seller-popover__row>span,
.seller-popover__field>span{
  display:block;
  margin-bottom:6px;
  color:#71838d;
  font-size:10px;
  font-weight:850;
  letter-spacing:.02em;
}
.seller-popover__id{
  padding-bottom:11px;
  margin-bottom:11px;
  border-bottom:1px solid #edf1ef;
}
.seller-popover__id strong{
  color:var(--ink);
  font-size:13px;
  font-weight:900;
}
.seller-popover__field input{
  width:100%;
  box-sizing:border-box;
  min-height:42px;
  padding:10px 12px;
  border:1px solid #d8e1dd;
  border-radius:12px;
  background:#fbfcfb;
  color:var(--ink);
  font:800 14px/1 Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  outline:none;
}
.seller-popover__field input:focus{
  border-color:#a7cbb5;
  background:#fff;
  box-shadow:0 0 0 3px rgba(53,140,88,.08);
}

/* old panel is gone */
.seller-panel{
  display:none!important;
}

/* UI v22 - compact seller popover */
.seller-popover--compact{
  width:220px;
  padding:12px;
}

.seller-popover__seller{
  padding:2px 2px 10px;
}
.seller-popover__seller strong{
  display:block;
  color:var(--ink);
  font-size:13px;
  font-weight:900;
  line-height:1.2;
  letter-spacing:.01em;
}

.seller-popover__field--compact{
  margin:0;
}
.seller-popover__field--compact input{
  width:100%;
  box-sizing:border-box;
  min-height:42px;
  padding:10px 12px;
  border:1px solid #d8e1dd;
  border-radius:12px;
  background:#fbfcfb;
  color:var(--ink);
  font:800 14px/1 Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  outline:none;
}
.seller-popover__field--compact input::placeholder{
  color:#8a999f;
  font-weight:700;
  opacity:1;
}
.seller-popover__field--compact input:focus::placeholder{
  opacity:0;
}

/* UI v24 - adaptive centered -> split layout */

/* Before a complete offer exists, the calculator is centered as a single column. */
.layout-adaptive{
  display:grid;
  grid-template-columns:minmax(0,760px);
  justify-content:center;
  align-items:start;
  gap:24px;
  transition:grid-template-columns .34s ease, gap .34s ease, justify-content .34s ease;
}
.layout-adaptive .col-main{
  width:100%;
  min-width:0;
  transition:transform .34s cubic-bezier(.2,.75,.2,1), width .34s ease;
}
.layout-adaptive .col-side{
  display:none;
}

/* Once a valid price/offer exists, return to the standard left + right composition. */
.layout-adaptive.has-offer{
  grid-template-columns:minmax(0,1fr) minmax(320px,420px);
  justify-content:stretch;
  gap:24px;
}
.layout-adaptive.has-offer .col-side{
  display:block;
  animation:offerSlideIn .34s cubic-bezier(.2,.75,.2,1) both;
}
.layout-adaptive.has-offer .col-main{
  animation:mainShiftLeft .34s cubic-bezier(.2,.75,.2,1) both;
}

@keyframes offerSlideIn{
  from{
    opacity:0;
    transform:translateX(18px);
  }
  to{
    opacity:1;
    transform:none;
  }
}
@keyframes mainShiftLeft{
  from{
    transform:translateX(26px);
  }
  to{
    transform:none;
  }
}

/* On small screens always stack naturally, without sideways movement. */
@media(max-width:980px){
  .layout-adaptive,
  .layout-adaptive.has-offer{
    grid-template-columns:minmax(0,1fr);
    justify-content:stretch;
  }
  .layout-adaptive.has-offer .col-side{
    display:block;
    animation:offerFadeIn .24s ease both;
  }
  .layout-adaptive.has-offer .col-main{
    animation:none;
  }
  @keyframes offerFadeIn{
    from{opacity:0;transform:translateY(8px)}
    to{opacity:1;transform:none}
  }
}

@media(prefers-reduced-motion:reduce){
  .layout-adaptive,
  .layout-adaptive .col-main,
  .layout-adaptive.has-offer .col-side,
  .layout-adaptive.has-offer .col-main{
    transition:none!important;
    animation:none!important;
  }
}

/* UI v25 - wider centered state + slower premium transition */

/* Before the offer exists, give the configurator enough width so product names
   stay on one line and the whole composition feels intentional. */
.layout-adaptive{
  grid-template-columns:minmax(0,940px) 0px!important;
  justify-content:center!important;
  gap:0!important;
  transition:
    grid-template-columns .72s cubic-bezier(.22,.61,.36,1),
    gap .72s cubic-bezier(.22,.61,.36,1),
    justify-content .72s cubic-bezier(.22,.61,.36,1)!important;
}

.layout-adaptive .col-main{
  min-width:0;
  width:100%;
  transition:
    transform .72s cubic-bezier(.22,.61,.36,1),
    width .72s cubic-bezier(.22,.61,.36,1)!important;
}

/* Keep the right column in the layout so its entrance can animate instead of
   appearing abruptly with display:none/display:block. */
.layout-adaptive .col-side{
  display:block!important;
  min-width:0;
  width:100%;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateX(34px);
  transition:
    opacity .48s ease .18s,
    transform .72s cubic-bezier(.22,.61,.36,1),
    visibility 0s linear .72s;
}

/* Completed offer: main configuration glides left while summary arrives from right. */
.layout-adaptive.has-offer{
  grid-template-columns:minmax(0,1fr) minmax(320px,420px)!important;
  justify-content:stretch!important;
  gap:24px!important;
}

.layout-adaptive.has-offer .col-main{
  animation:none!important;
  transform:translateX(0);
}

.layout-adaptive.has-offer .col-side{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateX(0);
  animation:none!important;
  transition:
    opacity .50s ease .18s,
    transform .72s cubic-bezier(.22,.61,.36,1),
    visibility 0s linear 0s;
}

/* Give the scope choices a little more room so labels don't split awkwardly. */
.layout-adaptive:not(.has-offer) .offer-choice{
  min-width:0;
}
.layout-adaptive:not(.has-offer) .offer-choice strong{
  white-space:normal;
}

/* On normal laptop widths, preserve the wider centered configuration. */
@media (min-width:981px) and (max-width:1180px){
  .layout-adaptive{
    grid-template-columns:minmax(0,860px) 0px!important;
  }
  .layout-adaptive.has-offer{
    grid-template-columns:minmax(0,1fr) minmax(310px,380px)!important;
  }
}

/* Mobile/tablet keeps natural stacked behavior. */
@media(max-width:980px){
  .layout-adaptive,
  .layout-adaptive.has-offer{
    grid-template-columns:minmax(0,1fr)!important;
    gap:20px!important;
  }
  .layout-adaptive .col-side{
    display:none!important;
  }
  .layout-adaptive.has-offer .col-side{
    display:block!important;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:none;
    transition:opacity .32s ease, transform .32s ease;
  }
}

/* Reduced motion remains fully usable. */
@media(prefers-reduced-motion:reduce){
  .layout-adaptive,
  .layout-adaptive .col-main,
  .layout-adaptive .col-side,
  .layout-adaptive.has-offer .col-side{
    transition:none!important;
    animation:none!important;
  }
}

/* UI v26 - butter-smooth offer transition */

/* The layout itself changes instantly; View Transitions animate the geometry.
   This avoids the two-step "shrink, then pop" feeling from animated grid tracks. */
.layout-adaptive,
.layout-adaptive.has-offer{
  transition:none!important;
}

.layout-adaptive .col-main{
  transition:none!important;
  view-transition-name:edp-main;
}

.layout-adaptive .col-side{
  transition:none!important;
  view-transition-name:edp-offer;
}

/* Default root crossfade is disabled so only the two meaningful regions animate. */
::view-transition-old(root),
::view-transition-new(root){
  animation:none;
  mix-blend-mode:normal;
}

/* Main configurator morphs from centered/wide to left/narrow as one continuous movement. */
::view-transition-group(edp-main){
  animation-duration:.82s;
  animation-timing-function:cubic-bezier(.22,.75,.18,1);
}

/* Offer arrives slightly after the main column starts moving. */
::view-transition-group(edp-offer){
  animation-duration:.82s;
  animation-timing-function:cubic-bezier(.22,.75,.18,1);
}

::view-transition-old(edp-offer){
  animation:edpOfferOut .26s ease both;
}

::view-transition-new(edp-offer){
  animation:edpOfferIn .62s cubic-bezier(.2,.72,.18,1) .12s both;
}

@keyframes edpOfferIn{
  from{
    opacity:0;
    transform:translateX(22px);
  }
  to{
    opacity:1;
    transform:translateX(0);
  }
}

@keyframes edpOfferOut{
  from{
    opacity:1;
    transform:translateX(0);
  }
  to{
    opacity:0;
    transform:translateX(12px);
  }
}

/* Fallback for browsers without View Transitions: still one continuous, softer movement. */
@supports not (view-transition-name:none){
  .layout-adaptive .col-main{
    transition:width .72s cubic-bezier(.22,.75,.18,1), transform .72s cubic-bezier(.22,.75,.18,1)!important;
  }
  .layout-adaptive .col-side{
    transition:opacity .52s ease .14s, transform .72s cubic-bezier(.22,.75,.18,1)!important;
  }
}

/* Keep headings and labels stable while the container changes width. */
.layout-adaptive .panel,
.layout-adaptive .offer-choice,
.layout-adaptive .support-panel,
.layout-adaptive .finance-panel{
  backface-visibility:hidden;
  transform:translateZ(0);
}

/* UI v27 - stable split layout during editing */

.offer-pending{
  padding:20px 22px;
  border:1px solid #dfe6e2;
  border-radius:20px;
  background:rgba(255,255,255,.72);
}
.offer-pending>span{
  display:block;
  color:var(--ink);
  font-size:13px;
  font-weight:850;
}
.offer-pending>small{
  display:block;
  margin-top:5px;
  color:#788a93;
  font-size:10px;
  line-height:1.45;
  font-weight:650;
}

/* Once the offer has appeared, adding another element does not make the whole
   page jump back to the centered state. */
.layout-adaptive.has-offer .col-side{
  min-height:1px;
}

/* UI v28 - one coherent motion language everywhere */

/* Scope cards: keep the descriptive line in one line on desktop. */
@media(min-width:1001px){
  .offer-choice{
    padding-right:18px!important;
  }
  .offer-choice>span:last-child{
    padding-right:0!important;
    min-width:0;
  }
  .offer-choice small{
    white-space:nowrap;
    font-size:11px;
    letter-spacing:-.01em;
  }
}

/* The desktop layout never changes the width of the main configurator.
   Before an offer exists, the main column is simply translated to the visual center.
   When an offer appears, it glides left while the right column fades/slides in. */
@media(min-width:1181px){
  .layout-adaptive,
  .layout-adaptive.has-offer{
    --edp-main-w:860px;
    --edp-side-w:390px;
    --edp-gap:24px;
    display:grid!important;
    grid-template-columns:var(--edp-main-w) var(--edp-side-w)!important;
    gap:var(--edp-gap)!important;
    justify-content:center!important;
    align-items:start;
    transition:none!important;
  }

  .layout-adaptive .col-main{
    width:var(--edp-main-w)!important;
    transform:translateX(calc((var(--edp-side-w) + var(--edp-gap)) / 2));
    transition:transform .92s cubic-bezier(.2,.82,.2,1)!important;
    animation:none!important;
    will-change:transform;
  }

  .layout-adaptive .col-side{
    display:grid!important;
    width:var(--edp-side-w)!important;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateX(26px);
    transition:
      opacity .48s ease .24s,
      transform .78s cubic-bezier(.2,.82,.2,1) .08s,
      visibility 0s linear .95s!important;
    animation:none!important;
    will-change:opacity,transform;
  }

  .layout-adaptive.has-offer .col-main{
    transform:translateX(0);
  }

  .layout-adaptive.has-offer .col-side{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateX(0);
    transition:
      opacity .52s ease .20s,
      transform .82s cubic-bezier(.2,.82,.2,1) .06s,
      visibility 0s linear 0s!important;
  }
}

/* Slightly smaller desktop keeps the same motion principle with responsive widths. */
@media(min-width:1001px) and (max-width:1180px){
  .layout-adaptive,
  .layout-adaptive.has-offer{
    --edp-side-w:340px;
    --edp-gap:20px;
    grid-template-columns:minmax(0,1fr) var(--edp-side-w)!important;
    gap:var(--edp-gap)!important;
    justify-content:stretch!important;
  }
  .layout-adaptive .col-main{
    transform:translateX(calc((var(--edp-side-w) + var(--edp-gap)) / 2));
    transition:transform .92s cubic-bezier(.2,.82,.2,1)!important;
  }
  .layout-adaptive .col-side{
    display:grid!important;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateX(22px);
    transition:
      opacity .46s ease .22s,
      transform .78s cubic-bezier(.2,.82,.2,1) .08s,
      visibility 0s linear .95s!important;
  }
  .layout-adaptive.has-offer .col-main{
    transform:translateX(0);
  }
  .layout-adaptive.has-offer .col-side{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:none;
  }
}

/* Every newly revealed configuration section uses the same soft entrance. */
.ui-flow-in{
  animation:edpSectionFlow .46s cubic-bezier(.2,.76,.2,1) var(--flow-delay,0ms) both;
}
@keyframes edpSectionFlow{
  from{
    opacity:0;
    transform:translateY(12px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

/* Every offer entrance, including cooperative-only and returning cached values,
   uses exactly the same motion. No bounce, no scale. */
.offer-flow-in{
  animation:edpOfferFlow .58s cubic-bezier(.2,.76,.2,1) .16s both;
}
@keyframes edpOfferFlow{
  from{
    opacity:0;
    transform:translateX(14px);
  }
  to{
    opacity:1;
    transform:translateX(0);
  }
}

/* Do not let old View Transition rules interfere with the unified motion. */
::view-transition-old(root),
::view-transition-new(root),
::view-transition-group(edp-main),
::view-transition-group(edp-offer),
::view-transition-old(edp-offer),
::view-transition-new(edp-offer){
  animation:none!important;
}

/* Pending state uses the same quiet entrance. */
.offer-pending:not([hidden]){
  animation:edpOfferFlow .42s cubic-bezier(.2,.76,.2,1) .10s both;
}

@media(max-width:1000px){
  .layout-adaptive .col-main,
  .layout-adaptive.has-offer .col-main{
    transform:none!important;
  }
  .layout-adaptive .col-side{
    display:none!important;
  }
  .layout-adaptive.has-offer .col-side{
    display:grid!important;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:none;
  }
}

@media(prefers-reduced-motion:reduce){
  .layout-adaptive .col-main,
  .layout-adaptive .col-side,
  .ui-flow-in,
  .offer-flow-in,
  .offer-pending:not([hidden]){
    transition:none!important;
    animation:none!important;
    transform:none!important;
  }
}

/* UI v29 - compact seller popover + smarter recentering */

/* Smaller, quieter seller popover. */
.seller-popover--compact{
  width:194px!important;
  padding:9px!important;
  border-radius:14px!important;
}

.seller-popover__seller{
  padding:0 3px 6px!important;
}

.seller-popover__seller strong{
  color:#8a999f!important;
  font-size:10px!important;
  line-height:1.2!important;
  font-weight:700!important;
  letter-spacing:.01em!important;
}

.seller-popover__field--compact input{
  min-height:38px!important;
  padding:9px 11px!important;
  border-radius:10px!important;
  font-size:13px!important;
}

/* The ID now reads like a discreet contextual hint directly above the field,
   not like a heading. */
.seller-popover__field--compact input::placeholder{
  font-size:12px!important;
  font-weight:650!important;
}

/* When the last fully configured base disappears, the left column returns
   smoothly to the centered state instead of leaving a pointless pending offer. */
.layout-adaptive:not(.has-offer) .offer-pending{
  display:none!important;
}

/* UI v30 */
.seller-popover__seller{
  padding:0 3px 2px!important;
}
.seller-popover__seller strong{
  margin:0!important;
}
.seller-popover__field--compact{
  margin-top:0!important;
}

/* 30.1 - ME-only subsidy flow */
#existPvWrap:not([hidden]),
#subSystemWrap:not([hidden]),
#subCondsWrap:not([hidden]){
  animation:edpSectionFlow .38s cubic-bezier(.2,.76,.2,1) both;
}

/* 30.2 - clean financing summary */

.loan-summary-card{
  border-top:1px solid #e7ecea;
  background:transparent;
}

.loan-summary-head{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:18px 26px;
  cursor:pointer;
}
.loan-summary-head::-webkit-details-marker{display:none}

.loan-summary-title{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.loan-summary-kicker{
  color:#7f9099;
  font-size:10px;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.loan-summary-title strong{
  color:var(--ink);
  font-size:13px;
  font-weight:850;
  line-height:1.25;
}

.loan-summary-card[open] .result-chevron{
  transform:rotate(180deg);
}

.loan-summary-body{
  padding:0 26px 20px;
}

.loan-hero{
  padding:3px 0 16px;
}
.loan-hero__label{
  display:block;
  color:#71838d;
  font-size:11px;
  font-weight:800;
}
.loan-hero>strong{
  display:block;
  margin-top:3px;
  color:var(--ink);
  font-size:31px;
  line-height:1;
  font-weight:900;
  letter-spacing:-.045em;
  font-variant-numeric:tabular-nums;
}
.loan-hero__meta{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:10px;
}
.loan-hero__meta span{
  padding:6px 8px;
  border-radius:999px;
  background:#f1f4f3;
  color:#6f818a;
  font-size:9px;
  font-weight:800;
}

.loan-tech-details{
  padding-top:11px;
  border-top:1px solid #edf1ef;
}
.loan-tech-details>summary{
  list-style:none;
  cursor:pointer;
  color:#75868e;
  font-size:10px;
  font-weight:850;
  padding:2px 0 8px;
}
.loan-tech-details>summary::-webkit-details-marker{display:none}
.loan-tech-details>summary:after{
  content:"⌄";
  float:right;
  color:#98a5aa;
}
.loan-tech-details[open]>summary:after{
  transform:rotate(180deg);
}
.loan-tech-table{
  margin-top:4px;
}
.loan-tech-table tr th,
.loan-tech-table tr td{
  font-size:10px!important;
}
.loan-tech-table tr td{
  font-weight:800!important;
}

/* Financing should not compete visually with the main investment price. */
.loan-summary-card .price tr.total th,
.loan-summary-card .price tr.total td{
  font-size:10px!important;
}

/* 30.3 - centered start screen for investment scope */

/* Desktop: before anything is selected, the three investment-scope choices
   sit in the visual center of the available screen instead of starting at the top. */
@media(min-width:1001px){
  .layout-adaptive:not(.config-started):not(.has-offer){
    min-height:calc(100vh - 86px);
    align-items:start!important;
  }

  .layout-adaptive:not(.config-started):not(.has-offer) .col-main{
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-height:calc(100vh - 110px);
    transform:translateX(calc((var(--edp-side-w,390px) + var(--edp-gap,24px)) / 2));
  }

  .layout-adaptive:not(.config-started):not(.has-offer) #scopePanel{
    width:100%;
    transform:translateY(-3vh);
  }

  /* Once the user makes the first selection, the selector glides upward.
     The movement is intentionally slower than the section reveals. */
  .layout-adaptive.config-started .col-main{
    justify-content:flex-start;
    min-height:0;
  }

  #scopePanel{
    transition:
      transform .78s cubic-bezier(.2,.82,.2,1),
      margin .78s cubic-bezier(.2,.82,.2,1)!important;
    will-change:transform;
  }

  .layout-adaptive.config-started #scopePanel{
    transform:translateY(0);
  }
}

/* The scope panel is the anchor of the experience. */
#scopePanel{
  position:relative;
  z-index:2;
}

/* Newly exposed configuration blocks should feel like the page unfolds
   from the selector, not like the rest of the form suddenly pops in. */
.config-reveal-block:not([hidden]){
  animation:configStageReveal .52s cubic-bezier(.2,.76,.2,1) both;
}

#pvBlock.config-reveal-block:not([hidden]){
  animation-delay:.12s;
}
#meBlock.config-reveal-block:not([hidden]){
  animation-delay:.17s;
}
#inverterBlock.config-reveal-block:not([hidden]){
  animation-delay:.22s;
}
#subsidyBlock.config-reveal-block:not([hidden]){
  animation-delay:.27s;
}
#loanBlock.config-reveal-block:not([hidden]){
  animation-delay:.32s;
}

@keyframes configStageReveal{
  from{
    opacity:0;
    transform:translateY(18px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

/* Avoid a hard jump when returning to the untouched state. */
.layout-adaptive:not(.config-started) #scopePanel{
  transition:
    transform .82s cubic-bezier(.2,.82,.2,1),
    margin .82s cubic-bezier(.2,.82,.2,1)!important;
}

/* On smaller screens, keep the selector naturally near the top. */
@media(max-width:1000px){
  .layout-adaptive:not(.config-started):not(.has-offer),
  .layout-adaptive:not(.config-started):not(.has-offer) .col-main{
    min-height:0!important;
    display:block!important;
  }
  .layout-adaptive:not(.config-started):not(.has-offer) #scopePanel{
    transform:none!important;
  }
}

@media(prefers-reduced-motion:reduce){
  #scopePanel,
  .config-reveal-block:not([hidden]){
    transition:none!important;
    animation:none!important;
    transform:none!important;
  }
}

/* 30.4 - simplified start position; no viewport locking, no flex jump */

/* Undo the 30.3 full-screen/flex experiment. The page must always remain
   a normal, scrollable document. */
html,
body{
  overflow-y:auto!important;
  overflow-x:hidden;
}

@media(min-width:1001px){
  .layout-adaptive:not(.config-started):not(.has-offer),
  .layout-adaptive.config-started,
  .layout-adaptive.has-offer{
    min-height:0!important;
    align-items:start!important;
  }

  .layout-adaptive:not(.config-started):not(.has-offer) .col-main,
  .layout-adaptive.config-started .col-main,
  .layout-adaptive.has-offer .col-main{
    display:block!important;
    min-height:0!important;
    justify-content:initial!important;
  }

  /* Start lower on the page, but stay in normal document flow. */
  #scopePanel{
    margin-top:0;
    transform:none!important;
    transition:margin-top .88s cubic-bezier(.2,.82,.2,1)!important;
    will-change:margin-top;
  }

  .layout-adaptive:not(.config-started):not(.has-offer) #scopePanel{
    margin-top:clamp(110px,18vh,190px);
    transform:none!important;
  }

  .layout-adaptive.config-started #scopePanel,
  .layout-adaptive.has-offer #scopePanel{
    margin-top:0;
  }
}

/* Same motion language for all newly revealed sections. */
.config-reveal-block:not([hidden]){
  animation:edpUnifiedReveal .48s cubic-bezier(.2,.76,.2,1) both!important;
}

#pvBlock.config-reveal-block:not([hidden]),
#meBlock.config-reveal-block:not([hidden]){
  animation-delay:.14s!important;
}
#inverterBlock.config-reveal-block:not([hidden]){
  animation-delay:.20s!important;
}
#subsidyBlock.config-reveal-block:not([hidden]){
  animation-delay:.26s!important;
}
#loanBlock.config-reveal-block:not([hidden]){
  animation-delay:.32s!important;
}

@keyframes edpUnifiedReveal{
  from{
    opacity:0;
    transform:translateY(14px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

/* Never animate the whole main column vertically. Horizontal offer movement
   remains controlled by the established 30.2/30.3 split-layout rules. */
.layout-adaptive .col-main{
  transition:transform .92s cubic-bezier(.2,.82,.2,1)!important;
}

/* Mobile stays natural and immediately scrollable. */
@media(max-width:1000px){
  #scopePanel{
    margin-top:20px!important;
    transform:none!important;
  }
}

@media(prefers-reduced-motion:reduce){
  #scopePanel{
    transition:none!important;
  }
  .config-reveal-block:not([hidden]){
    animation:none!important;
  }
}

/* 30.5 - financing moved to the right, below "W standardzie" */

.finance-option{
  margin-top:8px;
  border:1px solid #e2e8e5;
  border-radius:16px;
  background:rgba(255,255,255,.84);
  overflow:hidden;
}

.finance-option__summary{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px;
  cursor:pointer;
}
.finance-option__summary::-webkit-details-marker{display:none}

.finance-option__summary>div{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.finance-option__eyebrow{
  color:#8b999f;
  font-size:9px;
  line-height:1.1;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.finance-option__summary strong{
  color:var(--ink);
  font-size:12px;
  line-height:1.3;
  font-weight:850;
}

.finance-option[open]>.finance-option__summary .support-chevron{
  transform:rotate(180deg);
}

.finance-option__body{
  padding:0 16px 16px;
}

.finance-option .switch-row{
  margin-top:2px;
}

.finance-option .loan-period{
  margin-top:12px;
}

.finance-option .loan-period-options{
  gap:6px;
}

.finance-option .loan-period-options button{
  min-width:0;
  padding:8px 9px;
  font-size:10px;
}

.finance-option .finance-hint{
  margin:9px 0 0;
  font-size:9px;
}

.loan-summary-card--embedded{
  margin-top:14px;
  border-top:1px solid #e8edeb;
  background:transparent;
}

.loan-summary-card--embedded .loan-summary-head{
  padding:14px 0 10px;
}

.loan-summary-card--embedded .loan-summary-body{
  padding:0 0 4px;
}

.finance-option__disclaimer{
  margin:12px 0 0!important;
  padding-top:10px;
  border-top:1px solid #edf1ef;
  font-size:8.5px!important;
  line-height:1.45;
}

/* The old left-side numbered financing step no longer exists. */
#stepLoan{
  display:none!important;
}

/* 30.7 - financing as a distinct green option */

.finance-option--accent{
  margin-top:10px;
  border:1px solid #b8d9c5;
  border-radius:16px;
  background:#edf7f1;
  overflow:hidden;
}

.finance-option__summary--centered{
  position:relative;
  justify-content:center!important;
  min-height:48px;
  padding:14px 42px!important;
  text-align:center;
}

.finance-option__summary--centered strong{
  color:#245d3c!important;
  font-size:13px!important;
  font-weight:900!important;
  letter-spacing:.01em;
}

.finance-option__summary--centered .support-chevron{
  position:absolute;
  right:16px;
  top:50%;
  transform:translateY(-50%);
  color:#4d7b60;
}

.finance-option--accent[open] .finance-option__summary--centered .support-chevron{
  transform:translateY(-50%) rotate(180deg);
}

.finance-option--accent .finance-option__body{
  padding-top:6px;
  background:rgba(255,255,255,.36);
}

.finance-option--accent .loan-period{
  margin-top:0;
}

/* "W standardzie" belongs to PV now. */
.pv-standard{
  margin-top:18px;
  padding-top:16px;
  border-top:1px solid #e7ece9;
  text-align:center;
}

.pv-standard__label{
  display:block;
  margin-bottom:9px;
  color:#8a989e;
  font-size:9px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.pv-standard__items{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:7px;
}

.pv-standard__items span{
  padding:6px 9px;
  border-radius:999px;
  background:#f3f6f4;
  color:#667a71;
  font-size:9px;
  font-weight:800;
}

/* 30.8 - compact financing, sticky offer, inline PV standard */

/* Right offer stays visible while the left configuration scrolls. */
@media(min-width:1001px){
  .layout-adaptive .col-side{
    position:sticky;
    top:18px;
    align-self:start;
    max-height:calc(100vh - 36px);
    overflow-y:auto;
    overscroll-behavior:contain;
    scrollbar-width:thin;
    padding-bottom:6px;
  }
}

/* Financing trigger: much smaller and visually balanced. */
.finance-option--accent{
  margin-top:8px;
  border-radius:13px;
}

.finance-option__summary--centered{
  min-height:36px!important;
  padding:9px 34px!important;
}

.finance-option__summary--centered strong{
  font-size:12px!important;
  line-height:1.15!important;
  font-weight:850!important;
}

.finance-option__summary--centered .support-chevron{
  right:13px;
  font-size:12px;
}

/* Expanded financing: same scale as the rest of the interface. */
.finance-option--accent .finance-option__body{
  padding:10px 12px 12px!important;
}

.finance-option--accent .nested-fields{
  margin-top:0!important;
}

.finance-option--accent .flow-label{
  font-size:9px!important;
  margin-bottom:6px!important;
  color:#7d8f87!important;
  font-weight:850!important;
  letter-spacing:.03em;
}

.finance-option--accent .loan-period-options{
  gap:5px!important;
}

.finance-option--accent .loan-period-options button{
  min-height:30px!important;
  padding:6px 8px!important;
  border-radius:9px!important;
  font-size:9px!important;
  font-weight:800!important;
}

/* Compact the overpayment option instead of the large standard checkbox row. */
.finance-option--accent .switch-row.compact{
  min-height:0!important;
  margin-top:9px!important;
  padding:8px 9px!important;
  gap:8px!important;
  border-radius:10px!important;
}

.finance-option--accent .switch-row.compact input[type="checkbox"]{
  width:14px!important;
  height:14px!important;
  min-width:14px!important;
  margin:0!important;
}

.finance-option--accent .switch-row.compact span strong{
  font-size:9.5px!important;
  line-height:1.25!important;
  font-weight:800!important;
}

/* "Po ilu ratach" should be a small technical field, not a giant form block. */
.finance-option--accent #overFields{
  margin-top:7px!important;
  display:block!important;
}

.finance-option--accent #overFields[hidden]{
  display:none!important;
}

.finance-option--accent #overFields label{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  font-size:9px!important;
  color:#71827b!important;
  font-weight:750!important;
}

.finance-option--accent #overAfter{
  width:74px!important;
  min-height:30px!important;
  padding:6px 8px!important;
  border-radius:9px!important;
  font-size:10px!important;
  text-align:center!important;
}

.finance-option--accent .finance-hint{
  margin:7px 0 0!important;
  font-size:8.5px!important;
  line-height:1.35!important;
}

/* Monthly payment remains the focal point, but no oversized typography. */
.finance-option--accent .loan-summary-card--embedded{
  margin-top:10px!important;
}

.finance-option--accent .loan-summary-head{
  padding:10px 0 7px!important;
}

.finance-option--accent .loan-summary-kicker{
  font-size:8.5px!important;
}

.finance-option--accent .loan-summary-title strong{
  font-size:11px!important;
}

.finance-option--accent .loan-hero{
  padding:2px 0 10px!important;
}

.finance-option--accent .loan-hero__label{
  font-size:9px!important;
}

.finance-option--accent .loan-hero>strong{
  margin-top:2px!important;
  font-size:24px!important;
  letter-spacing:-.035em!important;
}

.finance-option--accent .loan-hero__meta{
  margin-top:7px!important;
  gap:5px!important;
}

.finance-option--accent .loan-hero__meta span{
  padding:5px 7px!important;
  font-size:8px!important;
}

.finance-option__disclaimer{
  margin-top:9px!important;
  padding-top:8px!important;
  font-size:7.8px!important;
}

/* PV "W standardzie:" compact, left aligned and inline. */
.pv-standard{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:7px;
  margin-top:14px!important;
  padding-top:12px!important;
  text-align:left!important;
}

.pv-standard__label{
  display:inline-block!important;
  margin:0!important;
  color:#74867d!important;
  font-size:9px!important;
  font-weight:850!important;
  letter-spacing:0!important;
  text-transform:none!important;
  white-space:nowrap;
}

.pv-standard__items{
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:flex-start!important;
  gap:5px!important;
  flex:1 1 auto;
}

.pv-standard__items span{
  padding:5px 7px!important;
  border-radius:999px!important;
  font-size:8.5px!important;
}

/* Smooth open/close language stays consistent. */
.finance-option--accent[open] .finance-option__body{
  animation:edpUnifiedReveal .34s cubic-bezier(.2,.76,.2,1) both;
}

/* Prevent sticky side from feeling cramped on shorter screens. */
@media(max-height:760px) and (min-width:1001px){
  .layout-adaptive .col-side{
    top:10px;
    max-height:calc(100vh - 20px);
  }
}

/* 30.9 - redesigned financing trigger, not merely compressed */

/* Make financing read like one deliberate premium action, not another big card. */
.finance-option--accent{
  margin-top:9px!important;
  border:0!important;
  border-radius:11px!important;
  background:transparent!important;
  overflow:visible!important;
}

/* Slim green action bar. */
.finance-option__summary--centered{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:34px!important;
  height:34px!important;
  padding:0 38px!important;
  border:1px solid #bdd8c6!important;
  border-radius:11px!important;
  background:linear-gradient(180deg,#edf8f1 0%,#e8f4ed 100%)!important;
  cursor:pointer!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72)!important;
  transition:
    background .25s ease,
    border-color .25s ease,
    transform .25s cubic-bezier(.2,.76,.2,1)!important;
}

/* The label now has the same visual weight as the other UI headings. */
.finance-option__summary--centered strong{
  color:#2e6544!important;
  font-size:11.5px!important;
  line-height:1!important;
  font-weight:850!important;
  letter-spacing:.015em!important;
}

/* Chevron becomes a small control detail rather than a floating symbol. */
.finance-option__summary--centered .support-chevron{
  position:absolute!important;
  right:8px!important;
  top:50%!important;
  width:20px!important;
  height:20px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.64)!important;
  color:#527965!important;
  font-size:11px!important;
  line-height:1!important;
  transform:translateY(-50%)!important;
  transition:transform .25s cubic-bezier(.2,.76,.2,1), background .25s ease!important;
}

.finance-option--accent[open] .finance-option__summary--centered{
  border-color:#aacdb7!important;
  background:linear-gradient(180deg,#eaf6ef 0%,#e3f1e9 100%)!important;
}

.finance-option--accent[open] .finance-option__summary--centered .support-chevron{
  transform:translateY(-50%) rotate(180deg)!important;
  background:rgba(255,255,255,.82)!important;
}

/* Expanded content becomes a separate clean sheet under the slim trigger. */
.finance-option--accent .finance-option__body{
  margin-top:6px!important;
  padding:12px 12px 11px!important;
  border:1px solid #e1e9e4!important;
  border-radius:12px!important;
  background:#fff!important;
  box-shadow:none!important;
}

/* Period selector gets normal proportions and hierarchy. */
.finance-option--accent .flow-label{
  margin-bottom:7px!important;
  color:#6f8178!important;
  font-size:9.5px!important;
  font-weight:800!important;
  letter-spacing:.02em!important;
}

.finance-option--accent .loan-period-options{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:5px!important;
}

.finance-option--accent .loan-period-options button{
  min-height:29px!important;
  height:29px!important;
  padding:0 5px!important;
  border-radius:8px!important;
  font-size:9px!important;
  font-weight:800!important;
}

/* Keep secondary financing controls restrained and aligned. */
.finance-option--accent .switch-row.compact{
  margin-top:9px!important;
  padding:7px 8px!important;
  border-radius:9px!important;
  background:#f7f9f8!important;
  border:1px solid #edf1ef!important;
}

.finance-option--accent .switch-row.compact input[type="checkbox"]{
  width:13px!important;
  height:13px!important;
  min-width:13px!important;
}

.finance-option--accent .switch-row.compact span strong{
  font-size:9px!important;
  font-weight:780!important;
}

.finance-option--accent #overFields{
  margin-top:6px!important;
}

.finance-option--accent #overFields label{
  min-height:31px!important;
  padding:0!important;
  font-size:8.8px!important;
}

.finance-option--accent #overAfter{
  width:62px!important;
  min-height:28px!important;
  height:28px!important;
  padding:4px 7px!important;
  border-radius:8px!important;
  font-size:9.5px!important;
}

/* Result styling remains elegant and calm. */
.finance-option--accent .loan-summary-card--embedded{
  margin-top:10px!important;
  padding-top:1px!important;
  border-top:1px solid #edf1ef!important;
}

.finance-option--accent .loan-hero>strong{
  font-size:22px!important;
  line-height:1.02!important;
}

.finance-option--accent .loan-hero__meta span{
  background:#f3f6f4!important;
  color:#6c7e75!important;
}

/* Same motion language as the rest of the calculator. */
.finance-option--accent[open] .finance-option__body{
  animation:edpUnifiedReveal .38s cubic-bezier(.2,.76,.2,1) both!important;
}

@media(hover:hover) and (pointer:fine){
  .finance-option__summary--centered:hover{
    background:linear-gradient(180deg,#e8f6ee 0%,#e2f1e8 100%)!important;
    border-color:#accfb9!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .finance-option__summary--centered,
  .finance-option__summary--centered .support-chevron,
  .finance-option--accent[open] .finance-option__body{
    transition:none!important;
    animation:none!important;
  }
}

/* 30.10 - offer is always anchored at the top when visible */

/* Desktop: keep the entire right offer module fixed directly below the sticky header.
   The grid still reserves its column, so the left configurator layout does not change. */
@media(min-width:1181px){
  .layout-adaptive.has-offer .col-side{
    position:fixed!important;
    top:94px!important;
    right:max(24px, calc((100vw - 1280px) / 2))!important;
    width:390px!important;
    max-height:calc(100vh - 108px)!important;
    overflow-y:auto!important;
    overscroll-behavior:contain;
    z-index:10;
    align-self:auto!important;
  }
}

/* Medium desktop uses the narrower side column defined by the adaptive layout. */
@media(min-width:1001px) and (max-width:1180px){
  .layout-adaptive.has-offer .col-side{
    position:fixed!important;
    top:94px!important;
    right:24px!important;
    width:340px!important;
    max-height:calc(100vh - 108px)!important;
    overflow-y:auto!important;
    overscroll-behavior:contain;
    z-index:10;
    align-self:auto!important;
  }
}

/* When there is no offer, keep the hidden right column in normal layout state. */
@media(min-width:1001px){
  .layout-adaptive:not(.has-offer) .col-side{
    position:static!important;
    max-height:none!important;
    overflow:visible!important;
  }
}

/* Mobile/tablet remains part of normal document flow. */
@media(max-width:1000px){
  .layout-adaptive .col-side,
  .layout-adaptive.has-offer .col-side{
    position:static!important;
    width:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }
}

/* 30.11 - correct sticky offer, never overlapping the left column */

/* Undo the fixed-position experiment from 30.10.
   The offer stays inside its reserved grid column and sticks below the header. */
@media(min-width:1001px){
  .layout-adaptive.has-offer .col-side{
    position:sticky!important;
    top:94px!important;
    right:auto!important;
    left:auto!important;
    width:auto!important;
    max-width:none!important;
    max-height:none!important;
    overflow:visible!important;
    overscroll-behavior:auto!important;
    z-index:2!important;
    align-self:start!important;
  }

  /* Explicitly preserve the two-column grid so the right offer can never cover
     fields in the configurator. */
  .layout-adaptive.has-offer{
    align-items:start!important;
  }
}

/* Medium desktop: keep the right column in the grid rather than floating it
   over the configurator. */
@media(min-width:1001px) and (max-width:1180px){
  .layout-adaptive.has-offer .col-side{
    position:sticky!important;
    top:94px!important;
    right:auto!important;
    width:auto!important;
  }
}

/* No offer = normal hidden side column behavior. */
@media(min-width:1001px){
  .layout-adaptive:not(.has-offer) .col-side{
    position:static!important;
    top:auto!important;
    right:auto!important;
    width:100%!important;
  }
}

/* 30.12 - desktop app layout:
   top menu stays fixed, right offer stays fixed in place,
   ONLY the left configurator column scrolls. */

@media(min-width:1001px){

  html,
  body{
    height:100%;
    overflow:hidden!important;
  }

  .site-header{
    position:relative!important;
    top:auto!important;
    z-index:100!important;
    height:78px;
    flex:0 0 78px;
  }

  main{
    height:calc(100vh - 78px);
    overflow:hidden!important;
  }

  .configurator{
    height:100%;
    padding:0!important;
    overflow:hidden!important;
  }

  .configurator>.wrap{
    height:100%;
  }

  .layout-adaptive,
  .layout-adaptive.has-offer{
    height:100%;
    max-height:100%;
    align-items:stretch!important;
  }

  /* LEFT SIDE - this is the only main scrolling area. */
  .layout-adaptive .col-main,
  .layout-adaptive.has-offer .col-main{
    height:100%;
    max-height:100%;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain;
    padding-top:18px;
    padding-bottom:88px;
    padding-right:5px;
    scrollbar-gutter:stable;
    scrollbar-width:thin;
  }

  /* RIGHT SIDE - never follows the left scroll.
     It stays exactly where it appeared. */
  .layout-adaptive .col-side,
  .layout-adaptive.has-offer .col-side{
    position:relative!important;
    top:auto!important;
    right:auto!important;
    left:auto!important;
    align-self:start!important;
    height:auto!important;
    max-height:calc(100vh - 98px)!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain;
    margin-top:18px!important;
    padding:0 0 8px!important;
    z-index:2!important;
    scrollbar-width:thin;
  }

  /* Financing sits directly under the visible offer with no floating gap. */
  .layout-adaptive.has-offer .finance-option{
    margin-top:6px!important;
  }

  /* Keep the offer stack compact and visually attached. */
  .layout-adaptive.has-offer .summary{
    margin-bottom:0!important;
  }
}

/* Mobile/tablet keeps normal page scrolling. */
@media(max-width:1000px){
  html,
  body{
    height:auto!important;
    overflow-y:auto!important;
  }

  main,
  .configurator,
  .configurator>.wrap,
  .layout-adaptive,
  .layout-adaptive .col-main,
  .layout-adaptive .col-side{
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }

  .site-header{
    position:sticky!important;
    top:0!important;
  }
}

/* 30.13 - no footer, invisible left scrollbar, financing closer to offer */

@media(min-width:1001px){
  /* Left side still scrolls normally, but without any visible scrollbar. */
  .layout-adaptive .col-main,
  .layout-adaptive.has-offer .col-main{
    scrollbar-width:none!important;
    -ms-overflow-style:none!important;
  }

  .layout-adaptive .col-main::-webkit-scrollbar,
  .layout-adaptive.has-offer .col-main::-webkit-scrollbar{
    width:0!important;
    height:0!important;
    display:none!important;
  }

  /* Financing sits almost flush under the offer. */
  .layout-adaptive.has-offer .finance-option{
    margin-top:2px!important;
  }

  .layout-adaptive.has-offer .summary{
    margin-bottom:0!important;
  }
}

/* Footer is intentionally removed from the interface. */
footer,
.site-footer,
.footer{
  display:none!important;
}

/* 30.14 - keep the login screen centered.
   Desktop app scrolling rules from 30.12/30.13 should apply only to the calculator,
   not to login.html. */

body.login-page{
  height:100%!important;
  min-height:100vh!important;
  overflow:auto!important;
}

body.login-page main,
body.login-page .login-main{
  min-height:100vh!important;
  height:auto!important;
  overflow:visible!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}

body.login-page .login-shell,
body.login-page .login-wrap,
body.login-page .login-card-wrap{
  margin:auto!important;
}

/* Fallback in case login.html doesn't currently expose a dedicated body class. */
@supports selector(body:has(.login-card)){
  body:has(.login-card){
    height:100%!important;
    min-height:100vh!important;
    overflow:auto!important;
  }

  body:has(.login-card) main{
    min-height:100vh!important;
    height:auto!important;
    overflow:visible!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }
}

/* 30.18 - financing sits tighter under offer and opens as one smooth surface */

@media(min-width:1001px){
  .layout-adaptive.has-offer .finance-option{
    margin-top:0!important;
    transform:translateY(-5px);
  }
}

/* Do not animate with the generic reveal - use a dedicated measured expansion. */
.finance-option--accent[open] .finance-option__body{
  animation:none!important;
}

.finance-option--accent{
  overflow:hidden!important;
}

/* Closed body state */
.finance-option--accent .finance-option__body{
  display:grid!important;
  grid-template-rows:0fr;
  margin-top:0!important;
  padding:0 12px!important;
  border:0!important;
  border-radius:0 0 12px 12px!important;
  background:#fff!important;
  opacity:0;
  transform:translateY(-4px);
  overflow:hidden!important;
  transition:
    grid-template-rows .48s cubic-bezier(.2,.82,.2,1),
    opacity .30s ease,
    transform .48s cubic-bezier(.2,.82,.2,1),
    padding .48s cubic-bezier(.2,.82,.2,1),
    margin-top .48s cubic-bezier(.2,.82,.2,1),
    border-color .48s ease;
}

.finance-option--accent .finance-option__body > *{
  min-height:0;
}

/* Open state */
.finance-option--accent[open] .finance-option__body{
  grid-template-rows:1fr;
  margin-top:4px!important;
  padding:10px 12px 10px!important;
  border:1px solid #e4ebe7!important;
  opacity:1;
  transform:translateY(0);
}

/* Remove the beige / grey auxiliary surfaces around financing controls. */
.finance-option--accent .switch-row.compact{
  margin-top:6px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  border-radius:0!important;
}

.finance-option--accent .loan-hero__meta span{
  background:transparent!important;
  border:1px solid #e6ece8!important;
}

.finance-option--accent .nested-fields{
  margin-top:0!important;
}

/* Repayment period label and chips are tightly grouped. */
.finance-option--accent .flow-label{
  margin:0 0 4px!important;
  line-height:1.1!important;
}

.finance-option--accent .loan-period,
.finance-option--accent .loan-period-options{
  margin-top:0!important;
}

.finance-option--accent .loan-period-options{
  gap:4px!important;
}

.finance-option--accent .loan-period-options button{
  min-height:28px!important;
  height:28px!important;
  padding:0 5px!important;
  border-radius:8px!important;
}

/* Bring every following financing element upward and reduce dead space. */
.finance-option--accent .finance-hint{
  margin:5px 0 0!important;
}

.finance-option--accent #overFields{
  margin-top:4px!important;
}

.finance-option--accent .loan-summary-card--embedded{
  margin-top:7px!important;
}

.finance-option--accent .loan-summary-head{
  padding:7px 0 5px!important;
}

.finance-option--accent .loan-hero{
  padding:0 0 7px!important;
}

.finance-option__disclaimer{
  margin-top:6px!important;
  padding-top:6px!important;
}

/* The financing trigger visually attaches to the offer above. */
.finance-option__summary--centered{
  height:32px!important;
  min-height:32px!important;
}

/* 30.19 - REAL financing rebuild */

/* button directly under offer */
@media(min-width:1001px){
  .layout-adaptive.has-offer .finance-option{
    margin-top:-8px!important;
    transform:none!important;
  }
}

/* no details/default browser behavior */
.finance-option--accent{
  border:0!important;
  background:transparent!important;
  overflow:visible!important;
}

/* slim financing trigger */
.finance-option__summary--centered{
  width:100%!important;
  height:31px!important;
  min-height:31px!important;
  padding:0 34px!important;
  border:1px solid #bdd8c6!important;
  border-radius:10px!important;
  background:#eaf5ee!important;
  box-shadow:none!important;
  cursor:pointer!important;
}

/* smooth panel: animate height via grid, no pop */
.finance-reveal{
  display:grid;
  grid-template-rows:0fr;
  opacity:0;
  transform:translateY(-5px);
  transition:
    grid-template-rows .46s cubic-bezier(.22,.78,.22,1),
    opacity .28s ease,
    transform .46s cubic-bezier(.22,.78,.22,1);
}

.finance-reveal__inner{
  min-height:0;
  overflow:hidden;
}

.finance-option.is-open .finance-reveal{
  grid-template-rows:1fr;
  opacity:1;
  transform:translateY(0);
}

.finance-option.is-open .support-chevron{
  transform:translateY(-50%) rotate(180deg)!important;
}

/* IMPORTANT: no beige/grey box AROUND repayment period */
.finance-reveal__inner,
#loanFields,
.finance-period,
.finance-option--accent .loan-period,
.finance-option--accent .nested-fields,
.finance-option--accent .finance-option__body{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  border-radius:0!important;
}

/* content begins immediately below button */
.finance-reveal__inner{
  padding:7px 1px 0!important;
}

#loanFields{
  margin:0!important;
  padding:0!important;
}

/* "Okres spłaty" with chips immediately below it */
.finance-period{
  margin:0!important;
  padding:0!important;
}

.finance-period .flow-label{
  display:block!important;
  margin:0 0 3px!important;
  padding:0!important;
  font-size:9.5px!important;
  line-height:1!important;
  color:#6f8178!important;
  font-weight:800!important;
}

.finance-option--accent .loan-period-options{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:4px!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
}

.finance-option--accent .loan-period-options button{
  height:27px!important;
  min-height:27px!important;
  padding:0 5px!important;
  margin:0!important;
  border-radius:8px!important;
  font-size:9px!important;
  box-shadow:none!important;
}

/* no extra "beige" chip container */
.finance-option--accent .chips{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

/* pull every following element upward */
.finance-option--accent .finance-hint{
  margin:4px 0 0!important;
  padding:0!important;
}

.finance-option--accent .switch-row.compact{
  margin:5px 0 0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  min-height:20px!important;
}

.finance-option--accent #overFields{
  margin:4px 0 0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
}

.finance-overpay-row{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  font-size:8.8px!important;
}

.finance-overpay-row #overAfter{
  width:62px!important;
  height:27px!important;
  min-height:27px!important;
  padding:4px 7px!important;
  border-radius:8px!important;
}

/* compact result area */
.finance-option--accent .loan-summary-card--embedded{
  margin-top:6px!important;
}

.finance-option--accent .finance-option__disclaimer{
  margin-top:5px!important;
  padding-top:5px!important;
}

/* smooth internal reveal, no generic pop */
.finance-option.is-open .finance-reveal__inner{
  animation:financeInnerFade .38s .05s both cubic-bezier(.22,.78,.22,1);
}

@keyframes financeInnerFade{
  from{opacity:0;transform:translateY(-4px)}
  to{opacity:1;transform:translateY(0)}
}

/* v31.0.2: szczegóły kwoty inwestycji */
.price-shell .price-toggle{appearance:none;background:transparent;border:0;padding:0;color:inherit;font:inherit;font-weight:inherit;letter-spacing:inherit;cursor:pointer;display:inline-flex;align-items:center;justify-content:flex-end;gap:8px;text-align:right;white-space:nowrap}
.price-shell .price-toggle:focus-visible{outline:2px solid #126a4c;outline-offset:4px;border-radius:4px}
.price-shell .price-toggle-chevron{font-size:16px;line-height:1;display:inline-block;transition:transform .18s ease}
.price-shell .price-toggle[aria-expanded="true"] .price-toggle-chevron{transform:rotate(180deg)}
.price-shell #netDetailRow[hidden],.price-shell #vatDetailRow[hidden]{display:none!important}
@media(prefers-reduced-motion:reduce){.price-shell .price-toggle-chevron{transition:none}}