.visual-site{--ink:#172e3d;--muted:#5c6e75;--green:#193b49;--lime:#e3f1da;--paper:#f7f8f4;background:var(--paper);color:var(--ink)}.visual-site .brand-mark{background:#203d49;color:#d8ebbe}.brand-dot{color:#e2915f}.visual-site .btn{background:#203d49;border-color:#203d49;color:white;box-shadow:none}.visual-site .btn:hover{background:#305567;transform:translateY(-1px)}.visual-site .btn.secondary{color:#203d49;background:transparent;border-color:#d1d9d8}.visual-site .btn.subtle{background:transparent;color:var(--ink);border-color:transparent}.visual-site .header-row{min-height:88px}.visual-site .header-links{gap:27px}.visual-site .header-links>a{font-size:13px}.visual-site .header-links>.btn{font-size:12px}.visual-site .footer{margin-top:72px;background:#eff2ee}.visual-site .footer p{font-size:13px;color:var(--muted)}.visual-site h1,.visual-site h2,.visual-site h3{letter-spacing:-.04em}.visual-site .eyebrow{font-size:10px;letter-spacing:.15em}.visual-site .dot{background:#dd9160}.visual-site .wrap{max-width:1320px}.visual-hero{display:grid;grid-template-columns:1fr 1.22fr;gap:40px;padding-top:67px;padding-bottom:63px;align-items:center}.hero-copy h1{font-size:clamp(40px,4.6vw,66px);line-height:1.12;margin:21px 0 24px;font-weight:800;letter-spacing:-.065em}.hero-copy h1 em{font-style:normal;color:#558074}.hero-copy>p{font-size:17px;line-height:1.8;color:var(--muted)}.hero-copy .actions{margin-top:29px;gap:20px}.hero-copy .btn{font-size:13px;padding:16px 19px}.text-link{font-size:12px;font-weight:600}.trust-line{display:flex;flex-wrap:wrap;gap:15px;font-size:10px;color:#6d7d7b;margin-top:27px}.hero-scene{overflow:hidden;background:#162734;color:#d5e3e9;border-radius:20px;border:1px solid #28424f;box-shadow:0 28px 55px -35px #0d2029a0;position:relative;transform:rotate(-1deg)}.scene-top{padding:20px 24px;display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:11px;color:#b3cbd3;border-bottom:1px solid #ffffff0d}.scene-live{font-size:9px;font-weight:700;letter-spacing:.12em;display:flex;align-items:center;gap:8px}.scene-live i{width:6px;height:6px;border-radius:50%;background:#a8d5af;box-shadow:0 0 12px #a8d5af60}.hero-scene canvas{display:block;width:100%;height:310px;cursor:grab;touch-action:pan-y}.hero-scene-footer{display:flex;padding:2px 24px 15px;align-items:center;justify-content:space-between;gap:10px}.hero-scene-footer>div:first-child{display:flex;align-items:baseline;gap:10px}.hero-scene-footer strong{font-size:37px;letter-spacing:-.06em;color:#fff;font-family:Manrope,system-ui,sans-serif}.hero-scene-footer span{font-size:10px;color:#bed0d5}.chips{display:flex;gap:5px}.chip{color:#bfd2db;background:transparent;border:1px solid #3c5361;border-radius:7px;font-size:10px;padding:9px 12px}.chip.active{background:#d4e4bd;color:#20362f;border-color:#d4e4bd}.scene-hint{margin:0;padding:13px 24px 17px;border-top:1px solid #ffffff0b;font-size:10px;color:#819eab}.feature-strip{background:#edf0e9;border-block:1px solid #e2e7df}.feature-strip>.wrap{display:flex;align-items:center;gap:32px;padding-block:21px;font-size:13px;font-weight:600}.feature-strip b{font-weight:400;color:#9aac9d}.feature-strip small{font-weight:400;margin-left:auto;font-size:11px;color:#7b8a83}.visual-site .section{padding-block:64px}.visual-site .section-heading h2{font-size:30px;margin-top:12px}.visual-site .section-heading>p{font-size:13px;line-height:1.8}.visual-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.visual-card{padding:26px;background:#fff;border:1px solid #e0e5de;border-radius:16px;transition:transform .2s,box-shadow .2s}.visual-card:hover{transform:translateY(-4px);box-shadow:0 15px 26px #23352e0a;text-decoration:none;border-color:#adc0b6}.card-art{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.card-art svg{width:75px;height:56px}.card-art>span{font-size:8px;letter-spacing:.15em;color:#738984;border:1px solid #e6ece4;padding:5px 8px;border-radius:4px}.visual-card h3{font-size:21px;margin:0 0 11px}.visual-card p{font-size:13px;line-height:1.8;color:var(--muted);min-height:46px}.visual-card .card-bottom{border-top:1px solid #eef0eb;padding-top:18px;margin-top:20px;font-size:11px}.data-banner{padding:35px 42px;border-radius:18px;background:#e7eee4;display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:50px}.data-banner h2{font-size:30px;line-height:1.3;margin:14px 0}.data-banner p{font-size:13px;color:var(--muted);max-width:440px;line-height:1.8}.data-banner .btn{margin-top:10px;font-size:12px}.size-silhouettes{display:flex;flex-direction:column;gap:12px;align-items:flex-end}.size-silhouettes span{width:var(--size);height:39px;border:1px solid #607769;background:repeating-linear-gradient(90deg,#6c84761a 0 13px,#78928244 13px 15px);border-radius:3px;padding:10px 16px;font-size:12px;font-weight:700;color:#3d5949}.size-silhouettes span.high{height:47px;background:repeating-linear-gradient(90deg,#9daf8b35 0 13px,#78928266 13px 15px)}.quick-links{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.quick-links a{padding:22px 18px;border:1px solid #dfe5dc;border-radius:10px;background:white;font-size:12px;font-weight:600;display:flex;gap:15px;align-items:center}.quick-links span{font-size:19px;color:#648077}.sponsor{display:flex;align-items:center;gap:23px;border-top:1px solid #dce3db;border-bottom:1px solid #dce3db;padding-block:27px;margin-top:15px}.sponsor-icon{width:40px;height:40px;border-radius:10px;background:#e6ece1;display:grid;place-items:center;font-size:25px;color:#667b60;flex-shrink:0}.sponsor strong{font-size:13px}.sponsor p{font-size:12px;color:var(--muted);margin:7px 0 0}.sponsor>a{margin-left:auto;white-space:nowrap;font-size:12px;font-weight:600}.visual-intro{padding-top:44px;padding-bottom:30px}.visual-intro h1{font-size:40px;margin:14px 0 10px;line-height:1.15}.visual-intro>p{color:var(--muted);font-size:14px;line-height:1.7;margin:0}.planner-layout{display:grid;grid-template-columns:330px minmax(0,1fr);gap:22px;align-items:start}.plan-form{background:#fff;border:1px solid #dfe4df;border-radius:15px;padding:23px;min-width:0}.form-step{display:flex;align-items:center;gap:9px;margin:4px 0 17px}.form-step:not(:first-child){border-top:1px solid #edf0eb;padding-top:22px;margin-top:23px}.form-step>span{background:#eef2e9;border-radius:5px;color:#758e70;font-size:9px;padding:5px 6px;font-weight:700}.form-step h2{font-size:15px;letter-spacing:-.02em;margin:0}.plan-form .field{font-size:10px;gap:7px;color:#647474}.plan-form input,.plan-form select{min-height:39px;border-radius:7px;padding:9px 10px;font-size:12px;min-width:0;background:#fbfcf9;border-color:#dce3dc;width:100%}.plan-form .fields{gap:12px}.plan-form> .fields{margin-top:17px}.plan-form .advanced{margin:16px 0;border:0;border-radius:0;padding:0}.advanced summary{font-size:10px;font-weight:500;color:#647771;padding:8px 0}.advanced .fields{padding-top:10px}.advanced p{font-size:10px;color:#788882;line-height:1.6}.segmented{display:flex;background:#eff3ed;padding:4px;border-radius:8px;gap:3px;margin-bottom:18px}.segmented button{flex:1;white-space:nowrap;border:0;background:transparent;padding:8px 3px;font-size:10px;color:#61726c;border-radius:5px}.segmented button.active{background:#fff;color:#254c3c;box-shadow:0 2px 4px #263d2710}.cargo-row{border-top:1px solid #e8eee7;margin-top:17px;padding-top:15px}.cargo-row:first-child{border-top:0;padding-top:0}.cargo-title{display:flex;align-items:center;gap:7px;margin-bottom:13px}.cargo-title i{height:8px;width:8px;border-radius:50%;flex-shrink:0}.cargo-title input{border:0;padding:5px;background:transparent;min-height:0;font-size:12px;font-weight:600;color:#273f49;flex:1;min-width:0}.cargo-title button{border:0;color:#82908c;background:transparent;font-size:17px;padding:0 5px}.cargo-row .fields{grid-template-columns:repeat(2,minmax(0,1fr))}.cargo-row .cargo-options{display:flex;flex-direction:column;gap:11px;margin-top:15px}.cargo-options label{font-size:10px;display:flex;align-items:center;gap:7px;color:#526862}.cargo-options input[type=checkbox]{width:14px;min-height:14px;accent-color:#365b4c;margin:0}.cargo-options .layer-input{display:flex;align-items:center;gap:8px}.cargo-options .layer-input input{width:60px;min-height:31px;padding:5px}.add-cargo{width:100%;border:1px dashed #bbc9c0;border-radius:7px;font-size:11px;background:transparent;color:#527363;padding:11px;margin-top:18px}.visual-site .calculate{display:flex;justify-content:space-between;width:100%;margin-top:18px;font-size:12px;padding:14px}.form-privacy{font-size:9px;color:#8a9790;text-align:center;line-height:1.8;margin-bottom:0}.form-error{color:#a84032;font-size:12px;line-height:1.6}.form-error:empty{display:none}.plan-output{min-width:0}.plan-visual{background:#142534;border-radius:15px;overflow:hidden;color:#b4cbd5;border:1px solid #2a414f}.plan-visual .scene-top{padding:15px 21px}.camera-controls{display:flex;gap:4px}.camera-controls button{border:0;border-radius:5px;color:#9eb8c4;background:transparent;font-size:10px;padding:7px 10px}.camera-controls button.active{background:#354a55;color:#e1edee}.plan-visual canvas{display:block;width:100%;height:410px;cursor:grab;touch-action:pan-y}.plan-visual canvas:focus-visible{outline:2px solid #d8eabc;outline-offset:-3px}.plan-visual canvas.dragging,.hero-scene canvas.dragging{cursor:grabbing}.scene-bottom{display:flex;justify-content:space-between;align-items:center;padding:7px 20px 17px;font-size:9px;color:#7795a6;gap:12px}.scene-bottom>div{display:flex;gap:5px}.scene-bottom button{border:1px solid #354f5f;background:transparent;border-radius:5px;color:#9fbbc5;padding:5px 8px;font-size:10px}.load-progress{display:flex;align-items:center;gap:14px;padding:15px 20px;border-top:1px solid #ffffff0c;background:#ffffff03;font-size:9px;color:#aac1cc}.load-progress input{flex:1;min-width:40px;accent-color:#a5c8a8;height:4px}.load-progress output{min-width:40px;text-align:right}.result-summary{border:1px solid #dce4dc;background:white;border-radius:14px;padding:23px;margin-top:18px}.result-head{display:flex;align-items:center;justify-content:space-between;gap:15px}.result-head h2{font-size:24px;margin:8px 0 0}.result-badge{border:1px solid #ccdfd1;color:#538061;background:#f0f6ed;font-size:10px;border-radius:30px;padding:7px 12px;white-space:nowrap}.result-badge.warn{color:#a36b32;background:#fcf5e9;border-color:#ebd9bd}.plan-metrics{display:grid;grid-template-columns:repeat(3,1fr);margin-top:21px;gap:14px}.plan-metrics>div{border-left:1px solid #e4e9e1;padding-left:18px}.plan-metrics>div:first-child{border:0;padding-left:0}.plan-metrics small{display:block;font-size:9px;letter-spacing:.05em;color:#7e918a;margin-bottom:7px}.plan-metrics strong{font-size:24px;font-family:Manrope,system-ui;letter-spacing:-.05em;font-weight:700}.plan-metrics em{font-style:normal;font-size:12px;font-weight:400;color:#71877c;margin-left:4px}.metric-bar{height:4px;background:#edf1e9;border-radius:5px;margin-top:12px;overflow:hidden}.metric-bar>span{display:block;height:100%;background:#a3bd91;max-width:100%}.plan-legend{display:flex;gap:15px;flex-wrap:wrap;margin-top:20px}.plan-legend span{font-size:10px;display:flex;gap:6px;align-items:center;color:#61766d}.plan-legend i{width:7px;height:7px;border-radius:2px}.plan-caution{border-top:1px solid #edf0e9;font-size:10px;color:#7f8d84;line-height:1.8;padding-top:14px;margin-top:18px;margin-bottom:5px}.result-summary .actions{gap:7px;margin-top:15px}.result-summary .btn{font-size:10px;padding:9px 12px}.dirty-note{background:#fff7df;color:#8f6d2b;padding:9px 12px;font-size:11px;border-radius:7px}.remaining-note{font-size:11px;background:#fff6ed;border-radius:7px;padding:10px 12px;color:#99633c;margin-top:12px}.compare-section{margin:26px 0}.compare-section h2{font-size:19px;letter-spacing:-.035em}.compare-section>p{font-size:11px;color:#809184}.container-comparison{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.comparison-card{border:1px solid #dce3d9;border-radius:9px;text-align:left;padding:15px 13px;background:#fff;color:#294639}.comparison-card.selected{border-color:#87a68c;background:#eef4e9}.comparison-card strong{font-size:12px;display:block}.comparison-card span{font-size:23px;letter-spacing:-.04em;display:block;margin-top:9px}.comparison-card span small{font-size:10px;color:#839482;font-weight:400}.comparison-card p{font-size:10px;margin:7px 0 0;color:#7d917b}.visual-site .explanation{max-width:860px;padding-block:45px;font-size:13px;line-height:1.9;color:#60716d}.visual-site .explanation h2{font-size:21px;color:var(--ink);margin-top:28px}.visual-site .explanation a:not(.btn){text-decoration:underline;text-underline-offset:3px}.dimension-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.dimension-card{border:1px solid #dbe4da;border-radius:14px;padding:25px;background:white}.dimension-card svg{display:block;width:90px;height:70px;margin-bottom:25px}.dimension-card h2{font-size:23px;margin:10px 0 25px}.dimension-card dl{margin-bottom:24px}.dimension-card dl div{margin-bottom:18px}.dimension-card dt{font-size:10px;color:#849285}.dimension-card dd{font-size:15px;margin:5px 0 0;font-weight:600;letter-spacing:-.02em}.dimension-card .btn{font-size:12px}.source-link{display:block;font-size:10px;color:#7c8c7e;margin-top:17px;text-decoration:underline}.volume-bars{display:flex;flex-direction:column;gap:14px;margin-top:26px}.volume-bar-label{font-size:11px;display:flex;justify-content:space-between}.volume-bar-track{height:8px;background:#edf0e8;border-radius:6px;margin-top:7px;overflow:hidden}.volume-bar-track>span{display:block;height:100%;background:#a6c4b1}.volume-bars>div+div .volume-bar-track>span{background:#eab18c}#volume-total{font-size:42px;letter-spacing:-.05em;margin:8px 0}#volume-canvas{height:360px}[hidden]{display:none!important}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
@media(min-width:1450px){.visual-hero{gap:70px;padding-block:80px}.hero-scene canvas{height:340px}}
@media(max-width:1000px){.visual-hero{gap:22px}.hero-copy h1{font-size:45px}.hero-copy .actions{align-items:flex-start;flex-direction:column;gap:16px}.hero-scene canvas{height:285px}.trust-line{gap:9px;font-size:9px}.planner-layout{grid-template-columns:300px minmax(0,1fr);gap:15px}.plan-form{padding:19px}.plan-visual canvas{height:360px}.plan-metrics strong{font-size:20px}.result-head{align-items:flex-start;flex-direction:column;gap:11px}.visual-card{padding:21px}.visual-card h3{font-size:18px}.visual-site .header-links{gap:18px}}
@media(max-width:760px){.visual-site .wrap{width:calc(100% - 32px)}.visual-site .header-row{min-height:72px}.visual-site .brand{font-size:19px}.visual-site .brand-mark{width:27px;height:27px;font-size:16px}.visual-site .header-links{gap:14px}.visual-site .header-links>.btn{display:none}.visual-hero{grid-template-columns:1fr;padding-top:38px;padding-bottom:35px;gap:30px}.hero-copy h1{font-size:49px;max-width:500px;margin-top:17px}.hero-copy>p{font-size:15px}.hero-copy .actions{flex-direction:row;align-items:center;gap:20px}.hero-copy .btn{font-size:11px;padding:14px}.trust-line{font-size:9px;gap:16px;margin-top:21px}.hero-scene{transform:none}.hero-scene canvas{height:275px}.hero-scene-footer{padding-inline:18px}.hero-scene-footer strong{font-size:31px}.hero-scene-footer span{font-size:9px}.scene-top{padding:16px 18px}.chip{padding:8px 10px;font-size:9px}.scene-hint{font-size:9px;padding-inline:18px}.feature-strip>.wrap{gap:15px;font-size:10px;justify-content:center;padding-block:18px}.feature-strip small{display:none}.visual-site .section{padding-block:40px}.visual-site .section-heading{align-items:flex-start;gap:12px}.visual-site .section-heading h2{font-size:27px}.visual-site .section-heading>p{font-size:12px}.visual-cards{grid-template-columns:1fr;gap:14px}.visual-card{padding:22px}.visual-card h3{font-size:22px}.visual-card p{min-height:0}.card-art{margin-bottom:15px}.visual-card .card-bottom{margin-top:16px}.data-banner{grid-template-columns:1fr;gap:30px;padding:27px}.data-banner h2{font-size:26px}.size-silhouettes{padding-right:10px}.quick-links{grid-template-columns:1fr;gap:10px}.quick-links a{padding:20px}.sponsor{gap:12px;flex-wrap:wrap;padding-block:24px}.sponsor>div{flex:1}.sponsor p{font-size:11px;line-height:1.7}.sponsor>a{margin-left:52px}.visual-intro{padding-block:29px 25px}.visual-intro h1{font-size:31px}.visual-intro>p{font-size:12px}.planner-layout{grid-template-columns:1fr}.plan-form{padding:22px}.plan-output{width:100%}.plan-form .field{font-size:11px}.plan-form input,.plan-form select{font-size:14px;min-height:43px}.plan-form .calculate{font-size:13px}.plan-visual canvas{height:305px}.plan-visual .scene-top{padding:15px}.scene-live{font-size:8px}.camera-controls button{padding:7px 8px;font-size:9px}.scene-bottom{padding-inline:15px;font-size:8px;gap:5px}.scene-bottom button{padding:6px}.load-progress{font-size:8px;padding-inline:15px;gap:9px}.result-summary{padding:19px}.result-head{flex-direction:row;align-items:center;gap:8px}.result-head h2{font-size:21px}.result-badge{font-size:8px;padding:6px 8px}.plan-metrics{gap:8px}.plan-metrics>div{padding-left:10px}.plan-metrics strong{font-size:21px}.plan-metrics small{font-size:8px}.plan-metrics em{font-size:10px}.container-comparison{gap:7px}.comparison-card{padding:12px 9px}.comparison-card strong{font-size:10px}.comparison-card p{font-size:9px}.comparison-card span{font-size:21px}.dimension-cards{grid-template-columns:1fr}.visual-site .explanation{padding-block:28px}.visual-site .footer{margin-top:40px}.visual-site .footer-row{gap:25px}.visual-site .footer nav{display:flex;flex-wrap:wrap;gap:15px;font-size:11px}#volume-canvas{height:290px}}
@media print{.site-header,.footer,.plan-form,.sponsor,.compare-section,.explanation,.camera-controls,.scene-bottom,.load-progress,.result-summary .actions,.visual-intro .eyebrow{display:none!important}.visual-intro{padding:0!important}.visual-intro h1{font-size:23px!important}.planner-layout{display:block!important}.plan-visual{break-inside:avoid;print-color-adjust:exact;-webkit-print-color-adjust:exact}.plan-visual canvas{height:340px!important}.result-summary{break-inside:avoid}.wrap{width:100%!important}.visual-site{background:#fff}.plan-metrics{grid-template-columns:repeat(3,1fr)!important}.result-badge.warn{display:block}.plan-caution{color:#333!important}}
.everyday-form>.field,.everyday-form>.fields{margin-bottom:18px}.everyday-visual{background:linear-gradient(135deg,#203744,#122331);border-radius:15px;padding:27px;color:#d5e5e6;min-height:270px;display:flex;flex-direction:column;justify-content:space-between;gap:30px}.diagram-label{font-size:9px;letter-spacing:.12em;color:#9dbbc4}.diagram-caption{font-size:11px;color:#97b1bc}.fx-visual{display:flex;justify-content:space-between;align-items:center;gap:16px}.fx-visual>div{flex:1;min-width:0}.fx-visual span{display:block;color:#a3c7b5;font-size:14px;letter-spacing:.1em;margin-bottom:14px}.fx-visual strong{font-family:Manrope,system-ui;font-size:clamp(20px,3vw,38px);letter-spacing:-.04em;overflow-wrap:anywhere}.fx-visual b{font-size:23px;font-weight:400;color:#7d9ca9}.ldm-trailer{height:105px;border:2px solid #8da6ac;border-radius:7px;padding:5px;background:repeating-linear-gradient(90deg,transparent 0 7.2%,#d5e2e618 7.2% 7.35%)}.ldm-fill{background:#a2c5a4;height:100%;border-radius:3px;min-width:3px;position:relative}.ldm-fill strong{position:absolute;top:36px;left:10px;color:white;white-space:nowrap;font-size:16px;text-shadow:0 1px 3px #244338}.time-bars{display:flex;gap:5px;min-height:110px}.time-bars>div{min-width:55px;border-radius:5px;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#203b3f;gap:8px}.time-bars strong{font-size:30px}.time-bars span{font-size:10px}.result-summary #everyday-total{font-size:37px;letter-spacing:-.04em;margin:12px 0;overflow-wrap:anywhere}.lang-link{font-size:10px!important;font-weight:700;border:1px solid #dce4da;border-radius:5px;padding:5px 8px}.saved-tools{margin-top:18px;padding-top:15px;border-top:1px solid #e5ebe2}.saved-tools p{font-size:10px;color:#778575;line-height:1.7}.saved-tools .actions{gap:7px}.saved-tools button{font-size:10px!important}
@media(max-width:760px){.everyday-visual{min-height:240px;padding:24px}.fx-visual strong{font-size:26px}.visual-site .header-links{gap:12px}.visual-site .header-links>a{font-size:12px}.result-summary #everyday-total{font-size:31px}.time-bars span{font-size:9px}}