.hub-form { display:grid; gap:1rem; max-width:680px; margin:1.5rem 0; }
.hub-form label { display:grid; gap:.35rem; }
.hub-form input:not([type=checkbox]), .hub-form select, .hub-form textarea { width:100%; padding:.65rem; font:inherit; color:inherit; border:1px solid #777b48; background:#fff; }
.hub-form textarea { min-height:6rem; resize:vertical; }
.hub-form .hub-confirm { display:flex; align-items:baseline; gap:.5rem; }
.hub-form button { justify-self:start; }
.hub-cover { width:min(100%,320px); aspect-ratio:1; object-fit:cover; }
.prose dd { overflow-wrap:anywhere; }
.hub-links { display: flex; flex-wrap: wrap; align-items: center; gap: .85rem 1.25rem; margin: 1rem 0; }

.hub-pricing-intro { max-width: 62ch; }
.hub-pricing-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: 18px;
  margin: 28px 0 48px;
}
.hub-pricing-card {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: clamp(20px, 3vw, 32px);
  border: 1px solid #362d2a40;
  border-radius: 18px;
  background: #f7e7df;
  color: #28201f;
  text-decoration: none;
  transition: border-color .18s ease, box-shadow .18s ease;
}
.hub-pricing-labels { background: #e6ebe5; }
.hub-pricing-promotion { background: #f5ead2; }
.hub-pricing-card:hover, .hub-pricing-card:focus-visible {
  border-color: var(--red);
  box-shadow: 0 7px 20px #362d2a22;
}
.hub-pricing-card h2, .hub-pricing-card p { margin: 0; }
.hub-pricing-card h2 { font-size: clamp(1.55rem, 2.6vw, 2.15rem); }
.hub-pricing-card p { flex: 1; }
.hub-pricing-label { font-size: .78rem; font-weight: 700; }
.hub-pricing-card strong { font-size: 1.35rem; }
.hub-pricing-cta {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: .45em;
  padding: .55em .85em;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-weight: 700;
  font-size: .9rem;
}

.hub-price { font-size: 1.5rem; font-weight: 700; }
.hub-pricing-detail { background: #faf6ee; }
.hub-pricing-detail strong { margin-top: auto; }

.hub-plan-summary {
  padding: 1rem 1.25rem;
  border-left: 4px solid var(--red);
  border-radius: 0 10px 10px 0;
  background: #f8e6db;
  font-size: clamp(1.05rem, 2vw, 1.2rem);
  font-weight: 700;
}
.hub-auth {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 330px), 1fr));
  align-items: stretch;
  grid-auto-rows: 1fr;
  gap: 18px;
  max-width: 920px;
}
.hub-auth section, .hub-submit-form {
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: clamp(18px, 3vw, 30px);
  background: #faf6ee;
}
.hub-auth > section {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.hub-auth > section > .button {
  align-self: flex-start;
  margin-top: auto;
  width: min(100%, 14rem);
  text-align: center;
}
.hub-auth .hub-form { margin-bottom: 0; }
.hub-form input:not([type="checkbox"]), .hub-form select, .hub-form textarea { border-radius: 8px; min-width: 0; }
.hub-submit-form { max-width: 920px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hub-submit-form label:has(textarea), .hub-submit-form .hub-confirm { grid-column: 1 / -1; }
.hub-submit-form > .button { justify-self: start; }
@media(max-width:600px) {
  .hub-submit-form { grid-template-columns: minmax(0, 1fr); }
}
.hub-access-form {
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: clamp(18px, 3vw, 30px);
  background: #faf6ee;
}
.hub-access-form > .button { justify-self: start; }
.hub-access-link { text-decoration: underline; font-weight: 700; }

.hub-form .hub-genre {
  appearance: none;
  padding-right: 2.4rem;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23777b48' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") right .7rem center / 1rem no-repeat;
}
.hub-form .hub-genre:focus-visible { outline: 2px solid #777b48; outline-offset: 2px; }

.hub-genre-field { min-width: 0; display: grid; gap: .35rem; align-content: start; }
.hub-genre-field select[hidden] { display: none; }
.hub-genre-picker { position: relative; min-width: 0; }
.hub-genre-picker summary {
  list-style: none; cursor: pointer; border: 1px solid #777b48;
  border-radius: 8px; padding: .65rem .85rem; background: #fff;
  display: flex; align-items: center; justify-content: space-between; gap: .75rem;
}
.hub-genre-picker summary::-webkit-details-marker { display: none; }
.hub-genre-picker summary::after {
  content: ""; width: .45rem; height: .45rem; flex-shrink: 0;
  border: solid #777b48; border-width: 0 1.5px 1.5px 0; transform: rotate(45deg);
}
.hub-genre-picker[open] summary::after { transform: rotate(225deg); }
.hub-genre-options {
  position: absolute; inset: calc(100% + .35rem) 0 auto; z-index: 10;
  max-height: min(17rem, 45vh); overflow-y: auto; overscroll-behavior: contain;
  border: 1px solid #777b48; border-radius: 10px; padding: .3rem;
  background: #fff; box-shadow: 0 8px 24px #332e1826;
}
.hub-genre-options button {
  display: block; width: 100%; min-height: 44px; padding: .5rem .75rem;
  border: 0; border-radius: 6px; background: transparent; text-align: left;
  color: inherit; font: inherit; cursor: pointer;
}
.hub-genre-options button:hover,
.hub-genre-options button[aria-pressed="true"] { background: #eeeedf; }
.hub-genre-picker summary:focus-visible,
.hub-genre-options button:focus-visible { outline: 2px solid #777b48; outline-offset: -2px; }
 .hub-upload-box { position: relative; display: flex; align-items: center; gap: .65rem; min-width: 0; padding: .55rem; border: 1px dashed #777b48; border-radius: 8px; background: #faf9f3; }
.hub-upload-action { flex: none; padding: .65rem .85rem; border-radius: 6px; background: #555936; color: #fff; font-weight: 600; }
.hub-upload-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .9rem; }
.hub-form .hub-upload-box.is-enhanced input.hub-upload { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; opacity: 0; cursor: pointer; }
.hub-upload-box:focus-within { outline: 2px solid #777b48; outline-offset: 2px; }
.hub-upload-box:not(.is-enhanced) { display: block; }
.hub-upload-box:not(.is-enhanced) > span { display: none; }

.hub-form { gap: .7rem .9rem; margin-block: 1rem; align-items: start; }
.hub-form label { align-content: start; min-width: 0; gap: .25rem; }
.hub-form .hub-genre-field { gap: .25rem; }
.hub-form input[type="date"],
.hub-genre-picker summary {
  box-sizing: border-box; height: 44px; min-height: 44px;
}
.hub-form input[type="date"] { display: block; max-width: 100%; padding: .45rem .65rem; }
.hub-form input[type="date"]::-webkit-date-and-time-value { text-align: left; }
.hub-submit-form { padding: clamp(.85rem, 2vw, 1.25rem); }
.hub-submit-form .hub-profile-field { grid-column: 1 / -1; }
.hub-submit-form label small { line-height: 1.35; }
.hub-genre-picker summary[aria-disabled="true"] { opacity: .6; cursor: default; }
.hub-genre-options button:disabled { opacity: .5; cursor: default; }
.hub-links > .hub-genre-field { min-width: 10rem; }

.hub-submit-contact {
  grid-column: 1 / -1; min-width: 0; margin: 0; padding: .65rem .85rem .85rem;
  border: 1px solid #d5cbb9; border-radius: 12px; background: #f5f0e5;
}
.hub-submit-contact legend { padding-inline: .4rem; color: #555936; font-weight: 700; }
.hub-submit-contact-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem .9rem; }
.hub-submit-contact-fields label, .hub-submit-story > span { font-weight: 700; }
.hub-submit-contact-fields input { font-weight: 400; }
.hub-submit-story { grid-column: 1 / -1; padding-block: .35rem .15rem; }
.hub-submit-story small { font-weight: 400; color: #555936; }
.hub-submit-story textarea { min-height: 7rem; }
@media (max-width: 620px) {
  .hub-submit-contact-fields { grid-template-columns: minmax(0, 1fr); }
}

.hub-submit-card-stack { display: grid; gap: .7rem; min-width: 0; }
.hub-submit-form .hub-submit-contact label,
.hub-submit-form .hub-submit-contact .hub-genre-field { font-weight: 700; }
.hub-submit-form .hub-submit-contact :is(input, textarea, select, summary, small, .hub-upload-name, .hub-genre-options button) { font-weight: 400; }
.hub-submit-form .hub-submit-contact small { color: #555936; }
.hub-submit-card-stack .hub-submit-story { padding: 0; }

.hub-admin-tabs { display:flex; gap:.5rem; flex-wrap:wrap; margin:1.25rem 0; }
.hub-admin-tabs a { padding:.55rem .9rem; border:1px solid #777b48; border-radius:8px; }
.hub-admin-tabs a[aria-current="page"] { color:#fff; background:#555936; }
.hub-admin-queue { display:grid; gap:.65rem; }
.hub-admin-request { min-width:0; border:1px solid #d5cbb9; border-radius:12px; background:#f9f5ec; }
.hub-admin-request summary { display:flex; align-items:center; gap:.75rem; padding:.85rem 1rem; cursor:pointer; list-style:none; }
.hub-admin-request summary::-webkit-details-marker { display:none; }
.hub-admin-request summary::after { content:""; flex:none; width:.45rem; height:.45rem; border:solid #555936; border-width:0 2px 2px 0; transform:rotate(45deg); }
.hub-admin-request[open] summary::after { transform:rotate(225deg); }
.hub-admin-request-title { flex:1; display:grid; gap:.1rem; min-width:0; overflow-wrap:anywhere; }
.hub-admin-request-title small,.hub-admin-status { color:#555936; }
.hub-admin-status { padding:.25rem .55rem; border-radius:20px; background:#e9e9d9; font-size:.82rem; }
.hub-admin-request-body { border-top:1px solid #d5cbb9; padding:.8rem 1rem; overflow-wrap:anywhere; }
.hub-admin-request-body dl { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%, 13rem),1fr)); gap:.65rem; }
.hub-admin-request-body dl > div { background:#fffdf7; padding:.6rem .75rem; border-radius:8px; }
.hub-admin-request-body dl > div:nth-child(n+5) { grid-column:1 / -1; }
.hub-admin-request-body dt { font-weight:700; }
.hub-admin-request-body dd { margin:0; }
.hub-admin-decision { padding:.8rem; border:1px solid #d5cbb9; border-radius:10px; }
.hub-admin-decision .hub-admin-reject { background:#fffdf7; color:#a63826; border:1px solid currentColor; }

.hub-release-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,17rem),1fr)); gap:.85rem; }
.hub-release-tile { display:grid; grid-template-columns:4.5rem minmax(0,1fr); gap:.8rem; align-items:center; padding:.75rem; border:1px solid #d5cbb9; border-radius:12px; background:#fffdf7; }
.hub-release-thumb { display:grid; place-items:center; aspect-ratio:1; overflow:hidden; border-radius:8px; background:#e9e9d9; color:#555936; }
.hub-release-thumb img { width:100%; height:100%; object-fit:cover; }
.hub-release-tile h3,.hub-release-tile p { margin:0 0 .25rem; overflow-wrap:anywhere; }
.hub-release-tile h3 { font-size:1.05rem; }
.hub-release-chip { display:inline-block; padding:.2rem .55rem; border-radius:20px; background:#e9e9d9; color:#41452a; font-size:.8rem; font-weight:700; }
.hub-release-page { display:grid; gap:1rem; max-width:920px; margin-inline:auto; }
.hub-release-page > section,.hub-release-hero { padding:clamp(1rem,3vw,2rem); border:1px solid #d5cbb9; border-radius:16px; background:#fffdf7; min-width:0; }
.hub-release-hero { display:flex; flex-wrap:wrap; gap:clamp(1rem,4vw,2.3rem); align-items:center; background:#f5f0e5; }
.hub-release-hero .hub-cover { width:min(100%,15rem); height:auto; margin:0; border-radius:12px; }
.hub-release-intro { min-width:0; overflow-wrap:anywhere; }
.hub-release-intro h1 { margin:.35rem 0; }
.hub-release-page > section h2 { margin-top:0; }
.hub-release-player { display:block; width:100%; max-width:620px; height:244px; border:0; border-radius:8px; margin-bottom:.75rem; }

.hub-release-meta { color:#666052; font-size:.86rem; font-weight:400; }
.hub-share-previews { display:flex; flex-wrap:wrap; gap:1rem; align-items:start; margin:1rem 0; }
.hub-share-previews figure { margin:0; max-width:100%; min-width:0; }
.hub-share-previews figcaption { font-size:.82rem; color:#666052; margin-bottom:.4rem; }
.hub-share-preview { box-sizing:border-box; max-width:100%; border:1px solid #d5cbb9; border-radius:10px; background:#f5f0e5; overflow:hidden; overflow-wrap:anywhere; }
.hub-share-preview > div { padding:.7rem; min-width:0; }
.hub-share-preview strong { display:block; font-size:.95rem; }
.hub-share-preview p,.hub-share-preview small { font-size:.8rem; margin:.3rem 0 0; color:#555936; }
.hub-share-compact { width:360px; display:flex; align-items:start; justify-content:space-between; }
.hub-share-compact img { width:72px; height:72px; object-fit:cover; border-radius:6px; margin:.65rem .65rem .65rem 0; }
.hub-share-wide { width:480px; }
.hub-share-wide img { width:100%; aspect-ratio:1.91; object-fit:contain; background:#e9e9d9; display:block; }
.hub-rich-field { min-width:0; grid-column:1 / -1; }
.hub-rich-tools { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; margin-top:.35rem; }
.hub-rich-tools button { padding:.25rem .6rem; border-radius:6px; border:1px solid #777b48; background:#fffdf7; color:#41452a; font:inherit; font-size:.82rem; font-weight:700; }
.hub-rich-tools small { color:#666052; }
.hub-artist-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr)); gap:.75rem; }
.hub-artist-tile { display:flex; align-items:center; gap:.65rem; padding:.65rem; min-width:0; overflow-wrap:anywhere; border:1px solid #d5cbb9; border-radius:10px; background:#fffdf7; }
.hub-artist-tile:hover { border-color:#777b48; }
.hub-artist-tile small { display:block; color:#666052; font-size:.78rem; }
.hub-artist-avatar { flex:none; width:44px; height:44px; display:grid; place-items:center; overflow:hidden; border-radius:8px; background:#e9e9d9; color:#41452a; font-weight:700; }
.hub-artist-avatar img { width:100%; height:100%; object-fit:cover; }

.hub-catalog-genre { margin:-.4rem 0 1.15rem; color:#555936; font-size:clamp(1.05rem,2.2vw,1.4rem); font-weight:600; }

.hub-share-compact { box-sizing:border-box; display:grid; grid-template-columns:minmax(0,1fr) 76px; align-items:center; gap:.65rem; height:104px; padding:.7rem; }
.hub-share-compact > div { padding:0; }
.hub-share-compact img { width:76px; height:76px; margin:0; object-fit:cover; }
.hub-share-copy { min-width:0; }
.hub-share-copy strong,.hub-share-copy p { display:-webkit-box; -webkit-box-orient:vertical; overflow:hidden; line-height:1.25; }
.hub-share-copy strong { -webkit-line-clamp:1; line-clamp:1; }
.hub-share-copy p { -webkit-line-clamp:2; line-clamp:2; max-height:2.5em; }
.hub-share-wide img { aspect-ratio:1200 / 630; object-fit:contain; }
.hub-share-wide > div { min-height:84px; box-sizing:border-box; }

.hub-feedback { max-width:760px; margin-inline:auto; }
.hub-feedback header { padding:clamp(1rem,4vw,2rem); background:#e9e9d9; border:1px solid #c9c9ba; border-radius:15px; }
.hub-feedback header h1 { font-size:clamp(2rem,5vw,3.4rem); margin:.35rem 0 .7rem; }
.hub-feedback header p { margin:0; max-width:56ch; }
.hub-feedback-form { max-width:none; background:#fffdf7; padding:clamp(1rem,3vw,1.6rem); border:1px solid #d5cbb9; border-radius:14px; gap:1rem; }
.hub-feedback-form label,.hub-feedback-form .hub-genre-field { font-weight:700; }
.hub-feedback-form :is(input,select,textarea,summary,small,.hub-genre-options button) { font-weight:400; }
.hub-feedback-form small { color:#555936; }
.hub-feedback-contact { display:grid; gap:.85rem; grid-template-columns:repeat(2,minmax(0,1fr)); }
footer > .hub-footer-menu { flex:0 1 auto; min-width:0; max-width:100%; display:grid; gap:.65rem; }
.hub-footer-links { display:flex; flex-wrap:wrap; gap:.4rem 1rem; justify-content:flex-end; }
.hub-footer-links a { font-size:13px; padding:.2rem 0; }
.hub-footer-feedback-row { display:flex; justify-content:flex-end; margin:0; }
@media(max-width:700px) {
  footer > div:first-child, footer > .hub-footer-menu { flex:0 0 100%; min-width:0; }
  .hub-footer-links,.hub-footer-feedback-row { justify-content:flex-start; }
}
.hub-footer-feedback { display:inline-block; text-align:center; padding:.6rem .85rem; border-radius:8px; background:#555936; color:#fff; font-weight:700; }
@media(max-width:560px){.hub-feedback-contact{grid-template-columns:1fr;}}

.hub-week-releases .hub-release-grid { grid-template-columns:repeat(auto-fill,minmax(min(100%,29rem),1fr)); gap:1rem; }
.hub-week-releases .hub-release-tile { grid-template-columns:clamp(5.5rem,18vw,9rem) minmax(0,1fr); gap:clamp(.75rem,2vw,1.2rem); padding:clamp(.75rem,2vw,1.2rem); }
.hub-week-releases .hub-release-tile h3 { font-size:clamp(1.2rem,2.6vw,1.75rem); line-height:1.18; }
.hub-week-releases .hub-release-tile p { margin-block:.35rem .5rem; }
