:root{--bg:#0b0f17;--bg2:#111827;--bg3:#151f2e;--bd:#1f2937;--ac:#2f6bff;--tx:#e5e7eb;--dim:#9ca3af;--hi:#ffffff;--gr:#22c55e;--rd:#ef4444;--mn:'Manrope',sans-serif;--sf:'Manrope',sans-serif;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--radius-s:8px;--radius-m:12px;--radius-l:16px;--radius-xl:18px;--control-h:32px;--line-tight:1.1;--line-base:1.4}
*{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%;background:var(--bg);font-family:var(--sf);color:var(--tx)}
html,body{background:#000000;position:relative;min-height:100%}
.glow-bg{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0;overflow:hidden;min-height:100vh}
.glow-blob{position:absolute;filter:blur(180px);will-change:transform,opacity;animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-direction:alternate}
@keyframes gblob1{0%{opacity:0.3;transform:translate(0,0) scale(1)}50%{opacity:0.5;transform:translate(12vw,4vh) scale(1.1)}100%{opacity:0.25;transform:translate(4vw,8vh) scale(0.92)}}
@keyframes gblob2{0%{opacity:0.25;transform:translate(0,0) scale(1)}50%{opacity:0.45;transform:translate(-14vw,-5vh) scale(1.15)}100%{opacity:0.3;transform:translate(-6vw,-10vh) scale(0.94)}}
@keyframes gblob3{0%{opacity:0.2;transform:translate(-50%,-50%) scale(0.9)}50%{opacity:0.4;transform:translate(-35%,-42%) scale(1.12)}100%{opacity:0.22;transform:translate(-62%,-55%) scale(0.95)}}
@keyframes gblob4{0%{opacity:0.28;transform:translate(0,0) scale(1)}50%{opacity:0.48;transform:translate(10vw,5vh) scale(1.1)}100%{opacity:0.22;transform:translate(3vw,9vh) scale(0.9)}}
@keyframes gblob5{0%{opacity:0.25;transform:translate(0,0) scale(1)}50%{opacity:0.42;transform:translate(-12vw,-6vh) scale(1.12)}100%{opacity:0.28;transform:translate(-5vw,-3vh) scale(0.93)}}
a{color:var(--ac);text-decoration:none}a:hover{text-decoration:underline}
.container{max-width:100%;margin:0 auto;padding:0;position:relative;z-index:1}

/* Header */
.mh-nav{padding:8px 32px;background:linear-gradient(145deg,rgba(255,255,255,0.06) 0%,rgba(255,255,255,0.03) 100%);border-bottom:1px solid rgba(255,255,255,0.1);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 2px 16px rgba(0,0,0,0.3)}
.mh-nav-inner{max-width:1400px;margin:0 auto;display:flex;justify-content:space-between;align-items:center}
.mh-nav-logo{font-size:26px;font-weight:900;letter-spacing:-0.04em;color:#fff;text-decoration:none}
.mh-nav-logo span{color:#3b82f6}
.mh-nav-right{display:flex;align-items:center;gap:16px}
.mh-nav-link{font-size:11px;font-weight:800;color:#fff;background:#3b82f6;padding:4px 16px;border-radius:12px;text-decoration:none;text-transform:uppercase;letter-spacing:0.05em;transition:background .2s}
.mh-nav-link:hover{background:#2563eb}
.mh-nav-back{color:rgba(255,255,255,0.4);font-size:13px;text-decoration:none;transition:color .2s}
.mh-nav-back:hover{color:#3b82f6}
.detail-header{display:flex;align-items:center;gap:12px;padding:16px 0;margin-bottom:24px}
.detail-header .elec-input{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:12px;color:var(--dim)}
.detail-header .elec-input input{width:60px;background:var(--bg);border:1px solid var(--bd);color:var(--hi);text-align:right;padding:4px 6px;border-radius:4px;font-size:12px}

/* Main layout */
.detail-body{display:flex;gap:24px;padding:24px}
.detail-left{flex:1;min-width:0;position:relative}
.detail-right{flex:1;min-width:0}

/* Left: Image & Specs */
.detail-img-wrap{position:relative;background:#ffffff;border:1px solid rgba(255,255,255,0.12);border-radius:var(--radius-l);overflow:hidden;margin:30px 0 var(--space-5);height:570px;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 40px rgba(0,0,0,0.35);cursor:zoom-in}
.back-to-catalog{display:inline-flex;align-items:center;gap:6px;font-size:17px;font-weight:800;line-height:1;color:rgba(255,255,255,0.72);text-decoration:none;margin-bottom:0;padding:0;transition:color .2s;position:absolute;top:0;left:0;z-index:2;letter-spacing:-0.01em}
.back-to-catalog:hover{color:#3b82f6}
.back-to-catalog::before{content:'←';display:inline-flex;align-items:center;justify-content:center;font-size:18px;font-weight:900;line-height:1;color:currentColor;transform:translateY(-1px)}
.detail-img-bg{display:none}
.detail-img{position:relative;z-index:1;max-width:98%;max-height:555px;object-fit:contain;border-radius:0}
.detail-img-ph{position:relative;z-index:1;height:240px;display:flex;align-items:center;justify-content:center;color:#94a3b8;font-size:16px}
.detail-img-caption{margin:10px 0 18px;color:rgba(255,255,255,0.62);font-size:12px;line-height:1.45}
/* Lightbox */
.lightbox-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.92);z-index:9999;align-items:center;justify-content:center;cursor:default;overflow:hidden;touch-action:none}
.lightbox-overlay.open{display:flex}
.lightbox-overlay img{width:auto;height:auto;max-width:none;max-height:none;object-fit:none;border-radius:0;box-shadow:none;background:transparent;transform-origin:center center;transition:none;pointer-events:none;user-select:none}
.lightbox-controls{position:fixed;top:16px;right:20px;display:flex;gap:8px;z-index:10000;align-items:center}
.lightbox-btn{color:#fff;cursor:pointer;opacity:0.8;transition:opacity .2s;background:rgba(0,0,0,0.4);border:none;line-height:1;border-radius:50%;display:flex;align-items:center;justify-content:center}
.lightbox-btn:hover{opacity:1;background:rgba(0,0,0,0.7)}
.lightbox-close{font-size:72px;width:80px;height:80px}
.lightbox-hint{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,0.5);font-size:12px;z-index:10000;pointer-events:none;transition:opacity 1s;font-family:var(--mn)}
.detail-title{font-family:var(--mn);font-size:32px;font-weight:800;line-height:var(--line-tight);color:var(--hi);margin-bottom:var(--space-1)}
.detail-subtitle{font-family:var(--mn);font-size:14px;line-height:var(--line-base);color:var(--dim);margin-bottom:var(--space-5)}
.mh-breadcrumbs{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:14px 24px 0;color:rgba(255,255,255,0.42);font-size:12px;font-weight:600;letter-spacing:.02em}
.mh-breadcrumbs a{color:rgba(255,255,255,0.58);text-decoration:none}
.mh-breadcrumbs a:hover{color:#60a5fa}
.mh-breadcrumbs-sep{opacity:.28}
.detail-ssr-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:14px 24px 0;position:relative;z-index:1}
.detail-ssr-card{background:linear-gradient(145deg,rgba(18,18,24,0.92) 0%,rgba(10,10,14,0.96) 100%);border:1px solid rgba(255,255,255,0.07);border-radius:14px;padding:14px 16px;box-shadow:0 8px 24px rgba(0,0,0,0.28)}
.detail-ssr-card-label{font-size:11px;line-height:1.35;color:rgba(255,255,255,0.48);text-transform:uppercase;letter-spacing:.4px}
.detail-ssr-card-value{margin-top:8px;font-size:22px;line-height:1.1;font-weight:800;color:#fff;font-family:var(--mn)}
.detail-ssr-card-sub{margin-top:6px;font-size:12px;line-height:1.4;color:rgba(255,255,255,0.42)}
.spec-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;background:linear-gradient(145deg,rgba(18,18,24,0.92) 0%,rgba(10,10,14,0.96) 100%);border:1px solid rgba(255,255,255,0.07);border-radius:var(--radius-m);overflow:hidden;box-shadow:0 8px 32px rgba(0,0,0,0.4)}
.spec-item{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid rgba(255,255,255,0.06)}
.spec-item:nth-child(odd){border-right:1px solid rgba(255,255,255,0.06)}
.spec-label{font-size:12px;line-height:var(--line-base);color:rgba(255,255,255,0.45);text-transform:uppercase;font-family:var(--mn);letter-spacing:.5px}
.spec-val{font-size:14px;line-height:var(--line-base);color:#ffffff;font-weight:600;text-align:right}

/* Price History Chart */
.ph-section{margin-top:24px}
.ph-card{background:linear-gradient(145deg,rgba(18,18,24,0.92) 0%,rgba(10,10,14,0.96) 100%);border:1px solid rgba(255,255,255,0.07);border-radius:var(--radius-m);padding:20px;box-shadow:0 8px 32px rgba(0,0,0,0.4)}
.ph-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;flex-wrap:wrap;gap:var(--space-2)}
.ph-title{font-family:var(--mn);font-size:13px;color:var(--dim);text-transform:uppercase;letter-spacing:1px}
.ph-periods{display:flex;gap:4px}
.ph-period{background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);border-radius:var(--radius-s);padding:6px 12px;font-size:12px;line-height:1;font-weight:700;color:rgba(255,255,255,0.5);cursor:pointer;transition:all .2s;font-family:var(--mn);min-height:var(--control-h);display:inline-flex;align-items:center;justify-content:center}
.ph-period:hover{border-color:rgba(47,107,255,0.3);color:#e5e7eb}
.ph-period.active{background:rgba(47,107,255,0.15);border-color:rgba(47,107,255,0.4);color:#60a5fa}
.ph-stats{display:flex;gap:16px;margin-bottom:12px;flex-wrap:wrap}
.ph-stat{font-size:11px;font-family:var(--mn);color:rgba(255,255,255,0.5)}
.ph-stat strong{color:#e5e7eb;font-weight:700;margin-left:4px}
.ph-stat.min strong{color:#22c55e}
.ph-stat.max strong{color:#ef4444}
.ph-stat.cur strong{color:#3b82f6}
.ph-canvas-wrap{position:relative;height:220px}
.ph-canvas-wrap canvas{width:100%!important;height:100%!important}
.ph-hover-tip{position:absolute;display:none;pointer-events:none;min-width:0;width:max-content;max-width:none;padding:10px 12px;border-radius:10px;background:rgba(15,15,20,0.95);border:1px solid rgba(255,255,255,0.10);box-shadow:0 12px 30px rgba(0,0,0,.36);z-index:3;transform:translateX(-50%);will-change:left,top;backface-visibility:hidden}
.ph-hover-tip-date{font-size:12px;line-height:1.25;font-weight:700;color:#f3f4f6;margin-bottom:6px;font-family:var(--mn);white-space:nowrap}
.ph-hover-tip-line{font-size:13px;line-height:1.35;font-weight:700;color:#f3f4f6;font-family:var(--mn);white-space:nowrap}
.ph-empty{text-align:center;padding:40px 0;color:rgba(255,255,255,0.3);font-size:13px}
.ph-footnotes{margin-top:12px;display:flex;flex-direction:column;gap:4px}
.ph-footnote{font-size:12px;line-height:1.4;color:rgba(255,255,255,0.42)}
.ph-mode-switch{display:flex;gap:2px;background:rgba(255,255,255,0.06);border-radius:10px;padding:2px}
.ph-mode-btn{padding:6px 16px;border-radius:8px;font-size:11px;font-weight:700;color:rgba(255,255,255,0.5);cursor:pointer;transition:all .2s;font-family:var(--mn);border:none;background:none}
.ph-mode-btn.active{background:rgba(47,107,255,0.15);color:#60a5fa}
.ph-mode-btn:hover:not(.active){color:#e5e7eb}
@media(max-width:640px){.ph-canvas-wrap{height:180px}.ph-stats{gap:10px}.ph-period{padding:4px 8px;font-size:10px}.detail-ssr-summary{grid-template-columns:1fr 1fr;padding:12px 12px 0}.mh-breadcrumbs{padding:12px 12px 0}.detail-ssr-card-value{font-size:18px}}

/* Right: Calculations */
.calc-section{margin-bottom:24px}
.calc-title{font-family:var(--mn);font-size:13px;line-height:var(--line-base);color:var(--dim);text-transform:uppercase;letter-spacing:1px;margin-bottom:12px;display:flex;align-items:center;gap:var(--space-2)}
.calc-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.calc-card{background:linear-gradient(145deg,rgba(18,18,24,0.92) 0%,rgba(10,10,14,0.96) 100%);border:1px solid rgba(255,255,255,0.07);border-radius:var(--radius-l);padding:16px;min-height:88px;box-shadow:0 8px 32px rgba(0,0,0,0.4)}
.calc-card-label{font-size:11px;line-height:var(--line-base);color:rgba(255,255,255,0.5);text-transform:uppercase;font-family:var(--mn);letter-spacing:.4px}
.calc-card-val{font-size:32px;font-weight:800;color:#ffffff;margin-top:8px;font-family:var(--mn);transition:color .3s;min-height:40px;line-height:var(--line-tight)}
.calc-card-val.positive{color:var(--gr)}
.calc-card-val.negative{color:var(--rd)}
.calc-card-sub{font-size:12px;line-height:var(--line-base);color:rgba(255,255,255,0.4);margin-top:8px}
        .faq-info-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:999px;border:1px solid rgba(255,255,255,0.14);background:rgba(255,255,255,0.04);color:#93c5fd;font-size:11px;font-weight:800;font-family:Inter,system-ui,sans-serif;cursor:pointer;flex-shrink:0;line-height:1;text-align:center;padding:0;vertical-align:middle;font-style:normal;appearance:none}
.faq-info-btn:hover{border-color:rgba(96,165,250,0.42);background:rgba(59,130,246,0.12)}
.faq-popover{position:absolute;display:none;max-width:280px;padding:12px 14px;border-radius:12px;background:rgba(14,14,18,0.98);border:1px solid rgba(255,255,255,0.10);box-shadow:0 18px 50px rgba(0,0,0,0.45);z-index:2147483647}
.faq-popover.open{display:block}
.faq-popover-title{font-size:12px;font-weight:800;color:#fff;margin-bottom:6px}
.faq-popover-body{font-size:12px;line-height:1.45;color:rgba(255,255,255,0.68)}
.calc-full{grid-column:span 2}
.calc-income-card,.calc-roi-card{min-height:112px;border-radius:var(--radius-xl);display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"label switch" "value value";align-items:start;column-gap:12px;row-gap:8px}
.calc-income-label{grid-area:label}
.calc-income-switch{grid-area:switch}
#cv-income,#cv-roi{grid-area:value}
.calc-risk-card{display:flex;flex-direction:column;justify-content:flex-start;min-height:122px}
.calc-risk-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.calc-risk-label{font-size:15px;line-height:1.15;font-weight:800;color:#ffffff;font-family:var(--mn)}
.calc-risk-track{position:relative;margin-top:14px;height:8px;border-radius:999px;background:linear-gradient(90deg,#ef4444 0%,#f59e0b 50%,#22c55e 100%);box-shadow:inset 0 0 0 1px rgba(255,255,255,0.05)}
.calc-risk-dot{position:absolute;top:50%;width:4px;height:16px;border-radius:999px;background:#ffffff;transform:translate(-50%,-50%);left:50%;box-shadow:0 0 10px rgba(255,255,255,0.55);transition:left .35s ease, box-shadow .3s ease}
.calc-income-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.calc-income-label{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12px;color:rgba(255,255,255,0.72);letter-spacing:.9px}
.calc-income-switch{display:inline-flex;align-items:center;gap:4px;padding:4px;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.08);border-radius:var(--radius-xl);min-height:var(--control-h)}
.calc-income-btn{border:none;background:transparent;color:rgba(255,255,255,0.46);font:700 12px/1 var(--mn);padding:6px 10px;border-radius:999px;cursor:pointer;transition:all .18s;min-height:24px;display:inline-flex;align-items:center;justify-content:center}
.calc-income-btn:hover{color:#dbeafe}
.calc-income-btn.active{background:rgba(59,130,246,0.18);color:#60a5fa;box-shadow:inset 0 0 0 1px rgba(96,165,250,0.22)}
.calc-roi-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}

/* Offer selector (vendor table replacement) */
.offer-section{margin-top:24px}
.offer-list{display:flex;flex-direction:column;gap:8px}
    .nav-search-wrap{z-index:260000;overflow:visible}
    .nav-search-results{display:none;position:fixed;z-index:2147483647;background:#05070d !important;border:1px solid rgba(112,146,255,0.34);border-radius:14px;max-height:420px;overflow-y:auto;box-shadow:0 24px 70px rgba(0,0,0,.82),0 0 0 1px rgba(80,120,255,0.10) inset;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;padding:6px 0;isolation:isolate;opacity:1 !important}
    .nav-search-results.open{display:block}
    .nav-search-item{display:flex;align-items:center;gap:12px;padding:12px 16px;cursor:pointer;transition:background .15s;text-decoration:none}
    .nav-search-item,.nav-search-item *{cursor:pointer}
    .nav-search-item:hover{background:rgba(255,255,255,0.06)}
    .nav-search-img{width:46px;height:46px;border-radius:10px;background:rgba(255,255,255,0.06);display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}
    .nav-search-img img{width:100%;height:100%;object-fit:contain}
    .nav-search-name{font-size:13px;font-weight:700;color:#e5e7eb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .nav-search-sub{font-size:11px;color:rgba(255,255,255,0.45);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .nav-search-price{font-size:13px;font-weight:700;color:#e5e7eb;text-align:right;white-space:nowrap;flex-shrink:0}
    .nav-search-empty{padding:16px;text-align:center;color:rgba(255,255,255,0.45);font-size:12px}
    .search-clear-btn{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:22px;height:22px;border:none;border-radius:999px;background:rgba(255,255,255,0.08);color:rgba(255,255,255,0.7);font-size:12px;font-weight:700;display:none;align-items:center;justify-content:center;cursor:pointer;z-index:2;transition:background .15s,color .15s}
    .search-clear-btn:hover{background:rgba(255,255,255,0.14);color:#fff}
    .search-clear-btn.visible{display:inline-flex}
    .nav-search-input.has-clear{padding-right:42px}
    .site-footer{padding:20px 16px 20px;text-align:center;opacity:.3;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.2em}
.nav-glass-btn{display:flex;align-items:center;justify-content:center;padding:0 24px;background:transparent;color:#3b82f6;font-size:14px;font-weight:900;line-height:1;text-decoration:none;text-transform:uppercase;letter-spacing:0.05em;border:none;transition:all .2s;font-family:'Inter',sans-serif;text-shadow:none;box-shadow:none}
.nav-glass-btn:hover{color:#60a5fa;text-shadow:none;box-shadow:none}
.auth-login-btn{display:flex;align-items:center;justify-content:center;padding:0 24px;background:transparent;color:#3b82f6;font-size:14px;font-weight:900;cursor:pointer;transition:all .2s;font-family:'Inter',sans-serif;text-transform:uppercase;letter-spacing:0.05em;text-decoration:none;border:none;min-width:auto;text-shadow:none;box-shadow:none}
.auth-login-btn:hover{color:#60a5fa;text-shadow:none;box-shadow:none}
    .auth-user{display:flex;align-items:center;gap:8px;cursor:pointer;position:relative;padding:0 16px;border-left:1px solid rgba(255,255,255,0.08);transition:background .2s}
    .auth-user:hover{background:rgba(255,255,255,0.06)}
.auth-avatar{width:28px;height:28px;min-width:28px;min-height:28px;border-radius:50%;border:2px solid rgba(255,255,255,0.15);object-fit:cover;box-sizing:border-box}
    .auth-name{font-size:12px;color:rgba(255,255,255,0.7);font-weight:600;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
    .auth-dropdown{display:none;position:absolute;top:calc(100% + 8px);right:0;background:#0b0f17;border:1px solid rgba(255,255,255,0.1);border-radius:10px;padding:6px 0;min-width:160px;z-index:100;box-shadow:0 8px 32px rgba(0,0,0,.5);backdrop-filter:none !important;-webkit-backdrop-filter:none !important;opacity:1 !important}
    .auth-dropdown.open{display:block}
    .auth-dropdown-item{padding:8px 16px;font-size:12px;color:var(--tx);cursor:pointer;transition:background .15s;display:block;text-decoration:none;font-weight:600}
    .auth-dropdown-item:hover{background:rgba(47,107,255,.1);color:var(--ac)}
    .auth-dropdown-item.logout{color:#ef4444}
    .auth-dropdown-item.logout:hover{background:rgba(239,68,68,.1)}
    .auth-modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.6);backdrop-filter:blur(4px);z-index:1000;align-items:center;justify-content:center}
    .auth-modal-overlay.open{display:flex}
    .auth-modal{background:linear-gradient(145deg,rgba(20,20,28,0.98) 0%,rgba(12,12,16,0.99) 100%);border:1px solid rgba(255,255,255,0.1);border-radius:20px;padding:32px;min-width:340px;max-width:400px;box-shadow:0 24px 64px rgba(0,0,0,.6);text-align:center;position:relative}
    .auth-modal h2{color:#fff;font-size:22px;font-weight:800;margin:0 0 8px}
    .auth-modal p{color:rgba(255,255,255,0.4);font-size:13px;margin:0 0 24px}
    .auth-google-btn,.auth-yandex-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:12px 20px;border:1px solid rgba(255,255,255,0.12);border-radius:12px;background:rgba(255,255,255,0.05);color:#fff;font-size:14px;font-weight:700;cursor:pointer;transition:all .2s;text-decoration:none}
    .auth-google-btn:hover,.auth-yandex-btn:hover{background:rgba(255,255,255,0.1);border-color:rgba(255,255,255,0.2)}
    .auth-google-btn svg,.auth-yandex-btn svg{width:20px;height:20px}
    .auth-yandex-btn{margin-top:12px}
    .auth-modal-close{position:absolute;top:12px;right:16px;background:none;border:none;color:rgba(255,255,255,0.3);font-size:20px;cursor:pointer}
    .auth-modal-close:hover{color:#fff}
.offer-row{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:var(--radius-m);border:1px solid rgba(255,255,255,0.07);background:linear-gradient(145deg,rgba(18,18,24,0.92) 0%,rgba(10,10,14,0.96) 100%);cursor:pointer;transition:all .2s;position:relative;box-shadow:0 4px 16px rgba(0,0,0,0.3)}
.offer-row:hover{border-color:rgba(47,107,255,0.3);box-shadow:0 6px 24px rgba(47,107,255,0.1)}
.offer-row.selected{border-color:var(--ac);background:rgba(47,107,255,0.1);box-shadow:0 0 0 1.5px var(--ac),0 6px 24px rgba(47,107,255,0.15)}
.offer-row.selected::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--ac);border-radius:10px 0 0 10px}
.offer-source{font-weight:900;font-size:16px;line-height:var(--line-tight);color:var(--hi);min-width:130px;white-space:nowrap;font-family:var(--mn)}
.offer-specs{flex:1;display:flex;align-items:center;gap:16px;font-size:12px;line-height:var(--line-base);color:rgba(255,255,255,0.5)}
.offer-specs span{white-space:nowrap}
.offer-right{display:flex;align-items:center;gap:10px;flex-shrink:0;margin-left:auto}
.offer-button{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-shrink:0}
.offer-meta{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-shrink:0;margin-left:auto}
.offer-price{text-align:right;min-width:100px;margin-right:4px}
.offer-price-main{font-size:16px;line-height:var(--line-tight);font-weight:700;color:var(--hi)}
.offer-price-sub{font-size:12px;line-height:var(--line-base);color:rgba(255,255,255,0.4)}
.offer-tags{display:flex;flex-direction:column;gap:3px;align-items:center}
.offer-tag{font-size:9px;line-height:1;font-weight:800;padding:4px 8px;border-radius:var(--radius-s);text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;text-align:center;min-width:72px;display:inline-flex;align-items:center;justify-content:center}
.offer-tag-price{background:var(--gr);color:#000}
.offer-tag-roi{background:var(--ac);color:#fff}
.offer-roi{background:rgba(22,163,74,0.9);color:#fff;font-size:12px;line-height:1;font-weight:800;padding:6px 10px;border-radius:var(--radius-s);letter-spacing:0.02em;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;min-height:28px}
.offer-roi-neg{background:rgba(220,38,38,0.9) !important}
.offer-roi-warn{background:rgba(234,179,8,0.9) !important}
.offer-link{display:inline-flex;align-items:center;justify-content:center;gap:4px;font-size:12px;line-height:1;font-weight:700;color:var(--ac);text-decoration:none;white-space:nowrap;padding:0 12px;min-height:32px;border:1px solid rgba(47,107,255,0.4);border-radius:var(--radius-s);transition:all .2s}
.offer-link:hover{background:var(--ac);color:#fff;text-decoration:none}

.offer-src-group{margin-bottom:8px}
.offer-src-group.has-rest>.offer-row:first-child{border-radius:10px 10px 0 0;border-bottom:none}
.offer-src-toggle{padding:10px 16px;border-radius:0 0 var(--radius-m) var(--radius-m);border:1px solid rgba(255,255,255,0.07);border-top:none;text-align:center;color:rgba(255,255,255,0.4);cursor:pointer;transition:all .2s;font-size:12px;line-height:var(--line-base);font-weight:600;background:linear-gradient(145deg,rgba(14,14,19,0.92) 0%,rgba(8,8,11,0.96) 100%)}
.offer-src-toggle:hover{color:var(--ac)}
.offer-src-toggle.open{border-radius:0;border-bottom:none}
.offer-src-extra{display:none;flex-direction:column;gap:0;border:1px solid rgba(255,255,255,0.07);border-top:none;border-radius:0 0 10px 10px;overflow:hidden}
.offer-src-extra.open{display:flex}
.offer-src-extra .offer-row{border-radius:0;border-left:none;border-right:none;border-bottom:none;box-shadow:none;border-top:1px solid rgba(255,255,255,0.05)}
.offer-src-extra .offer-row:last-child{border-radius:0 0 10px 10px}
.offer-src-sort{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border-top:1px solid rgba(255,255,255,0.05);background:rgba(255,255,255,0.02)}
.offer-src-sort-label{font-size:11px;color:rgba(255,255,255,0.55);font-weight:700}
.offer-src-sort-wrap{position:relative;display:inline-flex}
.offer-src-sort-popup{display:none;position:absolute;top:calc(100% + 8px);right:0;background:linear-gradient(145deg,rgba(20,20,28,0.98) 0%,rgba(12,12,16,0.99) 100%);border:1px solid rgba(255,255,255,0.1);border-radius:var(--radius-m);padding:8px 0;min-width:180px;z-index:30;box-shadow:0 8px 32px rgba(0,0,0,.5)}
.offer-src-sort-popup.open{display:block}
.offer-src-sort-btn{font-size:10px;line-height:1;font-weight:700;color:rgba(255,255,255,0.35);background:none;border:1px solid rgba(255,255,255,0.08);border-radius:6px;padding:6px 8px;cursor:pointer;transition:all .15s;font-family:var(--mn);min-height:24px;display:inline-flex;align-items:center;justify-content:center}
.offer-src-sort-btn:hover{border-color:var(--ac);color:var(--ac)}
.offer-src-sort-btn.active{border-color:var(--ac);color:var(--ac)}
/* Sort button & popup */
.offer-sort-wrap{position:relative;display:inline-block;margin-left:auto}
.offer-sort-btn{display:inline-flex;align-items:center;justify-content:center;gap:4px;font-size:11px;line-height:1;font-weight:700;color:rgba(255,255,255,0.5);background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.1);border-radius:var(--radius-s);padding:0 12px;min-height:32px;cursor:pointer;transition:all .2s;font-family:var(--mn);text-transform:uppercase;letter-spacing:.3px}
.offer-sort-btn:hover{border-color:var(--ac);color:var(--ac)}
.offer-sort-btn.active{border-color:var(--ac);color:var(--ac)}
.offer-sort-popup{display:none;position:absolute;top:calc(100% + 8px);right:0;background:linear-gradient(145deg,rgba(20,20,28,0.98) 0%,rgba(12,12,16,0.99) 100%);border:1px solid rgba(255,255,255,0.1);border-radius:var(--radius-m);padding:8px 0;min-width:180px;z-index:20;box-shadow:0 8px 32px rgba(0,0,0,.5)}
.offer-sort-popup.open{display:block}
.offer-sort-item{padding:10px 16px;font-size:12px;line-height:var(--line-base);font-weight:600;color:var(--tx);cursor:pointer;transition:background .15s;font-family:var(--mn)}
.offer-sort-item:hover{background:rgba(47,107,255,.1);color:var(--ac)}
.offer-sort-item.active{color:#fff;background:rgba(47,107,255,.2);border-left:2px solid var(--ac)}
.offer-sort-item .sort-arrow{font-size:10px;margin-left:4px;opacity:.6}
.offer-sort-reset{border-top:1px solid rgba(255,255,255,0.06);margin-top:4px;padding-top:10px;color:var(--dim)}
.offer-sort-reset:hover{color:var(--rd)}
/* Unavailable vendor */
.offer-row--unavail{flex-wrap:wrap}
.offer-row--unavail .offer-link{display:none !important}
.offer-unavail-block{display:flex;flex-direction:column;align-items:flex-end;gap:2px;text-align:right}
.offer-unavail-title{font-size:12px;font-weight:700;color:rgba(220,80,80,0.85);white-space:nowrap}
.offer-unavail-sub{font-size:10px;color:rgba(255,255,255,0.35);line-height:1.3;max-width:200px}

/* Chart */
.chart-wrap{background:linear-gradient(145deg,rgba(18,18,24,0.92) 0%,rgba(10,10,14,0.96) 100%);border:1px solid rgba(255,255,255,0.07);border-radius:var(--radius-m);padding:16px;margin-top:16px;min-height:290px;box-shadow:0 8px 32px rgba(0,0,0,0.4)}
.chart-wrap canvas{width:100%!important;height:250px!important}

/* Toggle */
.calc-toggle{display:inline-flex;border:1px solid rgba(255,255,255,0.1);border-radius:4px;overflow:hidden;font-size:11px;font-family:var(--mn)}
.calc-toggle span{padding:4px 10px;cursor:pointer;color:rgba(255,255,255,0.4);transition:.2s}
.calc-toggle span.active{background:var(--ac);color:#fff}

/* Animated number */
.anim-val{display:inline-block}

/* Responsive */
@media(max-width:768px){
  .detail-body{flex-direction:column}
  .calc-grid{grid-template-columns:1fr}
  .calc-full{grid-column:span 1}
  .spec-grid{grid-template-columns:1fr}
  .spec-item:nth-child(odd){border-right:none}
  .offer-row{flex-wrap:wrap}
  .offer-specs{flex-basis:100%;order:3}
  .offer-unavail-block{min-width:unset;flex-basis:100%;order:4;align-items:flex-start;text-align:left;padding-left:0;margin-top:6px}
}

/* Loading */
.detail-loading{text-align:center;padding:80px 20px;color:var(--dim);font-size:16px}

/* Nav electricity price indicator */
.nav-elec-wrap{display:flex;align-items:center;gap:6px;padding:0 12px;border-left:1px solid rgba(255,255,255,0.08);font-size:12px;line-height:1}
.nav-elec-wrap::before{content:'\26A1';font-size:14px;line-height:1;color:#60a5fa;filter:drop-shadow(0 0 6px rgba(59,130,246,0.32))}
.nav-elec-icon{font-size:14px;line-height:1;color:#60a5fa;filter:drop-shadow(0 0 6px rgba(59,130,246,0.32))}
.nav-elec-label{display:none}
.nav-elec-input{width:42px;height:28px;background:transparent !important;border:none;color:#fff;text-align:right;padding:0 22px 0 0;border-radius:0;font-size:13px;font-weight:800;outline:none;appearance:textfield;-moz-appearance:textfield;line-height:1;font-variant-numeric:tabular-nums;caret-color:#60a5fa}
.nav-elec-input:focus{border:none;box-shadow:none;background:transparent !important}
.nav-elec-input::-webkit-outer-spin-button,.nav-elec-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.nav-elec-spin{position:relative;display:flex;align-items:center}
.nav-elec-step{position:absolute;right:0;width:14px;height:10px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer;padding:0;border-radius:4px;transition:background .16s}
.nav-elec-step:hover{background:rgba(59,130,246,0.14)}
.nav-elec-step.up{top:3px}
.nav-elec-step.down{bottom:3px}
.nav-elec-step::before{content:'';width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent}
.nav-elec-step.up::before{border-bottom:6px solid rgba(96,165,250,0.98);filter:drop-shadow(0 0 4px rgba(59,130,246,0.45))}
.nav-elec-step.down::before{border-top:6px solid rgba(96,165,250,0.98)}
.nav-elec-unit{display:inline-flex;align-items:center;font-size:13px;color:#fff;font-weight:800}
.nav-search-results::-webkit-scrollbar{width:10px}
.nav-search-results::-webkit-scrollbar-track{background:rgba(255,255,255,0.04);border-radius:999px}
.nav-search-results::-webkit-scrollbar-thumb{background:linear-gradient(180deg,rgba(59,130,246,0.95) 0%,rgba(37,99,235,0.82) 100%);border-radius:999px;border:2px solid rgba(5,8,16,0.9)}
.nav-search-results::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,rgba(96,165,250,1) 0%,rgba(59,130,246,0.92) 100%)}
.nav-search-results{scrollbar-color:rgba(59,130,246,0.95) rgba(255,255,255,0.04);scrollbar-width:thin}

/* ========== MOBILE RESPONSIVE ========== */

/* Global box-sizing fix */
*,*::before,*::after{box-sizing:border-box}

/* iOS input zoom fix */
@media(max-width:768px){
  input,textarea,select{font-size:16px !important}
}

/* Active states for touch */
.offer-row:active{transform:scale(0.98);transition:transform .1s}
.offer-link:active{background:var(--ac);color:#fff;transform:scale(0.97)}
.ph-period:active,.ph-mode-btn:active{transform:scale(0.95)}

/* Mobile-only elements вЂ" hidden on desktop, shown on mobile */
.mob-result-block{display:none}
.mob-detail-cta{display:none}

/* Tablet в‰¤1024px */
@media(max-width:1024px){
  .detail-body{padding:16px}
  .detail-img-wrap{height:300px}
  .detail-title{font-size:24px}
  .calc-card-val{font-size:18px}
}

/* Mobile в‰¤768px */
@media(max-width:768px){
  html,body{overflow-x:hidden;max-width:100vw}

  /* Anti-overlap */
  .detail-body,.detail-body *{white-space:normal;word-break:break-word}

  /* Nav */
  .mh-nav{padding:8px 12px}
  .mh-nav-logo{font-size:20px}
  .mh-nav-right{gap:8px}
  .mh-nav-link{font-size:10px;padding:3px 10px;min-height:36px;display:inline-flex;align-items:center}
  .mh-nav-back{font-size:12px}
  nav{padding:0 12px !important;height:48px !important}
  nav>a{font-size:1.4rem !important;line-height:48px !important}
  .nav-glass-btn{padding:0 10px !important;font-size:12px !important;min-height:48px}
  .auth-login-btn{padding:0 10px !important;font-size:12px !important;min-height:48px}
  .nav-search-wrap{display:none !important}
  .auth-user{padding:0 8px}
  .auth-name{max-width:80px;font-size:11px}
.auth-avatar{width:28px;height:28px;min-width:28px;min-height:28px;box-sizing:border-box}
  .auth-modal{min-width:0;width:calc(100vw - 32px);max-width:400px;padding:24px 20px}

  /* Flatten layout: both columns become a single flow with CSS order */
  .detail-body{display:flex;flex-direction:column;padding:4px 12px 16px;gap:10px}
  .detail-left,.detail-right{flex:none;width:100%;display:contents;position:static}
  .back-to-catalog{position:static;top:auto;left:auto;font-size:13px;margin-bottom:0;min-height:28px;display:inline-flex;align-items:center;order:0;padding:0;letter-spacing:0;font-weight:800}
  .back-to-catalog::before{font-size:14px;transform:none}

  /* 1. Image first вЂ" flush to top */
  .detail-img-wrap{height:220px;border-radius:12px;margin-bottom:0;margin-top:0;order:1}
  .detail-img{max-height:210px}

  /* 2. Title */
  .detail-title{font-size:20px;line-height:1.2;order:2}
  .detail-subtitle{font-size:12px;margin-bottom:0;line-height:1.4;order:3}

  /* 3. Key specs вЂ" 2-col compact, no wrapping, smaller font */
  .spec-grid{grid-template-columns:1fr 1fr;border-radius:10px;order:4}
  .spec-item{padding:8px 10px;min-width:0}
  .spec-label{font-size:10px;line-height:1.4;white-space:nowrap}
  .spec-val{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:58%;min-width:0}

  /* 4. Result block (2x2 grid) вЂ" shown on mobile */
  .mob-result-block{display:none !important}
  .calc-section{display:block;order:5;margin-bottom:0}
  .calc-grid{grid-template-columns:1fr 1fr;gap:8px}
  .calc-full{grid-column:span 1}
  .calc-card{padding:12px;border-radius:12px;min-height:108px}
  .calc-card-val{font-size:16px;min-height:0}
  .calc-card-sub{font-size:10px;margin-top:6px}
  .calc-income-card,.calc-roi-card,.calc-risk-card{min-height:112px}
  .calc-risk-note{display:none}
  .calc-title{font-size:12px;margin-bottom:8px}
  .calc-income-card,.calc-roi-card{display:flex;flex-direction:column;padding:12px 12px 0}
  .calc-card-label.calc-income-label{display:block;font-size:10px;line-height:1.3;letter-spacing:.35px;max-width:none;min-width:0}
  .calc-income-switch{margin-top:auto;margin-left:-12px;margin-right:-12px;width:calc(100% + 24px);padding:6px;border:none;border-top:1px solid rgba(255,255,255,0.08);border-radius:0 0 12px 12px;background:rgba(255,255,255,0.04);justify-content:stretch;gap:4px;min-height:0}
  .calc-income-btn{padding:4px 7px;font-size:10px;min-height:22px}
  .calc-risk-label{font-size:14px}
  .calc-income-btn{flex:1}
  .mob-result-card{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:3px}
  .mob-result-label{font-size:10px;color:rgba(255,255,255,0.45);font-weight:600;line-height:1.4}
  .mob-result-val{font-size:18px;font-weight:800;color:#fff;line-height:1.2}
  .mob-result-val.positive{color:var(--gr)}
  .mob-result-val.negative{color:#ef4444}
  .mob-result-sub{font-size:10px;color:rgba(255,255,255,0.35)}

  /* Elec input in content вЂ" HIDDEN on mobile (moved to nav) */
  .detail-header{display:none}


  /* 6. CTA button (mob-detail-cta) */
  .mob-detail-cta{display:block;order:6;width:100%;padding:14px;background:#2563eb;color:#fff;border:none;border-radius:14px;font-size:15px;font-weight:800;text-align:center;min-height:48px;cursor:pointer;letter-spacing:0.03em;-webkit-tap-highlight-color:transparent}
  .mob-detail-cta:active{background:#1e40af;transform:scale(0.97)}

  /* 7. Chart */
  .ph-section{margin-top:0;order:7}
  .ph-card{padding:14px;border-radius:12px}
  .ph-header{flex-direction:column;align-items:flex-start;gap:8px;margin-bottom:10px}
  .ph-title{font-size:12px}
  .ph-mode-switch{width:100%}
  .ph-mode-btn{flex:1;text-align:center;padding:8px 8px;font-size:12px;min-height:40px}
  .ph-periods{width:100%;flex-wrap:wrap}
  .ph-period{flex:1;text-align:center;padding:7px 6px;font-size:11px;min-height:36px;display:flex;align-items:center;justify-content:center}
  .ph-canvas-wrap{height:200px}
  .ph-stats{gap:10px;margin-bottom:10px}
  .ph-stat{font-size:11px}
  .chart-wrap{padding:14px;border-radius:12px}
  .chart-wrap canvas{height:200px!important}

  /* 8. Offers */
  .offer-section{margin-top:0;order:8}
  .offer-row{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"source right" "specs button";align-items:center;column-gap:10px;row-gap:6px;padding:10px 12px;border-radius:12px}
  .offer-source{grid-area:source;font-size:13px;min-width:0;max-width:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:none}
  .offer-specs{grid-area:specs;flex-basis:auto;order:initial;gap:8px;font-size:11px;padding-top:0;border-top:none;min-width:0;overflow:hidden}
  .offer-right{grid-area:right;display:flex;flex-direction:column;align-items:flex-end;gap:4px;min-width:0;margin-left:0}
  .offer-price{min-width:0;margin-right:0;text-align:right}
  .offer-price-main{font-size:14px}
  .offer-price-sub{font-size:10px}
  .offer-button{grid-area:button;display:flex;align-items:center;justify-content:flex-end;min-width:110px}
  .offer-tags{display:none}
  .offer-tag{font-size:7px;padding:2px 6px;min-width:0}
  .offer-roi{font-size:11px;padding:4px 8px;white-space:nowrap;min-height:24px}
  .offer-link{font-size:12px;padding:0 14px;min-height:34px;min-width:110px;width:100%;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;flex:none}
  .offer-link::before{content:none}
  .offer-unavail-block{min-width:unset;flex-basis:100%;order:4;align-items:flex-start;text-align:left;padding-left:0;margin-top:4px}
  .offer-unavail-title{font-size:12px}
  .offer-unavail-sub{font-size:10px;max-width:none}
  .offer-sort-btn{padding:8px 12px;font-size:11px;min-height:40px}
  .offer-sort-popup{position:fixed;left:12px;right:12px;bottom:12px;top:auto;min-width:0;max-height:min(52vh,360px);overflow-y:auto;border-radius:16px;padding:8px 0;z-index:2147483647}
  .offer-sort-item{padding:14px 16px;min-height:48px;display:flex;align-items:center;font-size:14px}
  .offer-src-sort-btn{min-height:40px;padding:8px 12px}
  .offer-src-toggle{min-height:44px;display:flex;align-items:center;justify-content:center;font-size:13px}
  .nav-elec-wrap{padding:0 8px;gap:0;min-width:72px;justify-content:center}
  .nav-elec-wrap::before{content:'⚡';font-size:14px;line-height:1;color:#60a5fa;margin-right:4px}
  .nav-elec-label,.nav-elec-step{display:none}
  .nav-elec-spin{position:relative;display:flex;align-items:center}
  .nav-elec-input{width:40px;height:28px;padding:2px 0;background:transparent;border:none;color:#fff;text-align:center;font-size:13px;font-weight:800;border-radius:0}
  .nav-elec-input:focus{border:none;box-shadow:none}
  .nav-elec-unit{display:inline-flex;align-items:center;font-size:12px;color:#ffffff;font-weight:800;margin-left:2px}

  .nav-elec-wrap::before{content:'\26A1';font-size:13px;line-height:1;color:#60a5fa;display:block}
  .nav-elec-label{display:none}
  .nav-elec-step{display:flex !important}
  .nav-elec-wrap{padding:0 8px;gap:5px;min-width:98px;justify-content:center}
  .nav-elec-icon{font-size:13px}
  .nav-elec-input{width:58px;height:28px;padding:0 18px 0 0;background:transparent;border:none;color:#fff;text-align:right;font-size:13px;font-weight:800;border-radius:0}
  .nav-elec-unit{font-size:12px}

  /* Lightbox */
  .lightbox-close{font-size:48px;width:54px;height:54px}
  .lightbox-controls{top:10px;right:10px}

  /* Toggle */
  .calc-toggle span{padding:8px 14px;min-height:40px;display:inline-flex;align-items:center;font-size:12px}
}

/* Small mobile в‰¤480px */
@media(max-width:480px){
  .detail-body{padding:10px 8px;gap:16px}
  .detail-img-wrap{height:200px}
  .detail-body{padding:6px 8px 14px;gap:10px}
  .detail-img-wrap{height:180px}
  .detail-title{font-size:17px}
  .detail-subtitle{font-size:11px}
  .mob-result-val{font-size:16px}
  .mob-result-block{gap:6px}
  .mob-result-card{padding:10px}
  .mob-result-label{font-size:9px}
  .offer-source{font-size:12px}
  .offer-price-main{font-size:13px}
  .offer-roi{font-size:10px;padding:2px 6px}
  .ph-canvas-wrap{height:170px}
  .spec-val{font-size:11px}
  .spec-label{font-size:9px}

  nav>a{font-size:1.2rem !important}
  .nav-glass-btn{padding:0 8px !important;font-size:10px !important}
  .auth-login-btn{padding:0 8px !important;font-size:10px !important}
  .nav-elec-wrap{padding:0 6px}
  .nav-elec-wrap{min-width:92px}
  .nav-elec-input{width:52px;font-size:11px;padding-right:17px}
  .auth-modal{padding:20px 16px}
  .auth-modal h2{font-size:18px}
}