:root{--bg:#0e141b;--fg:#eaf1f7;--muted:#9fb0bf;--panel:rgba(9,14,20,.6);--accent:#e63946;--panel-width:400px;--panel-width-right:380px;--topbar-offset: 76px;--panel-top-offset: calc(var(--topbar-offset) + 2rem);--radius:12px;--shadow:0 12px 40px rgba(0,0,0,.35);--border:1px solid rgba(255,255,255,.12);--blur:10px;--space-1:6px;--space-2:10px;--space-3:14px;--space-4:18px;--space-5:26px;--space-6:36px;--z-panel: 6;--z-ui:5;--z-overlay: 7}html,body,#root{height:100%;overflow:hidden}body{margin:0;background:linear-gradient(180deg,#0b1117,#0f1720);color:var(--fg);font-family:Inter,system-ui,sans-serif;line-height:1.55}.side-panel{position:fixed;top:var(--panel-top-offset);left:12px;bottom:12px;width:var(--panel-width);background:var(--panel);-webkit-backdrop-filter:blur(var(--blur));backdrop-filter:blur(var(--blur));border-right:var(--border);z-index:var(--z-panel);display:flex;flex-direction:column;box-shadow:var(--shadow);transform:translate(0);transition:transform .25s ease;border-radius:12px}.side-panel--collapsed{transform:translate(-110%)}.panel-header{padding:calc(var(--space-6) - 2px) var(--space-6) var(--space-4);border-bottom:var(--border);display:flex;flex-direction:column;gap:var(--space-4)}.brand{display:flex;align-items:center;gap:var(--space-3);font-weight:700;letter-spacing:.2px}.brand__dot{width:10px;height:10px;border-radius:999px;background:#3dc169;display:inline-block}.topbar{position:fixed;top:12px;left:12px;right:12px;display:flex;align-items:center;justify-content:space-between;gap:10px;background:#090e1499;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:10px 12px;z-index:var(--z-ui);box-shadow:var(--shadow)}.topbar-left{display:flex;align-items:center;gap:8px}.brand-mini{display:flex;align-items:center;gap:6px;font-weight:700;opacity:.9}.topbar-scenario{color:var(--muted);font-size:.95rem}.topnav{display:flex;gap:8px;align-items:center}.topnav-link{background:transparent;border:1px solid rgba(255,255,255,.14);color:var(--fg);padding:6px 10px;border-radius:999px;cursor:pointer;font-size:.9rem}.topnav-link.active{background:#ffffff1f}.topbar-actions{display:flex;gap:8px;align-items:center}.collapse-btn{position:absolute;top:12px;right:12px;background:transparent;color:var(--muted);border:var(--border);border-radius:8px;padding:4px 8px;cursor:pointer}.hero-summary{display:flex;flex-direction:column;gap:8px}.hero-title{color:var(--fg);opacity:.9;font-size:.95rem}.spec-strip{display:flex;flex-wrap:wrap;gap:8px}.chip{font-size:.8rem;padding:4px 8px;border-radius:999px;border:var(--border);background:#ffffff0d;color:var(--fg)}.brand-logo{width:64px;height:64px}.side-nav{width:100%}.side-nav__list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--space-2)}.nav-link{width:100%;text-align:left;background:transparent;color:var(--fg);border:var(--border);border-radius:10px;padding:10px 12px;cursor:pointer;transition:background .2s ease,border-color .2s ease,transform .05s ease}.nav-link:hover{background:#ffffff0f}.nav-link:active{transform:translateY(1px)}.nav-link--active{background:#ffffff1a;border-color:#ffffff2e}.panel-content{flex:1;padding:calc(var(--space-6) - 2px) var(--space-6) var(--space-4);padding-top:14px;overflow:auto;scrollbar-width:none}.panel-content::-webkit-scrollbar{width:0;height:0}.panel-content::-webkit-scrollbar-track{background:transparent}.panel-content::-webkit-scrollbar-thumb{background:transparent}.panel-footer{padding:var(--space-4) var(--space-5);border-top:var(--border)}.panel{min-width:0}.landing{position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--z-overlay);pointer-events:auto}.landing--scroll{overflow:auto;scrollbar-width:none}.landing--scroll::-webkit-scrollbar{width:0;height:0}.landing__bg{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(1200px 600px at 20% 20%,rgba(255,255,255,.08),transparent 50%),url(/hero-bg.jpg) center/cover no-repeat,linear-gradient(180deg,#0b1117,#0f1720);filter:saturate(1.05) blur(.2px)}.landing__veil{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(600px 320px at 50% 30%,#0a101833,#0a101885)}.section{position:relative;z-index:1;padding:38px 20px;display:flex;flex-direction:column;gap:14px;max-width:1080px;margin:0 auto}.landing__hero{align-items:center;text-align:center}.landing__brand{display:flex;gap:8px;align-items:center;color:var(--muted);font-weight:700}.landing__brand img{width:28px;height:28px}.landing__cta{display:flex;gap:10px;margin-top:6px}.muted{color:var(--muted)}.section__title{margin:0 auto;text-align:center;font-size:1.3rem;letter-spacing:.2px}.card-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.card{display:flex;flex-direction:column;gap:6px}@media (max-width: 980px){.card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 580px){.card-grid{grid-template-columns:1fr}}.logo-strip{margin-top:16px;display:flex;flex-direction:column;gap:8px;align-items:center}.logo-strip__row{display:flex;gap:16px;flex-wrap:wrap;opacity:.8}.logo{padding:6px 10px;border:var(--border);border-radius:8px;background:#ffffff0a}.mosaic{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.mosaic__item{height:140px;border-radius:10px;border:var(--border);background:#ffffff0f;box-shadow:inset 0 0 0 1px #ffffff0a}@media (max-width: 720px){.mosaic{grid-template-columns:1fr}.mosaic__item{height:110px}}.quote-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.quote blockquote{margin:0}.quote figcaption{margin-top:6px;color:var(--muted);font-size:.95rem}@media (max-width: 980px){.quote-grid{grid-template-columns:1fr}}.cta{display:flex;align-items:center;justify-content:space-between;gap:12px}.landing__faq{display:flex;flex-direction:column;gap:8px}.faq{background:#ffffff0a;border:var(--border);border-radius:10px;padding:10px 12px}.faq__q{cursor:pointer;list-style:none;font-weight:700}.faq__a{margin-top:6px;color:var(--muted)}.landing__footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:26px}.loading-orbit{position:relative;width:90px;height:90px;margin-top:12px}.loading-orbit__ring{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;border:1px dashed rgba(255,255,255,.28);filter:drop-shadow(0 0 10px rgba(255,255,255,.08))}.loading-orbit__dot{position:absolute;top:50%;left:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--accent);box-shadow:0 0 14px #e639468c;animation:orbit 2.6s linear infinite}@keyframes orbit{0%{transform:rotate(0) translate(38px) rotate(0)}to{transform:rotate(360deg) translate(38px) rotate(-360deg)}}.btn{background:linear-gradient(180deg,#162034,#111a2a);border:1px solid #273449;color:var(--fg);padding:10px 14px;border-radius:10px;cursor:pointer;transition:all .18s ease;box-shadow:0 2px #0003 inset,0 4px 16px #0000002e}.btn:hover{transform:translateY(-1px);box-shadow:0 2px #00000040 inset,0 10px 26px #00000047}.btn:active{transform:translateY(0)}.btn.cta{background:var(--accent);border-color:#ad1f28;color:#fff}.btn:focus-visible{outline:2px solid #6fb1ff;outline-offset:2px}.reset-btn{display:block;width:100%;background:linear-gradient(135deg,#ff5a6b,#e63946);color:#fff;border:none;padding:12px 16px;font-weight:700;border-radius:10px;box-shadow:0 8px 24px #e6394659}.panel-resizer{position:absolute;top:0;right:-4px;width:8px;height:100%;cursor:col-resize}.side-panel--resizing{-webkit-user-select:none;user-select:none}.panel-content-inner{animation:fadeIn .18s ease}@media (prefers-reduced-motion: reduce){.panel-content-inner{animation:none}}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}.hamburger-btn{position:fixed;top:calc(var(--panel-top-offset) + 12px);left:12px;z-index:var(--z-ui);background:#111723;border:1px solid #1a2230;color:var(--fg);padding:8px 10px;border-radius:8px;display:block}.drawer-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:var(--z-overlay)}.drawer-overlay--visible{opacity:1;pointer-events:auto}@media (max-width: 767px){.side-panel{transform:translate(-100%);width:min(86vw,420px)}.side-panel.side-panel--open{transform:translate(0)}.hamburger-btn{display:block}.panel-content-host{left:0;padding-left:0}}.section-content h2{background:linear-gradient(90deg,#ff7a7a,#ff3700);-webkit-background-clip:text;-webkit-text-fill-color:transparent;color:#e53935;margin-top:0;margin-bottom:15px}.section-content ul{display:flex;flex-direction:column;gap:var(--space-3);padding:0}.section-content li{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-3);padding:var(--space-3);background:#ffffff08;border:var(--border);border-radius:var(--radius);transition:background .18s ease,transform .18s ease}.section-content li:hover{background:#ffffff0f;transform:translateY(-1px)}.section-content li strong:before{content:"✓";color:#ff765bf2;font-weight:700;font-size:1.1rem;flex-shrink:0;padding-right:10px}.image-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px}.image-placeholder{background:#ffffff1a;border-radius:5px;height:130px;display:flex;justify-content:center;align-items:center;color:var(--muted);border:1px dashed var(--muted)}.compat-pro{display:flex;flex-direction:column;gap:var(--space-4);padding-top:var(--space-2)}.compat-pro__head{display:flex;justify-content:space-between;align-items:center;gap:12px}.compat-pro__title{margin:0;font-size:1.05rem;font-weight:700;letter-spacing:.2px}.compat-pro__sub{margin:0;color:var(--muted);font-size:.9rem}.compat-pro__ring{position:relative;width:78px;height:78px;border-radius:50%;background:#ffffff0f;border:var(--border)}.compat-pro__ring-fill{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;mask:radial-gradient(circle at 50% 50%,transparent 28px,#000 29px)}.compat-pro__ring-center{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-weight:700;font-size:.95rem}.compat-pro__grid{display:grid;grid-template-columns:1fr;gap:var(--space-3)}@media (max-width: 720px){.compat-pro__grid{grid-template-columns:1fr}}.compat-pro__card{background:#ffffff0a;border:var(--border);border-radius:var(--radius);padding:var(--space-3);box-shadow:var(--shadow)}.compat-pro__label{display:flex;align-items:center;gap:8px;font-weight:700;margin-bottom:8px}.dot{width:8px;height:8px;border-radius:999px;background:var(--accent);display:inline-block}.compat-pro__control{display:flex;align-items:center;gap:10px}.compat-pro__number{max-width:120px}.compat-pro__control input[type=range]{width:100%;accent-color:var(--accent)}.compat-pro__chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.chip{background:#ffffff0f;border:var(--border);color:var(--fg);padding:6px 10px;border-radius:999px;cursor:pointer;transition:transform .12s ease,background .12s ease}.chip:hover{transform:translateY(-1px);background:#ffffff1a}.chip--ok{background:#5cd68226;color:#97f3b6;border-color:#5cd68259}.chip--warn{background:#e24a9026;color:#ff9dc6;border-color:#e24a9059}.compat-pro__meter{position:relative;height:10px;border-radius:999px;background:#ffffff0f;border:var(--border);margin-top:10px;overflow:hidden}.compat-pro__meter .bar{position:absolute;top:0;left:0;height:100%}.compat-pro__meter .bar--ok{background:linear-gradient(90deg,var(--accent),#ff9800e5)}.compat-pro__meter .bar--limit{right:0;left:auto;width:2px;background:#ffffff4d}.compat-pro__preview{position:relative;height:80px;border-radius:10px;background:#ffffff08;border:var(--border);display:flex;align-items:center;padding:6px;overflow:hidden}.compat-pro__preview .screen{height:100%;min-width:22%;max-width:100%;background:linear-gradient(180deg,#162034,#111a2a);border:1px solid #273449;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:.85rem}.compat-pro__footer{display:flex;align-items:center;gap:10px;margin-top:2px}.hint{color:var(--muted);font-size:.9rem}.tabs{display:flex;gap:8px;padding:10px;background:var(--panel);position:fixed;top:10px;left:10px;border-radius:8px;z-index:10}.tab{padding:8px 12px;border-radius:6px;background:#111723;color:var(--fg);cursor:pointer;border:1px solid #1a2230}.tab.active{background:#182233;border-color:#2a3a55}.panel{background:#0e141b;border:1px solid #1a2230;border-radius:10px;overflow:auto;padding:14px}.split{display:grid;grid-template-columns:1fr 1fr;gap:12px;height:100%}.input,textarea{background:#0c1218;color:var(--fg);border:1px solid #1a2230;border-radius:6px;padding:8px;width:100%}.toolbar{display:flex;gap:10px;align-items:center}.btn{background:#182233;border:1px solid #2a3a55;color:var(--fg);padding:6px 10px;border-radius:6px;cursor:pointer}.btn.primary{background:var(--accent);border-color:#ad1f28}.viewerUI{position:fixed;top:calc(var(--topbar-offset) + 10px);right:20px;background:var(--panel);padding:12px 14px;border-radius:10px;z-index:var(--z-ui);border:var(--border);-webkit-backdrop-filter:blur(var(--blur));backdrop-filter:blur(var(--blur))}.section-content p{margin:0 0 12px}.toolbar-check{display:flex;gap:10px;align-items:center;font-size:.92rem;color:var(--muted)}.toolbar-check input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:36px;height:22px;background:#1a2533;border:1px solid #2a3a55;border-radius:999px;position:relative;outline:none;transition:all .18s ease}.toolbar-check input[type=checkbox]:after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:999px;background:linear-gradient(180deg,#eaf1f7,#cdd9e5);box-shadow:0 2px 6px #00000059;transition:all .18s ease}.toolbar-check input[type=checkbox]:checked{background:linear-gradient(180deg,#2d6bff,#2150d8);border-color:#2d6bff}.toolbar-check input[type=checkbox]:checked:after{left:16px}.mode-banner{margin-top:8px;font-size:.9rem;color:var(--muted)}.scenario-badge{color:var(--muted);font-size:.9rem}.help-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;display:flex;align-items:center;justify-content:center;z-index:var(--z-overlay)}.help-card{width:min(520px,90vw);background:#0e141b;border:var(--border);border-radius:var(--radius);padding:var(--space-5);box-shadow:var(--shadow);max-height:80vh;overflow:auto;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.25) transparent}.help-card::-webkit-scrollbar{width:10px}.help-card::-webkit-scrollbar-track{background:transparent;border-radius:8px}.help-card::-webkit-scrollbar-thumb{background:#ffffff38;border:2px solid transparent;background-clip:padding-box;border-radius:8px}.help-card::-webkit-scrollbar-thumb:hover{background:#ffffff52;border:2px solid transparent}.help-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-3)}.help-card ul{margin:0;padding-left:18px;color:var(--fg)}.controls-grid{display:grid;grid-template-columns:repeat(2,minmax(160px,1fr));gap:10px}.hotspot{width:24px;height:24px;border-radius:999px;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;border:2px solid rgba(255,255,255,.6);box-shadow:0 2px 6px #0006;cursor:pointer}.hotspot-wrap{position:relative}.hotspot-tip{position:absolute;bottom:30px;left:50%;transform:translate(-50%);background:#0a0f16cc;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--fg);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:12px 14px;width:240px;box-shadow:0 14px 32px #00000073;text-align:left}.hotspot-tip:after{content:"";position:absolute;bottom:-6px;left:50%;transform:translate(-50%);width:10px;height:10px;background:#0e141b;border-left:var(--border);border-bottom:var(--border);transform-origin:center;rotate:45deg}.tip-header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}.tip-header strong{font-size:.95rem}.tip-close{background:transparent;border:1px solid rgba(255,255,255,.18);color:var(--fg);border-radius:8px;width:24px;height:24px;line-height:22px;text-align:center;cursor:pointer}.hotspot-tip div{font-size:.92rem;line-height:1.35}.angle-tip{pointer-events:none;padding:8px 10px;width:auto}.angle-tip .tip-header strong{font-size:.9rem}.angle-tip .tip-header span{font-weight:700}.skeleton{background:linear-gradient(90deg,#ffffff0f 25%,#ffffff1a 37%,#ffffff0f 63%);background-size:400% 100%;height:18px;width:120px;border-radius:6px;animation:shimmer 1.2s infinite}@keyframes shimmer{0%{background-position:100% 0}to{background-position:0 0}}.spec-card{position:fixed;right:20px;bottom:20px;display:flex;gap:8px;flex-wrap:wrap;background:#0b111799;-webkit-backdrop-filter:blur(var(--blur));backdrop-filter:blur(var(--blur));border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:10px 12px;z-index:var(--z-ui);box-shadow:var(--shadow)}.spec-chip{font-size:.8rem;padding:6px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:linear-gradient(180deg,#ffffff14,#ffffff08);color:var(--fg)}@media (max-width: 767px){.spec-card{right:12px;bottom:12px}}.scenario-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;display:flex;align-items:center;justify-content:center;z-index:var(--z-overlay)}.scenario-card{width:min(720px,92vw);background:#0e141b;border:var(--border);border-radius:12px;padding:18px;box-shadow:var(--shadow);max-height:82vh;overflow:auto;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.25) transparent}.scenario-card::-webkit-scrollbar{width:10px}.scenario-card::-webkit-scrollbar-track{background:transparent;border-radius:8px}.scenario-card::-webkit-scrollbar-thumb{background:#ffffff38;border:2px solid transparent;background-clip:padding-box;border-radius:8px}.scenario-card::-webkit-scrollbar-thumb:hover{background:#ffffff52;border:2px solid transparent}.scenario-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.scenario-families{display:flex;gap:8px;margin-bottom:8px}.scenario-family{background:linear-gradient(180deg,#141c28,#101824);border:1px solid #223045;color:var(--fg);padding:8px 10px;border-radius:10px;cursor:pointer;transition:all .18s ease}.scenario-family.active{background:#182233;border-color:#2a3a55}.scenario-submodes{display:flex;flex-wrap:wrap;gap:8px}.scenario-chip{background:#ffffff0f;border:var(--border);color:var(--fg);padding:6px 10px;border-radius:999px;cursor:pointer}.scenario-note{margin-top:10px;color:var(--muted);font-size:.9rem}.scenario-submodes.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}.scenario-thumb{background:#0c121a99;border:1px solid rgba(255,255,255,.12);color:var(--fg);border-radius:12px;padding:10px;text-align:left;cursor:pointer;transition:all .18s ease;box-shadow:0 8px 24px #00000038}.scenario-thumb:hover{transform:translateY(-2px);box-shadow:0 16px 36px #0000004d}.thumb-box{height:72px;border-radius:10px;background:linear-gradient(135deg,#ffffff14,#ffffff08);border:1px solid rgba(255,255,255,.14);margin-bottom:8px}.thumb-label{font-size:.9rem;color:var(--fg);opacity:.9}.right-open-btn{position:fixed;top:calc(var(--panel-top-offset) + 12px);right:12px;z-index:var(--z-ui);background:#111723;border:1px solid #1a2230;color:var(--fg);padding:8px 10px;border-radius:8px}.right-panel{position:fixed;top:var(--panel-top-offset);right:12px;bottom:12px;width:var(--panel-width-right);background:var(--panel);-webkit-backdrop-filter:blur(var(--blur));backdrop-filter:blur(var(--blur));border-left:var(--border);z-index:var(--z-panel);transform:translate(100%);transition:transform .25s ease;display:flex;flex-direction:column;box-shadow:var(--shadow);border-radius:12px}.right-panel.open{transform:translate(0)}.right-resizer{position:absolute;top:0;left:-4px;width:8px;height:100%;cursor:col-resize}.spec-list{display:flex;flex-direction:column;gap:8px}.spec-row{display:flex;align-items:center;justify-content:space-between;padding:6px 0;border-bottom:1px dashed rgba(255,255,255,.06)}.angle-badge{font-size:.8rem;padding:4px 8px;border-radius:10px;border:1px solid rgba(255,255,255,.14);background:linear-gradient(180deg,#ffffff14,#ffffff08);color:var(--fg);box-shadow:0 6px 20px #00000059}.toasts{position:fixed;bottom:20px;left:20px;display:flex;flex-direction:column;gap:8px;z-index:var(--z-ui)}.toast{background:#0c121abf;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--fg);border:1px solid rgba(255,255,255,.14);border-radius:10px;padding:10px 12px;box-shadow:var(--shadow);cursor:pointer}