/* Revision 8: dark glass, harmonious colour and light along the upper edge.
   This sheet owns the current palette; typography and geometry stay in refinement.css. */
:root {
  --bg: #090a0d;
  --surface: #17181d;
  --surface-2: #24262e;
  --ink: #f4f2f0;
  --muted: #b4b4bf;
  --subtle: #9496a3;
  --line: #ffffff17;
  --glass-line: #ffffff20;
  --accent: #409aa6;
  --on-accent: #f5fbff;
  --cyan: #328d9b;
  --mint: #328d9b;
  --rose: #aa5b7f;
  --amber: #de962b;
  --violet: #8063bd;
  --coral: #c46d47;
  --action-fill: linear-gradient(155deg, #286b7c, #1c3f52);
  --action-line: #7bb6c35c;
  --smoked-glass: linear-gradient(145deg, #25263291, #13141acc 66%);
}

/* Light enters from the upper edge and recedes into black behind the feed. */
.app { --light-one: #28535b; --light-two: #3d325c; background: var(--bg); color: var(--ink); }
.app .ambient-lights i { filter: blur(32px); }
.app .ambient-lights i:nth-child(1),
.app[data-scene] .ambient-lights i:nth-child(1) {
  width: 570px; height: 450px; top: -205px; left: -240px;
  background: radial-gradient(ellipse at center, var(--light-one), transparent 68%);
  opacity: .8;
}
.app .ambient-lights i:nth-child(2),
.app[data-scene] .ambient-lights i:nth-child(2) {
  width: 470px; height: 430px; top: -245px; right: -215px;
  background: radial-gradient(ellipse at center, var(--light-two), transparent 68%);
  opacity: .7;
}
.app .ambient-lights i:nth-child(3) { display: none; }
.app[data-scene=home] { --light-one: #316a61; --light-two: #80502d; }
.app[data-scene=explore], .app[data-scene=rate-search] { --light-one: #365e87; --light-two: #3d6665; }
.app[data-scene=community], .app[data-scene=post], .app[data-scene=compose] { --light-one: #55447c; --light-two: #85434c; --action-fill: linear-gradient(155deg, #665294, #38305f); --action-line: #aa92d266; }
.app[data-scene=preferences], .app[data-scene=tastes] { --light-one: #2f6967; --light-two: #4c4378; }
.app[data-scene=rating] { --light-one: #684c78; --light-two: #7b4e2b; --action-fill: linear-gradient(155deg, #785688, #473459); --action-line: #bc93cb5c; }
.app[data-scene=progress] { --light-one: #2b6969; --light-two: #3c4b75; }
.app[data-scene=profile] { --light-one: #31495b; --light-two: #65513a; }

/* Smoked, colourless glass lets official posters carry their own colour. */
.icon-btn, .secondary-btn, .glass-button, .tabs button, .chip,
.cinema-card, .shared-panel, .availability-panel, .post, .library-summary,
.provider, .club-card, .private-panel, .file-row, .info-box, .match-row,
.import-counts>div, .library-row, .rate-work-result, .release-item,
.social-compose-entry, .add-review-toggle, .story-note-card {
  background: var(--smoked-glass);
  border-color: var(--glass-line);
  box-shadow: inset 0 1px 0 #ffffff0c, inset 0 -1px 0 #00000036;
  backdrop-filter: blur(16px) saturate(1.08);
  -webkit-backdrop-filter: blur(16px) saturate(1.08);
}
.post, .cinema-card { background: linear-gradient(145deg, #20212a80, #111113c9 58%); }
.post-work, .film-review, .spoiler, .privacy-note, .status-tile {
  background: #ffffff04; border-color: #ffffff13;
}
.cinema-visual, .poster-open img, .library-row img, .post-work img,
.identity-poster, .post-image, .compose-image { background-color: #0c0b0d; }
.availability-icon, .provider-logo { background: #ffffff07; color: #c8c7d1; }
.public-provider { background: var(--smoked-glass); }
.public-provider .provider-logo { background: #244f6265; color: #a4c7d5; }

/* Selected tags share a petrol family; action colours follow a small, coherent palette. */
.primary-btn, .app[data-scene] .primary-btn, .discussion-send, .message-input .icon-btn {
  background: var(--action-fill); color: var(--on-accent);
  border: 1px solid var(--action-line);
  box-shadow: inset 0 1px 0 #d1e1ff26, inset 0 -1px 0 #0003, 0 5px 16px #0003;
}
.secondary-btn, .glass-button, .outline-btn { color: var(--ink); }
.tabs button, .chip { color: var(--muted); }
.tabs button[aria-selected=true], .chip[aria-pressed=true],
.format-options [data-format][aria-pressed=true] {
  background: linear-gradient(145deg, #254f6280, #192e3dba);
  border-color: #709cba63; color: #ecf4ff;
  box-shadow: inset 0 1px 0 #9bc7e51c;
}
.format-options [data-format], .genre-choice { --tone: #328d9b !important; }
.format-options [data-format] { color: var(--muted); background: #ffffff04; }
.format-options [data-format][aria-pressed=true]:before { background: #6dafbf; }
.genre-choice { background: linear-gradient(145deg, #1d222c9e, #121113b8); border-color: #ffffff1b; }
.genre-choice>svg { color: #99aebc; }
.genre-choice>span:not(.genre-check) { color: #bdc6cf; }
.genre-choice.selected {
  background: radial-gradient(ellipse at 0 0, #28768b66, transparent 90%), #14252c;
  border-color: #579ca96e; box-shadow: inset 0 1px 0 #a4dce82e;
}
.genre-choice.selected .genre-check { background: #276c80; border-color: #71a6bc; color: #fff; }
.text-btn, .source-btn, .home-calendar-link button, .accent-text,
.discussion-reply, .discussion-thread-link { color: #a8c5d9; }
.tag, .badge:not(.confirmed) { background: #ffffff08; color: #c1bec8; }
.save-image.saved, .cinema-visual .save-image.saved {
  background: #234858e6; color: #eef8ff; border-color: #76a6be78;
}
.switch[aria-checked=true] { background: linear-gradient(135deg, #2c7889, #214655); }
.switch[aria-checked=true]:before { background: #edf8ff; }
.image-tag { background: #1713159c; color: #f4eeea; }
.detail-status.is-seen .status-tile, .image-tag.seen-tag, .badge.confirmed {
  background: linear-gradient(145deg, #56351de6, #271b12ed);
  color: #e8b66d; border-color: #ae794242;
}
.detail-status.is-seen h2, .library-row.is-complete .library-main p { color: #e8b66d; }
.availability-panel .badge { background: #38271b; color: #e8b66d; }
.success-mark { background: #63371f55; color: #e8b66d; }
.library-row>.icon-btn:disabled { color: #e8b66d; }
.progress-track>span { background: linear-gradient(90deg, #378494, #75a9bd); }

/* The compact dock keeps the blurred content beneath it, with restrained reflections. */
.bottom-nav {
  background: linear-gradient(135deg, #60657636, #171719cf 48%, #252b3b9c);
  border-color: #ffffff2b;
  box-shadow: inset 0 1px 0 #ffffff29, inset 0 -1px 0 #0004, 0 9px 24px #0006;
  backdrop-filter: blur(24px) saturate(1.12);
  -webkit-backdrop-filter: blur(24px) saturate(1.12);
}
.bottom-nav button, .bottom-nav button[aria-current=page] { color: #f5f1ed; }
.bottom-nav button[aria-current=page] { background: #ffffff12; box-shadow: inset 0 1px 0 #ffffff1c; }
.bottom-nav .create-icon {
  background: var(--action-fill); color: #f1f8ff; border-color: #8db3d266;
  box-shadow: inset 0 1px 0 #d5e6ff30, 0 2px 8px #0004;
}
.avatar, .avatar.camille, .avatar.lina, .avatar.noe, .avatar.adele,
.own-story .avatar { background: linear-gradient(150deg, #394151, #1b202a); color: #e2e7f0; border-color: #14151b; }
.profile-title>.avatar { border-color: var(--bg); }

/* Story outlines link petrol, iris and muted coral within one moving border. */
.story-ring:before { background: conic-gradient(from 0deg, #31778b, #7964bc, #bc7589, #89b5b9, #31778b); }
.story-ring:after { background: #0e1016; }
.story-more { background: linear-gradient(145deg, #66518c, #292845); color: #fff1e7; border-color: #9c8bbc66; box-shadow: 0 0 0 2px #0e1016; }
.story-reader { background: #09090b; }
.story-reader:after { background: linear-gradient(180deg, #09090b90, #09090bf0 95%); }
.story-segments>span i { background: #e6e2f0; }
.star-base { fill: #91878240; }
.premium-value, .rating-small, .post-head .rating-small,
.small-score-star>span, .story-score strong { color: #de962b; }

/* Completion is a white check on petrol glass. */
#app .episode .episode-check { color: #b9bcc9; background: #ffffff07; border-color: #ffffff20; }
#app .episode .episode-check.done { background: linear-gradient(145deg, #2b6374e0, #1e3d4ce8); color: #fff; border-color: #80aebe73; box-shadow: inset 0 1px 0 #c0e0f026; }
#app .episode .episode-check.done .heroicon { color: #fff; }
#app .episode:has(.episode-check.done) .episode-copy p { color: #b5ccd5; }
.progress-editor { background: radial-gradient(ellipse at 0 0, #2f738145, transparent 78%), linear-gradient(145deg, #172a32, #11151c); border-color: #739fb63d; box-shadow: inset 0 1px 0 #b3dce721; }
.progress-picker>button { color: #9cabbf; }
.progress-picker>button[aria-selected=true] { background: linear-gradient(145deg, #34778d50, #243c5280); border-color: #78b2ca75; color: #f0f8ff; box-shadow: inset 0 1px 0 #b7dfea26, 0 7px 24px #0003; }
#app .progress-kicker, #app .progress-instruction, #app .progress-editor h1 small,
#app .scrubber-ends, #app .manual-progress, .manual-progress-field { color: #b0c2d0; }
.progress-scrubber input::-webkit-slider-runnable-track { background: linear-gradient(90deg, #76b3c2 var(--completion,0%), #2b3d4c var(--completion,0%)); }
.progress-scrubber input::-moz-range-track { background: #2b3d4c; }
.progress-scrubber input::-moz-range-progress { background: #76b3c2; }
.progress-scrubber input::-webkit-slider-thumb { background: linear-gradient(145deg, #83bbcc, #47758c); border-color: #a2cbd8; box-shadow: inset 0 1px 0 #daeff93d, 0 3px 12px #0005; }
.progress-scrubber input::-moz-range-thumb { background: #6699ad; border-color: #a2cbd8; }

/* Neutral copy remains readable over coloured edge light. */
#app p { color: var(--muted); }
#app :is(.muted,.small,.person-context,.post-work p,.story-name,.discovery-heading span,
  .form-label,.field-note,.genre-selection-count,.profile-identity .small,.profile-links,
  .rate-search-caption,.rate-work-result small,.release-results,.release-demo-label,
  .release-item-main p,.public-import-steps,.source-candidates p,.rating-privacy,
  .star-help,.clear-stars,.post-kind,.social-compose-entry small,.add-review-toggle small,.story-author small,
  .story-gesture-hint,.premium-value>span,.story-score strong span,.privacy-note,
  .work-identity>div>span,.detail-bar>span,.toggle-line p,.compose-intro,
  .story-demo,.asset-credit,.next-progress,.result-summary,.release-item-main p,
  .public-import-form .info-box) { color: var(--muted); }
#app :is(.post-text,.work-synopsis p,.profile-info>p,.story-review,.social-compose-entry>span:not(.avatar),.add-review-toggle>span) { color: #dedee5; }
#app :is(.screen-heading h1,.rating-experience h1,.story-author strong) { color: var(--ink); }
#app :is(.post-actions button,.post-actions button svg,.library-summary svg,.rate-work-result>svg,.social-compose-entry>svg,.add-review-toggle>svg) { color: #adb2c3; }
#app :is(.post-actions button.active,.post-actions button.active svg,.release-item-main small) { color: #a99ad0; }
.social-compose-entry { background: linear-gradient(135deg, #493b7230, #191b25b3 70%); }
.story-note-card>p:first-child, .manual-progress-field input { color: #bbc3cf; }
.input, .select, .review-textarea { color: var(--ink); background-color: #ffffff04; border-color: #ffffff20; }
.input::placeholder, .review-textarea::placeholder, .compose-text::placeholder { color: #a1a5b3; }
.select option { background: #191c25; }
.select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23bfb2a8'%3E%3Cpath fill-rule='evenodd' d='M12.53 16.28a.75.75 0 0 1-1.06 0l-7.5-7.5a.75.75 0 0 1 1.06-1.06L12 14.69l6.97-6.97a.75.75 0 0 1 1.06 1.06l-7.5 7.5Z' clip-rule='evenodd'/%3E%3C/svg%3E"); }
.searchbox, .rate-searchbox { background: #ffffff04; border-color: #ffffff20; }
.rate-searchbox:focus-within, .searchbox:focus-within { border-color: #7baabd; box-shadow: 0 0 0 3px #409aa61a; }
.sticky-action, .discussion-composer, .message-input { background: #0e1016ee; border-color: #ffffff13; }
.bubble { background: #232531; }
.bubble.mine { background: #283e51; color: #eaf2fa; }
.notification-row .notification-icon { background: #3c4e7c30; color: #ada4d1; }
.toast, #sheet { background: #1b1d28; color: var(--ink); border-color: #798cb82e; }
.toast { box-shadow: 0 8px 25px #0007; }
.discussion-composer textarea { background: #ffffff05; caret-color: var(--accent); }
.discussion-comment.is-reply-target .discussion-comment-heading h3 { text-decoration-color: var(--accent); }
#app :focus-visible, #sheet :focus-visible { outline-color: #92b8d3; }
input, textarea { caret-color: var(--accent); }
::selection { background: #405b78; color: #fff; }
.app-main { scrollbar-color: #46566d transparent; }
.app-main::-webkit-scrollbar-thumb { background: #46566d; }

/* The review frame stays neutral and visually separate from the product. */
.mobile-canvas { border-color: #ffffff26; }
.mobile-demo { background: #14151b; color: #aeb2bf; }
.review-header { background: #111012; }
.prototype-dot, .swatch { background: var(--accent); }
.flow-btn.is-active svg, .flow-steps button.current { color: #abbcda; }
.flow-btn.is-active, .state-options button[aria-pressed=true] { background: #293449; color: #d6e0f1; }
.flow-steps button.current { border-color: #7d9abd; }

@media (prefers-reduced-motion: reduce) {
  .app .ambient-lights i { animation: none; filter: blur(28px); will-change: auto; }
}
@media (prefers-reduced-transparency: reduce) {
  .app { background: #09090b; }
  .app .ambient-lights { display: none; }
  .post, .cinema-card, .social-compose-entry, .progress-editor, .bottom-nav,
  .icon-btn, .secondary-btn, .glass-button, .shared-panel, .availability-panel,
  .provider, .library-summary, .add-review-toggle, .discussion-composer {
    background: #171a23; backdrop-filter: none; -webkit-backdrop-filter: none;
  }
}