/* Three clear destinations; the workshop is for assembling and playing. */
.nav-item { position: relative; }
.nav-dot { position:absolute; top:8px; right:12px; width:7px; height:7px; background:var(--accent); border-radius:50%; }
.level-pill { display:grid; gap:5px; min-width:72px; min-height:44px; padding:6px 11px; background:#202c3b; border:1px solid #3e4e61; border-radius:12px; color:#e8eddd; font-size:14px; }
.level-mini-track { width:100%; height:3px; background:#455164; border-radius:3px; overflow:hidden; }
.level-mini-track i { display:block; height:100%; background:var(--accent); }
.workshop-v7 .heading-row h1 { font-size:22px; letter-spacing:-.6px; }
.workshop-v7 .workshop-controls { display:flex; flex-direction:column; }
.workshop-v7 .workshop-controls > * { order:initial; }
.workshop-v7 .workshop-controls > .slot-grid { margin-bottom:22px; }
.workshop-v7 .stage-card { border-top:0; border-bottom:0; margin:0; padding:12px 0; gap:12px; }
.workshop-v7 .stage-number { width:42px; height:42px; min-width:42px; font-size:18px; }
.workshop-v7 .stage-info small { color:var(--muted); font-size:14px; }
.workshop-v7 .stage-info strong { margin-top:1px; font-size:19px; }
.workshop-v7 .stage-card > .icon { width:20px; flex-shrink:0; color:var(--muted); }
.workshop-v7 .workshop-action .primary { gap:10px; }
.workshop-v7 .workshop-action .center-note { font-size:14px; margin-top:9px; }
.daily-nudge { margin-top:18px; width:100%; display:flex; align-items:center; gap:12px; color:#eceddc; border:0; border-top:1px solid #354455; background:none; padding:18px 0 10px; text-align:left; }
.daily-nudge > .icon { width:21px; height:21px; color:#c7d996; flex-shrink:0; }
.daily-nudge > span { flex:1; font-size:16px; font-weight:650; line-height:1.35; }
.daily-nudge small { display:block; color:var(--muted); font-size:14px; font-weight:400; margin-top:4px; }
.daily-nudge b { margin-left:4px; color:var(--accent); white-space:nowrap; }
.workshop-details { margin:16px 0 0; padding:0; border:0; border-top:1px solid #303d4d; border-radius:0; background:none; }
.workshop-details summary { display:flex; align-items:center; justify-content:space-between; min-height:48px; color:#acbbce; font-size:14px; font-weight:500; }
.workshop-details summary > .icon { width:17px; height:17px; }
.workshop-details .build-insights { margin-bottom:12px; }
.result-progression { display:flex; align-items:center; gap:14px; padding:16px 0; margin-bottom:12px; border-top:1px solid #3a4859; border-bottom:1px solid #3a4859; }
.result-progression .xp-earned { color:var(--accent); font-size:23px; font-weight:800; white-space:nowrap; }
.result-progression > span:nth-child(2) { flex:1; }
.result-progression strong,.result-progression small { display:block; }
.result-progression small { font-size:14px; color:var(--muted); }
.result-progression .ghost { padding:8px 0; font-size:14px; }
@media (max-width:899px) {
  .navbar { grid-template-columns:repeat(3,minmax(0,1fr)); padding-top:7px; padding-bottom:calc(7px + var(--safe-bottom)); }
  .nav-item { min-height:50px; font-size:14px; gap:3px; }
  .nav-item .icon { width:22px; height:22px; }
  .nav-item.active:after { display:none; }
  .topbar { border-bottom:0; }
  .shell[data-screen="workshop"] { padding-bottom:calc(90px + var(--safe-bottom)); }
  .shell[data-screen="workshop"] .main { padding-top:0; }
  .workshop-v7 { display:flex; flex-direction:column; align-items:stretch; gap:4px; }
  .workshop-v7 .workshop-stage { display:flex; padding:0; border:0; background:none; box-shadow:none; border-radius:0; overflow:visible; }
  .workshop-v7 .heading-row { display:none; }
  .workshop-v7 .specimen { height:clamp(258px,40dvh,360px); margin:0 calc(-1 * var(--gutter)); overflow:hidden; border-radius:0; order:1; }
  .workshop-v7 .specimen .hero-creature { height:100%; }
  .workshop-v7 .model-hint { bottom:8px; font-size:13px; padding:3px 8px; }
  .workshop-v7 .creature-label { display:block; order:2; margin:10px 0 12px; }
  .workshop-v7 .creature-label h2 { font-size:20px; line-height:1.2; letter-spacing:-.5px; }
  .workshop-v7 .mobile-slot-dock { order:3; gap:7px; margin:0; }
  .workshop-v7 .mobile-slot-dock button { display:flex; flex-direction:column; justify-content:center; min-height:56px; padding:7px 7px; border-radius:10px; gap:3px; border:1px solid #3d4a5a; background:#1d2835; }
  .workshop-v7 .dock-label { font-size:12px; line-height:1.2; color:#99aabe; }
  .workshop-v7 .dock-label .icon { width:12px; height:12px; }
  .workshop-v7 .mobile-slot-dock .dock-name { font-size:14px; font-weight:600; letter-spacing:-.4px; line-height:1.2; color:#eef1e9; }
  .workshop-v7 .workshop-controls { padding:0; }
  .workshop-v7 .workshop-controls > .slot-grid,.workshop-v7 .workshop-controls > .panel-heading { display:none; }
  .workshop-v7 .stage-card { padding:12px 0 9px; }
  .workshop-v7 .stage-info strong { font-size:16px; }
  .workshop-v7 .stage-info small { font-size:13px; }
  .workshop-v7 .stage-number { width:36px; height:36px; min-width:36px; font-size:16px; background:#263125; }
  .shell[data-screen="workshop"] .workshop-v7 .workshop-action .primary { position:static; width:100%; min-height:56px; margin:0; box-shadow:inset 0 -3px 0 #a7b536; }
  .workshop-v7 .workshop-action .center-note { margin-top:7px; }
  .workshop-v7 .daily-nudge { margin-top:8px; padding:12px 0; }
  .workshop-v7 .daily-nudge > span { font-size:14px; }
  .workshop-v7 .daily-nudge small { font-size:13px; margin-top:2px; }
  .workshop-v7 .workshop-details { margin-top:4px; }
  .result-progression { gap:10px; }
  .result-progression .xp-earned { font-size:21px; }
}
@media (max-width:359px) {
  .workshop-v7 .mobile-slot-dock button { padding-inline:3px; }
  .workshop-v7 .mobile-slot-dock .dock-name { letter-spacing:-.7px; }
  .workshop-v7 .creature-label h2 { font-size:18px; }
  .result-progression { flex-wrap:wrap; }
}
@media (max-width:899px) and (max-height:750px) {
  .workshop-v7 .specimen { height:258px; }
  .workshop-v7 .creature-label { margin:5px 0 9px; }
  .workshop-v7 .creature-label h2 { font-size:18px; }
}