#personal-tool-summary { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
.skill-stat-block { display:flex; flex-direction:column; justify-content:center; border-left:1px solid var(--frame-edge); padding:4px 10px; }
.skill-stat-block small { color:var(--muted); text-transform:uppercase; letter-spacing:.08em; font-size:.65rem; }
.skill-stat-block strong { color:var(--ink); font-size:.8rem; font-weight:600; line-height:1.4; }
.skill-stat-block:last-child strong { color:var(--gold); }
.skill-dashboard-body .tool-card > .tool-material-details { grid-column:1 / -1; margin:6px 0; font-size:.8rem; }
.tool-material-details summary { padding:7px 9px; }
.requirement-summary-row { display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding:7px 0; border-bottom:1px solid var(--line); font-size:.8rem; }
.requirement-summary-row span { min-width:0; }
.requirement-summary-row b { white-space:nowrap; font-variant-numeric:tabular-nums; }
.requirement-summary-row.met b { color:var(--mint); }
.requirement-summary-row.unmet b { color:#ffc08a; }
.next-needs-summary { margin:8px 0 16px; }
.next-needs-summary h4 { margin:0 0 5px; font-size:.9rem; color:var(--gold); }
.next-needs-summary p { font-size:.8rem; color:var(--muted); margin-top:8px; }
.dashboard-activities .resource-card:has(.next-needs-summary) .resource-gate { display:none; }
.dashboard-activities #resource-list.compact-activities .resource-card:first-child:not(.locked) .resource-art { width:112px; height:104px; }
.dashboard-activities #resource-list.compact-activities .resource-card:first-child:not(.locked) .resource-art img { width:96px; height:96px; }

/* Give the persistent training status more presence on every desktop tab. */
@media(min-width:1200px){
 body .training-sticky-wrap .training-banner { min-height:120px; padding:18px 22px 0; gap:14px 22px; }
 body .training-banner .training-description .eyebrow { display:block; font-size:.9rem; letter-spacing:.12em; margin-bottom:6px; }
 body .training-banner #training-title { font-size:1.5rem; line-height:1.35; }
 body .training-banner .training-description { text-align:center; }
 body .skill-dashboard-header #dashboard-skill-progress .xp-summary {
  grid-column:1 / -1; grid-row:2; width:100%; justify-content:center;
  display:grid; grid-template-columns:auto minmax(120px,1fr); align-items:center;
  gap:16px; font-size:.9rem;
 }
 body .skill-dashboard-header #dashboard-skill-progress .xp-summary progress { width:100%; min-width:0; height:6px; }
 body .skill-dashboard-header .skill-stat-block { padding:4px 16px; }
 body .skill-dashboard-header .skill-stat-block strong { font-size:.95rem; }
 body .training-banner .training-controls { gap:14px; flex-wrap:wrap; }
 body .training-banner .training-controls button { min-height:48px; padding:10px 16px; font-size:.95rem; }
 body .training-banner #training-time { font-size:1rem; }
 body .training-banner #training-meter { height:5px; flex-basis:calc(100% + 44px); margin:0 -22px; }
}
/* Light-catching edges and larger existing artwork, without decorative noise. */
/* Wider desktop navigation keeps the large artwork beside readable labels. */
@media(min-width:1200px){
 body .shell,
 body .shell.skills-dashboard-layout,
 body .shell.tab-dashboard-layout { grid-template-columns:320px minmax(0,1fr); }
 .relay-menu .compact-nav > button { min-height:102px; padding:6px 12px; gap:14px; border-radius:3px; }
 .relay-menu .compact-nav .nav-name { overflow-wrap:normal; }
 .relay-menu .compact-nav[aria-label="Utility"] > button:not(:hover):not(.selected) {
  border-color:#344853; background:linear-gradient(115deg,#19252d,#0c151c);
  box-shadow:inset 0 1px 0 #ffffff08,0 2px 3px #0003;
 }
}
body :is(.panel,.resource-card,.tool-card,.recipe,.inventory-item,.equipment-panel) {
 border-top-color:#536875; border-bottom-color:#182831;
 box-shadow:inset 0 1px 0 #c7e3ef12,inset 0 -1px 0 #0006,0 5px 12px #0003;
}
body .skill-dashboard-header { box-shadow:inset 0 1px 0 #c7e3ef16,0 6px 16px #0005; }
.dashboard-activities #resource-list.compact-activities .resource-card .resource-art,
.dashboard-activities #resource-list.compact-activities .resource-card:first-child:not(.locked) .resource-art {
 width:144px; height:136px; padding:8px; border-radius:8px;
 background:radial-gradient(ellipse at 50% 65%,#7295a523,transparent 72%);
}
.dashboard-activities #resource-list.compact-activities .resource-card .resource-art img,
.dashboard-activities #resource-list.compact-activities .resource-card:first-child:not(.locked) .resource-art img {
 width:120px; height:120px; object-fit:contain; filter:drop-shadow(0 6px 5px #0008); border-radius:6px;
}
.dashboard-activities #resource-list.compact-activities .resource-card.is-training .resource-art {
 background:radial-gradient(ellipse at 50% 65%,#4cd9b42e,transparent 75%);
 border-color:#67c9b185; box-shadow:inset 0 1px 0 #b4ffea20,0 0 18px #48caa517;
}
body .tool-card:has([data-tool]:not(:disabled)) { border-top-color:#d1a453; border-right-color:#78603c; }
.skill-dashboard-body .tool-card > .equipment-art,
.skill-dashboard-body .tool-card > .equipment-fallback {
 width:100px; height:100px; max-height:none; padding:4px; margin:0;
 background:radial-gradient(ellipse,#7c98a61f,transparent 72%);
}
.skill-dashboard-body .tool-card > .equipment-art,
.skill-dashboard-body .tool-card > .equipment-fallback img { max-height:96px; width:96px; height:96px; object-fit:contain; filter:drop-shadow(0 5px 4px #0008); }
.skill-dashboard-body .tool-card:has([data-tool]:not(:disabled)) > :is(.equipment-art,.equipment-fallback) { background:radial-gradient(ellipse,#efba5228,transparent 74%); }
body .skill-dashboard-header #boost-training:not(:disabled),body button[data-tool]:not(:disabled),body #tutorial-next {
 background:linear-gradient(#ffd582 0%,#e9b44f 45%,#bf8128 100%); color:#211707; border:1px solid #ffe0a0;
 box-shadow:inset 0 1px 0 #fff1bd,inset 0 -2px 0 #8a561a,0 3px 8px #0005; text-shadow:0 1px 0 #ffe2a866;
}
body .skill-dashboard-header #boost-training:hover:not(:disabled),body button[data-tool]:hover:not(:disabled),body #tutorial-next:hover {
 background:linear-gradient(#ffe3a5,#f1c367 48%,#d09336); box-shadow:inset 0 1px 0 #fff5d3,inset 0 -2px 0 #9b6924,0 0 14px #e9b44f30;
}
@media(min-width:1200px){
 .skill-dashboard-body .tool-card { --tool-art-size:clamp(112px,8.6vw,144px); grid-template-columns:var(--tool-art-size) minmax(0,1fr); column-gap:12px; }
 .skill-dashboard-body .tool-card > .equipment-art,
 .skill-dashboard-body .tool-card > .equipment-fallback {
  width:var(--tool-art-size); height:var(--tool-art-size); max-height:none; padding:0;
  align-self:center; border-radius:6px;
 }
 .skill-dashboard-body .tool-card > .equipment-fallback img {
  width:100%; height:100%; max-height:none; object-fit:contain;
 }
 .skill-dashboard-body .tool-card > h3 { align-self:end; }
}
#tool-list .material-briefing-link,.next-needs-summary .material-briefing-link { display:flex; box-sizing:border-box; width:100%; min-height:42px; margin:6px 0; padding:9px 12px; border:1px solid var(--frame-edge); border-radius:5px; background:var(--frame-surface); color:var(--ink); box-shadow:var(--frame-shadow); font-size:.8rem; text-align:left; cursor:pointer; }
#tool-list .material-briefing-link:hover,.next-needs-summary .material-briefing-link:hover { color:#f3f7fa; border-color:var(--frame-light); background:linear-gradient(115deg,#273943,#14232d); box-shadow:inset 0 1px 0 #ffffff12,0 0 12px #99bdd416; }
#tool-list .material-briefing-link:focus-visible,.next-needs-summary .material-briefing-link:focus-visible { outline:2px solid #85e0cb; outline-offset:3px; }
