.designer-app{background:linear-gradient(180deg,#f8fcff,#eef7fc 42%,#fff);min-height:100vh;padding-bottom:80px}
.designer-intro{padding:62px 0 34px}.designer-intro h1{font-family:"Barlow Condensed",Arial,sans-serif;text-transform:uppercase;font-size:clamp(54px,6vw,88px);line-height:.86;margin:6px 0 18px;color:#06223b}.designer-intro h1 em{font-style:normal;color:#0879e8}.designer-intro>p:last-of-type{max-width:760px;color:#557184;font-size:17px;line-height:1.65}
.mode-switch{display:flex;gap:0;margin-top:28px;border-bottom:1px solid #bfd6e4}.mode{appearance:none;border:0;background:transparent;padding:16px 24px;font:800 17px "Barlow Condensed",Arial;text-transform:uppercase;color:#557184;cursor:pointer;border-bottom:3px solid transparent}.mode.active{color:#0879e8;border-color:#0879e8}
.planner-shell{display:grid;grid-template-columns:minmax(330px,.78fr) minmax(520px,1.45fr);gap:18px;align-items:stretch}.planner-panel,.preview-panel{background:#fff;border:1px solid #d7e7f0;box-shadow:0 18px 45px rgba(3,47,77,.08)}.planner-panel{padding:30px;display:flex;flex-direction:column;min-height:650px}.progress{height:3px;background:#e5eff5;margin-bottom:13px}.progress-fill{display:block;height:100%;width:25%;background:#0879e8;transition:width .3s}.step-meta{display:flex;justify-content:space-between;text-transform:uppercase;font:700 13px "Barlow Condensed";letter-spacing:.08em;color:#718797;margin-bottom:36px}.plan-step{display:none}.plan-step.active{display:block}.plan-step h2,.detail-flow h2{font-family:"Barlow Condensed";font-size:39px;line-height:.95;text-transform:uppercase;color:#06223b;margin:0 0 10px}.plan-step>p,.detail-flow>p{color:#6b8292;line-height:1.5;margin:0 0 28px}.budget-display{display:flex;align-items:flex-start;justify-content:center;margin:30px 0 12px;color:#0879e8}.budget-display span{font-size:28px;margin:10px 5px}.budget-display strong{font:800 76px/1 "Barlow Condensed"}input[type=range]{width:100%;accent-color:#0879e8}.quick-picks,.choice-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:18px}.quick-picks button,.choice-grid button,.priority-list button{border:1px solid #cbdde8;background:#f8fbfd;padding:15px 10px;cursor:pointer;color:#17364c;transition:.2s}.quick-picks button:hover,.choice-grid button:hover,.priority-list button:hover,.quick-picks button.selected,.choice-grid button.selected,.priority-list button.selected{border-color:#0879e8;background:#eaf5ff;box-shadow:inset 0 -3px #0879e8}.tank-choices{grid-template-columns:1fr 1fr}.tank-choices b{display:block;font:800 30px "Barlow Condensed";color:#06223b}.tank-choices span{font-size:12px;color:#718797}.choice-grid.compact{grid-template-columns:repeat(2,1fr);margin:8px 0 24px}.field-label{display:block;font:700 13px "Barlow Condensed";text-transform:uppercase;color:#61798a;margin-top:16px}.priority-list{display:grid;gap:10px}.priority-list button{text-align:left;padding:17px}.priority-list b{display:block;font:800 20px "Barlow Condensed";text-transform:uppercase}.priority-list span{display:block;color:#6d8494;margin-top:4px}.planner-actions{margin-top:auto;padding-top:28px;display:flex;justify-content:space-between;gap:12px}.planner-actions button{border:0;padding:14px 22px;font:800 16px "Barlow Condensed";text-transform:uppercase;cursor:pointer}.planner-actions .ghost{background:#edf4f8;color:#466174}.planner-actions .primary{background:#0879e8;color:#fff;min-width:150px}.planner-actions button:disabled{opacity:.35;cursor:not-allowed}
.preview-panel{background:#031b2e;color:#fff;overflow:hidden}.preview-head{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;border-bottom:1px solid rgba(119,198,236,.18)}.preview-head small{display:block;text-transform:uppercase;color:#7eb5d1;font-size:10px;letter-spacing:.12em}.preview-head strong{font:700 19px "Barlow Condensed";text-transform:uppercase}.live-dot{text-transform:uppercase;font-size:10px;letter-spacing:.1em;color:#80e4ff}.live-dot:before{content:"";display:inline-block;width:7px;height:7px;background:#3ee5ff;border-radius:50%;box-shadow:0 0 12px #3ee5ff;margin-right:7px}.aquarium-preview{height:500px;position:relative;overflow:hidden;background:#05233a}.aquarium-preview img{width:100%;height:100%;object-fit:cover;transition:filter .5s,transform .7s}.preview-light{position:absolute;inset:-15% 15% auto;height:42%;background:radial-gradient(ellipse,rgba(255,255,255,.25),rgba(85,213,255,.10) 35%,transparent 70%);filter:blur(8px);animation:aquaLight 7s ease-in-out infinite alternate}.preview-caption{position:absolute;left:20px;right:20px;bottom:18px;display:flex;justify-content:space-between;font:700 13px "Barlow Condensed";text-transform:uppercase;text-shadow:0 2px 10px #000}.budget-meter{padding:22px 25px 25px}.budget-meter>div:first-child{display:flex;justify-content:space-between}.budget-meter strong{color:#63dcff}.meter{height:5px;background:#15384d;margin:11px 0}.meter i{display:block;height:100%;width:95%;background:linear-gradient(90deg,#2cc5ff,#74e68e);transition:width .35s}.budget-meter small{color:#8eafc2}
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.detail-grid label{font:700 13px "Barlow Condensed";text-transform:uppercase;color:#597284}.detail-grid select{width:100%;margin-top:7px;padding:13px;border:1px solid #cbdde8;background:#f8fbfd}
.result-section{margin-top:22px;background:#fff;border-top:4px solid #0879e8;padding:42px;box-shadow:0 15px 40px rgba(3,47,77,.07)}.result-copy{display:grid;grid-template-columns:.8fr 1.2fr;column-gap:40px;align-items:end}.result-copy .eyebrow{grid-column:1/-1}.result-copy h2{font:800 46px/.94 "Barlow Condensed";text-transform:uppercase;margin:7px 0}.result-copy>p:last-child{color:#637d8e;line-height:1.6}.result-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:30px;border-left:1px solid #d7e7f0;border-top:1px solid #d7e7f0}.result-grid article{padding:24px;border-right:1px solid #d7e7f0;border-bottom:1px solid #d7e7f0}.result-grid span{font:700 13px "Barlow Condensed";text-transform:uppercase;color:#658092}.result-grid b{display:block;font:800 28px "Barlow Condensed";color:#0879e8;margin:6px 0}.result-grid p{font-size:13px;color:#708796;margin:0;line-height:1.45}.result-actions{display:flex;gap:12px;margin-top:28px}.action-dark{background:#06223b;color:#fff;border:0;cursor:pointer}
@keyframes aquaLight{from{transform:translateX(-7%);opacity:.65}to{transform:translateX(8%);opacity:1}}
@media(max-width:980px){.planner-shell{grid-template-columns:1fr}.preview-panel{order:-1}.aquarium-preview{height:420px}.result-copy{grid-template-columns:1fr}.result-grid{grid-template-columns:1fr 1fr}}
@media(max-width:650px){.designer-intro{padding-top:38px}.designer-intro h1{font-size:56px}.planner-panel{padding:22px;min-height:610px}.preview-head{height:64px}.aquarium-preview{height:310px}.quick-picks{grid-template-columns:1fr 1fr}.result-section{padding:28px 20px}.result-grid{grid-template-columns:1fr}.result-actions{flex-direction:column}.detail-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.preview-light{animation:none}}

.simple-page{min-height:70vh;background:#f7fbfe;padding-bottom:90px}.simple-hero{padding:72px 0 42px}.simple-hero h1{font:800 clamp(54px,6vw,86px)/.88 "Barlow Condensed";text-transform:uppercase;color:#06223b;margin:8px 0 20px}.simple-hero>p:last-child{max-width:800px;font-size:18px;line-height:1.65;color:#5d7788}.content-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.content-card{background:#fff;border-top:3px solid #0879e8;padding:34px;min-height:190px;box-shadow:0 10px 28px rgba(3,47,77,.06)}.content-card h2{font:800 32px "Barlow Condensed";text-transform:uppercase;color:#06223b;margin:0 0 12px}.content-card p{color:#657e8e;line-height:1.55}.content-card a{font:800 15px "Barlow Condensed";text-transform:uppercase;color:#0879e8}.legal-copy{max-width:900px;background:#fff;padding:40px;margin-bottom:70px}.legal-copy h2{font:800 28px "Barlow Condensed";text-transform:uppercase}.legal-copy p{line-height:1.65;color:#5d7788}@media(max-width:650px){.content-grid{grid-template-columns:1fr}}

.designer-intro-compact{padding-top:46px}
.designer-intro-compact>p.eyebrow,
.designer-intro-compact>h1,
.designer-intro-compact>p:not(.eyebrow){display:none}
.designer-intro-compact .mode-switch{margin-top:0}
.designer-app .subhero{margin-bottom:0}
@media(max-width:650px){.designer-intro-compact{padding-top:30px}}