.szd-calculator,
.szd-calculator-placeholder {
	--szd-calc-forest: #223028;
	--szd-calc-forest-dark: #17211b;
	--szd-calc-graphite: #252725;
	--szd-calc-wood: #9b642f;
	--szd-calc-cream: #f3efe7;
	--szd-calc-paper: #fbfaf7;
	--szd-calc-white: #fff;
	--szd-calc-line: #cfc5b7;
	--szd-calc-muted: #6b706c;
	--szd-calc-danger: #a53d32;
	--szd-calc-radius: 18px;
	--szd-calc-shadow: 0 18px 55px rgba(23, 33, 27, .1);
	--szd-calc-shadow-soft: 0 10px 34px rgba(38, 43, 39, .055);
	box-sizing: border-box;
	color: var(--szd-calc-graphite);
	font-family: "Manrope", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.szd-calculator *,
.szd-calculator *::before,
.szd-calculator *::after { box-sizing: border-box; }

.szd-calculator button,
.szd-calculator input,
.szd-calculator select,
.szd-calculator textarea { font: inherit; }

.szd-calculator button {
	touch-action: manipulation;
	-webkit-tap-highlight-color: transparent;
}

.szd-calculator button:focus-visible,
.szd-calculator input:focus-visible,
.szd-calculator select:focus-visible,
.szd-calculator textarea:focus-visible,
.szd-calculator [tabindex]:focus-visible {
	outline: 3px solid var(--szd-calc-wood);
	outline-offset: 2px;
}

.szd-calculator-placeholder {
	padding: 24px;
	border: 1px solid var(--szd-calc-line);
	border-radius: 14px;
	background: var(--szd-calc-cream);
}

.szd-preview-admin > .description { margin-bottom: 18px; }

.szd-calculator {
	width: 100%;
	max-width: 1560px;
	margin: 20px 0 40px;
	overflow: clip;
	border: 1px solid var(--szd-calc-line);
	border-radius: 24px;
	background: #e8e2d8;
	box-shadow: var(--szd-calc-shadow);
}

.szd-calc-header {
	min-height: 76px;
	padding: 14px 24px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	position: relative;
	isolation: isolate;
	overflow: hidden;
	color: var(--szd-calc-white);
	background: var(--szd-calc-forest-dark);
	border-bottom: 1px solid rgba(255,255,255,.1);
}

.szd-calc-header::after {
	content: "";
	position: absolute;
	inset: 0 0 0 52%;
	z-index: -1;
	opacity: .24;
	background-image: linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px);
	background-size: 22px 22px;
	mask-image: linear-gradient(90deg, transparent, #000);
}

.szd-calc-brand { display: flex; align-items: center; gap: 12px; }
.szd-calc-brand__mark {
	width: 44px;
	height: 44px;
	display: grid;
	place-items: center;
	flex: 0 0 auto;
	border: 1px solid rgba(255,255,255,.28);
	border-radius: 12px;
	color: #f0d9bd;
	background: rgba(255,255,255,.06);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .08em;
}
.szd-calc-brand strong { display: block; color: #fff; font-size: 14px; letter-spacing: .08em; }
.szd-calc-brand small { margin-top: 3px; display: block; color: rgba(255,255,255,.65); font-size: 12px; }
.szd-calc-badge {
	padding: 8px 12px;
	border: 1px solid rgba(255,255,255,.24);
	border-radius: 999px;
	color: #f0d9bd;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .08em;
	white-space: nowrap;
}

.szd-calc-shell {
	padding: 22px;
	background-image: radial-gradient(circle at 8% 0, rgba(155,100,47,.09), transparent 31%), linear-gradient(145deg, #eee9e0, #e4ddd1);
}
.szd-calc-steps {
	margin: 0 0 18px;
	padding: 5px;
	display: flex;
	gap: 4px;
	overflow-x: auto;
	border: 1px solid #e4ded4;
	border-radius: 17px;
	background: #f1eee7;
	scrollbar-width: thin;
}
.szd-calc-step {
	min-height: 48px;
	padding: 7px 14px 7px 8px;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex: 0 0 auto;
	border: 1px solid transparent;
	border-radius: 12px;
	color: var(--szd-calc-muted);
	background: transparent;
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
}
.szd-calc-step span {
	width: 30px;
	height: 30px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: var(--szd-calc-cream);
	font-weight: 800;
}
.szd-calc-step:hover { color: var(--szd-calc-forest); background: rgba(255,255,255,.58); }
.szd-calc-step.is-active { color: var(--szd-calc-forest); border-color: #cfc6b8; background: var(--szd-calc-white); box-shadow: 0 7px 22px rgba(34,48,40,.09); }
.szd-calc-step.is-active span { color: #fff; background: var(--szd-calc-forest); }

.szd-calc-workspace {
	display: grid;
	grid-template-columns: minmax(390px, 1.15fr) minmax(390px, .95fr) minmax(280px, .68fr);
	gap: 18px;
	align-items: start;
}
.szd-calc-visual,
.szd-calc-config,
.szd-calc-summary {
	border: 1px solid #c4b6a3;
	border-radius: var(--szd-calc-radius);
	box-shadow: 0 13px 36px rgba(44,36,27,.1), 0 2px 7px rgba(44,36,27,.055);
}
.szd-calc-visual { position: sticky; top: 44px; overflow: hidden; padding: 22px; background: linear-gradient(155deg,#f3ecdf 0%,#e9dfd0 100%); }
.szd-calc-config { min-height: 650px; position: relative; overflow: hidden; padding: 26px; background: #fffdf8; }
.szd-calc-summary { position: sticky; top: 44px; overflow: hidden; padding: 22px; background: linear-gradient(155deg,#f0f5f1 0%,#e4ede7 100%); }
.szd-calc-visual::before,
.szd-calc-config::before,
.szd-calc-summary::before { content: ""; height: 3px; position: absolute; top: 0; right: 0; left: 0; background: var(--szd-calc-line); }
.szd-calc-visual::before { background: var(--szd-calc-wood); }
.szd-calc-config::before { background: var(--szd-calc-forest); }
.szd-calc-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.szd-calc-panel-head h2 {
	margin: 5px 0 0;
	color: var(--szd-calc-forest-dark) !important;
	font-family: "Lora", Georgia, serif;
	font-size: clamp(21px, 2vw, 27px);
	line-height: 1.2;
}
.szd-calc-eyebrow { color: var(--szd-calc-wood); font-size: 11px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.szd-calc-text-button { padding: 7px; border: 0; color: var(--szd-calc-forest); background: transparent; font-size: 13px; font-weight: 800; cursor: pointer; }

.szd-calc-view-switch {
	margin-top: 17px;
	padding: 4px;
	display: grid;
	grid-template-columns: repeat(3, minmax(0,1fr));
	gap: 4px;
	border: 1px solid #ded7cb;
	border-radius: 13px;
	background: #f2eee5;
}
.szd-calc-view-switch button {
	min-height: 44px;
	padding: 8px 10px;
	border: 0;
	border-radius: 10px;
	color: #5b625d;
	background: transparent;
	font: inherit;
	font-size: 12px;
	font-weight: 850;
	cursor: pointer;
	touch-action: manipulation;
}
.szd-calc-view-switch button:hover { color: var(--szd-calc-forest); background: rgba(255,255,255,.68); }
.szd-calc-view-switch button.is-active { color: #fff; background: var(--szd-calc-forest); box-shadow: 0 5px 14px rgba(28,65,50,.18); }

.szd-calc-plan {
	min-height: 420px;
	margin: 18px 0 13px;
	display: grid;
	place-items: center;
	overflow: hidden;
	border: 1px solid #c9bba7;
	border-radius: 15px;
	background: linear-gradient(180deg,#f8f7f2 0%,#e3e9e0 100%);
	box-shadow: inset 0 1px 0 rgba(255,255,255,.8), inset 0 -16px 36px rgba(91,72,50,.055);
}
.szd-calculator[data-visual-view="top"] .szd-calc-plan { background-image: linear-gradient(rgba(142,151,142,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(142,151,142,.1) 1px,transparent 1px); background-size: 24px 24px; }
.szd-calc-plan svg { width: 100%; height: 420px; display: block; }
.szd-calc-legend { display: flex; flex-wrap: wrap; gap: 13px; color: var(--szd-calc-muted); font-size: 12px; }
.szd-calc-legend span { display: inline-flex; align-items: center; gap: 6px; }
.szd-calc-legend i { width: 20px; height: 4px; display: inline-block; border-radius: 5px; }
.szd-calc-legend .is-house { background: #3b4740; }
.szd-calc-legend .is-railing { background: var(--szd-calc-wood); }
.szd-calc-legend .is-access { height: 10px; border: 1px solid var(--szd-calc-wood); background: #f7f3ea; }
.szd-calc-legend .is-roof { opacity: .7; background: #78958a; }
.szd-calc-legend .is-material { height: 7px; background: repeating-linear-gradient(90deg,#d7a263 0 5px,#71431f 6px 7px); }
.szd-calc-legend .is-foundation { height: 7px; background: radial-gradient(circle,#73766f 1px,transparent 1.5px) 0 0/5px 5px,#b7b5aa; }
.szd-calc-visual-note { margin: 14px 0 0; color: var(--szd-calc-muted); font-size: 12px; line-height: 1.55; }

.szd-calc-title {
	margin: 0 0 7px;
	color: var(--szd-calc-forest-dark) !important;
	font-family: "Lora", Georgia, serif;
	font-size: clamp(24px, 2.3vw, 31px);
	line-height: 1.15;
}
.szd-calc-progress { margin-bottom: 13px; display: flex; align-items: center; gap: 12px; color: var(--szd-calc-muted); font-size: 11px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.szd-calc-progress__bar { height: 6px; min-width: 90px; flex: 1; overflow: hidden; border-radius: 99px; background: #ece8df; }
.szd-calc-progress__bar i { height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg, var(--szd-calc-wood), var(--szd-calc-forest)); transition: width .25s ease; }
.szd-calc-title[tabindex="-1"]:focus-visible {
	outline: 3px solid var(--szd-calc-wood);
	outline-offset: 5px;
}
.szd-calc-lead { margin: 0 0 16px; color: var(--szd-calc-muted); font-size: 14px; line-height: 1.6; }
.szd-calc-step-guide { margin: 0 0 22px; padding: 14px 15px; border: 1px solid #c3cec6; border-radius: 13px; background: linear-gradient(135deg,#eef5f0,#f4ecdf); box-shadow: 0 5px 14px rgba(45,56,49,.055); }
.szd-calc-step-guide > span { display: block; margin-bottom: 4px; color: var(--szd-calc-wood); font-size: 9px; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.szd-calc-step-guide strong { display: block; color: var(--szd-calc-forest-dark); font-size: 14px; }
.szd-calc-step-guide p { margin: 5px 0 0; color: #5b625d; font-size: 12px; line-height: 1.5; }
.szd-calc-included { margin: 0 0 18px; padding: 14px 15px; border: 1px solid #aec3b6; border-radius: 13px; background: #edf5ef; }
.szd-calc-included > span { display: block; margin-bottom: 5px; color: var(--szd-calc-wood); font-size: 9px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.szd-calc-included strong { display: block; color: var(--szd-calc-forest-dark); font-size: 13px; line-height: 1.45; }
.szd-calc-included p { margin: 6px 0 0; color: var(--szd-calc-muted); font-size: 12px; line-height: 1.45; }
.szd-calc-live-price-inline { margin: -7px 0 20px; padding: 14px 16px; position: relative; overflow: hidden; border-radius: 13px; color: #fff; background: var(--szd-calc-forest); box-shadow: 0 10px 24px rgba(28,65,50,.13); }
.szd-calc-live-price-inline small { display: block; margin-bottom: 4px; color: rgba(255,255,255,.72); font-size: 10px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.szd-calc-live-price-inline strong { display: block; font-family: "Lora", Georgia, serif; font-size: 23px; line-height: 1.2; }
.szd-calc-live-price-inline em { margin-top: 4px; display: block; color: rgba(255,255,255,.76); font-size: 11px; font-style: normal; }
.szd-calc-live-price-inline.is-loading::after { content: ""; width: 35%; height: 3px; position: absolute; left: -35%; bottom: 0; background: var(--szd-calc-wood); animation: szd-calc-loading 1.15s linear infinite; }
.szd-calc-advanced { grid-column: 1 / -1; padding: 11px 13px; border: 1px dashed #cfc5b7; border-radius: 11px; background: #faf8f3; }
.szd-calc-advanced summary { min-height: 30px; display: flex; align-items: center; color: var(--szd-calc-forest); font-size: 12px; font-weight: 850; cursor: pointer; touch-action: manipulation; }
.szd-calc-advanced summary::before { content: "+"; width: 22px; margin-right: 7px; display: inline-grid; place-items: center; border-radius: 50%; color: #fff; background: var(--szd-calc-forest); }
.szd-calc-advanced[open] summary::before { content: "−"; }
.szd-calc-advanced > p { margin: 8px 0 12px; color: var(--szd-calc-muted); font-size: 12px; line-height: 1.5; }
.szd-calc-heading { margin: 22px 0 11px; color: var(--szd-calc-forest-dark) !important; font-size: 15px; }
.szd-calc-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 13px; }
.szd-calc-field { display: grid; gap: 7px; min-width: 0; }
.szd-calc-field.is-full { grid-column: 1 / -1; }
.szd-calc-field label { display: grid; gap: 7px; color: #40463f; font-size: 12px; font-weight: 800; }
.szd-calc-field__label { display: block; }
.szd-calc-field input,
.szd-calc-field select,
.szd-calc-field textarea {
	width: 100%;
	min-height: 46px;
	padding: 11px 12px;
	border: 1px solid var(--szd-calc-line);
	border-radius: 11px;
	color: var(--szd-calc-graphite);
	background: #fffefa;
	box-shadow: inset 0 1px 2px rgba(44,35,24,.04);
}
.szd-calc-field textarea { min-height: 104px; resize: vertical; }
.szd-calc-field input:hover,
.szd-calc-field select:hover,
.szd-calc-field textarea:hover { border-color: #bcae9b; }
.szd-calc-field input:focus,
.szd-calc-field select:focus,
.szd-calc-field textarea:focus { border-color: var(--szd-calc-wood); box-shadow: 0 0 0 3px rgba(155,100,47,.1); }
.szd-calc-field small { color: var(--szd-calc-muted); line-height: 1.45; }
.szd-calc-cards { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 11px; }
.szd-calc-cards.is-three { grid-template-columns: repeat(3, minmax(0,1fr)); }
.szd-calc-card {
	min-height: 116px;
	padding: 15px;
	position: relative;
	border: 1px solid #d0c3b1;
	border-radius: 14px;
	color: var(--szd-calc-graphite);
	background: linear-gradient(145deg,#f7f2e9,#f0e8dc);
	text-align: left;
	cursor: pointer;
	box-shadow: inset 0 1px 0 rgba(255,255,255,.8), 0 4px 12px rgba(74,57,38,.045);
	transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.szd-calc-card:hover { transform: translateY(-2px); border-color: #a98763; background: #fbf6ed; box-shadow: 0 9px 20px rgba(74,57,38,.09); }
.szd-calc-card.is-selected { padding-right: 48px; border-color: var(--szd-calc-forest); background: linear-gradient(145deg,#eef5ef,#e3eee6); box-shadow: inset 0 0 0 1px var(--szd-calc-forest), 0 9px 24px rgba(34,48,40,.11); }
.szd-calc-card.is-selected::after { content: "✓"; width: 25px; height: 25px; position: absolute; top: 12px; right: 12px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--szd-calc-forest); font-size: 12px; font-weight: 900; }
.szd-calc-card[data-choice-field="foundation"]::before,
.szd-calc-card[data-choice-field="packageId"]::before,
.szd-calc-card[data-choice-field="deckDirection"]::before,
.szd-calc-card[data-choice-field="deckTone"]::before,
.szd-calc-card[data-choice-field="structureTone"]::before { content: ""; height: 7px; position: absolute; top: 0; right: 0; left: 0; border-radius: 13px 13px 0 0; background: #b7b1a8; }
.szd-calc-card[data-choice-field="foundation"][data-choice-value="concrete_slab"]::before { background: repeating-linear-gradient(90deg,#b9b9b5 0 26px,#929590 27px 28px); }
.szd-calc-card[data-choice-field="foundation"][data-choice-value="paving"]::before { background: repeating-linear-gradient(90deg,#bcae98 0 18px,#dfd6c7 19px 21px); }
.szd-calc-card[data-choice-field="foundation"][data-choice-value="prepared_gravel"]::before { background: radial-gradient(circle,#777c76 1.5px,transparent 2px) 0 0/9px 8px,#b7b4a9; }
.szd-calc-card[data-choice-field="foundation"][data-choice-value="unprepared_gravel"]::before { background: radial-gradient(circle,#6d7069 2px,transparent 2.5px) 0 0/14px 9px,#a8a498; }
.szd-calc-card[data-choice-field="foundation"][data-choice-value="soil"]::before { background: linear-gradient(90deg,#7d663e,#75916d,#6c5435); }
.szd-calc-card[data-choice-field="foundation"][data-choice-value="existing_structure"]::before { background: repeating-linear-gradient(90deg,#6a4930 0 13px,#b17a49 14px 20px); }
.szd-calc-card[data-choice-field="foundation"][data-choice-value="unknown"]::before { background: repeating-linear-gradient(135deg,#9d9f9b 0 7px,#dedbd3 7px 14px); }
.szd-calc-card[data-choice-field="packageId"][data-choice-value="practical"]::before { background: repeating-linear-gradient(90deg,#e0bc7e 0 19px,#8f673b 20px 21px); }
.szd-calc-card[data-choice-field="packageId"][data-choice-value="recommended"]::before { background: repeating-linear-gradient(90deg,#d7a263 0 11px,#71431f 12px 13px); }
.szd-calc-card[data-choice-field="packageId"][data-choice-value="premium"]::before { background: repeating-linear-gradient(90deg,#815439 0 9px,#321f16 10px 11px); }
.szd-calc-card[data-choice-field="deckDirection"][data-choice-value="along_length"]::before { height: 9px; background: repeating-linear-gradient(90deg,#d6a468 0 12px,#6e4326 12px 14px,#ebc692 14px 16px); }
.szd-calc-card[data-choice-field="deckDirection"][data-choice-value="along_width"]::before { height: 9px; background: repeating-linear-gradient(0deg,#d6a468 0 2px,#6e4326 2px 4px,#ebc692 4px 6px); }
.szd-calc-direction-box { overflow: hidden; }
.szd-calc-cards.is-direction .szd-calc-card { min-height: 105px; }
.szd-calc-card[data-choice-field="deckTone"][data-choice-value="natural"]::before,
.szd-calc-card[data-choice-field="structureTone"][data-choice-value="natural"]::before { background: #cf9b60; }
.szd-calc-card[data-choice-field="deckTone"][data-choice-value="honey"]::before { background: #d39440; }
.szd-calc-card[data-choice-field="deckTone"][data-choice-value="brown"]::before { background: #805139; }
.szd-calc-card[data-choice-field="deckTone"][data-choice-value="grey"]::before { background: #858984; }
.szd-calc-card[data-choice-field="structureTone"][data-choice-value="palisander"]::before { background: #65402b; }
.szd-calc-card[data-choice-field="structureTone"][data-choice-value="teak"]::before { background: #a66e3d; }
.szd-calc-card[data-choice-field="structureTone"][data-choice-value="graphite"]::before { background: #414743; }
.szd-calc-card strong { display: block; margin-bottom: 7px; color: var(--szd-calc-forest-dark) !important; }
.szd-calc-card small { display: block; color: var(--szd-calc-muted) !important; font-size: 12px; line-height: 1.45; }
.szd-calc-card__tag { margin: -3px 0 10px; padding: 4px 7px; display: inline-block; border-radius: 999px; color: var(--szd-calc-wood); background: var(--szd-calc-cream); font-size: 9px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.szd-calc-box { margin-top: 14px; padding: 15px; border: 1px solid #c8bba8; border-radius: 14px; background: linear-gradient(145deg,#f1eadf,#ebe3d7); box-shadow: inset 0 1px 0 rgba(255,255,255,.72); }
.szd-calc-box > :first-child { margin-top: 0; }
.szd-calc-notice { margin-top: 14px; padding: 12px 14px; border-left: 4px solid var(--szd-calc-wood); border-radius: 9px; background: var(--szd-calc-cream); font-size: 13px; line-height: 1.55; }
.szd-calc-side-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 8px; }
.szd-calc-side {
	min-height: 46px;
	padding: 10px;
	border: 1px solid var(--szd-calc-line);
	border-radius: 10px;
	color: var(--szd-calc-forest);
	background: #fff;
	font-size: 12px;
	font-weight: 800;
	cursor: pointer;
}
.szd-calc-side.is-selected { color: #fff; border-color: var(--szd-calc-forest); background: var(--szd-calc-forest); }
.szd-calc-side.is-house { color: #70756f; background: #e9ece9; }
.szd-calc-inline-actions { margin: 12px 0; display: flex; flex-wrap: wrap; gap: 8px; }
.szd-calc-button {
	min-height: 46px;
	padding: 11px 17px;
	border: 0;
	border-radius: 999px;
	font-weight: 800;
	cursor: pointer;
	transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
}
.szd-calc-button:hover:not(:disabled) { transform: translateY(-1px); }
.szd-calc-button.is-primary { color: #fff; background: var(--szd-calc-forest); box-shadow: 0 8px 20px rgba(34,48,40,.16); }
.szd-calc-button.is-primary:hover:not(:disabled) { background: var(--szd-calc-forest-dark); box-shadow: 0 11px 26px rgba(23,33,27,.22); }
.szd-calc-button.is-secondary { color: var(--szd-calc-forest); background: var(--szd-calc-cream); }
.szd-calc-button.is-ghost { color: var(--szd-calc-forest); border: 1px solid var(--szd-calc-line); background: #fff; }
.szd-calc-button.is-danger { color: var(--szd-calc-danger); background: #f8e8e5; }
.szd-calc-button.is-full { width: 100%; }
.szd-calc-button:disabled { opacity: .45; cursor: not-allowed; }
.szd-calc-actions { margin-top: 26px; padding-top: 18px; display: flex; justify-content: space-between; gap: 12px; border-top: 1px solid var(--szd-calc-line); }
.szd-calc-access-row { margin-bottom: 10px; padding: 12px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; border: 1px solid #cbbdaa; border-radius: 13px; background: #f4eee4; box-shadow: inset 0 1px 0 rgba(255,255,255,.8); }
.szd-calc-access-row .is-danger { grid-column: 1 / -1; justify-self: start; }
.szd-calc-type-preview {
	min-height: 74px;
	grid-column: 1 / -1;
	position: relative;
	overflow: hidden;
	border: 1px solid #b7a58e;
	border-radius: 11px;
	background-color: #d9b17e;
	box-shadow: inset 0 -15px 24px rgba(72,43,25,.12);
}
.szd-calc-type-preview::before { content: ""; position: absolute; inset: 8px 10px 24px; border: 4px solid #765037; border-radius: 2px; }
.szd-calc-type-preview span { padding: 4px 8px; position: absolute; right: 8px; bottom: 6px; border-radius: 999px; color: #fff; background: rgba(34,48,40,.88); font-size: 9px; font-weight: 900; letter-spacing: .04em; }
.szd-calc-type-preview.is-railing_simple_vertical { background-image: repeating-linear-gradient(90deg, transparent 0 13px, #80583a 13px 18px); }
.szd-calc-type-preview.is-railing_horizontal_slats { background-image: repeating-linear-gradient(0deg, transparent 0 10px, #80583a 10px 15px); }
.szd-calc-type-preview.is-railing_lattice,
.szd-calc-type-preview.is-screen_lattice { background-image: repeating-linear-gradient(45deg, transparent 0 13px, #80583a 13px 17px), repeating-linear-gradient(-45deg, transparent 0 13px, #80583a 13px 17px); }
.szd-calc-type-preview.is-screen_slatted { background-image: repeating-linear-gradient(90deg, #8d6040 0 8px, #e0bd8a 8px 15px); }
.szd-calc-type-preview.is-screen_full_board { background-image: repeating-linear-gradient(90deg, #8c5b39 0 22px, #6e452e 22px 24px); }
.szd-calc-empty { padding: 20px; border: 1px dashed #aa9983; border-radius: 12px; color: var(--szd-calc-muted); background: #f5efe5; text-align: center; }
.szd-calc-review { display: grid; gap: 0; }
.szd-calc-review div,
.szd-calc-summary-list div { padding: 10px 0; display: flex; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--szd-calc-line); }
.szd-calc-review span,
.szd-calc-summary-list span { color: var(--szd-calc-muted); font-size: 12px; }
.szd-calc-review strong,
.szd-calc-summary-list strong { color: var(--szd-calc-forest-dark); font-size: 12px; text-align: right; }
.szd-calc-price { margin: 18px -4px 11px; padding: 18px 16px 16px; border-top: 3px solid var(--szd-calc-wood); border-radius: 14px; color: #fff; background: var(--szd-calc-forest); }
.szd-calc-price small { display: block; margin-bottom: 6px; opacity: .72; }
.szd-calc-price strong { display: block; font-family: "Lora", Georgia, serif; font-size: 20px; line-height: 1.25; }
.szd-calc-price em { margin-top: 7px; display: block; color: rgba(255,255,255,.78); font-size: 11px; font-style: normal; line-height: 1.4; }
.szd-calc-summary > p { color: var(--szd-calc-muted); font-size: 12px; line-height: 1.55; }
.szd-calc-server-result {
	margin: 18px 0 14px;
	padding: 16px;
	display: grid;
	gap: 7px;
	border: 1px solid var(--szd-calc-line);
	border-radius: 14px;
	background: #f8f6f0;
}
.szd-calc-server-result small { color: var(--szd-calc-wood); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.szd-calc-server-result strong { color: var(--szd-calc-forest-dark); font-family: "Lora", Georgia, serif; font-size: 21px; line-height: 1.25; }
.szd-calc-server-result span { color: var(--szd-calc-muted); font-size: 12px; line-height: 1.5; }
.szd-calc-server-result .szd-calc-server-result__review { margin-top: 4px; padding-top: 8px; border-top: 1px solid rgba(44,79,61,.18); color: var(--szd-calc-forest); font-weight: 700; }
.szd-calc-server-result.is-success { border-color: #9bb5a5; background: #edf5ef; }
.szd-calc-server-result.is-warning { border-color: #d4b17c; background: #fff7e7; }
.szd-calc-server-result.is-error { border-color: #d6a099; background: #fbefed; }
.szd-calc-server-result.is-loading { position: relative; overflow: hidden; }
.szd-calc-server-result.is-loading::after {
	content: "";
	width: 42%;
	height: 3px;
	position: absolute;
	left: -42%;
	bottom: 0;
	background: var(--szd-calc-wood);
	animation: szd-calc-loading 1.1s ease-in-out infinite;
}
@keyframes szd-calc-loading { to { left: 100%; } }
.szd-calc-guidance {
	margin: 16px 0 0;
	padding: 18px;
	border: 1px solid var(--szd-calc-line);
	border-radius: 16px;
	background: #fff;
}
.szd-calc-guidance h3,
.szd-calc-guidance h4 { margin: 0; color: var(--szd-calc-forest-dark); font-family: "Lora", Georgia, serif; }
.szd-calc-guidance h3 { font-size: 18px; }
.szd-calc-guidance h4 { font-size: 17px; }
.szd-calc-guidance ol { margin: 10px 0 15px; padding-left: 24px; color: var(--szd-calc-graphite); font-size: 13px; line-height: 1.7; }
.szd-calc-guidance-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.szd-calc-guidance-actions .szd-calc-button { min-height: 44px; flex: 1 1 150px; }
.szd-calc-guidance-actions .szd-calc-button[aria-expanded="true"] { color: #fff; border-color: var(--szd-calc-forest); background: var(--szd-calc-forest); }
.szd-calc-guidance-panel { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--szd-calc-line); }
.szd-calc-guidance-list { margin: 10px 0 0; padding: 0; display: grid; gap: 9px; list-style: none; }
.szd-calc-guidance-list li { padding: 12px; display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; border-radius: 12px; background: var(--szd-calc-cream); }
.szd-calc-guidance-list strong,
.szd-calc-guidance-list span { display: block; }
.szd-calc-guidance-list strong { margin-bottom: 4px; color: var(--szd-calc-forest-dark); font-size: 13px; }
.szd-calc-guidance-list span { color: var(--szd-calc-muted); font-size: 11px; line-height: 1.5; }
.szd-calc-guidance-list b { flex: 0 0 auto; padding: 5px 8px; border-radius: 999px; font-size: 12px; white-space: nowrap; }
.szd-calc-guidance-list b.is-saving { color: #24523e; background: #dcecdf; }
.szd-calc-guidance-list b.is-upgrade { color: #74451e; background: #f3e4cf; }
.szd-calc-compare { margin-top: 11px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.szd-calc-compare article { padding: 13px; display: grid; gap: 5px; border: 1px solid var(--szd-calc-line); border-radius: 12px; background: #fdfcf9; }
.szd-calc-compare small { color: var(--szd-calc-wood); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.szd-calc-compare strong { color: var(--szd-calc-forest-dark); font-size: 13px; }
.szd-calc-compare span { color: var(--szd-calc-graphite); font-size: 12px; }
.szd-calc-guidance-panel > p { margin: 10px 0 0; color: var(--szd-calc-muted); font-size: 12px; line-height: 1.5; }
.szd-calc-guidance-panel > p b { color: var(--szd-calc-forest); }
.szd-calc-draft {
	margin-top: 16px;
	padding: 18px;
	border: 1px solid var(--szd-calc-line);
	border-radius: 16px;
	background: #fdfcf9;
}
.szd-calc-draft h3 { margin: 0; color: var(--szd-calc-forest-dark); font-family: "Lora", Georgia, serif; font-size: 18px; }
.szd-calc-draft > p { margin: 7px 0 13px; color: var(--szd-calc-muted); font-size: 12px; line-height: 1.55; }
.szd-calc-draft-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.szd-calc-draft-actions .szd-calc-button { min-height: 44px; flex: 1 1 190px; }
.szd-calc-share-field { margin-top: 13px; display: grid; gap: 6px; color: var(--szd-calc-graphite); font-size: 12px; font-weight: 800; }
.szd-calc-share-field input { width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid var(--szd-calc-line); border-radius: 10px; color: var(--szd-calc-graphite); background: #fff; font-size: 11px; }
.szd-calc-draft .szd-calc-draft-status { min-height: 19px; margin-bottom: 0; color: var(--szd-calc-forest); }
.szd-calc-document-action {
	margin-top: 16px;
	padding: 15px 16px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	border: 1px solid #b9c9bf;
	border-radius: 16px;
	background: #f1f6f2;
}
.szd-calc-document-action h3 { margin: 0; color: var(--szd-calc-forest-dark); font-family: "Lora", Georgia, serif; font-size: 18px; }
.szd-calc-document-action p { margin: 4px 0 0; color: var(--szd-calc-muted); font-size: 12px; line-height: 1.45; }
.szd-calc-document-action .szd-calc-button { flex: 0 0 auto; }
.szd-calc-pdf-open { overflow: hidden; }
.szd-calc-pdf-modal {
	padding: 28px;
	position: fixed;
	inset: 0;
	z-index: 100000;
	overflow: auto;
	background: rgba(19, 27, 22, .82);
	backdrop-filter: blur(7px);
}
.szd-calc-pdf-dialog { width: min(920px, 100%); margin: 0 auto; }
.szd-calc-pdf-toolbar {
	margin-bottom: 12px;
	padding: 10px;
	position: sticky;
	top: 0;
	z-index: 2;
	display: flex;
	justify-content: flex-end;
	gap: 9px;
	border: 1px solid rgba(255,255,255,.18);
	border-radius: 16px;
	background: rgba(255,255,255,.96);
	box-shadow: 0 10px 34px rgba(0,0,0,.18);
}
.szd-calc-pdf-sheet {
	min-height: 1120px;
	padding: 52px;
	color: #263029;
	background: #fff;
	box-shadow: 0 24px 80px rgba(0,0,0,.28);
}
.szd-calc-pdf-header { padding-bottom: 20px; display: flex; align-items: center; justify-content: space-between; gap: 22px; border-bottom: 1px solid #d8ddd9; }
.szd-calc-pdf-brand { display: flex; align-items: center; gap: 12px; }
.szd-calc-pdf-brand > span { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 5px; color: #fff; background: var(--szd-calc-wood); font-size: 13px; font-weight: 900; letter-spacing: .08em; }
.szd-calc-pdf-brand div,
.szd-calc-pdf-meta { display: grid; gap: 3px; }
.szd-calc-pdf-brand strong { color: var(--szd-calc-forest-dark); font-size: 13px; letter-spacing: .08em; }
.szd-calc-pdf-brand small,
.szd-calc-pdf-meta { color: #6b746e; font-size: 10px; }
.szd-calc-pdf-meta { text-align: right; }
.szd-calc-pdf-hero { padding: 42px 0 30px; }
.szd-calc-pdf-hero > span { color: var(--szd-calc-wood); font-size: 10px; font-weight: 900; letter-spacing: .15em; text-transform: uppercase; }
.szd-calc-pdf-hero h2 { margin: 7px 0; color: var(--szd-calc-forest-dark); font-family: "Lora", Georgia, serif; font-size: 39px; line-height: 1.12; }
.szd-calc-pdf-hero p { margin: 0; color: #5b645e; font-size: 15px; }
.szd-calc-pdf-grid { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr); gap: 26px; }
.szd-calc-pdf-grid h3,
.szd-calc-pdf-factors h3 { margin: 0 0 14px; color: var(--szd-calc-forest-dark); font-family: "Lora", Georgia, serif; font-size: 17px; }
.szd-calc-pdf-plan,
.szd-calc-pdf-spec { padding: 20px; border: 1px solid #d8ddd9; border-radius: 12px; }
.szd-calc-pdf-plan-svg { width: 100%; height: auto; max-height: 315px; display: block; }
.szd-calc-pdf-spec dl { margin: 0; }
.szd-calc-pdf-spec dl div { padding: 7px 0; display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: 12px; border-bottom: 1px solid #ecefec; }
.szd-calc-pdf-spec dl div:last-child { border-bottom: 0; }
.szd-calc-pdf-spec dt { color: #6b746e; font-size: 10px; }
.szd-calc-pdf-spec dd { margin: 0; color: #263029; font-size: 10px; font-weight: 800; text-align: right; }
.szd-calc-pdf-price { margin: 28px 0; padding: 23px 25px; display: flex; align-items: center; justify-content: space-between; gap: 18px; color: #fff; border-radius: 12px; background: var(--szd-calc-forest); }
.szd-calc-pdf-price div { display: grid; gap: 4px; }
.szd-calc-pdf-price small { opacity: .72; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.szd-calc-pdf-price strong { font-family: "Lora", Georgia, serif; font-size: 26px; }
.szd-calc-pdf-price > span { font-size: 11px; opacity: .8; }
.szd-calc-pdf-factors { padding: 18px 20px; border-left: 4px solid var(--szd-calc-wood); background: var(--szd-calc-cream); }
.szd-calc-pdf-factors ol { margin: 0; padding-left: 21px; display: grid; gap: 6px; font-size: 11px; }
.szd-calc-pdf-footer { margin-top: 30px; padding-top: 17px; border-top: 1px solid #d8ddd9; color: #667069; font-size: 9px; line-height: 1.55; }
.szd-calc-pdf-footer p { margin: 0 0 5px; }
.szd-calc-pdf-footer small { display: block; margin-top: 12px; color: var(--szd-calc-forest-dark); font-weight: 800; letter-spacing: .04em; }
.szd-calc-contact {
	margin-top: 20px;
	padding: 18px;
	display: grid;
	gap: 14px;
	border: 1px solid #c9bca9;
	border-radius: 16px;
	background: #fffdf8;
}
.szd-calc-contact h3 { margin: -6px 0 0; color: var(--szd-calc-forest-dark); font-family: "Lora", Georgia, serif; font-size: 23px; }
.szd-calc-contact > p { margin: -7px 0 2px; color: var(--szd-calc-muted); font-size: 13px; line-height: 1.5; }
.szd-calc-consent { display: flex; align-items: flex-start; gap: 9px; color: #454942; font-size: 12px; line-height: 1.5; }
.szd-calc-consent input { margin-top: 2px; flex: 0 0 auto; }
.szd-calc-honeypot { width: 1px; height: 1px; position: absolute; left: -10000px; overflow: hidden; }
.szd-calc-lead-result { margin-top: 20px; padding: 18px; display: grid; gap: 7px; border-radius: 14px; }
.szd-calc-lead-result strong { color: var(--szd-calc-forest-dark); font-family: "Lora", Georgia, serif; font-size: 21px; }
.szd-calc-lead-result span,
.szd-calc-lead-result small { font-size: 12px; line-height: 1.5; }
.szd-calc-lead-result.is-success { border: 1px solid #9bb5a5; background: #edf5ef; }
.szd-calc-lead-result.is-error { border: 1px solid #d6a099; background: #fbefed; }
.szd-calc-toast {
	max-width: calc(100% - 24px);
	padding: 12px 18px;
	position: fixed;
	bottom: 24px;
	left: 50%;
	z-index: 10000;
	transform: translate(-50%, 20px);
	opacity: 0;
	pointer-events: none;
	border-radius: 999px;
	color: #fff;
	background: var(--szd-calc-graphite);
	box-shadow: 0 12px 34px rgba(0,0,0,.18);
	transition: .2s ease;
}
.szd-calc-toast.is-visible { opacity: 1; transform: translate(-50%,0); }

.szd-calc-svg-house { fill: #3b4740; }
.szd-calc-render { animation: szd-calc-visual-in .18s ease-out both; }
.szd-calc-svg-scene { fill: url(#szdSceneGradient); }
.szd-calculator[data-visual-view="top"] .szd-calc-svg-scene { fill: rgba(255,255,255,.76); }
.szd-calc-svg-scene-glow { fill: url(#szdSceneGlow); pointer-events: none; }
.szd-calc-svg-horizon { fill: #d7e1d4; opacity: .72; }
.szd-calc-svg-landscape { fill: #8da487; opacity: .26; }
.szd-calc-svg-landscape.is-right { fill: #789276; opacity: .22; }
.szd-calc-svg-topography { fill: none; stroke: #9ca99d; stroke-width: 1.2; stroke-dasharray: 6 8; opacity: .26; }
.szd-calc-svg-site { fill: rgba(105,132,111,.075); stroke: rgba(69,94,77,.13); stroke-width: 2; }
.szd-calc-svg-yard { fill: rgba(119,145,112,.14); stroke: rgba(70,101,77,.2); stroke-width: 1.5; }
.szd-calc-svg-foundation-base { stroke-width: 2; filter: url(#szdPlanShadow); }
.szd-calc-svg-foundation.is-concrete_slab .szd-calc-svg-foundation-base { fill: #bbbcb8; stroke: #8d918e; }
.szd-calc-svg-foundation.is-paving .szd-calc-svg-foundation-base { fill: #c7baa6; stroke: #968b7d; }
.szd-calc-svg-foundation.is-prepared_gravel .szd-calc-svg-foundation-base { fill: #b7b5aa; stroke: #858780; }
.szd-calc-svg-foundation.is-unprepared_gravel .szd-calc-svg-foundation-base { fill: #a7a398; stroke: #74766f; }
.szd-calc-svg-foundation.is-soil .szd-calc-svg-foundation-base { fill: #788667; stroke: #5f674e; }
.szd-calc-svg-foundation.is-existing_structure .szd-calc-svg-foundation-base { fill: #876141; stroke: #573d2d; }
.szd-calc-svg-foundation.is-unknown .szd-calc-svg-foundation-base { fill: #dedbd2; stroke: #8c918d; stroke-dasharray: 8 6; }
.szd-calc-svg-foundation-joint { stroke: rgba(80,84,82,.36); stroke-width: 1.2; }
.szd-calc-svg-concrete-speckle { fill: rgba(78,84,80,.32); }
.szd-calc-svg-paving-line { stroke: rgba(91,77,59,.42); stroke-width: 1.2; }
.szd-calc-svg-gravel { fill: #73766f; stroke: rgba(255,255,255,.38); stroke-width: .7; }
.szd-calc-svg-foundation.is-unprepared_gravel .szd-calc-svg-gravel { fill: #5f625c; }
.szd-calc-svg-grass { fill: none; stroke: #496342; stroke-width: 2; stroke-linecap: round; }
.szd-calc-svg-old-joist { stroke: #5f3f29; stroke-width: 6; stroke-linecap: round; opacity: .78; }
.szd-calc-svg-foundation-label,
.szd-calc-svg-material-label,
.szd-calc-svg-roof-label,
.szd-calc-svg-demolition-label { fill: #26352d; stroke: rgba(255,253,247,.94); stroke-width: 4; paint-order: stroke fill; font-size: 9px; font-weight: 900; letter-spacing: .09em; pointer-events: none; }
.szd-calc-svg-demolition-label { fill: #99443b; stroke: rgba(255,247,242,.96); }
.szd-calc-svg-roof-label { fill: #385c54; }
.szd-calc-svg-demolition-chip rect { fill: rgba(255,247,243,.94); stroke: rgba(153,68,59,.38); stroke-width: 1; filter: url(#szdTinyShadow); }
.szd-calc-svg-demolition-chip text { fill: #99443b; font-size: 9px; font-weight: 900; letter-spacing: .08em; }
.szd-calc-svg-specs rect { fill: rgba(255,255,255,.9); stroke: rgba(45,69,57,.2); stroke-width: 1; filter: url(#szdTinyShadow); }
.szd-calc-svg-specs text { fill: #31443a; font-size: 9px; font-weight: 900; letter-spacing: .06em; }
.szd-calc-svg-rail { stroke: var(--szd-preview-structure, var(--szd-calc-wood)); stroke-width: 9; stroke-linecap: round; }
.szd-calc-svg-screen { stroke: var(--szd-preview-structure-dark, #6f5033); stroke-width: 14; stroke-linecap: round; }
.szd-calc-svg-edge--railing_lattice,
.szd-calc-svg-edge--screen_lattice { stroke-dasharray: 3 5; }
.szd-calc-svg-edge--screen_slatted { stroke-width: 12; stroke-dasharray: 8 3; }
.szd-calc-svg-edge--screen_full_board { stroke-width: 17; }
.szd-calc-svg-edge--railing_simple_vertical { stroke-width: 7; stroke-dasharray: 2 4; }
.szd-calc-svg-access { fill: #fbfaf7; stroke: var(--szd-calc-wood); stroke-width: 3; }
.szd-calc-svg-gutter { stroke: #466f63; stroke-width: 6; }
.szd-calc-svg-marker { fill: rgba(255, 255, 255, .72); stroke: #6f5033; stroke-width: 2; stroke-dasharray: 5 4; }
.szd-calc-svg-marker-label { fill: #6f5033; font-size: 11px; font-weight: 800; pointer-events: none; }
.szd-calc-svg-hit { cursor: pointer; fill: transparent; stroke: transparent; stroke-width: 28; }
.szd-calc-svg-hit:focus { outline: none; stroke: rgba(168,115,66,.32); }
.szd-calc-svg-label { fill: var(--szd-calc-forest); font-size: 16px; font-weight: 900; pointer-events: none; }
.szd-calc-svg-size { fill: #4e514d; font-size: 19px; font-weight: 800; }
.szd-calc-svg-ground-shadow { fill: rgba(39,55,46,.16); filter: url(#szdSoftShadow); }
.szd-calc-svg-contact-shadow { fill: rgba(34,48,40,.22); filter: url(#szdSoftShadow); }
.szd-calc-svg-ground { stroke: #b9b2a6; stroke-width: 3; stroke-linecap: round; }
.szd-calc-svg-house-plane { fill: url(#szdHouseGradient); stroke: #526058; stroke-width: 3; filter: url(#szdObjectShadow); }
.szd-calc-svg-house-plinth { fill: #7a7f78; opacity: .72; }
.szd-calc-svg-house-plinth-line { stroke: #737972; stroke-width: 14; opacity: .72; }
.szd-calc-svg-door { fill: #7a8b82; stroke: #46554d; stroke-width: 3; }
.szd-calc-svg-window { fill: url(#szdGlassGradient); stroke: #526a68; stroke-width: 3; }
.szd-calc-svg-window-line { stroke: rgba(255,255,255,.72); stroke-width: 2; }
.szd-calc-svg-window-shine { stroke: rgba(255,255,255,.7); stroke-width: 3; stroke-linecap: round; opacity: .75; }
.szd-calc-svg-door-handle { fill: #d4c296; stroke: #525c56; stroke-width: 1; }
.szd-calc-svg-deck-top { fill: var(--szd-preview-deck, #d5a66f); stroke: var(--szd-preview-deck-edge, #765334); stroke-width: 3; filter: url(#szdAmbientShadow); }
.szd-calc-svg-deck-side,
.szd-calc-svg-deck-side-elevation { fill: url(#szdDeckFaceGradient); stroke: var(--szd-preview-deck-edge, #64462f); stroke-width: 2; }
.szd-calc-svg-deck-side { fill: url(#szdDeckFaceGradient); stroke: var(--szd-preview-deck-edge, #64462f); stroke-width: 2; }
.szd-calc-svg-deck-side.is-right { filter: brightness(.82); }
.szd-calc-svg-deck-cap { stroke: rgba(255,255,255,.45); stroke-width: 3; }
.szd-calc-svg-deck-face-seam { stroke: rgba(49,30,18,.28); stroke-width: 1; }
.szd-calc-svg-deck-bevel { stroke: rgba(255,255,255,.46); stroke-width: 2.2; stroke-linecap: round; }
.szd-calc-svg-board-panel { fill: rgba(255,255,255,.075); stroke: none; pointer-events: none; }
.szd-calc-svg-deck-surface.is-premium .szd-calc-svg-board-panel { fill: rgba(255,255,255,.055); }
.szd-calc-svg-board { stroke: var(--szd-preview-board-line, rgba(75,45,23,.52)); stroke-width: 1.7; }
.szd-calc-svg-deck-surface.is-practical .szd-calc-svg-board { stroke-width: 2.2; }
.szd-calc-svg-deck-surface.is-premium .szd-calc-svg-board { stroke-width: 1.25; }
.szd-calc-svg-groove { stroke: var(--szd-preview-board-highlight, rgba(255,255,255,.42)); stroke-width: .85; opacity: .72; }
.szd-calc-svg-wood-grain { fill: none; stroke: var(--szd-preview-board-line,#704526); stroke-width: .85; opacity: .16; stroke-linecap: round; }
.szd-calc-svg-premium-sheen { fill: rgba(255,255,255,.12); }
.szd-calc-svg-premium-sheen-line { stroke: rgba(255,255,255,.3); stroke-width: 5; stroke-linecap: round; }
.szd-calc-svg-screw { fill: #dce2e1; stroke: #505957; stroke-width: .75; }
.szd-calc-svg-knot { fill: rgba(73,44,24,.25); stroke: var(--szd-preview-board-line, #704526); stroke-width: 1.2; }
.szd-calc-svg-fascia { stroke: var(--szd-preview-structure-dark, #4c3426); stroke-width: 7; }
.szd-calc-svg-post,
.szd-calc-svg-roof-post,
.szd-calc-svg-support { stroke: var(--szd-preview-structure-dark, #5e422d); stroke-width: 8; stroke-linecap: round; }
.szd-calc-svg-support { stroke-width: 9; }
.szd-calc-svg-structure { filter: url(#szdTinyShadow); }
.szd-calc-svg-brace { stroke: var(--szd-preview-structure,#805033); stroke-width: 5; stroke-linecap: round; opacity: .9; }
.szd-calc-svg-footing { fill: #8b8b82; stroke: #65675f; stroke-width: 1.5; }
.szd-calc-svg-panel-base { stroke: var(--szd-preview-structure-dark, #67462f); stroke-width: 1.7; }
.szd-calc-svg-fill-panel.is-railing_simple_vertical .szd-calc-svg-panel-base,
.szd-calc-svg-fill-panel.is-railing_horizontal_slats .szd-calc-svg-panel-base { fill: rgba(190,147,94,.08); }
.szd-calc-svg-fill-panel.is-railing_lattice .szd-calc-svg-panel-base,
.szd-calc-svg-fill-panel.is-screen_lattice .szd-calc-svg-panel-base { fill: rgba(240,220,187,.27); }
.szd-calc-svg-fill-panel.is-screen_slatted .szd-calc-svg-panel-base { fill: rgba(126,82,49,.2); }
.szd-calc-svg-fill-panel.is-screen_full_board .szd-calc-svg-panel-base { fill: var(--szd-preview-structure, #805033); fill-opacity: .88; }
.szd-calc-svg-fill-panel.is-screen_polycarbonate .szd-calc-svg-panel-base { fill: rgba(175,211,210,.45); stroke: #5d8178; }
.szd-calc-svg-fill-panel.is-weather { opacity: .92; }
.szd-calc-svg-rail-top { stroke: var(--szd-preview-structure-dark, #7e5638); stroke-width: 7; stroke-linecap: round; }
.szd-calc-svg-rail-top.is-light { stroke-width: 4; opacity: .82; }
.szd-calc-svg-rail-detail { stroke: var(--szd-preview-structure-dark, #7e5638); stroke-width: 4; stroke-linecap: round; }
.szd-calc-svg-picket { stroke: var(--szd-preview-structure, #98643e); stroke-width: 4.5; stroke-linecap: round; }
.szd-calc-svg-slat { stroke: var(--szd-preview-structure, #98643e); stroke-width: 5.5; stroke-linecap: round; }
.szd-calc-svg-screen-slat { stroke: var(--szd-preview-structure, #98643e); stroke-width: 7; stroke-linecap: round; }
.szd-calc-svg-lattice { stroke: var(--szd-preview-structure, #98643e); stroke-width: 3.2; stroke-linecap: round; }
.szd-calc-svg-wall-seam { stroke: rgba(43,29,20,.42); stroke-width: 1.6; }
.szd-calc-svg-underdeck-base { fill: rgba(119,77,47,.3); stroke: var(--szd-preview-structure-dark, #67462f); stroke-width: 2; }
.szd-calc-svg-underdeck.is-full .szd-calc-svg-underdeck-base { fill: var(--szd-preview-structure, #805033); fill-opacity: .9; }
.szd-calc-svg-underdeck.is-lattice .szd-calc-svg-underdeck-base { fill: rgba(241,222,190,.3); }
.szd-calc-svg-underdeck.is-slatted .szd-calc-svg-underdeck-base { fill: rgba(132,87,52,.26); }
.szd-calc-svg-underdeck-slat { stroke: var(--szd-preview-structure, #98643e); stroke-width: 5; stroke-linecap: round; }
.szd-calc-svg-element-label { fill: #27372e; stroke: rgba(255,253,247,.96); stroke-width: 4; paint-order: stroke fill; font-size: 9px; font-weight: 900; letter-spacing: .09em; pointer-events: none; }
.szd-calc-svg-cladding-face { fill: var(--szd-preview-structure,#805033); stroke: var(--szd-preview-structure-dark,#4f3224); stroke-width: 1.5; filter: url(#szdTinyShadow); }
.szd-calc-svg-cladding-face.is-B,
.szd-calc-svg-cladding-face.is-D { filter: brightness(.82); }
.szd-calc-svg-cladding-seam { stroke: rgba(45,27,17,.4); stroke-width: 1.2; }
.szd-calc-svg-edge-cladding-top { stroke: var(--szd-preview-structure-dark,#4f3224); stroke-width: 9; stroke-linecap: round; }
.szd-calc-svg-raised-level { fill: var(--szd-preview-deck,#d5a66f); stroke: var(--szd-preview-deck-edge,#64462f); stroke-width: 2; filter: url(#szdTinyShadow); }
.szd-calc-svg-level-break { stroke: var(--szd-preview-deck-edge,#64462f); stroke-width: 5; }
.szd-calc-svg-table { fill: #805b3c; stroke: #493323; stroke-width: 2; filter: url(#szdTinyShadow); }
.szd-calc-svg-furniture-leg { stroke: #4b382a; stroke-width: 6; stroke-linecap: round; }
.szd-calc-svg-chair { fill: #9a744f; stroke: #4b382a; stroke-width: 1.5; }
.szd-calc-svg-grill-top { fill: #343b38; stroke: #111715; stroke-width: 2; }
.szd-calc-svg-grill-body { fill: #4b5551; stroke: #1d2522; stroke-width: 2; filter: url(#szdTinyShadow); }
.szd-calc-svg-grill-leg { stroke: #28302d; stroke-width: 5; }
.szd-calc-svg-hot-tub { fill: #d4d0c6; stroke: #626d68; stroke-width: 3; filter: url(#szdTinyShadow); }
.szd-calc-svg-hot-tub-water { fill: #82b8bd; stroke: #eefafa; stroke-width: 2; }
.szd-calc-svg-heavy-load { fill: #747a75; stroke: #3c4641; stroke-width: 2; filter: url(#szdTinyShadow); }
.szd-calc-svg-led { stroke: #ffe69b; stroke-width: 5; stroke-linecap: round; filter: url(#szdTinyShadow); }
.szd-calc-svg-cable-prep { stroke: #61726a; stroke-width: 3; stroke-dasharray: 7 5; }
.szd-calc-svg-socket rect { fill: #f5f2e9; stroke: #46554d; stroke-width: 1.5; filter: url(#szdTinyShadow); }
.szd-calc-svg-socket circle { fill: #46554d; }
.szd-calc-svg-roof { fill: rgba(164,196,186,.48); stroke: #56786d; stroke-width: 3; filter: url(#szdObjectShadow); }
.szd-calc-svg-roof.is-cellular_polycarbonate { fill: url(#szdRoofGlassGradient); stroke: #60877d; }
.szd-calc-svg-roof.is-solid_polycarbonate { fill: url(#szdRoofGlassGradient); stroke: #668b84; opacity: .8; }
.szd-calc-svg-roof.is-trapezoidal_sheet { fill: #77837f; stroke: #3e514b; }
.szd-calc-svg-roof.is-recommend { fill: rgba(193,203,197,.48); stroke: #687970; stroke-dasharray: 8 5; }
.szd-calc-svg-roof-cover-line { stroke: rgba(56,80,73,.42); stroke-width: 1.7; }
.szd-calc-svg-roof-group.is-trapezoidal_sheet .szd-calc-svg-roof-cover-line { stroke: rgba(37,52,48,.75); stroke-width: 2.5; }
.szd-calc-svg-roof-thickness { fill: #455d55; opacity: .86; }
.szd-calc-svg-roof-shine { stroke: rgba(255,255,255,.56); stroke-width: 3; stroke-linecap: round; opacity: .7; }
.szd-calc-svg-roof-post.is-back { opacity: .82; }
.szd-calc-svg-roof-group.is-structure-bsh .szd-calc-svg-roof-post,
.szd-calc-svg-roof-group.is-structure-bsh .szd-calc-svg-roof-frame { stroke-width: 10; }
.szd-calc-svg-roof-group.is-structure-recommend .szd-calc-svg-roof-frame { stroke-dasharray: 9 5; }
.szd-calc-svg-roof-frame { stroke: var(--szd-preview-structure-dark, #45695e); stroke-width: 7; stroke-linecap: round; }
.szd-calc-svg-roof-rafter { stroke: var(--szd-preview-structure, rgba(69,105,94,.58)); stroke-width: 2.5; }
.szd-calc-svg-gutter-3d { stroke: #345c52; stroke-width: 7; stroke-linecap: round; }
.szd-calc-svg-downspout { stroke: #345c52; stroke-width: 5; stroke-linecap: round; }
.szd-calc-svg-rain-barrel { fill: #55786e; stroke: #304d45; stroke-width: 2; filter: url(#szdTinyShadow); }
.szd-calc-svg-rain-barrel-top { fill: #76988f; stroke: #304d45; stroke-width: 2; }
.szd-calc-svg-accesses { filter: url(#szdTinyShadow); }
.szd-calc-svg-step { fill: var(--szd-preview-deck, #c79a66); stroke: var(--szd-preview-deck-edge, #765334); stroke-width: 2; }
.szd-calc-svg-view-label { fill: #48524c; font-size: 12px; font-weight: 900; letter-spacing: .12em; }
.szd-calc-svg-side-name { fill: #4e5d55; font-size: 10px; font-weight: 900; letter-spacing: .16em; }

@keyframes szd-calc-visual-in {
	from { opacity: .72; transform: translateY(2px); }
	to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 1320px) {
	.szd-calc-workspace { grid-template-columns: minmax(360px,1fr) minmax(360px,1fr); }
	.szd-calc-summary { grid-column: 1 / -1; position: static; display: grid; grid-template-columns: minmax(0,1fr) minmax(250px,.6fr); column-gap: 28px; }
	.szd-calc-summary .szd-calc-eyebrow { grid-column: 1 / -1; }
	.szd-calc-summary-list { grid-row: span 3; }
}

@media (max-width: 900px) {
	.szd-calc-shell { padding: 14px; }
	.szd-calc-workspace { grid-template-columns: 1fr; }
	.szd-calc-config { min-height: 0; order: 1; }
	.szd-calc-visual { position: static; order: 2; }
	.szd-calc-summary { grid-column: auto; position: static; order: 3; display: block; border-radius: 16px; }
	.szd-calc-summary .szd-calc-eyebrow,
	.szd-calc-summary-list,
	.szd-calc-summary > p,
	.szd-calc-summary > .szd-calc-button { display: none; }
	.szd-calc-price { margin: 0; }
	.szd-calc-cards.is-three { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
	.szd-calculator { margin-inline: 0; border-radius: 16px; }
	.szd-calc-header { min-height: 68px; padding: 11px 14px; }
	.szd-calc-brand__mark { width: 40px; height: 40px; }
	.szd-calc-brand strong { font-size: 12px; }
	.szd-calc-brand small { display: none; }
	.szd-calc-badge { padding: 7px 9px; font-size: 9px; }
	.szd-calc-shell { padding: 10px; }
	.szd-calc-step { min-height: 44px; padding-right: 10px; font-size: 11px; }
	.szd-calc-step span { width: 28px; height: 28px; }
	.szd-calc-visual,
	.szd-calc-config,
	.szd-calc-summary { padding: 15px; }
	.szd-calc-plan { min-height: 270px; }
	.szd-calc-plan svg { height: 270px; }
	.szd-calc-svg-foundation-label,
	.szd-calc-svg-material-label,
	.szd-calc-svg-roof-label,
	.szd-calc-svg-demolition-label,
	.szd-calc-svg-demolition-chip,
	.szd-calc-svg-element-label { display: none; }
	.szd-calc-svg-specs text { font-size: 11px; }
	.szd-calc-view-switch { margin-top: 14px; }
	.szd-calc-view-switch button { padding-inline: 5px; font-size: 11px; }
	.szd-calc-progress { gap: 8px; }
	.szd-calc-progress__bar { min-width: 55px; }
	.szd-calc-field-grid,
	.szd-calc-cards { grid-template-columns: 1fr; }
	.szd-calc-side-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
	.szd-calc-access-row { grid-template-columns: 1fr; }
	.szd-calc-access-row .is-danger { grid-column: auto; }
	.szd-calc-guidance-list li { display: grid; }
	.szd-calc-guidance-list b { justify-self: start; }
	.szd-calc-compare { grid-template-columns: 1fr; }
	.szd-calc-document-action { align-items: stretch; flex-direction: column; }
	.szd-calc-pdf-modal { padding: 8px; }
	.szd-calc-pdf-toolbar { position: static; }
	.szd-calc-pdf-toolbar .szd-calc-button { min-height: 42px; padding-inline: 12px; flex: 1; }
	.szd-calc-pdf-sheet { min-height: 0; padding: 25px 20px; }
	.szd-calc-pdf-header { align-items: flex-start; }
	.szd-calc-pdf-brand { min-width: 0; }
	.szd-calc-pdf-brand strong { font-size: 11px; }
	.szd-calc-pdf-brand small { display: none; }
	.szd-calc-pdf-meta { flex: 0 0 auto; white-space: nowrap; }
	.szd-calc-pdf-hero { padding: 28px 0 22px; }
	.szd-calc-pdf-hero h2 { font-size: 30px; }
	.szd-calc-pdf-grid { grid-template-columns: 1fr; }
	.szd-calc-pdf-price { align-items: flex-start; flex-direction: column; }
	.szd-calc-pdf-price strong { font-size: 21px; white-space: nowrap; }
	.szd-calc-actions .szd-calc-button { flex: 1; padding-inline: 10px; }
}

@media (max-width: 360px) {
	.szd-calc-badge { display: none; }
	.szd-calc-panel-head { display: block; }
	.szd-calc-text-button { margin-top: 6px; padding-left: 0; }
}

@media (prefers-reduced-motion: reduce) {
	.szd-calculator *,
	.szd-calculator *::before,
	.szd-calculator *::after {
		scroll-behavior: auto !important;
		transition-duration: .01ms !important;
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
	}
}

@media print {
	@page { size: A4 portrait; margin: 10mm; }
	body * { visibility: hidden !important; }
	.szd-calc-pdf-modal,
	.szd-calc-pdf-modal * { visibility: visible !important; }
	.szd-calc-pdf-modal { width: 100%; padding: 0; position: absolute; inset: 0 auto auto 0; overflow: visible; background: #fff; backdrop-filter: none; }
	.szd-calc-pdf-dialog { width: 100%; max-width: none; margin: 0; }
	.szd-calc-pdf-toolbar { display: none !important; }
	.szd-calc-pdf-sheet { width: 100%; min-height: 0; padding: 0; box-shadow: none; }
	.szd-calc-pdf-plan,
	.szd-calc-pdf-spec,
	.szd-calc-pdf-price,
	.szd-calc-pdf-factors { break-inside: avoid; }
}