/* 3Dhive material system. Load after the existing layout and refresh sheets.
   Surface color belongs to theme; style presets retain their type/shape choices.
   Solid ceramic/graphite panels use a fine lit edge and contact shadow. Only
   floating chrome receives a directional sheen; no image texture over content. */
:root,
:root[data-theme="light"][data-style]{
  color-scheme:light;
  --bg:#eef1f5; --surface:#fff; --raised:#f8f9fb; --stage:#fff;
  --slot:#edf0f4; --line:#dce1e8; --line-soft:#e9edf2;
  --ink:#171b22; --text:#303742; --dim:#5d6775; --faint:#687281;
  --meta:#606b79; --label:#535f6d;
  --accent:#1766e8; --accent-soft:#eaf2ff; --accent-ink:#175bc7;
  --on-accent:#fff; --on-accent-ink:#fff;
  --favorite:#be123c; --favorite-soft:#fde7ec;
  --danger:#c83742; --danger-soft:#fff0f1;
  --gold-ink:#a45d13; --gold-fill:#fff2e3;
  --cad-accent:#c57017; --cad-accent-ink:#99510d; --cad-accent-soft:#fff2e3;
  --control-surface:var(--surface);
  --glass-surface:var(--surface); --glass-surface-strong:var(--surface); --glass-surface-soft:var(--raised);
  --surface-hover:#f1f5fa; --surface-preview:#f2f5f9;
  --tip-bg:#20252d; --tip-fg:#fff;
  --ui-positive:#15724f; --ui-warning:#a25b14; --ui-info:var(--accent-ink);
  --mat-panel:var(--surface); --mat-raised:var(--raised); --mat-recess:var(--slot);
  --mat-border:var(--line); --mat-edge:rgba(255,255,255,.94);
  --mat-muted:var(--dim); --mat-blue:var(--accent-ink); --mat-blue-soft:var(--accent-soft);
  --mat-green:var(--ui-positive); --mat-orange:var(--gold-ink);
  --mat-sheen:linear-gradient(160deg,var(--mat-edge),transparent 45%);
  --mat-shadow:inset 0 1px 0 var(--mat-edge),0 1px 2px rgba(28,39,56,.06),0 6px 18px -12px rgba(28,39,56,.19);
  --mat-shadow-float:inset 0 1px 0 var(--mat-edge),0 2px 5px rgba(28,39,56,.06),0 16px 40px -16px rgba(28,39,56,.25);
  --mat-shadow-sheet:inset 0 1px 0 var(--mat-edge),0 8px 24px -10px rgba(28,39,56,.17),0 32px 90px -28px rgba(28,39,56,.3);
  --shadow-sm:var(--mat-shadow); --shadow-md:var(--mat-shadow-float); --shadow-lg:var(--mat-shadow-sheet);
  --lift:var(--mat-shadow); --float:var(--mat-shadow-float); --sheet:var(--mat-shadow-sheet);
  --canvas-ink:var(--text); --canvas-selection:#1766e8; --canvas-handle:#fff;
  --canvas-grid-major:#8692a1; --canvas-grid-minor:#b8c2ce; --canvas-grid-opacity:.42;
  --sketch-grid-minor:rgba(103,122,146,.08); --sketch-grid-major:rgba(103,122,146,.16);
}
/* Also available when this sheet is loaded by the standalone account frame. */
:root{
  --font:'Hive Inter',ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
}
:root[data-theme="dark"],
:root[data-theme="dark"][data-style]{
  color-scheme:dark;
  --bg:#080808; --surface:#111111; --raised:#191919; --stage:#0b0b0b;
  --slot:#222222; --line:#363636; --line-soft:#292929;
  --ink:#f5f5f5; --text:#dbdbdb; --dim:#adadad; --faint:#9e9e9e;
  --meta:#adadad; --label:#bcbcbc;
  --accent:#545454; --accent-soft:#262626; --accent-ink:#d4d4d4;
  --on-accent:#fff; --on-accent-ink:#141414;
  --favorite:#ef8fa7; --favorite-soft:#331f26;
  --danger:#ff9199; --danger-soft:#341d23;
  --gold-ink:#efb36c; --gold-fill:#302419;
  --cad-accent:#efb36c; --cad-accent-ink:#f4c189; --cad-accent-soft:#302419;
  --control-surface:var(--raised);
  --glass-surface:var(--surface); --glass-surface-strong:var(--surface); --glass-surface-soft:var(--raised);
  --surface-hover:#292929; --surface-preview:#171717;
  --tip-bg:#eeeeee; --tip-fg:#171717;
  --ui-positive:#78d6a9; --ui-warning:#efb36c; --ui-info:var(--accent-ink);
  --mat-panel:var(--surface); --mat-raised:var(--raised); --mat-recess:var(--slot);
  --mat-border:var(--line); --mat-edge:rgba(255,255,255,.075);
  --mat-muted:var(--dim); --mat-blue:var(--accent-ink); --mat-blue-soft:var(--accent-soft);
  --mat-green:var(--ui-positive); --mat-orange:var(--gold-ink);
  --mat-shadow:inset 0 1px 0 var(--mat-edge),0 1px 3px rgba(0,0,0,.35),0 8px 20px -12px rgba(0,0,0,.6);
  --mat-shadow-float:inset 0 1px 0 var(--mat-edge),0 2px 6px rgba(0,0,0,.4),0 18px 44px -16px rgba(0,0,0,.75);
  --mat-shadow-sheet:inset 0 1px 0 var(--mat-edge),0 8px 24px rgba(0,0,0,.38),0 32px 90px -28px rgba(0,0,0,.9);
  --shadow-sm:var(--mat-shadow); --shadow-md:var(--mat-shadow-float); --shadow-lg:var(--mat-shadow-sheet);
  --lift:var(--mat-shadow); --float:var(--mat-shadow-float); --sheet:var(--mat-shadow-sheet);
  --canvas-ink:var(--text); --canvas-selection:#d4d4d4; --canvas-handle:#171717;
  --canvas-grid-major:#6c6c6c; --canvas-grid-minor:#3b3b3b; --canvas-grid-opacity:.55;
  --sketch-grid-minor:rgba(202,202,202,.055); --sketch-grid-major:rgba(202,202,202,.13);
}

