/* Rebost-specific layout. Colours, typography and controls come from /styles.css. */
.rebost-page .rebost-layout {gap:20px}
.rebost-page .session-status {font-weight:600}
.rebost-page .session-status.signed {color:var(--accent-dark); border-color:var(--accent)}
.rebost-page #status:empty {display:none}
.rebost-page #status:not(:empty) {
  position:sticky;
  top:8px;
  z-index:5;
  padding:16px 20px;
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--panel);
}
.rebost-page #status.success {color:var(--success-ink); border-color:var(--accent); background:var(--soft)}
.rebost-page #status.error {color:var(--ink); border-color:var(--warn-border); background:var(--warn-bg)}
.rebost-page #access {display:grid; gap:8px}
.rebost-page #access p {color:var(--muted); line-height:1.65}
.rebost-page #access .actions {margin-bottom:0}
.rebost-page #controls {min-width:0; margin:0; padding:0; border:0}
.rebost-page #mine {padding:0 0 14px; font-size:21px; font-weight:700; letter-spacing:-.025em}
.rebost-page .library-toolbar {display:grid; gap:16px; margin-bottom:20px}
.rebost-page .collections {display:flex; flex-wrap:wrap; gap:8px}
.rebost-page .collections button[aria-pressed="true"] {color:var(--accent-contrast); background:var(--accent); border-color:var(--accent)}
.rebost-page #collectionHint {color:var(--muted); font-size:14px; line-height:1.6}
.rebost-page .filters {display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:16px}
.rebost-page .filters label {min-width:0; margin:0}
.rebost-page select {width:100%; min-height:46px; border:1px solid var(--line); padding:9px 11px; color:var(--ink); background:var(--panel); font:inherit}
.rebost-page #uploadArea {display:grid; gap:14px}
.rebost-page #uploadArea > label {max-width:360px; margin:0}
.rebost-page #drop {padding:24px; border:2px dashed var(--accent); border-radius:16px; text-align:center; background:var(--soft); cursor:pointer}
.rebost-page #drop.drag {border-style:solid; background:var(--tint)}
.rebost-page #formats {margin-top:8px; color:var(--muted); font-size:13px}
.rebost-page #empty {padding:24px; border:1px dashed var(--line); border-radius:16px; color:var(--muted); text-align:center}
.rebost-page #grid {display:grid; grid-template-columns:repeat(auto-fill,minmax(245px,1fr)); gap:18px; align-items:start}
.rebost-page #grid article, .rebost-page .family-costume {display:flex; flex-direction:column; min-width:0; gap:10px; padding:18px; border:1px solid var(--line); border-radius:18px; background:var(--panel); box-shadow:0 3px 12px rgba(var(--shadow-rgb),.025)}
.rebost-page #grid .image {display:block; width:100%; height:170px; padding:0; overflow:hidden; border:1px solid var(--line); border-radius:12px; background:repeating-conic-gradient(var(--line) 0% 25%,var(--panel) 0% 50%) 0/20px 20px}
.rebost-page #grid img {width:100%; height:100%; object-fit:contain}
.rebost-page #grid input, .rebost-page #grid select {width:100%; max-width:100%}
.rebost-page #grid label {margin:0}
.rebost-page #grid h2 {font-size:18px; letter-spacing:-.025em; overflow-wrap:anywhere}
.rebost-page #grid .actions {margin:0; gap:8px}
.rebost-page #grid .actions button {font-size:13px; padding:9px 12px}
.rebost-page .credit, .rebost-page #grid small {font-size:12px; line-height:1.6; color:var(--muted); overflow-wrap:anywhere}
.rebost-page #more {margin-top:20px}
.rebost-page #preview {max-width:95vw; max-height:90vh; padding:18px; border:1px solid var(--line); border-radius:18px; color:var(--ink); background:var(--panel)}
.rebost-page #preview::backdrop {background:rgb(10 30 24 / 60%)}
.rebost-page #previewImage {display:block; max-width:85vw; max-height:70vh; margin-top:14px; object-fit:contain; background:repeating-conic-gradient(var(--line) 0% 25%,var(--panel) 0% 50%) 0/20px 20px}
.rebost-page #grid > .expanded-family {grid-column:1 / -1}
.rebost-page .family-variants {display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:14px; padding-top:14px; border-top:1px solid var(--line)}
.rebost-page .family-costume {padding:12px; box-shadow:none; background:var(--panel-muted)}
.rebost-page .family-costume .image {height:110px!important}
/* Embedded selectors retain the same controls in a compact layout. */
.rebost-page.picking .topbar {padding:8px 16px; justify-content:flex-end}
.rebost-page.picking .rebost-layout {padding:12px 16px; gap:12px}
.rebost-page.picking .role-heading {display:none}
.rebost-page.picking #mine {font-size:18px}
.rebost-page.picking .library-toolbar {padding:12px; gap:10px; margin-bottom:12px}
.rebost-page.picking #grid {grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:12px}
.rebost-page.picking #grid article {padding:12px}
.rebost-page.picking #grid .image {height:130px}
@media (max-width:540px) {
  .rebost-page .filters {grid-template-columns:1fr}
  .rebost-page #grid {grid-template-columns:1fr}
  .rebost-page #access .button-link {width:100%}
}