/* Catalogue tools and listening, shared with the bespoke visual shell. */
[hidden] { display: none !important; }
.ui-icon { width: 20px; height: 20px; flex: 0 0 auto; vertical-align: middle; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 42px; text-decoration: none; }
.icon-button { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border: 1px solid var(--groove); border-radius: 50%; background: var(--panel); color: var(--paper); flex: 0 0 auto; }
.icon-button:hover { color: var(--gold); border-color: var(--gold); }
.feature-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; }
.feature-heading .modal__title { margin: .2rem 0 .8rem; font-size: clamp(1.9rem,4vw,2.8rem); }
.feature-kicker { margin: 0; color: var(--gold); font-size: .75rem; letter-spacing: .06em; }
.feature-intro { margin: 0 0 1.8rem; color: var(--paper-dim); font-size: .9rem; }
.modal { max-height: min(90dvh,960px); width: min(760px,calc(100vw - 32px)); overscroll-behavior: contain; border-radius: 22px; }
.modal::backdrop { background: #020a13bd; backdrop-filter: blur(10px); }
.modal__inner { padding: clamp(20px,3vw,36px); }
.field__input,.field__select,.field__area { min-width: 0; max-width: 100%; }
.field__input,.field__select { min-height: 44px; }
.catalogue-search { display: grid; gap: 1rem; }
.lookup-actions { display: flex; gap: .6rem; flex-wrap: wrap; align-items: center; }
.lookup-actions .field__select { width: auto; margin-left: auto; font-size: .85rem; }
.lookup-status { margin: 1.6rem 0 1rem; color: var(--paper-dim); font-size: .85rem; }
.lookup-status[data-error=true], .field__error { color: #f4a68b; }
.lookup-results { display: flex; flex-direction: column; gap: .45rem; }
.lookup-result { display: flex; width: 100%; align-items: center; gap: 1rem; border: 1px solid transparent; border-radius: 12px; background: color-mix(in srgb,var(--panel-hi) 65%,transparent); padding: 1rem; text-align: left; color: var(--paper); }
.lookup-result:hover { border-color: var(--gold-lo); background: var(--panel-hi); }
.lookup-result > span:nth-child(2) { display: grid; flex: 1; min-width: 0; gap: .15rem; }
.lookup-result strong { font-size: 1rem; line-height: 1.25; }
.lookup-result span span,.lookup-result small { color: var(--paper-dim); font-size: .8rem; overflow-wrap: anywhere; }
.lookup-result small { margin-top: .2rem; opacity: .85; }
.lookup-disc { width: 42px; height: 42px; background: #153a31; color: var(--gold); border-radius: 50%; display: grid; place-items: center; flex-shrink: 0; }
.lookup-disc .ui-icon { width: 30px; height: 30px; }
.lookup-foot { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.5rem; border-top: 1px solid var(--groove); padding-top: 1rem; }
.lookup-foot p,.provider-credit { font-size: .75rem; color: var(--paper-dim); }
.provider-credit { margin-top: 1.5rem; line-height: 1.6; }
.provider-credit a,.source-link,.art-credit { color: var(--gold); text-underline-offset: 4px; }
.source-link { font-size: .8rem; display: inline-block; margin-top: .75rem; }
.release-preview { display: grid; grid-template-columns: minmax(0,190px) 1fr; gap: 1.5rem; align-items: start; }
.release-preview h3 { margin: .2rem 0 .5rem; font-size: 1.5rem; line-height: 1.15; }
.release-preview p { margin: 0 0 .5rem; color: var(--paper-dim); }
.release-art { aspect-ratio: 1; border-radius: 6px; overflow: hidden; background: #12352d; box-shadow: 0 16px 36px #0007; }
.release-art img { display: block; width: 100%; height: 100%; object-fit: contain; }
.release-art > span { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; font-size: .8rem; color: var(--paper-dim); }
.release-art .ui-icon { width: 70px; height: 70px; }
.release-facts { display: grid; grid-template-columns: auto 1fr; gap: .3rem 1rem; font-size: .8rem; }
.release-facts dt { color: var(--paper-dim); }
.release-facts dd { margin: 0; overflow-wrap: anywhere; }
.feature-warning { padding: 1rem; margin: 1.2rem 0; background: #d9bb7910; border-left: 2px solid var(--gold); color: var(--paper); font-size: .85rem; }
.lookup-tracklist { font-size: .85rem; margin: 1.3rem 0; }
.lookup-tracklist summary,.player-link-settings summary { cursor: pointer; color: var(--gold); padding: .6rem 0; }
.lookup-tracklist ol { padding: 0; list-style: none; }
.lookup-tracklist li { display: flex; justify-content: space-between; gap: 1rem; padding: .5rem; border-bottom: 1px solid var(--groove); }
.camera-box { margin-top: 1rem; border: 1px solid var(--groove); border-radius: 12px; padding: 1rem; background: #020a13; text-align: center; }
.camera-box video { width: 100%; max-height: 230px; object-fit: cover; border-radius: 6px; }
.camera-box p { font-size: .85rem; color: var(--paper-dim); }
.record-listen { display: flex; gap: .6rem; margin-top: 1.3rem; flex-wrap: wrap; }
.art-credit { display: block; font-size: .7rem; margin: -1rem 0 1.2rem; }
.music-player { position: fixed; z-index: 75; right: 24px; bottom: 24px; width: min(410px,calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow-y: auto; background: #091c2b; border: 1px solid #577264; box-shadow: 0 28px 80px #000a; border-radius: 22px; padding: 22px; }
.player-heading { display: flex; gap: 1rem; align-items: flex-start; justify-content: space-between; }
.player-heading h2 { font-size: 1.35rem; line-height: 1.15; margin: .4rem 0; }
.player-heading > div > p:last-child { margin: 0; font-size: .85rem; color: var(--paper-dim); }
.player-tabs { display: flex; gap: 4px; padding: 4px; background: #ffffff06; border: 1px solid var(--groove); border-radius: 100px; margin: 1.25rem 0; }
.player-tabs button { flex: 1; min-height: 40px; border: 0; color: var(--paper-dim); background: transparent; border-radius: 100px; font-size: .85rem; }
.player-tabs button[aria-pressed=true] { background: #1d4d3d; color: var(--paper); }
.player-content iframe { display: block; width: 100%; border: 0; border-radius: 12px; background: #121212; }
.player-note { font-size: .72rem; line-height: 1.5; margin: 1rem 0 0; color: var(--paper-dim); }
.player-message { font-size: .9rem; color: var(--paper-dim); }
.player-link-form { display: grid; gap: .8rem; margin-top: 1.5rem; }
.player-link-form .btn { justify-self: start; }
.player-matches { display: grid; gap: .5rem; margin-bottom: 1rem; }
.player-match { text-align: left; border: 1px solid var(--groove); border-radius: 8px; background: var(--panel); padding: .8rem; color: var(--paper); font-size: .85rem; }
.player-match:hover { border-color: var(--gold); }
.form__grid { min-width: 0; }
.form__grid .field { min-width: 0; }
.tracks__row input { min-width: 0; }
.sheet__actions { flex-wrap: wrap; }
@media(max-width:600px) {
  .modal { width: calc(100vw - 16px); max-height: calc(100dvh - 24px); border-radius: 18px; }
  .modal__inner { padding: 22px 18px; }
  .feature-heading .modal__title { font-size: 1.8rem; }
  .feature-intro { margin-bottom: 1.2rem; }
  .lookup-actions .field__select { margin-left: 0; }
  .lookup-result { padding: .8rem; gap: .7rem; }
  .lookup-disc { width: 32px; height: 32px; }
  .lookup-result > .ui-icon { display: none; }
  .release-preview { grid-template-columns: 95px minmax(0,1fr); gap: 1rem; }
  .release-preview h3 { font-size: 1.2rem; }
  .release-facts { grid-template-columns: 1fr; gap: .1rem; }
  .release-facts dt { margin-top: .35rem; font-size: .7rem; }
  .lookup-foot { align-items: flex-start; flex-direction: column; gap: .4rem; }
  .music-player { right: 8px; bottom: 8px; width: calc(100vw - 16px); max-height: calc(100dvh - 16px); padding: 18px; border-radius: 18px; }
  .form__grid { grid-template-columns: 1fr; }
  .field__input,.field__select,.field__area { font-size: 16px; }
}
@media(prefers-reduced-motion:reduce){.music-player,.lookup-result{animation:none;transition:none;}}
[hidden] { display: none !important; }
.stage { overflow: clip; }

@media (max-width: 600px) {
  .views { width: 100%; min-width: 0; justify-content: space-between; }
  .views__btn { flex: 1; min-height: 40px; padding: .55rem .25rem; font-size: .66rem; white-space: nowrap; }
}

/* A private listening room. Public brand assets remain available to link previews. */
.access-gate {position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;gap:clamp(24px,6vw,110px);padding:36px;overflow:auto;background:radial-gradient(ellipse at 22% 65%,#153e35 0,transparent 54%),#071525;}
.access-gate__record {width:min(39vw,500px);flex-shrink:0;transform:rotate(-9deg);filter:drop-shadow(0 35px 65px #0009);}
.access-gate__record img {width:100%;height:auto;border-radius:27%;display:block;}
.access-gate__form {width:min(100%,490px);position:relative;}
.access-gate__eyebrow {text-transform:uppercase;letter-spacing:.24em;font-size:10px;color:#97c4ad;margin:0 0 22px;}
.access-gate h1 {font-size:clamp(70px,8vw,122px);line-height:.81;letter-spacing:-.07em;font-weight:900;margin:0 0 44px;color:#f3eee1;}
.access-gate h1 span {color:#dcb77b;}
.access-gate label {display:block;font-size:12px;color:#c6ceca;margin-bottom:12px;}
.access-gate__entry {display:flex;gap:10px;}
.access-gate input {width:0;flex:1;min-width:0;min-height:56px;padding:0 16px;background:#ffffff09;color:#fff;border:1px solid #97c4ad66;border-radius:12px;font:24px inherit;letter-spacing:.25em;}
.access-gate input:focus {outline:2px solid #97c4ad;outline-offset:3px;}
.access-gate .btn {min-height:56px;background:#dcb77b;color:#071525;border-color:transparent;padding:0 22px;gap:12px;white-space:nowrap;}
.access-gate__error {min-height:36px;color:#f2af8e;font-size:12px;margin:12px 0;}
.access-gate__signature {font-size:12px;color:#97c4ad;letter-spacing:.04em;}
@media(max-width:650px) {.access-gate {display:block;padding:max(24px,env(safe-area-inset-top)) 26px 24px;}.access-gate__record {width:126px;margin:14px 0 38px auto;transform:rotate(9deg);}.access-gate__form {margin:auto;}.access-gate h1 {font-size:clamp(70px,17vw,104px);margin-bottom:34px;}.access-gate .btn{padding:0 16px;}}
@media(max-height:620px) and (min-width:651px) {.access-gate h1{font-size:74px;margin-bottom:24px;}.access-gate__record{width:240px;}}

/* Brass, pale mint and copper respond to deliberate interaction. */
:root {--accent-mint:#9bceb2;--accent-copper:#d59770;}
.views__btn[aria-pressed=true] {box-shadow:inset 0 1px 0 #bad8be2e,0 0 16px #7bb49712;border-color:#a1c4a761;animation:selection-glow .48s ease-out;}
@keyframes selection-glow {from{box-shadow:inset 0 0 0 1px #abd4b37d,0 0 20px #86c4a440;}to{box-shadow:inset 0 1px 0 #bad8be2e,0 0 16px #7bb49712;}}
.btn {transition:background .2s,color .2s,border-color .2s,box-shadow .2s,transform .18s;}
@media(hover:hover) {.btn:hover {box-shadow:0 4px 18px #82bca51a;border-color:var(--accent-mint);transform:translateY(-1px);}.btn--danger:hover{border-color:var(--accent-copper);}}
.btn:active {transform:scale(.975);}
.tag--favorite {color:#efc4a3;border-color:#c58b6573;background:#70462d30;}
button:focus-visible {outline:2px solid var(--accent-mint);outline-offset:4px;}
@media(prefers-reduced-motion:reduce) {.views__btn[aria-pressed=true]{animation:none;}.btn{transition:color .15s,background .15s;}.btn:hover,.btn:active{transform:none;}}
#lockBtn svg {display:none;}
@media(max-width:760px) {#lockBtn {position:absolute;top:6px;right:10px;width:44px;height:44px;min-height:44px;padding:0;display:flex;align-items:center;justify-content:center;}#lockBtn svg{display:block;}#lockBtn span{display:none;}.rail__identity{padding-right:48px;}}


/* V1.12: the OS owns the status bar and home indicator regions. */
:root {--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--footer-height:26px;}
body {padding:var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left);}
.app-footer {margin-top:auto;position:relative;z-index:60;flex:0 0 var(--footer-height);height:var(--footer-height);display:flex;align-items:center;justify-content:flex-end;padding:0 18px;color:#a0b2b5;font-size:10px;letter-spacing:.12em;font-variant-numeric:tabular-nums;background:#071525;}
.access-gate {padding:calc(36px + var(--safe-top)) calc(36px + var(--safe-right)) calc(36px + var(--safe-bottom) + var(--footer-height)) calc(36px + var(--safe-left));}
.access-gate h1 {font-size:clamp(64px,7vw,106px);}
.sheet {top:var(--safe-top);bottom:var(--safe-bottom);}
.modal {max-height:calc(100dvh - var(--safe-top) - var(--safe-bottom) - 24px);}
.music-player {bottom:calc(24px + var(--safe-bottom));max-height:calc(100dvh - var(--safe-top) - var(--safe-bottom) - 48px);}
@media(max-width:650px) {.access-gate{padding:calc(24px + var(--safe-top)) calc(26px + var(--safe-right)) calc(24px + var(--safe-bottom) + var(--footer-height)) calc(26px + var(--safe-left));}.access-gate h1{font-size:clamp(54px,13.8vw,88px);letter-spacing:-.065em;}.access-gate__record{margin-top:8px;margin-bottom:30px;}.music-player{bottom:calc(8px + var(--safe-bottom));}}
