/* Modern industrial workspace refresh · 2026 */
:root{
  --ui-radius-sm:10px;
  --ui-radius-md:16px;
  --ui-radius-lg:24px;
  --ui-radius-xl:32px;
  --ui-shadow-soft:0 8px 24px rgba(7,23,27,.06);
  --ui-shadow-card:0 18px 48px rgba(7,23,27,.1);
  --ui-shadow-hero:0 30px 80px rgba(7,23,27,.18);
}
body{
  background:
    radial-gradient(circle at 82% 4%,rgba(78,142,255,.07),transparent 24rem),
    radial-gradient(circle at 18% 32%,rgba(53,200,138,.06),transparent 28rem),
    #f3f6f5;
  font-family:"HarmonyOS Sans SC","MiSans","SF Pro Display","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
}
.sidebar{
  background:
    radial-gradient(circle at 18% 8%,rgba(255,107,53,.13),transparent 13rem),
    linear-gradient(180deg,#07171b 0%,#091d21 55%,#061216 100%);
  border-right:1px solid rgba(255,255,255,.06);
  box-shadow:18px 0 55px rgba(4,14,17,.1);
}
.brand{padding-bottom:26px}
.brand-mark{
  width:40px;height:40px;padding:9px;
  transform:none;border-color:rgba(255,255,255,.16);border-radius:13px;
  background:linear-gradient(145deg,rgba(255,255,255,.1),rgba(255,255,255,.025));
  box-shadow:inset 0 1px rgba(255,255,255,.1),0 10px 24px rgba(0,0,0,.16);
}
.brand-mark i{transform:none;border-radius:4px;background:linear-gradient(180deg,#ff8a55,#ff5b22)}
.brand b{font-size:15px;letter-spacing:.3px}.brand small{font-size:8px;letter-spacing:1.25px;color:#728581}
.nav-list{gap:7px}
.nav-item{
  min-height:48px;border-radius:13px;padding:0 10px;gap:10px;
  transition:background-color .2s ease,color .2s ease,box-shadow .2s ease,transform .2s ease;
}
.nav-item:hover{background:rgba(255,255,255,.055);transform:translateX(2px)}
.nav-item.active{
  background:linear-gradient(100deg,rgba(255,107,53,.2),rgba(255,255,255,.075));
  box-shadow:inset 0 0 0 1px rgba(255,138,85,.18),0 9px 22px rgba(0,0,0,.12);
}
.nav-item.active:before{content:"";position:absolute;left:-2px;width:3px;height:22px;border-radius:6px;background:#ff6b35;box-shadow:0 0 18px rgba(255,107,53,.6)}
.nav-icon{
  width:31px;height:31px;display:grid;place-items:center;flex:0 0 auto;
  border-radius:10px;background:rgba(255,255,255,.035);font-size:16px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
}
.nav-item.active .nav-icon{background:rgba(255,107,53,.16);color:#ff9868}
.nav-item span:nth-child(2){font-size:13px;letter-spacing:.1px}
.topbar{
  position:sticky;top:0;z-index:16;
  background:rgba(243,246,245,.82);
  -webkit-backdrop-filter:blur(18px) saturate(145%);backdrop-filter:blur(18px) saturate(145%);
  border-bottom-color:rgba(143,160,153,.22);
  box-shadow:0 8px 28px rgba(7,23,27,.035);
}
.plant-status{font-size:11px}.icon-button,.install-app{border-color:rgba(111,130,124,.25);background:rgba(255,255,255,.54)}
.profile{padding:5px 7px 5px 5px;border-radius:999px;background:rgba(255,255,255,.46);border:1px solid rgba(111,130,124,.18)}
.avatar{background:linear-gradient(145deg,#17383d,#0b2024);box-shadow:0 8px 20px rgba(7,23,27,.14)}

#homeView{position:relative;padding-top:1px}
#homeView .home-purpose{
  margin:24px clamp(22px,3.4vw,54px) 0;padding:28px;border:1px solid rgba(143,160,153,.18);border-radius:var(--ui-radius-xl);
  background:rgba(255,255,255,.72);box-shadow:var(--ui-shadow-card);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
}
#homeView .home-purpose-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:20px}
#homeView .home-purpose-head h2{margin:7px 0 0;font-size:clamp(27px,2.5vw,38px);line-height:1.08;letter-spacing:-1.4px;color:#10272d}
#homeView .home-purpose-head>p{max-width:430px;margin:0;color:#6b7e7a;font-size:12px;line-height:1.7;text-align:right}
#homeView .home-purpose-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
#homeView .purpose-card{
  position:relative;min-width:0;min-height:250px;padding:22px;border:1px solid rgba(123,148,139,.14);border-radius:22px;overflow:hidden;
  display:flex;flex-direction:column;align-items:stretch;background:linear-gradient(145deg,#fbfcfb,#eef3f1);box-shadow:0 8px 24px rgba(7,23,27,.055);
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
#homeView .purpose-card:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(rgba(96,124,116,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(96,124,116,.045) 1px,transparent 1px);background-size:26px 26px;mask-image:linear-gradient(to bottom right,rgba(0,0,0,.7),transparent 68%)}
#homeView .purpose-card>*{position:relative;z-index:1}
#homeView .purpose-learn{background:radial-gradient(circle at 90% 6%,rgba(255,107,53,.13),transparent 11rem),linear-gradient(145deg,#fffaf7,#f4eee9)}
#homeView .purpose-field{color:#edf7f3;border-color:rgba(111,174,155,.2);background:radial-gradient(circle at 92% 7%,rgba(53,200,138,.2),transparent 12rem),linear-gradient(145deg,#092329,#0a3533)}
#homeView .purpose-review{background:radial-gradient(circle at 92% 7%,rgba(78,142,255,.14),transparent 11rem),linear-gradient(145deg,#f8fbfd,#edf1f7)}
#homeView .purpose-card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:21px}
#homeView .purpose-number{font:700 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:1.4px;color:#ff6b35}
#homeView .purpose-symbol{width:39px;height:39px;display:grid;place-items:center;border:1px solid rgba(94,122,114,.16);border-radius:13px;background:rgba(255,255,255,.54);color:#17363b;font-size:17px}
#homeView .purpose-field .purpose-symbol{border-color:rgba(255,255,255,.12);background:rgba(255,255,255,.075);color:#7ce0b5}
#homeView .purpose-card-copy>span{display:block;color:#748783;font-size:9px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase}
#homeView .purpose-field .purpose-card-copy>span{color:#79aa9d}
#homeView .purpose-card-copy h3{margin:6px 0 8px;font-size:25px;line-height:1.1;letter-spacing:-.8px;color:#10272d}
#homeView .purpose-field .purpose-card-copy h3{color:#f1f8f5}
#homeView .purpose-card-copy p{max-width:390px;margin:0;color:#667a76;font-size:12px;line-height:1.7}
#homeView .purpose-field .purpose-card-copy p{color:#a0b9b2}
#homeView .purpose-tags{display:flex;flex-wrap:wrap;gap:6px;margin:17px 0 19px}
#homeView .purpose-tags span{padding:5px 8px;border:1px solid rgba(104,131,123,.13);border-radius:999px;background:rgba(255,255,255,.48);color:#627772;font-size:8px;white-space:nowrap}
#homeView .purpose-field .purpose-tags span{border-color:rgba(194,224,215,.12);background:rgba(255,255,255,.055);color:#9fc2b8}
#homeView .purpose-actions{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-top:auto}
#homeView .purpose-actions button{min-height:44px;border-radius:12px;padding:0 12px;font-family:inherit;font-size:10px;font-weight:700;line-height:1;cursor:pointer;touch-action:manipulation;transition:transform .18s ease,background-color .18s ease,border-color .18s ease,box-shadow .18s ease}
#homeView .purpose-primary{flex:1 1 145px;display:flex;align-items:center;justify-content:space-between;gap:12px;border:0;background:#102d33;color:#f5faf8;box-shadow:0 10px 22px rgba(11,37,43,.14)}
#homeView .purpose-primary i{font-style:normal;font-size:15px}
#homeView .purpose-learn .purpose-primary{background:linear-gradient(135deg,#ff6b35,#e95420);box-shadow:0 10px 22px rgba(233,84,32,.19)}
#homeView .purpose-field .purpose-primary{background:#67d6a6;color:#08221e;box-shadow:0 10px 22px rgba(53,200,138,.18)}
#homeView .purpose-review .purpose-primary{background:linear-gradient(135deg,#315f9b,#23466f)}
#homeView .purpose-quick{flex:0 1 auto;border:1px solid rgba(102,128,121,.18);background:rgba(255,255,255,.58);color:#39534e}
#homeView .purpose-field .purpose-quick{border-color:rgba(188,220,210,.15);background:rgba(255,255,255,.06);color:#c3d7d1}
@media(hover:hover){
  #homeView .purpose-card:hover{transform:translateY(-4px);border-color:rgba(255,107,53,.28);box-shadow:0 18px 44px rgba(7,23,27,.1)}
  #homeView .purpose-actions button:hover{transform:translateY(-1px)}
  #homeView .purpose-quick:hover{border-color:rgba(255,107,53,.4);background:#fff}
  #homeView .purpose-field .purpose-quick:hover{border-color:rgba(103,214,166,.42);background:rgba(103,214,166,.1)}
}
#homeView .purpose-actions button:active{transform:scale(.985)}
#homeView .hero-grid{
  min-height:560px;margin:14px clamp(22px,3.4vw,54px) 12px;
  grid-template-columns:minmax(0,1.08fr) minmax(390px,.92fr);
  border:1px solid rgba(255,255,255,.07);border-radius:var(--ui-radius-xl);
  background:linear-gradient(135deg,#07171b 0%,#0a2428 58%,#0d3031 100%);
  box-shadow:var(--ui-shadow-hero);isolation:isolate;
}
#homeView .hero-copy{
  padding:66px clamp(34px,4.2vw,70px) 48px;
  color:#f4f8f6;
  background:
    radial-gradient(circle at 2% 100%,rgba(255,107,53,.16),transparent 19rem),
    linear-gradient(130deg,rgba(255,255,255,.018),transparent 62%);
}
#homeView .eyebrow{color:#ff9465;font-size:10px;letter-spacing:2.4px}
#homeView .eyebrow:before{width:34px;background:linear-gradient(90deg,#ff6b35,transparent)}
#homeView .hero-copy h1{max-width:760px;margin:23px 0 19px;font-size:clamp(48px,5.25vw,76px);line-height:1.02;letter-spacing:-4px;color:#f6faf8}
#homeView .hero-copy h1 em{background:linear-gradient(92deg,#ff8d5b,#ff5e28 55%,#ffc1a4);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 12px 36px rgba(255,107,53,.16)}
#homeView .hero-copy>p{max-width:620px;font-size:15px;line-height:1.85;color:#a9bab6}
#homeView .hero-search{
  max-width:740px;height:68px;margin-top:30px;padding:7px;border:0;border-radius:18px;
  background:rgba(255,255,255,.96);box-shadow:0 22px 52px rgba(0,0,0,.24),inset 0 0 0 1px rgba(255,255,255,.65);
}
#homeView .hero-search input{font-size:14px;color:#10272d}
#homeView .hero-search button{height:54px;border-radius:13px;background:linear-gradient(135deg,#ff6b35,#e95420);box-shadow:0 10px 24px rgba(233,84,32,.28)}
#homeView .hero-search button:hover{background:linear-gradient(135deg,#ff7b45,#f05c24);transform:translateY(-1px)}
#homeView .hero-search button span{color:#fff}
#homeView .hot-tags{max-width:740px;margin-top:16px;gap:9px}
#homeView .hot-tags>span{color:#738783;font-size:10px}
#homeView .hot-tags button{border-color:rgba(198,216,210,.16);border-radius:999px;background:rgba(255,255,255,.055);color:#a8bab6;padding:7px 11px;font-size:10px}
#homeView .hot-tags button:hover{border-color:rgba(255,107,53,.55);background:rgba(255,107,53,.1);color:#ff9a70}
#homeView .hero-lower{max-width:740px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:18px;margin-top:27px}
#homeView .hero-proof{display:flex;align-items:center;gap:0;min-width:0}
#homeView .hero-proof>div{display:flex;align-items:center;gap:9px;padding:0 17px;border-left:1px solid rgba(188,207,201,.16)}
#homeView .hero-proof>div:first-child{padding-left:0;border-left:0}
#homeView .hero-proof b{font:600 20px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:#f5f9f7;letter-spacing:-1px}
#homeView .hero-proof span,#homeView .hero-proof small{display:block}
#homeView .hero-proof span{font-size:10px;font-weight:700;color:#c6d3cf;white-space:nowrap}
#homeView .hero-proof small{margin-top:3px;font-size:8px;font-weight:400;color:#6f8580}
#homeView .hero-vision-link{min-height:44px;flex:0 0 auto;border:1px solid rgba(188,207,201,.2);border-radius:12px;background:rgba(255,255,255,.055);color:#d6e1de;padding:0 13px;font-size:10px;cursor:pointer}
#homeView .hero-vision-link>span{margin-right:7px;color:#70b9ff}#homeView .hero-vision-link>b{margin-left:8px;color:#ff8c5b}
#homeView .hero-vision-link:hover{border-color:rgba(112,185,255,.45);background:rgba(78,142,255,.1)}
#homeView .hero-visual{
  min-height:560px;border-left:1px solid rgba(255,255,255,.065);
  background:
    radial-gradient(circle at 52% 46%,rgba(53,200,138,.16),transparent 11rem),
    radial-gradient(circle at 80% 20%,rgba(78,142,255,.14),transparent 15rem),
    linear-gradient(rgba(112,140,135,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(112,140,135,.055) 1px,transparent 1px),
    linear-gradient(145deg,#0c2226,#071519);
  background-size:auto,auto,32px 32px,32px 32px,auto;
}
#homeView .hero-visual:before{content:"LIVE INSTRUMENT LOOP";top:30px;left:32px;color:#6c827d;font:9px ui-monospace,SFMono-Regular,Menlo,monospace}
#homeView .radar-lines{border-color:rgba(111,155,145,.22);animation:radarBreath 5s ease-in-out infinite}
#homeView .radar-lines:before,#homeView .radar-lines:after{border-color:rgba(111,155,145,.17)}
#homeView .meter-face{border-color:#10282d;box-shadow:0 0 0 1px rgba(155,184,175,.25),0 36px 90px rgba(0,0,0,.45),0 0 70px rgba(53,200,138,.09)}
#homeView .needle{animation:needleLive 4.6s ease-in-out infinite}
#homeView .signal-card{left:8%;bottom:9%;border-color:rgba(146,177,168,.2);border-radius:16px;background:rgba(6,18,22,.67);box-shadow:0 18px 46px rgba(0,0,0,.26);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
#homeView .orbit{color:#92a7a2}
@keyframes radarBreath{50%{opacity:.63;transform:translate(-50%,-50%) scale(1.035)}}
@keyframes needleLive{0%,100%{transform:rotate(-28deg)}50%{transform:rotate(-21deg)}}

#homeView .dashboard-grid{grid-template-columns:minmax(0,1.22fr) minmax(320px,.78fr);gap:18px;padding:28px clamp(22px,3.4vw,54px)}
#homeView .continue-panel,#homeView .review-preview{padding:24px;border:1px solid rgba(143,160,153,.18);border-radius:var(--ui-radius-lg);background:rgba(255,255,255,.72);box-shadow:var(--ui-shadow-soft);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
#homeView .section-heading{margin-bottom:18px}#homeView .section-heading h2{font-size:23px;letter-spacing:-.7px}#homeView .section-heading .kicker{font-size:9px}
#homeView .course-card.featured{min-height:158px;border:0;border-radius:18px;background:linear-gradient(135deg,#f2f7f4,#e8f0ed);box-shadow:inset 0 0 0 1px rgba(123,148,139,.14)}
#homeView .course-meta span{font-size:11px}#homeView .course-meta i{font-size:9px}#homeView .course-main h3{font-size:20px}#homeView .course-main p{font-size:12px}
#homeView .review-stack{border:0;border-radius:18px;background:#f3f7f5;box-shadow:inset 0 0 0 1px rgba(123,148,139,.13);overflow:hidden}
#homeView .review-stack article{min-height:54px;padding:3px 2px}
#homeView .review-stack h3{font-size:13px}#homeView .review-stack p{font-size:10px}#homeView .quick-review,#homeView .due-count,#homeView .text-link{font-size:10px}
#homeView .round-arrow,#homeView .quick-review{border-radius:11px;background:rgba(255,255,255,.65)}
#homeView .progress{height:5px;border-radius:99px;overflow:hidden}#homeView .progress i{border-radius:99px;background:linear-gradient(90deg,#ff6b35,#ff9c72)}

.home-section-intro{display:flex;align-items:end;justify-content:space-between;gap:30px;margin:24px clamp(22px,3.4vw,54px) 18px}
.home-section-intro h2{margin:7px 0 0;font-size:clamp(25px,2.3vw,34px);letter-spacing:-1.2px}
.home-section-intro>p{max-width:430px;margin:0;font-size:13px;line-height:1.7;color:#6d7f7b;text-align:right}
#homeView .home-insight-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:18px;padding:0 clamp(22px,3.4vw,54px) 38px}
#homeView .home-insight{
  grid-column:span 6;min-height:215px;padding:28px;border:0;border-radius:var(--ui-radius-lg);
  grid-template-columns:1fr;align-content:space-between;gap:24px;
  background:rgba(255,255,255,.76);box-shadow:var(--ui-shadow-soft);
  transition:transform .22s ease,box-shadow .22s ease,background-color .22s ease;
}
#homeView a.home-insight{color:inherit;text-decoration:none}
#homeView .home-insight:after{content:"";position:absolute;right:-65px;top:-72px;width:190px;height:190px;border-radius:50%;background:radial-gradient(circle,rgba(78,142,255,.13),transparent 66%);pointer-events:none}
#homeView .home-insight:hover{transform:translateY(-5px);box-shadow:var(--ui-shadow-card)}
#homeView .home-insight h2{font-size:22px;letter-spacing:-.4px}
#homeView .insight-body{max-width:670px;border-left:0;border-top:1px solid rgba(123,148,139,.16);padding:20px 48px 0 0}
#homeView .insight-body b{font-size:14px}#homeView .insight-body p{font-size:12px;line-height:1.75;margin-top:8px}
#homeView .insight-arrow{right:24px;bottom:22px;width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:rgba(16,39,45,.06)}
#homeView .hot-label{right:24px;top:22px;border-radius:999px;padding:6px 9px;background:rgba(255,107,53,.1);font-size:9px}
#homeView .field-entry{grid-column:span 7;min-height:285px;color:#eef7f3;background:radial-gradient(circle at 90% 10%,rgba(53,200,138,.18),transparent 17rem),linear-gradient(135deg,#082026,#0c3332)}
#homeView .field-entry:after{background:radial-gradient(circle,rgba(53,200,138,.18),transparent 66%)}
#homeView .field-entry .insight-body,#homeView .safety-entry .insight-body{border-color:rgba(196,216,209,.15)}
#homeView .field-entry .insight-body p,#homeView .safety-entry .insight-body p{color:#9eb2ac}
#homeView .field-entry .insight-arrow,#homeView .safety-entry .insight-arrow{background:rgba(255,255,255,.08);color:#fff}
#homeView .technical-entry{grid-column:span 5;background:linear-gradient(145deg,#f7faf9,#eaf2f3)}
#homeView .technical-entry:after{background:radial-gradient(circle,rgba(78,142,255,.19),transparent 66%)}
#homeView .safety-entry{grid-column:span 5;background:radial-gradient(circle at 85% 15%,rgba(255,107,53,.22),transparent 15rem),linear-gradient(145deg,#161f21,#281b18)}
#homeView .calculator-entry{grid-column:span 7;background:linear-gradient(145deg,#eff8f3,#e5f0ec)}
#homeView .calculator-entry:after{background:radial-gradient(circle,rgba(53,200,138,.18),transparent 66%)}
#homeView .archive-entry,#homeView .ledger-entry{grid-column:span 6}
#homeView .archive-entry{background:linear-gradient(145deg,#f7f8f6,#edf0f5)}
#homeView .ledger-entry{background:linear-gradient(145deg,#eef7f1,#f8f2ea)}

#homeView .knowledge-map{margin:0 clamp(22px,3.4vw,54px);padding:28px 0 76px}
#homeView .map-cards{gap:16px}
#homeView .map-card{min-height:210px;border:0;border-radius:21px;background:rgba(255,255,255,.72);box-shadow:var(--ui-shadow-soft);transition:transform .22s ease,box-shadow .22s ease,background-color .22s ease}
#homeView .map-card:hover{transform:translateY(-5px);box-shadow:var(--ui-shadow-card);background:#fff}
#homeView .map-card>p{font-size:11px;line-height:1.6}#homeView .map-card>b{font-size:11px}
#homeView button:focus-visible,#homeView input:focus-visible{outline:3px solid rgba(78,142,255,.45);outline-offset:3px}

body.light-off{background:radial-gradient(circle at 82% 4%,rgba(78,142,255,.08),transparent 24rem),#091417}
.light-off .topbar{background:rgba(9,20,23,.82);border-bottom-color:rgba(129,153,146,.15)}
.light-off .icon-button,.light-off .install-app,.light-off .profile{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.08)}
.light-off #homeView .home-purpose,.light-off #homeView .continue-panel,.light-off #homeView .review-preview,.light-off #homeView .home-insight,.light-off #homeView .map-card{background:rgba(20,36,40,.78);border-color:rgba(135,160,152,.12)}
.light-off #homeView .home-purpose-head h2,.light-off #homeView .purpose-card-copy h3{color:#e8f1ee}
.light-off #homeView .home-purpose-head>p,.light-off #homeView .purpose-card-copy p{color:#8fa39d}
.light-off #homeView .purpose-learn,.light-off #homeView .purpose-review{background:radial-gradient(circle at 90% 6%,rgba(255,107,53,.08),transparent 11rem),linear-gradient(145deg,#17292d,#112024);border-color:rgba(135,160,152,.12)}
.light-off #homeView .purpose-tags span{border-color:rgba(188,214,206,.12);background:rgba(255,255,255,.04);color:#9eb1ac}
.light-off #homeView .purpose-symbol{border-color:rgba(255,255,255,.1);background:rgba(255,255,255,.05);color:#d4e1dd}
.light-off #homeView .purpose-quick{border-color:rgba(188,214,206,.12);background:rgba(255,255,255,.04);color:#b9cbc6}
.light-off #homeView .course-card.featured,.light-off #homeView .review-stack{background:#1a2b2f;box-shadow:inset 0 0 0 1px rgba(145,169,162,.1)}
.light-off #homeView .technical-entry,.light-off #homeView .calculator-entry,.light-off #homeView .archive-entry,.light-off #homeView .ledger-entry{background:linear-gradient(145deg,#17292d,#112024)}
.light-off #homeView .field-entry{background:radial-gradient(circle at 90% 10%,rgba(53,200,138,.18),transparent 17rem),linear-gradient(135deg,#071a1f,#0b2b2b)}
.light-off #homeView .safety-entry{background:radial-gradient(circle at 85% 15%,rgba(255,107,53,.2),transparent 15rem),linear-gradient(145deg,#111b1e,#241915)}
.light-off #homeView .map-card:hover{background:#1a2b2f}.light-off .home-section-intro>p{color:#8fa19d}

@media(max-width:1100px){
  .sidebar .nav-item{justify-content:center;padding:0}
  #homeView .home-purpose-grid{grid-template-columns:1fr 1fr}
  #homeView .purpose-field{grid-column:span 2}
  #homeView .hero-grid{grid-template-columns:1fr;margin-left:22px;margin-right:22px}
  #homeView .hero-copy{padding-bottom:42px}
  #homeView .hero-visual{display:block;min-height:310px;border-left:0;border-top:1px solid rgba(255,255,255,.065)}
  #homeView .dashboard-grid{grid-template-columns:1fr}
  #homeView .home-insight-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  #homeView .home-insight,#homeView .field-entry,#homeView .technical-entry,#homeView .safety-entry,#homeView .calculator-entry,#homeView .archive-entry,#homeView .ledger-entry{grid-column:span 1;min-height:225px}
  #homeView .field-entry,#homeView .calculator-entry{grid-column:span 2}
}
@media(max-width:700px){
  .sidebar{background:rgba(7,23,27,.93);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
  .sidebar .nav-list{gap:0}
  .sidebar .nav-item{min-height:50px;padding:0;gap:1px;border-radius:10px;transform:none}
  .sidebar .nav-icon{width:26px;height:26px;border-radius:8px;background:transparent;font-size:15px}
  .sidebar .nav-item span:nth-child(2){font-size:6.5px}
  .sidebar .nav-item.active:before{left:50%;top:-7px;width:24px;height:3px;transform:translateX(-50%)}
  .topbar{box-shadow:0 8px 24px rgba(7,23,27,.05)}
  #homeView .home-purpose{margin:12px 12px 0;padding:21px 15px 15px;border-radius:24px}
  #homeView .home-purpose-head{display:block;margin-bottom:15px}
  #homeView .home-purpose-head h2{font-size:28px;letter-spacing:-1px}
  #homeView .home-purpose-head>p{margin-top:8px;font-size:11px;text-align:left}
  #homeView .home-purpose-grid{grid-template-columns:1fr;gap:10px}
  #homeView .purpose-card,#homeView .purpose-field{grid-column:1;min-height:0;padding:16px;border-radius:18px;display:grid;grid-template-columns:42px minmax(0,1fr);column-gap:12px;align-items:start}
  #homeView .purpose-card-head{grid-column:1;grid-row:1/4;display:block;margin:0}
  #homeView .purpose-number{display:block;margin:2px 0 11px;text-align:center}
  #homeView .purpose-symbol{width:42px;height:42px}
  #homeView .purpose-card-copy{grid-column:2}
  #homeView .purpose-card-copy h3{font-size:21px;margin:4px 0 6px}
  #homeView .purpose-card-copy p{font-size:10.5px;line-height:1.55}
  #homeView .purpose-tags{grid-column:2;margin:11px 0 12px;gap:5px}
  #homeView .purpose-tags span{font-size:7.5px;padding:4px 7px}
  #homeView .purpose-actions{grid-column:2;gap:6px}
  #homeView .purpose-actions button{min-height:44px}
  #homeView .purpose-primary{flex-basis:100%}
  #homeView .purpose-quick{flex:1 1 auto;padding:0 9px}
  #homeView .hero-grid{margin:12px 12px 8px;border-radius:24px;min-height:0}
  #homeView .hero-copy{padding:36px 20px 28px}
  #homeView .eyebrow{font-size:9px;letter-spacing:1.8px}
  #homeView .hero-copy h1{font-size:clamp(38px,11.5vw,46px);letter-spacing:-2.7px;line-height:1.04;margin:19px 0 16px}
  #homeView .hero-copy>p{font-size:13px;line-height:1.75}
  #homeView .hero-search{height:auto;border-radius:16px;margin-top:23px}
  #homeView .hero-search input{min-height:48px;font-size:16px}
  #homeView .hero-search button{min-height:48px;border-radius:12px}
  #homeView .hot-tags{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
  #homeView .hot-tags::-webkit-scrollbar{display:none}
  #homeView .hot-tags>span,#homeView .hot-tags button{flex:0 0 auto}
  #homeView .hero-lower{display:grid;gap:15px;margin-top:21px}
  #homeView .hero-proof{width:100%;display:grid;grid-template-columns:repeat(3,1fr)}
  #homeView .hero-proof>div{display:block;padding:0 10px}
  #homeView .hero-proof b{font-size:17px}#homeView .hero-proof span{font-size:9px;margin-top:6px}#homeView .hero-proof small{font-size:7px;white-space:normal}
  #homeView .hero-vision-link{width:100%;min-height:46px}
  #homeView .hero-visual{min-height:230px}
  #homeView .meter-core{transform:translate(-50%,-50%) scale(.72)}
  #homeView .radar-lines{width:300px;height:300px}
  #homeView .signal-card{min-width:175px;padding:9px 11px;left:5%;bottom:7%}
  #homeView .orbit{font-size:8px}.orbit-a{top:17%}.orbit-b{top:21%}
  #homeView .dashboard-grid{gap:14px;padding:18px 12px}
  #homeView .continue-panel,#homeView .review-preview{padding:18px;border-radius:20px}
  #homeView .course-card.featured{grid-template-columns:47px minmax(0,1fr) 40px;gap:12px;padding:18px}
  #homeView .course-card .round-arrow{display:grid}
  #homeView .section-heading h2{font-size:21px}
  .home-section-intro{display:block;margin:28px 16px 17px}
  .home-section-intro h2{font-size:27px}.home-section-intro>p{margin-top:10px;font-size:12px;text-align:left}
  #homeView .home-insight-grid{grid-template-columns:1fr;gap:13px;padding:0 12px 30px}
  #homeView .home-insight,#homeView .field-entry,#homeView .technical-entry,#homeView .safety-entry,#homeView .calculator-entry,#homeView .archive-entry,#homeView .ledger-entry{grid-column:1;min-height:190px;padding:22px;border-radius:20px}
  #homeView .field-entry,#homeView .calculator-entry{min-height:225px}
  #homeView .home-insight h2{font-size:20px}#homeView .insight-body{padding-top:17px}#homeView .insight-body b{font-size:13px}#homeView .insight-body p{font-size:11px}
  #homeView .knowledge-map{margin:0 12px;padding:20px 0 88px}
  #homeView .map-cards{grid-template-columns:1fr 1fr;gap:11px}
  #homeView .map-card{min-height:190px;padding:17px;border-radius:18px}
  #homeView .map-card h3{font-size:15px}#homeView .map-card>p{font-size:10px}
  #homeView .mini-gauge,#homeView .signal-wave,#homeView .shield-icon,#homeView .valve-icon{transform:scale(.82);transform-origin:left center}
}
@media(prefers-reduced-motion:reduce){
  #homeView *,#homeView *:before,#homeView *:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
}

/* Mobile navigation: a stable five-item dock with the full toolset in a sheet. */
.mobile-dock,
.mobile-more-dialog {
  display: none;
}

@media(max-width:1100px) {
  body.mobile-nav-open {
    overflow: hidden;
  }

  .app-shell {
    display: block;
  }

  .sidebar {
    display: none !important;
  }

  .main-panel {
    width: 100%;
    grid-column: auto;
    padding-bottom: calc(98px + env(safe-area-inset-bottom));
  }

  .toast {
    bottom: calc(92px + env(safe-area-inset-bottom));
  }

  .mobile-dock {
    position: fixed;
    left: 50%;
    right: auto;
    bottom: calc(8px + env(safe-area-inset-bottom));
    z-index: 80;
    width: min(600px, calc(100% - 20px));
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 3px;
    min-height: 70px;
    border: 1px solid rgba(141, 164, 157, .22);
    border-radius: 22px;
    padding: 6px;
    background: rgba(7, 23, 27, .96);
    box-shadow: 0 18px 44px rgba(4, 15, 18, .3);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
    transform: translateX(-50%);
  }

  .mobile-dock button {
    position: relative;
    min-width: 0;
    min-height: 56px;
    display: grid;
    grid-template-rows: 28px auto;
    place-items: center;
    gap: 2px;
    border: 0;
    border-radius: 15px;
    padding: 5px 2px 4px;
    color: #93a49f;
    background: transparent;
    font: inherit;
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }

  .mobile-dock button i {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    color: #afbfba;
    font: normal 20px/1 Georgia, serif;
  }

  .mobile-dock button span {
    max-width: 100%;
    overflow: hidden;
    font-size: 10px;
    font-weight: 750;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-review-badge {
    position: absolute;
    top: 1px;
    right: calc(50% - 26px);
    min-width: 19px;
    height: 19px;
    display: grid;
    place-items: center;
    border: 2px solid #07171b;
    border-radius: 999px;
    padding: 0 4px;
    color: #fff;
    background: #ff6b35;
    font-size: 8px;
    font-weight: 900;
    line-height: 1;
  }

  .mobile-dock button.active,
  .mobile-dock button[aria-expanded="true"] {
    color: #fff;
    background: rgba(255, 106, 42, .12);
  }

  .mobile-dock button.active::after,
  .mobile-dock button[aria-expanded="true"]::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 1px;
    width: 18px;
    height: 2px;
    border-radius: 4px;
    background: #ff7943;
    transform: translateX(-50%);
  }

  .mobile-dock button.active i,
  .mobile-dock button[aria-expanded="true"] i {
    color: #ff9b70;
    background: rgba(255, 106, 42, .14);
  }

  .mobile-dock button:focus-visible,
  .mobile-more-dialog button:focus-visible {
    outline: 3px solid rgba(118, 169, 255, .7);
    outline-offset: 2px;
  }

  .mobile-more-dialog[open] {
    position: fixed;
    inset: 0;
    z-index: 100;
    width: 100%;
    max-width: none;
    height: 100%;
    max-height: none;
    display: grid;
    align-items: end;
    margin: 0;
    border: 0;
    padding: 0;
    overflow: hidden;
    color: var(--ink);
    background: transparent;
  }

  .mobile-more-dialog::backdrop {
    background: rgba(2, 12, 15, .68);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
  }

  .mobile-more-sheet {
    width: min(100%, 680px);
    max-height: min(74dvh, 620px);
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 1px solid rgba(134, 157, 150, .28);
    border-bottom: 0;
    border-radius: 26px 26px 0 0;
    padding: 20px 16px calc(20px + env(safe-area-inset-bottom));
    background: #f3f6f2;
    box-shadow: 0 -24px 60px rgba(3, 16, 19, .28);
    animation: mobileSheetIn .2s ease-out both;
    margin-inline: auto;
  }

  .mobile-more-sheet > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
  }

  .mobile-more-sheet > header span {
    color: var(--orange-deep);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.7px;
  }

  .mobile-more-sheet > header h2 {
    margin: 5px 0 0;
    font-size: 24px;
    letter-spacing: -.8px;
  }

  #mobileMoreClose {
    width: 44px;
    height: 44px;
    flex: 0 0 auto;
    border: 1px solid #ccd5cf;
    border-radius: 14px;
    color: #344641;
    background: #fff;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
    touch-action: manipulation;
  }

  .mobile-more-group + .mobile-more-group {
    margin-top: 18px;
  }

  .mobile-more-group h3 {
    margin: 0 0 8px;
    color: #687a74;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .8px;
  }

  .mobile-more-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .mobile-more-grid button {
    min-width: 0;
    min-height: 68px;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    border: 1px solid #d8dfda;
    border-radius: 16px;
    padding: 10px;
    color: #122326;
    background: rgba(255, 255, 255, .86);
    text-align: left;
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }

  .mobile-more-grid button > i {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    color: #c95020;
    background: #fff0e7;
    font: normal 17px/1 Georgia, serif;
  }

  .mobile-more-grid button b,
  .mobile-more-grid button small {
    display: block;
  }

  .mobile-more-grid button b {
    overflow: hidden;
    font-size: 12px;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-more-grid button small {
    margin-top: 3px;
    overflow: hidden;
    color: #71817c;
    font-size: 9px;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-more-grid button.active {
    border-color: rgba(255, 106, 42, .58);
    background: #fff8f3;
    box-shadow: inset 3px 0 #ff6a2a;
  }

  .light-off .mobile-more-sheet {
    color: #edf4f0;
    border-color: rgba(143, 163, 157, .22);
    background: #102024;
  }

  .light-off #mobileMoreClose,
  .light-off .mobile-more-grid button {
    color: #e9f1ed;
    border-color: #314348;
    background: #192c31;
  }

  .light-off .mobile-more-grid button.active {
    border-color: rgba(255, 132, 80, .62);
    background: #2a2724;
  }

  .light-off .mobile-more-group h3,
  .light-off .mobile-more-grid button small {
    color: #9caea8;
  }

  @keyframes mobileSheetIn {
    from { opacity: .7; transform: translateY(24px); }
    to { opacity: 1; transform: translateY(0); }
  }
}

@media(max-width:360px) {
  .mobile-dock {
    left: 50%;
    right: auto;
    width: calc(100% - 12px);
    padding-left: 3px;
    padding-right: 3px;
  }

  .mobile-dock button span {
    font-size: 9px;
  }

  .mobile-more-grid {
    grid-template-columns: 1fr;
  }
}

@media(prefers-reduced-motion:reduce) {
  .mobile-more-sheet {
    animation-duration: .01ms !important;
  }
}

/* AI search · complete-question examples */
#searchView .search-example-guide {
  margin: 14px 0 26px;
  padding: 18px;
  border: 1px solid rgba(128, 151, 144, .2);
  border-radius: 18px;
  background: rgba(255, 255, 255, .66);
  box-shadow: 0 10px 28px rgba(7, 23, 27, .045);
}

#searchView .search-example-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 22px;
  margin-bottom: 14px;
}

#searchView .search-example-head h2 {
  margin: 5px 0 0;
  font-size: 17px;
  letter-spacing: -.3px;
}

#searchView .search-example-head p {
  max-width: 420px;
  margin: 0;
  color: #6e807b;
  font-size: 10px;
  line-height: 1.65;
  text-align: right;
}

#searchView .search-example-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(156px, 1fr));
  gap: 9px;
}

#searchView .search-example-card {
  min-width: 0;
  min-height: 112px;
  padding: 13px;
  border: 1px solid rgba(126, 148, 141, .22);
  border-radius: 13px;
  background: rgba(246, 249, 247, .82);
  color: #14282d;
  cursor: pointer;
  display: grid;
  grid-template-rows: auto auto 1fr auto;
  gap: 5px;
  text-align: left;
  touch-action: manipulation;
  transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

#searchView .search-example-card > span {
  color: #de642e;
  font: 10px/1 ui-monospace, SFMono-Regular, Menlo, monospace;
}

#searchView .search-example-card > b {
  font-size: 13px;
  line-height: 1.35;
}

#searchView .search-example-card > small {
  color: #71817c;
  font-size: 10px;
  line-height: 1.5;
}

