:root{--bg:#06111e;--card:#2b3037;--ink:#f7f8fb;--muted:#b7bec8;--line:#3a4654;--gold:#f4c45e;--blue:#4da3ff;--sale:#ff6b6b}
*{box-sizing:border-box}html,body{background:var(--bg)}body{margin:0;font-family:Segoe UI,Arial,sans-serif;color:var(--ink)}
header{border-bottom:1px solid #263444;background:#050e18;position:sticky;top:0;z-index:5}.top{max-width:1380px;margin:auto;padding:18px 28px;display:flex;align-items:center;justify-content:space-between}
.brand{font-size:31px;font-weight:700;letter-spacing:.02em}.brand small{display:block;font:11px Segoe UI;letter-spacing:.17em;color:var(--gold);margin-top:4px}
nav a{color:#e8edf4;text-decoration:none;margin-left:25px;font-size:14px}nav a:hover{color:var(--gold)}
.hero{background:linear-gradient(120deg,#081522,#101d2c 58%,#172231);border-bottom:1px solid #243343;padding:54px 28px}.hero>div,.wrap{max-width:1380px;margin:auto}
.hero h1{font-size:50px;line-height:1.04;margin:0 0 15px;font-weight:500}.hero p{max-width:760px;color:#d0d6df;line-height:1.65;font-size:17px}
.wrap{padding:34px 28px 65px}h2{font-size:29px;font-weight:500;color:var(--blue);margin:25px 0 18px}
.families{display:flex;flex-wrap:wrap;gap:9px;margin:0 0 34px}.chip{border:1px solid #354454;background:#0c1927;padding:9px 13px;border-radius:22px;text-decoration:none;color:#e8edf4;font-size:13px}.chip:hover{border-color:var(--gold);color:var(--gold)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:22px}.card{border:1px solid #3b424b;border-radius:11px;overflow:hidden;background:var(--card);text-decoration:none;color:inherit;transition:.16s}
.card:hover{transform:translateY(-3px);border-color:#596675;box-shadow:0 12px 30px #0008}.photo{aspect-ratio:1/1;background:#f4f5f5;display:flex;align-items:center;justify-content:center;overflow:hidden}
.photo img{width:100%;height:100%;object-fit:contain}.placeholder{color:#777;font-size:13px}.pad{padding:16px 17px 18px}.family{font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--gold)}
.card h3{font-size:18px;font-weight:500;margin:8px 0 12px;line-height:1.3}.price{font-weight:650}.old{text-decoration:line-through;color:#a9afb7;margin-right:8px}.sale{color:var(--sale);font-weight:750}.discount{display:inline-block;margin-left:8px;padding:2px 6px;border-radius:5px;background:var(--sale);color:#111;font-size:.78em;font-weight:800;vertical-align:middle}
.product{display:grid;grid-template-columns:minmax(340px,1fr) minmax(360px,.9fr);gap:45px}.mainimg{border:1px solid #3c4651;border-radius:10px;overflow:hidden;background:#f5f5f4}.mainimg img{width:100%;display:block}.product h1{font-size:38px;font-weight:500;margin:6px 0 13px}.lead{font-size:17px;line-height:1.65;color:#d5dae1}
.spec{width:100%;border-collapse:collapse;margin:27px 0;background:#0c1825;border:1px solid #344252}.spec td{border-bottom:1px solid #2c3947;padding:10px 12px}.spec td:first-child{color:#aeb8c4;width:38%;font-weight:600}
.gallery{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}.gallery img{width:96px;height:96px;object-fit:contain;background:#f5f5f4;border:1px solid #45515e;border-radius:6px}
.back{display:inline-block;margin-bottom:22px;color:#c8d0da;text-decoration:none}.back:hover{color:var(--gold)}footer{border-top:1px solid #263444;background:#050e18;padding:31px;text-align:center;color:#8895a3;font-size:12px}
@media(max-width:760px){.product{grid-template-columns:1fr}.hero h1{font-size:36px}.top{padding:15px}.wrap{padding:24px 15px}.hero{padding:38px 15px}nav{display:none}}
.layout{max-width:1380px;margin:auto;display:grid;grid-template-columns:245px minmax(0,1fr);gap:28px;padding:30px 28px 65px}
.sidebar{background:#071421;border:1px solid #2b3948;border-radius:10px;padding:18px 14px;align-self:start;position:sticky;top:92px;max-height:calc(100vh - 115px);overflow:auto}
.sidebar-title{color:var(--gold);font-size:12px;font-weight:700;letter-spacing:.15em;margin:2px 8px 14px}
.navtree,.navtree ul{list-style:none;margin:0;padding:0}.navtree ul{margin-left:14px;border-left:1px solid #273748;padding-left:7px}
.navtree a{display:block;color:#e4e9ef;text-decoration:none;padding:7px 9px;border-radius:6px;font-size:14px;line-height:1.25}
.navtree a:hover{background:#102235;color:var(--gold)}.navtree .child a{font-size:13px;color:#bfc8d2;padding-top:5px;padding-bottom:5px}
.content{min-width:0}.content h2:first-child{margin-top:0}.count{color:#8190a0;font-size:11px;margin-left:4px}
@media(max-width:900px){.layout{grid-template-columns:1fr;padding:20px 15px 50px}.sidebar{position:static;max-height:none}.navtree{columns:2}}
@media(max-width:560px){.navtree{columns:1}}

.family-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px}
.family-card{display:block;background:#111d2a;border:1px solid #344252;border-radius:10px;padding:20px;text-decoration:none;color:#f5f7fa;transition:.15s}
.family-card:hover{border-color:var(--gold);transform:translateY(-2px);background:#142334}
.family-card strong{display:block;font-size:18px;font-weight:500;margin-bottom:7px}.family-card span{color:#9eabb9;font-size:13px}
.navtree details{margin:0}.navtree summary{list-style:none;cursor:pointer;color:#e4e9ef;padding:7px 9px;border-radius:6px;font-size:14px}
.navtree summary::-webkit-details-marker{display:none}.navtree summary:before{content:"▸";display:inline-block;width:16px;color:#7f8c99}
.navtree details[open]>summary:before{content:"▾";color:var(--gold)}.navtree summary:hover{background:#102235;color:var(--gold)}
.navtree .leaf{display:block;color:#bfc8d2;text-decoration:none;padding:5px 9px 5px 25px;font-size:13px;border-radius:5px}
.navtree .leaf:hover{background:#102235;color:var(--gold)}

.intro{max-width:920px}.intro-kicker{color:var(--gold);font-size:12px;font-weight:700;letter-spacing:.16em;margin-bottom:10px}
.intro h2{font-size:34px;color:#f7f8fb;margin:0 0 18px}.intro p{font-size:16px;line-height:1.65;color:#d5dbe3;max-width:880px}
.intro-visual{width:min(460px,100%);aspect-ratio:4/3;background:#03070b;border:1px solid #344252;border-radius:10px;margin:22px 0 24px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.intro-gem{font-size:110px;color:var(--blue);text-shadow:0 0 35px #4da3ff66}
.intro-sections{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:26px}.intro-box{background:#0c1927;border:1px solid #344252;border-radius:10px;padding:18px}
.intro-box h3{margin:0 0 8px;color:var(--gold);font-size:17px}.intro-box p{font-size:14px;margin:0;color:#bfc8d2}
@media(max-width:700px){.intro-sections{grid-template-columns:1fr}}

.navtree summary a{color:inherit;text-decoration:none}.navtree summary a:hover{color:var(--gold)}

/* V1.4.2 compact Studio-like tree */
.navtree,.navtree ul{list-style:none;margin:0;padding:0}.navtree ul{margin-left:13px;border-left:1px solid #273748;padding-left:7px}
.navtree li{margin:0;padding:0}.navtree details{margin:0}.navtree summary{display:flex;align-items:center;gap:3px;list-style:none;cursor:pointer;padding:0;border-radius:5px;min-height:28px}
.navtree summary::-webkit-details-marker{display:none}.navtree summary:before{content:none!important}
.navtree .twisty{width:15px;flex:0 0 15px;text-align:center}.navtree .twisty:before{content:"▸";font-size:10px;color:#7f8c99}
.navtree details[open]>summary>.twisty:before{content:"▾";color:var(--gold)}
.navtree .node-link,.navtree .leaf{color:#e4e9ef;text-decoration:none;font-size:13px;line-height:1.2}
.navtree .node-link{display:flex;align-items:center;flex:1;padding:6px 2px}.navtree .leaf{display:flex;align-items:center;justify-content:space-between;padding:6px 7px 6px 22px;border-radius:5px}
.navtree .count{margin-left:auto;padding:0 6px;color:#71869b;font-size:10px;font-weight:400;white-space:nowrap}
.navtree summary:hover,.navtree .leaf:hover{background:#102235}.navtree .node-link:hover,.navtree .leaf:hover{color:var(--gold)}
.navtree .active{color:var(--gold)!important;font-weight:650}

.geminfo{margin-top:34px;padding:22px;background:#0c1927;border:1px solid #344252;border-radius:10px}.geminfo h2{margin:0 0 12px;color:var(--gold);font-size:23px}.geminfo p{line-height:1.65;color:#d5dbe3}.more{display:inline-block;margin-top:6px;color:var(--blue);text-decoration:none}.more:hover{color:var(--gold)}
.chapters{display:grid;gap:18px}.chapter{background:#0c1927;border:1px solid #344252;border-radius:10px;padding:20px}.chapter h2{font-size:21px;color:var(--gold);margin:0 0 10px}.chapter p{line-height:1.7;color:#d5dbe3;margin:0}
.breadcrumb{font-size:13px;color:#9eabb9;margin-bottom:20px}.breadcrumb a{color:#bfc8d2;text-decoration:none}.breadcrumb a:hover{color:var(--gold)}
