/* Surface refinement
   Shared material treatment for page fields, ledgers, covers, and overlays.
   This layer changes surfaces only; route geometry remains route-owned. */

/* ————— ground: sections are white, separated by one hairline ————— */
.pnl:not(.f-slate){background-color:transparent;background-image:none}
.pnl.f-slate{background-image:none}
#app section.pnl+section.pnl{border-top:1px solid color-mix(in srgb,var(--text-primary) 7%,transparent)}

/* ————— buttons: no press-paper offsets anywhere ————— */
.btn,.btn2,.run-play-replay,.run-playback-toggle{
  box-shadow:none!important;border-radius:8px!important;
}
.btn:active,.btn2:active{transform:none}
.btn2{border:1px solid var(--border-subtle)!important;background:var(--bg-field)!important}

/* ————— covers: printed artifacts keep their card identity, shadows go soft ————— */
.play-cover{box-shadow:0 2px 6px rgba(25,55,47,.10),0 12px 28px rgba(25,55,47,.10)!important;border-radius:10px}
.catalog-card:hover .play-cover,.master-card:hover,.identity-card:hover,.profile-play:hover .play-cover{
  transform:none!important;
  box-shadow:0 4px 10px rgba(25,55,47,.14),0 18px 40px rgba(25,55,47,.16)!important;
}

/* ————— soft-field panels: border off, greige on, generous rounding ————— */
.catalog-intro-actions,.feature-hear,
.artist-metrics,.artist-credential,.identity-domain,.identity-relation-grid,.identity-person-link,
.play-evidence,.play-contract,.setup-grid,.record-proof,.source-vault,
.fit-controls,.fit-result,.plan-sheet,.plan-card,.pricing-ledger,.identity-ledger-example,
.fit-route,.pricing-guarantee-list{
  border-color:transparent!important;
  background-color:var(--bg-field)!important;
  border-radius:16px;
  box-shadow:none!important;
}
.identity-card,.master-card{
  border:0!important;background:var(--bg-field)!important;border-radius:16px;overflow:hidden;
}

/* ————— ledger surfaces: rows separate with hairlines, not rules ————— */
.catalog-table-head,.catalog-row,.track-row,.prow,.vrow,.tle,.lit{
  border-color:var(--border-subtle)!important;
}
.catalog-row,.track-row{box-shadow:none!important}