#searchView .search-example-card > em {
  color: #b65327;
  font-size: 9px;
  font-style: normal;
  font-weight: 700;
}

@media(hover:hover) {
  #searchView .search-example-card:hover {
    border-color: rgba(255, 107, 53, .58);
    background: #fffaf6;
    box-shadow: 0 10px 24px rgba(7, 23, 27, .07);
    transform: translateY(-2px);
  }
}

#searchView .search-example-card.selected {
  border-color: #ff6b35;
  background: #fff6ef;
  box-shadow: inset 3px 0 #ff6b35;
}

#searchView .search-example-card:focus-visible {
  outline: 3px solid rgba(78, 142, 255, .42);
  outline-offset: 3px;
}

.light-off #searchView .search-example-guide {
  border-color: rgba(138, 161, 154, .16);
  background: rgba(20, 36, 40, .74);
}

.light-off #searchView .search-example-head p,
.light-off #searchView .search-example-card > small {
  color: #94a6a0;
}

.light-off #searchView .search-example-card {
  border-color: #33464a;
  background: #16282d;
  color: #eef4f1;
}

.light-off #searchView .search-example-card.selected {
  border-color: #ff8150;
  background: #31251f;
}

@media(max-width:700px) {
  #searchView .search-example-guide {
    margin: 12px 0 22px;
    padding: 14px;
    border-radius: 16px;
  }

  #searchView .search-example-head {
    display: block;
    margin-bottom: 12px;
  }

  #searchView .search-example-head h2 {
    font-size: 16px;
    line-height: 1.4;
  }

  #searchView .search-example-head p {
    margin-top: 7px;
    font-size: 11px;
    line-height: 1.55;
    text-align: left;
  }

  #searchView .search-example-grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  #searchView .search-example-card {
    min-height: 78px;
    padding: 12px 13px;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    column-gap: 10px;
    row-gap: 3px;
    align-items: center;
  }

  #searchView .search-example-card > span {
    grid-row: 1 / 3;
    width: 32px;
    height: 32px;
    border-radius: 10px;
    background: rgba(255, 107, 53, .1);
    display: grid;
    place-items: center;
  }

  #searchView .search-example-card > b {
    align-self: end;
    font-size: 13px;
  }

  #searchView .search-example-card > small {
    align-self: start;
    font-size: 10px;
  }

  #searchView .search-example-card > em {
    grid-column: 3;
    grid-row: 1 / 3;
    font-size: 10px;
    white-space: nowrap;
  }
}