/* A solid page, slightly recessed work area, and crisp opaque floating chrome. */
body{ background:var(--bg); }
.shell{ background:var(--bg); }
.panel{ border-color:var(--line); background-color:var(--surface); }
.command{
  background:var(--mat-panel); border-color:var(--mat-border);
  box-shadow:var(--mat-shadow-float);
}
.command:focus-within{ border-color:var(--mat-border); box-shadow:var(--mat-shadow-float); }
/* The dock is a stacking context. Lift it with expanded chat so contextual
   Build offers cannot cover the conversation or its channel controls. */
.dock:has(.command[data-log="true"]){ z-index:90; }
.command input::placeholder,.command__ghost{ color:var(--dim); opacity:1; }
.command__add{ background:var(--raised); border-color:var(--line-soft); box-shadow:var(--mat-shadow); color:var(--text); }
.command__add:hover{ background:var(--slot); color:var(--ink); }
.watchbar{ background:var(--surface); border-color:var(--line); box-shadow:inset 0 1px 0 var(--mat-edge); }
.watchbar__chip{ color:var(--dim); border-radius:8px; }
.watchbar__chip:hover,.watchbar__chip:focus-visible{ background:var(--slot); color:var(--ink); }
.watchbar__chip[aria-pressed="true"]{ background:var(--accent-soft); color:var(--accent-ink); }
.watchbar__badge,.command__chat b{ background:var(--accent); color:#fff; }

/* Home: the models are the texture reference, with no translucent veil over
   their colors. Artwork and solid inset trays sit on white/black door panels. */
.load-view{ --load-tile:var(--raised); --load-gold:var(--gold-ink); background:var(--surface); }
.load-view__door{ background:var(--surface); }
.load-view__door[aria-labelledby="loadDesignTitle"]{ background:var(--raised); }
.load-view__door:hover,.load-view__door:focus-within{ background:var(--surface-hover); }
.load-view__art{ opacity:1; }
.load-view__eyebrow{ color:var(--dim); font-family:var(--font); font-size:var(--t-meta); letter-spacing:.09em; }
.load-view__verb{ color:var(--gold-ink); }
.load-view__title{ color:var(--ink); font-weight:600; letter-spacing:-.035em; }
.load-view__blurb,:root[data-theme="dark"] .load-view__blurb{ color:var(--dim); }
.load-view__tile,.load-view__plate,.load-view__printer-card{
  border-color:var(--mat-border); background-color:var(--mat-panel); box-shadow:var(--mat-shadow);
}
.load-view__plate{ background:var(--surface-preview); }
.load-view__video{ background:#101214; }
.load-view__ortho-grid{ background:var(--surface-preview); box-shadow:inset 0 1px 3px rgba(0,0,0,.035); }
.load-view__mini-head{ font-family:var(--font); font-size:var(--t-meta); letter-spacing:0; color:var(--dim); }
.load-view__mini-head b{ color:var(--ink); }
.load-view__mini-head > span{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.load-view__bars i{ background:var(--accent); opacity:.45; border-radius:2px 2px 0 0; }
.load-view__bars i:last-child{ opacity:1; }
.load-view__ortho-view small{ font-family:var(--font); letter-spacing:.04em; }
.load-view__go,.load-view__shops{
  background:var(--surface); color:var(--ink); border-color:var(--mat-border);
  box-shadow:var(--mat-shadow); backdrop-filter:none; -webkit-backdrop-filter:none;
}
.load-view__go{
  cursor:pointer; transform:translateY(0);
  transition:border-color .16s ease,background .16s ease,color .16s ease,
    box-shadow .16s ease,transform .16s cubic-bezier(.2,.8,.2,1);
}
.load-view__shops::before{ background:var(--mat-green); }
.load-view__door:hover .load-view__go,.load-view__go:hover,.load-view__go:focus-visible{
  background:var(--accent); border-color:var(--accent); color:#fff;
  transform:translateY(-2px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),
    0 3px 0 color-mix(in srgb,var(--accent) 68%,#000),
    0 12px 24px -10px rgba(18,64,128,.48);
}
.load-view__door:hover .load-view__go:active,.load-view__go:active{
  transform:translateY(1px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2),
    0 1px 0 color-mix(in srgb,var(--accent) 68%,#000),
    0 5px 12px -8px rgba(18,64,128,.38);
}
.load-view__prompt{ background:transparent; box-shadow:none; }
.load-view__signin,.top-panel__account-actions .top-panel__signin{
  background:var(--accent); border-color:var(--accent); color:var(--on-accent);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 2px 4px rgba(18,64,128,.14);
  backdrop-filter:none; -webkit-backdrop-filter:none;
}
.load-view__signin:hover,.top-panel__account-actions .top-panel__signin:hover{
  background:color-mix(in srgb,var(--accent) 88%,#000); color:var(--on-accent);
}
/* Keep the dimensional color and shadow for reduced-motion users without
   physically moving the control. */
:root[data-reduce-motion="true"] .load-view__door:hover .load-view__go,
:root[data-reduce-motion="true"] .load-view__go:is(:hover,:focus-visible,:active){ transform:none; }
@media (prefers-reduced-motion:reduce){
  .load-view__door:hover .load-view__go,
  .load-view__go:is(:hover,:focus-visible,:active){ transform:none; }
}

/* Preserve the expanding three-view header and its account lane. */
body:is([data-view="browse"],[data-view="design"],[data-view="build"],[data-view="seller"]) .view-preview{
  background:var(--surface); border-color:var(--line); box-shadow:inset 0 1px 0 var(--mat-edge);
}
body:is([data-view="browse"],[data-view="design"],[data-view="build"],[data-view="seller"]) .view-preview[data-active="true"]{
  background:var(--raised);
}
body:is([data-view="browse"],[data-view="design"],[data-view="build"],[data-view="seller"]) > .top-panel::after{
  background:var(--line); box-shadow:0 2px 6px rgba(0,0,0,.055);
}
.view-preview__verb{ font-family:var(--font); color:var(--dim); letter-spacing:.09em; }
.view-preview__ord{ color:var(--gold-ink); }
.view-preview__tile{ background:var(--raised); border-color:var(--line-soft); box-shadow:var(--mat-shadow); }
.view-preview__bars i{ background:var(--accent); border-radius:1px 1px 0 0; }
.view-preview__cap,.view-preview__row{ font-family:var(--font); }
.top-panel__account-actions .top-panel__home{
  background:var(--surface); border-color:var(--line); color:var(--dim); box-shadow:var(--mat-shadow);
}
.top-panel__account-actions .top-panel__home:hover{ color:var(--ink); background:var(--slot); }
.top-panel__account-actions .top-panel__home[aria-pressed="true"]{ color:var(--accent-ink); border-color:var(--accent); background:var(--accent-soft); }
.app-brand::before{ background:none; box-shadow:none; }
.app-brand.is-ambient-pulse::before,.app-brand.is-ambient-pulse .app-brand__mark{ animation:none; }

/* Keep Home's miniature captions within their existing frames on laptop
   screens. The full-size desktop and stacked compact layouts retain spacing. */
@media (min-width:1021px) and (max-height:850px){
  .load-view__mini{ padding:10px; gap:3px; }
  .load-view__mini .load-view__bars{ height:18px; flex-shrink:0; }
  .load-view__mini figcaption{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
}

/* A consistent visible keyboard ring is independent of hover/selected fills. */
:where(button,a,input,select,textarea,summary,[role="button"],[role="tab"],[tabindex]):focus-visible{
  /* Component hover/focus fills often reset outline. Keyboard visibility must
     survive those resets, including controls in dynamically loaded sheets.
     Keep offset overridable for controls whose parent clips outer rings. */
  outline:2px solid var(--accent-ink) !important; outline-offset:3px;
}
:where(input,select,textarea){ accent-color:var(--accent); }
/* Typing does not add a border around the command field or its rounded shell.
   Individual action buttons retain their own keyboard focus rings. */
#command:has(#commandInput:focus-visible){outline:0}
#command #commandInput:focus-visible{outline:0 !important}
/* Keep the live preference as well as the OS setting authoritative. */
:root[data-reduce-motion="true"] *,
:root[data-reduce-motion="true"] *::before,
:root[data-reduce-motion="true"] *::after{
  animation-duration:.01ms !important; animation-iteration-count:1 !important;
  transition-duration:.01ms !important; scroll-behavior:auto !important;
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}
