:root{
  --ut-navy:#103d55;
  --ut-navy-2:#176078;
  --ut-teal:#27928d;
  --ut-teal-strong:#147c77;
  --ut-paper:#f2f6f5;
  --ut-surface:#fff;
  --ut-ink:#142a34;
  --ut-muted:#687c83;
  --ut-line:#d8e4e1;
  --ut-soft:#e8f3f0;
  --ut-danger:#b54848;
  --ut-radius:20px;
  --ut-shadow:0 14px 38px rgba(16,61,85,.075);
  --ut-header-shadow:0 18px 46px rgba(16,61,85,.16);
  --ut-header-pad:max(24px,calc((100vw - 1880px)/2));
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei","PingFang SC","Noto Sans CJK SC",sans-serif;
}

html{background:var(--ut-paper)}
body.tool-theme{min-width:320px;background:radial-gradient(circle at 92% 2%,#dceeea 0,transparent 28%),linear-gradient(180deg,#f8faf9,var(--ut-paper));color:var(--ut-ink)}
body.tool-theme button,body.tool-theme input,body.tool-theme select,body.tool-theme textarea{font-family:inherit}
body.tool-theme :is(button,a,input,select,textarea):focus-visible{outline:3px solid rgba(39,146,141,.42);outline-offset:2px}

/* One visual language for the nine tool headers. */
body.tool-theme>.app-header,
body.tool-theme>.guide-topbar,
body.tool-theme>.manual-topbar,
body.tool-theme>header.topbar,
body.tool-theme .app>.topbar,
.policy-page .hero,
.store-topbar,
.store-detail-topbar,
.scheme-page .main>.topbar{
  color:#fff;
  border:0;
  border-radius:0 0 30px 30px;
  background:linear-gradient(135deg,var(--ut-navy) 0%,var(--ut-navy-2) 64%,var(--ut-teal) 100%);
  box-shadow:var(--ut-header-shadow);
  backdrop-filter:none;
}

body.tool-theme>.app-header,
body.tool-theme>.manual-topbar,
body.tool-theme>header.topbar{
  min-height:132px;
  padding-left:var(--ut-header-pad);
  padding-right:var(--ut-header-pad);
}

body.tool-theme>.guide-topbar,
body.tool-theme .app>.topbar{
  padding-left:var(--ut-header-pad);
  padding-right:var(--ut-header-pad);
}

body.tool-theme :is(.app-header,.guide-topbar,.manual-topbar,.topbar,.store-topbar,.store-detail-topbar) :is(h1,strong){color:#fff}
body.tool-theme :is(.app-header,.guide-topbar,.manual-topbar,.topbar,.store-topbar,.store-detail-topbar) :is(p,small,span){--ut-header-copy:#dcecef}
body.tool-theme :is(.app-header,.guide-topbar,.manual-topbar,.topbar,.store-topbar,.store-detail-topbar) :is(p,small){color:var(--ut-header-copy)}

/* The home control occupies the same top-left visual slot on every tool. */
body.tool-theme :is(.home-button,.guide-home,.manual-home,.store-home,.store-back,.crumb,.scheme-home),
body.tool-theme .app .brand-mark,
body.tool-theme .toolbox-brand-home .brand-mark{
  display:grid;
  place-items:center;
  flex:0 0 52px;
  width:52px;
  height:52px;
  min-width:52px;
  margin:0;
  padding:0;
  border:1px solid rgba(255,255,255,.2);
  border-radius:16px;
  background:rgba(255,255,255,.1);
  color:#fff;
  text-decoration:none;
  box-shadow:inset 0 1px rgba(255,255,255,.16);
  font-size:0;
}
body.tool-theme :is(.home-button,.guide-home,.manual-home,.store-home,.store-back,.crumb,.scheme-home):hover,
body.tool-theme .app .brand-mark:hover,
body.tool-theme .toolbox-brand-home .brand-mark:hover{background:rgba(255,255,255,.18)}
body.tool-theme :is(.home-button,.guide-home,.manual-home,.store-home,.store-back,.crumb,.scheme-home) svg,
body.tool-theme .app .brand-mark svg,
body.tool-theme .toolbox-brand-home .brand-mark svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* Shared surfaces, control geometry, and active states. */
body.tool-theme :is(.source-group-panel,.product-card,.panel,.note-card,.guide-filter-panel,.network-card,.manual-launch,.policy-document,.toolbar-panel,.policy-card,.metric,.store-stat,.store-region-visual,.store-region-list,.store-filter-panel,.store-table-panel,.kpi-card,.data-card,.filter-bar,.ledger-card){
  border-color:var(--ut-line);
  border-radius:var(--ut-radius);
  box-shadow:var(--ut-shadow);
}
body.tool-theme :is(input,select,textarea){border-color:var(--ut-line)}
body.tool-theme :is(.primary-button,.primary-btn,.button-primary,.note-primary,.manual-launch a){background:linear-gradient(135deg,var(--ut-navy),var(--ut-navy-2));border-color:transparent;color:#fff;box-shadow:0 9px 22px rgba(16,61,85,.16)}
body.tool-theme :is(.pill.active,.category-button.active,.guide-category.active,.page-tabs a.active,.status-tab.active,.quote-view-tab.is-active){background:var(--ut-teal-strong);border-color:var(--ut-teal-strong);color:#fff}
body.tool-theme :is(.keyword,.tag,.pinned-badge,.store-filter-chip,.network-tags span:first-child){background:var(--ut-soft);color:var(--ut-teal-strong)}

/* Quote is the ninth tool and opens inside the launcher document. */
body.tool-theme.toolbox-quote-open>.topbar{min-height:92px;padding-left:var(--ut-header-pad);padding-right:var(--ut-header-pad)}
body.tool-theme.toolbox-quote-open :is(.room-panel,.catalog-toolbar,.product-table-card,.quote-panel){border-color:var(--ut-line);box-shadow:var(--ut-shadow)}

/* Scheme keeps its navigation but shares the palette and top-left return control. */
.scheme-page .sidebar{background:linear-gradient(180deg,#103d55,#0d3044)}
.scheme-page .main>.topbar{display:flex!important;min-height:96px;height:auto;padding:18px 34px;gap:14px}
.scheme-page .scheme-home{display:grid}
.scheme-page .topbar h1{color:#fff}
.scheme-page .topbar p{color:#dcecef}
.scheme-page .topbar .secondary-btn{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.28);color:#fff}

@media(max-width:760px){
  :root{--ut-header-pad:14px}
  body.tool-theme>.app-header,
  body.tool-theme>.manual-topbar,
  body.tool-theme>header.topbar{min-height:118px;padding-top:calc(18px + env(safe-area-inset-top));padding-bottom:22px;border-radius:0 0 26px 26px}
  body.tool-theme>.guide-topbar,body.tool-theme .app>.topbar{border-radius:0 0 26px 26px}
  body.tool-theme :is(.home-button,.guide-home,.manual-home,.store-home,.store-back,.crumb,.scheme-home),
  body.tool-theme .app .brand-mark,
  body.tool-theme .toolbox-brand-home .brand-mark{flex-basis:48px;width:48px;height:48px;min-width:48px;border-radius:15px}
  body.tool-theme :is(.home-button,.guide-home,.manual-home,.store-home,.store-back,.crumb,.scheme-home) svg,
  body.tool-theme .app .brand-mark svg,
  body.tool-theme .toolbox-brand-home .brand-mark svg{width:24px;height:24px}
  .store-topbar-inner,.store-detail-topbar-inner{width:calc(100% - 28px);min-height:118px;padding:20px 0 22px}
  .scheme-page .main>.topbar{min-height:86px;padding:calc(12px + env(safe-area-inset-top)) 14px 12px;border-radius:0 0 26px 26px}
  .scheme-page .menu-btn{order:4;margin:0 0 0 auto;color:#fff;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18)}
  .scheme-page .topbar>div:nth-of-type(1){min-width:0}
  body.tool-theme.toolbox-quote-open>.topbar{min-height:82px;padding:calc(10px + env(safe-area-inset-top)) 14px 10px;border-radius:0 0 26px 26px}
}

@media(min-width:2000px){:root{--ut-header-pad:max(48px,calc((100vw - 2040px)/2))}}

/* Desktop workspace mode: the seven standalone tools use the full browser canvas.
   Quote and scheme intentionally keep their existing purpose-built layouts. */
@media (min-width:900px) {
  :root{
    --ut-header-pad:24px;
    --ut-page-gutter:24px;
  }

  /* Product library, including detail and source-reader states. */
  body.tool-theme .app{width:100%;max-width:none;margin:0}
  body.tool-theme .app>.topbar,
  body.tool-theme .detail-head,
  body.tool-theme .source-head{padding-left:var(--ut-page-gutter);padding-right:var(--ut-page-gutter)}
  body.tool-theme :is(.content,.detail-body,.tabbar,.source-page){width:100%;max-width:none;margin-left:0;margin-right:0;padding-left:var(--ut-page-gutter);padding-right:var(--ut-page-gutter)}

  /* Memory, network guide, and technical manual. */
  body.tool-theme .memory-app>.app-header{padding-left:var(--ut-page-gutter);padding-right:var(--ut-page-gutter)}
  body.tool-theme .memory-app>main,
  body.tool-theme .guide-shell,
  body.tool-theme .manual-shell{width:calc(100% - (var(--ut-page-gutter) * 2));max-width:none;margin-left:var(--ut-page-gutter);margin-right:var(--ut-page-gutter)}
  body.tool-theme .page[data-page="record"] .editor-card{max-width:none;margin-left:0;margin-right:0}

  /* Policy overview and editor landing canvas. */
  body.policy-page .hero{padding-left:var(--ut-page-gutter);padding-right:var(--ut-page-gutter)}
  body.policy-page .hero-inner{width:100%;max-width:none;margin:0}
  body.policy-page .workspace{width:calc(100% - (var(--ut-page-gutter) * 2));max-width:none;margin-left:var(--ut-page-gutter);margin-right:var(--ut-page-gutter)}

  /* Store directory and every store detail. */
  body.tool-theme :is(.store-topbar-inner,.store-detail-topbar-inner,.store-shell,.store-detail-shell){width:calc(100% - (var(--ut-page-gutter) * 2));max-width:none;margin-left:var(--ut-page-gutter);margin-right:var(--ut-page-gutter)}

  /* After-sales overview plus warranty, route, process, and installation pages. */
  body.tool-theme>header.topbar{padding-left:var(--ut-page-gutter);padding-right:var(--ut-page-gutter)}
  body.tool-theme :is(.page-shell,.wide-shell){width:calc(100% - (var(--ut-page-gutter) * 2));max-width:none;margin-left:var(--ut-page-gutter);margin-right:var(--ut-page-gutter)}
  body.tool-theme .policy-copy{max-width:none}
}