@media(prefers-reduced-motion:reduce) {
  #searchView .search-example-card {
    transition: none;
  }
}

/* PWA update, network and iOS installation guidance */
.network-banner[hidden], .pwa-update[hidden] { display: none !important; }

.network-banner {
  position: fixed;
  z-index: 180;
  top: 12px;
  left: 50%;
  width: min(620px, calc(100vw - 28px));
  min-height: 48px;
  padding: 10px 16px;
  border: 1px solid #d59b3f;
  border-radius: 14px;
  background: #fff7df;
  color: #473512;
  box-shadow: 0 16px 40px rgba(7, 23, 27, .16);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  transform: translateX(-50%);
  font-size: 11px;
}

.network-banner b { white-space: nowrap; }
.network-banner span { color: #6c5725; }

.pwa-update {
  position: fixed;
  z-index: 175;
  right: 24px;
  bottom: 24px;
  width: min(470px, calc(100vw - 28px));
  padding: 16px;
  border: 1px solid rgba(255, 107, 53, .45);
  border-radius: 16px;
  background: #10242a;
  color: #f1f6f3;
  box-shadow: 0 22px 60px rgba(5, 19, 23, .28);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 10px;
}

.pwa-update div { min-width: 0; }
.pwa-update b, .pwa-update span { display: block; }
.pwa-update b { font-size: 13px; }
.pwa-update span { margin-top: 3px; color: #a9bbb6; font-size: 9px; line-height: 1.5; }
.pwa-update button { min-height: 40px; padding: 0 13px; border: 1px solid #445a5f; border-radius: 10px; background: transparent; color: #e8efec; cursor: pointer; font-size: 10px; touch-action: manipulation; }
.pwa-update #pwaUpdateNow { border-color: #ff6b35; background: #ff6b35; color: #18110d; font-weight: 800; }

.pwa-install-guide {
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

.pwa-install-guide::backdrop { background: rgba(2, 12, 16, .72); backdrop-filter: blur(4px); }
.pwa-install-guide > section { position: absolute; left: 50%; bottom: max(16px, env(safe-area-inset-bottom)); width: min(520px, calc(100vw - 24px)); padding: 22px; border: 1px solid #d8e0dc; border-radius: 22px; background: #f4f7f3; color: #10252b; box-shadow: 0 28px 80px rgba(3, 18, 22, .28); transform: translateX(-50%); }
.pwa-install-guide header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
.pwa-install-guide header span { color: #e35f27; font: 700 9px/1 ui-monospace, monospace; letter-spacing: .16em; }
.pwa-install-guide h2 { margin: 5px 0 0; font-size: 21px; }
.pwa-install-guide header button { width: 42px; height: 42px; flex: 0 0 auto; border: 1px solid #ccd7d3; border-radius: 50%; background: transparent; color: #20363b; font-size: 22px; cursor: pointer; }
.pwa-install-steps { display: grid; grid-template-columns: 36px 1fr; gap: 10px 12px; align-items: center; }
.pwa-install-steps i { width: 34px; height: 34px; border-radius: 10px; background: #10252b; color: white; display: grid; place-items: center; font: 700 11px/1 ui-monospace, monospace; }
.pwa-install-steps p { margin: 0; font-size: 12px; }
.pwa-install-browser { margin-top: 16px; padding: 14px; border-left: 4px solid #ff6b35; background: #fff0e8; }
.pwa-install-browser b { font-size: 12px; }
.pwa-install-browser p { margin: 4px 0 0; color: #6f5e55; font-size: 10px; line-height: 1.6; }

.light-off .network-banner { background: #302814; color: #f2d785; }
.light-off .network-banner span { color: #c7b371; }

@media(max-width:700px) {
  .topbar { height: calc(58px + env(safe-area-inset-top)); padding-top: env(safe-area-inset-top); }
  .network-banner { top: calc(8px + env(safe-area-inset-top)); align-items: flex-start; justify-content: flex-start; }
  .network-banner b { padding-top: 1px; }
  .network-banner span { line-height: 1.45; }
  .pwa-update { right: 14px; bottom: calc(84px + env(safe-area-inset-bottom)); grid-template-columns: 1fr 1fr; }
  .pwa-update div { grid-column: 1 / -1; }
  .pwa-update button { width: 100%; }
  .pwa-install-guide > section { padding: 20px; }
}

@media(prefers-reduced-motion:reduce) {
  .pwa-install-guide::backdrop { backdrop-filter: none; }
}