:root{--calc-panel:rgba(16,18,20,.92);--calc-panel-2:#15181b;--calc-field:#0b0d0f;--calc-shadow:0 24px 70px rgba(0,0,0,.28)}
.calc-page{min-height:100vh;background:#070809}
.calc-page::before{background:radial-gradient(circle at 8% 4%,rgba(32,228,244,.13),transparent 30%),radial-gradient(circle at 92% 72%,rgba(157,99,255,.12),transparent 34%),linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px),#070809;background-size:auto,auto,90px 90px,90px 90px}
.calc-page .nav-links>a[aria-current="page"]{color:#fff}
.calc-shell{width:min(calc(100% - 40px),1180px);min-height:calc(100vh - 150px);margin:0 auto;padding:145px 0 90px}
.calc-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:42px;margin-bottom:72px}
.calc-intro h1{margin:0 0 16px;font-size:clamp(4.6rem,10vw,8.2rem)}
.calc-intro>div>p:last-child{max-width:620px;margin:0;color:var(--muted);font-size:clamp(1rem,2vw,1.25rem)}
.calc-intro-controls{display:flex;align-items:center;gap:10px;padding-bottom:9px}
.currency-switch{display:flex;padding:4px;border:1px solid var(--line);border-radius:999px;background:rgba(11,13,15,.85)}
.currency-switch button{min-width:72px;border:0;border-radius:999px;background:transparent;color:#8f989d;padding:10px 15px;font-size:.72rem;font-weight:900;letter-spacing:.09em;cursor:pointer;transition:background .2s,color .2s,transform .2s}
.currency-switch button.is-active{background:var(--accent);color:#001013;box-shadow:0 8px 24px rgba(32,228,244,.16)}
.icon-button{display:grid;width:44px;height:44px;place-items:center;border:1px solid var(--line);border-radius:50%;background:rgba(11,13,15,.85);color:#cad0d3;cursor:pointer;transition:border-color .2s,background .2s,transform .2s}
.icon-button:hover{border-color:rgba(32,228,244,.42);background:rgba(32,228,244,.08);transform:translateY(-2px)}
.icon-button svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.app-view{animation:view-in .35s ease both}
.app-view[hidden]{display:none!important}
@keyframes view-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.view-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:34px;margin-bottom:26px}
.view-heading h2{margin:0;font-size:clamp(2.4rem,5vw,4.3rem)}
.view-heading .eyebrow{margin-bottom:11px}
.view-heading>p{max-width:460px;margin:0 0 7px;color:var(--muted);font-size:.9rem}
.profile-strip{display:flex;overflow-x:auto;gap:9px;margin-bottom:16px;padding:2px 1px 9px;scrollbar-width:none;scroll-snap-type:x proximity}
.profile-strip::-webkit-scrollbar{display:none}
.profile-chip{position:relative;display:flex;min-width:165px;flex:0 0 auto;align-items:center;justify-content:space-between;gap:12px;padding:13px 15px;border:1px solid var(--line);border-radius:16px;background:rgba(16,18,20,.82);color:#99a2a7;text-align:left;cursor:pointer;scroll-snap-align:start;transition:border-color .2s,background .2s,color .2s,transform .2s}
.profile-chip:hover{border-color:rgba(32,228,244,.32);transform:translateY(-2px)}
.profile-chip.is-active{border-color:rgba(32,228,244,.5);background:rgba(32,228,244,.08);color:#fff}
.profile-chip span{display:flex;min-width:0;flex-direction:column}
.profile-chip small{color:var(--accent);font-size:.53rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.profile-chip strong{overflow:hidden;font-size:.78rem;text-overflow:ellipsis;white-space:nowrap}
.profile-chip .chip-delete{display:grid;width:27px;height:27px;flex:0 0 27px;place-items:center;border:1px solid var(--line);border-radius:50%;color:#899297;font-size:1rem}
.profile-add-chip{min-width:52px;justify-content:center;border-style:dashed;color:var(--accent);font-size:1.3rem}
.calculator-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(340px,.85fr);align-items:start;gap:16px}
.calc-panel,.result-card,.formula-card,.profile-form{border:1px solid var(--line);border-radius:25px;background:linear-gradient(145deg,rgba(20,23,26,.96),rgba(12,14,16,.96));box-shadow:var(--calc-shadow)}
.calc-panel{padding:26px}
.panel-heading{display:flex;align-items:center;gap:14px;margin-bottom:25px}
.panel-heading>span{display:grid;width:38px;height:38px;flex:0 0 38px;place-items:center;border:1px solid rgba(32,228,244,.35);border-radius:50%;background:rgba(32,228,244,.07);color:var(--accent);font-size:.67rem;font-weight:900;letter-spacing:.08em}
.panel-heading h3{margin:0;font-size:1.05rem}
.panel-heading p{margin:1px 0 0;color:#747d82;font-size:.7rem}
.panel-heading-small{margin-bottom:20px}
.field-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.field-grid-main{grid-template-columns:1.25fr .75fr .75fr}
.field{display:block;min-width:0}
.field>span:first-child,.range-label>span:first-child{display:block;margin:0 0 7px 2px;color:#90999e;font-size:.61rem;font-weight:850;letter-spacing:.09em;text-transform:uppercase}
.input-wrap{position:relative;display:block}
.input-wrap input{width:100%;height:56px;border:1px solid var(--line);border-radius:15px;outline:0;background:var(--calc-field);color:#f5f7f8;padding:0 50px 0 15px;font-size:1rem;font-weight:800;transition:border-color .2s,box-shadow .2s,background .2s}
.input-wrap input[type="text"]{padding-right:15px}
.input-wrap input:focus{border-color:rgba(32,228,244,.58);background:#0d1113;box-shadow:0 0 0 3px rgba(32,228,244,.08)}
.input-wrap input::placeholder{color:#42494d}
.input-wrap b{position:absolute;right:14px;top:50%;color:#788287;font-size:.68rem;transform:translateY(-50%);pointer-events:none}
.panel-divider{height:1px;margin:27px 0;background:var(--line)}
.range-field{display:block;padding-top:1px}
.range-label{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.range-label>span:first-child{margin-bottom:0}
.range-label output{padding:3px 8px;border-radius:999px;background:rgba(32,228,244,.08);color:var(--accent);font-size:.65rem;font-weight:900}
.range-field input[type="range"]{width:100%;height:36px;margin:0;accent-color:var(--accent);cursor:pointer}
.range-wide{margin-top:21px;padding-top:21px;border-top:1px solid var(--line)}
.result-column{position:sticky;top:102px;display:grid;gap:14px}
.result-card{overflow:hidden;padding:26px;background:radial-gradient(circle at 90% 0,rgba(32,228,244,.16),transparent 40%),linear-gradient(145deg,#14181a,#0c0e10)}
.result-topline{display:flex;align-items:center;justify-content:space-between;color:#929ba0;font-size:.62rem;font-weight:850;letter-spacing:.11em;text-transform:uppercase}
.result-topline span:last-child{color:var(--accent)}
.result-total{display:flex;align-items:baseline;gap:8px;margin:19px 0 3px;line-height:1}
.result-total strong{max-width:100%;overflow:hidden;font-size:clamp(3rem,6vw,5.2rem);letter-spacing:-.07em;text-overflow:ellipsis}
.result-total span{color:#8c959a;font-size:1.25rem;font-weight:850}
.result-profit{margin:0 0 26px;color:#8e989d;font-size:.75rem}
.result-profit strong{color:#65e7b0}
.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-bottom:22px}
.result-stats div{min-width:0;padding:11px 9px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.025)}
.result-stats span,.result-stats strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.result-stats span{color:#778085;font-size:.53rem;font-weight:850;letter-spacing:.07em;text-transform:uppercase}
.result-stats strong{font-size:.85rem}
.result-actions{display:grid;grid-template-columns:1fr 1.25fr;gap:8px}
.result-actions .button{width:100%;min-height:48px;padding:12px 14px;font-size:.73rem}
.formula-card{padding:23px}
.formula-list{display:grid}
.formula-step{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:11px;padding:13px 0;border-top:1px solid var(--line)}
.formula-step:first-child{border-top:0}
.formula-step>span{display:grid;width:28px;height:28px;place-items:center;border-radius:50%;background:rgba(255,255,255,.05);color:var(--accent);font-size:.58rem;font-weight:900}
.formula-step div{min-width:0}
.formula-step strong,.formula-step small{display:block}
.formula-step strong{font-size:.75rem}
.formula-step small{overflow:hidden;color:#727b80;font-size:.59rem;text-overflow:ellipsis;white-space:nowrap}
.formula-step>b{font-size:.72rem;white-space:nowrap}
.profile-form{margin-bottom:18px;padding:26px}
.profile-fields{grid-template-columns:repeat(2,minmax(0,1fr))}
.profile-fields .field:first-child{grid-column:1/-1}
.form-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:24px}
.profile-grid,.history-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.profile-card,.history-card,.empty-state{position:relative;display:flex;min-height:210px;overflow:hidden;flex-direction:column;padding:21px;border:1px solid var(--line);border-radius:21px;background:var(--calc-panel);transition:border-color .2s,transform .2s,background .2s}
.profile-card:hover,.history-card:hover{border-color:rgba(32,228,244,.35);transform:translateY(-3px)}
.profile-card.is-active{border-color:rgba(32,228,244,.55);background:radial-gradient(circle at 90% 0,rgba(32,228,244,.12),transparent 46%),var(--calc-panel)}
.card-index{color:var(--accent);font-size:.59rem;font-weight:900;letter-spacing:.11em;text-transform:uppercase}
.profile-card h3{margin:38px 0 4px;font-size:1.3rem}
.profile-card>p{margin:0;color:#737c81;font-size:.68rem}
.profile-meta{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:auto;padding-top:15px;border-top:1px solid var(--line)}
.profile-meta span,.profile-meta strong{display:block}
.profile-meta span{color:#717a7f;font-size:.54rem;text-transform:uppercase}
.profile-meta strong{font-size:.72rem}
.card-actions{position:absolute;right:13px;top:13px;display:flex;gap:5px}
.mini-button{display:grid;width:33px;height:33px;place-items:center;border:1px solid var(--line);border-radius:50%;background:rgba(255,255,255,.025);color:#a1a9ad;cursor:pointer;transition:border-color .2s,color .2s,background .2s}
.mini-button:hover{border-color:rgba(32,228,244,.4);color:var(--accent);background:rgba(32,228,244,.07)}
.mini-button.danger:hover{border-color:rgba(255,91,113,.38);color:#ff6c82;background:rgba(255,91,113,.08)}
.history-card{min-height:190px}
.history-card h3{margin:24px 0 3px;font-size:1.65rem}
.history-card>p{margin:0;color:#788186;font-size:.66rem}
.history-bottom{display:flex;align-items:end;justify-content:space-between;gap:15px;margin-top:auto;padding-top:15px;border-top:1px solid var(--line)}
.history-bottom span,.history-bottom strong{display:block}
.history-bottom span{color:#747d82;font-size:.54rem;text-transform:uppercase}
.history-bottom strong{font-size:.72rem}
.empty-state{min-height:240px;grid-column:1/-1;align-items:center;justify-content:center;text-align:center}
.empty-state strong{font-size:1.25rem}
.empty-state p{max-width:420px;margin:5px 0 0;color:var(--muted);font-size:.78rem}
.danger-button{border-color:rgba(255,91,113,.18);color:#ff7c90}
.mobile-dock{display:none}
.calc-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px 0 42px;border-top:1px solid var(--line)}
.calc-footer>div>span,.calc-footer>div>small{display:block}
.calc-footer>div>span{font-size:.7rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase}
.calc-footer>div>small{color:#778186;font-size:.61rem}
.toast{position:fixed;left:50%;bottom:92px;z-index:200;max-width:calc(100vw - 30px);padding:11px 16px;border:1px solid rgba(32,228,244,.3);border-radius:999px;background:#111719;color:#fff;font-size:.72rem;font-weight:800;box-shadow:0 18px 50px rgba(0,0,0,.45);transform:translate(-50%,18px);opacity:0;transition:opacity .2s,transform .2s;pointer-events:none}
.toast.is-visible{opacity:1;transform:translate(-50%,0)}

.calc-page.is-light{--text:#111416;--muted:#626c71;--line:rgba(10,20,24,.12);--line-strong:rgba(10,20,24,.2);--calc-panel:#fff;--calc-panel-2:#f5f7f8;--calc-field:#f2f5f6;background:#edf2f3;color:#111416}
.calc-page.is-light::before{background:radial-gradient(circle at 8% 4%,rgba(32,228,244,.2),transparent 32%),radial-gradient(circle at 92% 72%,rgba(157,99,255,.12),transparent 34%),linear-gradient(rgba(6,25,28,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(6,25,28,.035) 1px,transparent 1px),#edf2f3;background-size:auto,auto,90px 90px,90px 90px}
.calc-page.is-light .nav{background:rgba(247,251,252,.88)}
.calc-page.is-light .nav-links>a{color:#566167}
.calc-page.is-light .hero-outline{-webkit-text-stroke-color:rgba(12,22,25,.72)}
.calc-page.is-light .currency-switch,.calc-page.is-light .icon-button{background:rgba(255,255,255,.8)}
.calc-page.is-light .calc-panel,.calc-page.is-light .result-card,.calc-page.is-light .formula-card,.calc-page.is-light .profile-form{background:rgba(255,255,255,.9);box-shadow:0 24px 60px rgba(33,61,67,.1)}
.calc-page.is-light .profile-chip,.calc-page.is-light .profile-card,.calc-page.is-light .history-card,.calc-page.is-light .empty-state{background:rgba(255,255,255,.86)}
.calc-page.is-light .input-wrap input{background:#f1f5f6;color:#111416}
.calc-page.is-light .button-ghost{background:rgba(12,22,25,.035);color:#111416}
.calc-page.is-light .result-stats div{background:rgba(12,22,25,.025)}

@media(hover:hover) and (pointer:fine){.profile-card:hover .card-actions,.history-card:hover .card-actions{opacity:1}}
@media(max-width:920px){.calc-shell{padding-top:120px}.calc-intro{margin-bottom:54px}.calculator-grid{grid-template-columns:1fr}.result-column{position:static}.profile-grid,.history-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.calc-page.is-light .nav-wrap .nav.is-open{background:rgba(248,252,253,.98)}.calc-page.is-light.menu-open::after{background:rgba(228,236,238,.72)}}
@media(max-width:700px){.calc-page{padding-bottom:79px}.calc-shell{width:min(calc(100% - 28px),1180px);padding:105px 0 38px}.calc-intro{align-items:flex-start;flex-direction:column;gap:22px;margin-bottom:48px}.calc-intro h1{font-size:clamp(4.1rem,23vw,6rem)}.calc-intro-controls{width:100%;justify-content:space-between;padding:0}.currency-switch{flex:1}.currency-switch button{width:50%;min-width:0}.view-heading{align-items:flex-start;flex-direction:column;gap:14px}.view-heading h2{font-size:2.65rem}.view-heading>p{font-size:.8rem}.view-heading>.button{width:100%}.calc-panel,.result-card,.formula-card,.profile-form{border-radius:21px}.calc-panel{padding:19px}.field-grid,.field-grid-main,.profile-fields{grid-template-columns:1fr 1fr;gap:12px}.field-grid-main .field:first-child,.profile-fields .field:first-child{grid-column:1/-1}.input-wrap input{height:53px}.panel-heading{margin-bottom:20px}.panel-divider{margin:22px 0}.result-card{padding:20px}.result-total strong{font-size:3.55rem}.result-actions{grid-template-columns:1fr}.profile-grid,.history-grid{grid-template-columns:1fr}.profile-card,.history-card{min-height:185px}.form-actions{display:grid;grid-template-columns:1fr 1.35fr}.mobile-dock{position:fixed;left:50%;bottom:max(10px,env(safe-area-inset-bottom));z-index:80;display:grid;width:min(calc(100% - 28px),420px);grid-template-columns:repeat(3,1fr);gap:4px;padding:5px;border:1px solid var(--line);border-radius:19px;background:rgba(10,13,14,.92);box-shadow:0 18px 50px rgba(0,0,0,.48);transform:translateX(-50%);backdrop-filter:blur(18px)}.mobile-dock a{display:flex;min-height:48px;align-items:center;justify-content:center;gap:5px;border-radius:14px;color:#7f898e;font-size:.62rem;font-weight:850;text-decoration:none}.mobile-dock a span{color:var(--accent);font-size:.49rem}.mobile-dock a[aria-current="page"]{background:var(--accent);color:#001013}.mobile-dock a[aria-current="page"] span{color:#001013}.calc-page.is-light .mobile-dock{background:rgba(250,253,253,.94)}.calc-footer{align-items:flex-start;flex-direction:column;padding:25px 0 34px}.calc-footer newfpv-credit{width:100%}}
@media(max-width:390px){.field-grid,.field-grid-main{grid-template-columns:1fr}.field-grid-main .field:first-child{grid-column:auto}.result-stats{grid-template-columns:1fr 1fr}.result-stats div:last-child{grid-column:1/-1}.result-total strong{font-size:3.15rem}}
@media(prefers-reduced-motion:reduce){.app-view,.profile-chip,.profile-card,.history-card,.toast{animation:none!important;transition:none!important}}