/* ————— chips, labels, controls ————— */
.catalog-kicker,.catalog-disclosure{border:0!important;background:transparent!important;padding-left:0!important}
.catalog-search{border:1px solid var(--border-subtle)!important;background:#fff!important;border-radius:11px;box-shadow:none!important}
.catalog-filters{border:0!important;background:transparent!important}
.catalog-filters button,.catalog-filters a,.intw{border:0;background:var(--bg-field);border-radius:8px}
.ticket{border-width:1px!important;border-color:color-mix(in srgb,var(--text-primary) 30%,transparent)!important;border-radius:12px;box-shadow:none!important;overflow:hidden}

/* ————— the run playback sheet (example playback overlay) ————— */
.sheet{border-radius:18px}
.sheet:has(.run-playback-sheet){border-radius:18px;overflow:hidden}
.run-playback-shortcuts{border-bottom:1px solid var(--border-subtle)!important;background:transparent!important}
.run-playback-shortcuts kbd{border:1px solid var(--border-subtle)!important;box-shadow:none!important;border-radius:5px;background:var(--bg-field)!important}
.run-live-terminal{box-shadow:0 10px 30px rgba(25,55,47,.16)!important;border-radius:12px;overflow:hidden;border:0!important}
.run-playback-command{border:1px solid var(--border-subtle)!important;border-radius:9px}
.run-playback-facts{border-color:var(--border-subtle)!important}
.run-playback-facts span+span{border-color:var(--border-subtle)!important}
.run-playback-cta{border:0!important;background:var(--bg-field)!important;border-radius:14px}
.run-play-replay{border:0!important;background:var(--bg-field)!important}
.run-play-replay:hover{background:var(--text-primary)!important;color:var(--text-primary)!important;transform:none!important}
.run-highlights{border:0!important;background:var(--bg-field);border-radius:14px;overflow:hidden}
.run-highlights>div{border-color:var(--border-subtle)!important}
.run-fragment{border:1px solid var(--border-subtle)!important;border-radius:12px}
.run-result details{border-color:var(--border-subtle)!important}

/* ————— play detail: the run command is the action, not a popover ————— */
.play-run-real{display:grid;gap:7px;margin:16px 0 6px;max-width:min(58ch,100%);min-width:0}
.play-run-real .ds-command{min-width:0}
.play-run-real .play-cmd-note{opacity:.55}

/* ————— the spec card: the play's nutrition label ————— */
.play-spec{padding:6px clamp(24px,3.8vw,54px) 30px}
.spec-card{background:var(--bg-field);border-radius:16px;padding:4px 0 10px;max-width:1080px}
.spec-head{display:flex;justify-content:space-between;align-items:center;gap:2ch;flex-wrap:wrap;padding:15px 22px 11px}
.spec-ro{color:#3E8355;opacity:1}
.spec-row{display:grid;grid-template-columns:minmax(12ch,20ch) 9ch minmax(0,1fr);gap:14px;align-items:baseline;padding:10px 22px;border-top:1px solid var(--border-subtle);font:500 14px/1.4 var(--font-editorial)}
.spec-row b{font-weight:750}
.spec-surface{font:700 9.5px/1 var(--font-technical);letter-spacing:.08em;color:color-mix(in srgb,var(--text-primary) 52%,transparent)}
.spec-line{display:grid;grid-template-columns:minmax(10ch,12ch) minmax(0,1fr);gap:14px;align-items:baseline;padding:11px 22px;border-top:1px solid var(--border-subtle);font:500 13.5px/1.6 var(--font-editorial)}
.spec-line .tk{font:700 10px/1.4 var(--font-technical);letter-spacing:.09em;color:color-mix(in srgb,var(--text-primary) 52%,transparent)}
.spec-params{display:flex;flex-wrap:wrap;gap:7px}
.spec-param{display:inline-block;padding:5px 10px;background:var(--bg-page);border-radius:7px;font:600 11px/1.4 var(--font-technical)}
.spec-param b{font-weight:800}
.spec-note{font-style:normal;opacity:.55;font-size:11px}
@media (max-width:700px){
  .spec-row{grid-template-columns:minmax(0,1fr) auto;row-gap:3px}
  .spec-row .spec-surface{order:3}
  .spec-line{grid-template-columns:1fr;row-gap:5px}
}

/* ————— filled panels breathe: content never touches a field's edge ————— */
.play-page .play-evidence>div,
.play-page .play-evidence>div:not(:first-child){padding:16px 18px}
@media (max-width:720px){
  .play-page .play-evidence>div,
  .play-page .play-evidence>div:not(:first-child){padding:12px 18px}
}
.play-page .source-vault>summary{padding:17px 24px}
.play-page .source-vault .lit{padding:0 24px 20px}
.play-page .record-proof{padding:26px 28px}

/* ————— play liner notes: warm hairlines, no press grooves, no cool grays ————— */
.play-page :is(.setup-grid,.prow,.dep,.track-row,.tle,.vrow,.touch){
  box-shadow:none!important;border-color:var(--border-subtle)!important;
}
.play-page :is(.setup-grid,.play-contract){padding:30px 38px 34px}
@media (max-width:700px){.play-page :is(.setup-grid,.play-contract){padding:22px 22px 26px}}
.play-page .prow{grid-template-columns:minmax(9ch,13ch) 1fr;padding:16px 0}
.play-page .prow label{font:700 10.5px/1.7 var(--font-technical);letter-spacing:.09em;color:color-mix(in srgb,var(--text-primary) 60%,transparent)}
.play-page .prow .chips{display:inline-flex;flex-wrap:wrap;gap:8px}
.play-page .chip{background:var(--bg-page);border-radius:7px;padding:6px 13px;font:600 12.5px/1.4 var(--font-editorial);color:var(--text-primary)}
.play-page .chip:hover{background:color-mix(in srgb,var(--text-primary) 14%,var(--bg-page))}
.play-page .chip.on{background:var(--text-primary);color:var(--text-primary)}
.play-page .blank{font-size:14px;border-bottom-color:color-mix(in srgb,var(--text-primary) 40%,transparent)}
.play-page .prow .hint{font-size:12.5px;opacity:.6;margin-top:7px}
.play-page .dep{align-items:baseline;padding:13px 0}
.play-page .dep .mark{color:#3E8355}
.play-page .setup-grid p{opacity:.6}

/* ————— profile detail ————— */
.artist-portrait{border:0!important;box-shadow:none!important;border-radius:16px;overflow:hidden}
.profile-page .artist-metrics>div,
.profile-page .artist-metrics>div:first-child{padding:16px 18px}
.identity-relations .identity-relation-grid>*{border-color:var(--border-subtle)!important}
.artist-metrics>*{border-color:var(--border-subtle)!important}

/* ————— pricing ————— */