@font-face{font-family:Manrope;src:url(assets/Manrope.ttf) format("truetype");font-weight:200 800;font-display:swap}
:root{font-family:Manrope,system-ui,sans-serif;background:#090a13;color:#f5f3ff;--muted:#b1adc5;--accent:#c4abff;--border:#343047;--panel:#161526;--soft:#201c34}
*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit;color:inherit}a{color:inherit;text-decoration:none}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button,select{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid #ccb6ff;outline-offset:3px}[hidden]{display:none!important}.wrap{width:min(1240px,calc(100% - 96px));margin-inline:auto}.top{border-bottom:1px solid #ffffff16;background:#0b0b15}.top-inner{height:72px;display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{display:flex;align-items:center;gap:5px;font-weight:800;font-size:23px;letter-spacing:-1px}.mark{position:relative;color:var(--accent);border:1px solid #6a548c;border-radius:11px;display:grid;place-items:center;width:34px;height:34px;margin-right:6px;font-size:22px}.mark sup{position:absolute;right:2px;top:0;font-size:9px}.accent{color:var(--accent)}.top-note{font-size:11px;color:#d3c9e7;letter-spacing:.04em;border:1px solid var(--border);padding:7px 11px;border-radius:30px;white-space:nowrap}.top-note i,.eyebrow i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#bc93ff;margin-right:7px}
.hero{position:relative;background:#151523;isolation:isolate;border-bottom:1px solid #ffffff15}.hero:before{content:"";position:absolute;inset:0;z-index:-2;background:#151523}.hero:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#0a0a15 3%,#0a0a15f5 24%,#0a0a15bc 53%,#0a0a151a 100%),linear-gradient(0deg,#090a13 0%,transparent 48%)}.hero-inner{position:relative;padding:62px 0 53px}.hero-content{max-width:660px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:.18em;color:#c9b7ee;margin:0 0 13px}.hero h1{font-size:clamp(46px,6.1vw,90px);font-weight:800;line-height:.99;letter-spacing:-.072em;margin:15px 0 18px}.hero h1 span{color:#c2a9fb}.intro{max-width:455px;font-size:15px;line-height:1.65;color:#ddd6ed;margin:0 0 22px}.modes{display:inline-flex;gap:4px;border:1px solid #564b68;border-radius:13px;background:#12111cde;padding:4px;max-width:100%}.modes a{display:flex;align-items:center;justify-content:center;min-height:42px;padding:0 20px;border-radius:9px;font-size:13px;font-weight:750;white-space:nowrap;color:#cbc3df}.modes a[aria-current]{background:#403052;color:#f4eaff}.modes a:hover{background:#332943;color:#fff}.panel{background:#161526f2;border:1px solid #41374f;border-radius:18px;padding:21px}.solo{margin-top:18px;max-width:477px}.panel label,.panel legend{font-size:13px;font-weight:750}.panel label small{display:block;font-size:11px;margin-top:4px;color:var(--muted)}textarea,input[type=number],select{border:1px solid #454059;background:#10201c00;background-color:#100f1d;border-radius:10px;padding:11px 12px;min-width:0;width:100%;font-size:16px}textarea{display:block;margin-top:8px;line-height:1.45;resize:vertical;min-height:66px}textarea::placeholder{color:#a49bb9}.chips,.checks{display:flex;flex-wrap:wrap;gap:7px}.chips{margin:11px 0}.chips button,.add,.checks label{border:1px solid #504663;background:#201b31;border-radius:9px;min-height:44px;padding:7px 10px;font-size:12px}.chips button[aria-pressed=true]{background:#493861;border-color:#b596ea;color:#fff}.primary{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;border:1px solid #bd9bea;color:#171022;background:#c2a6f2;border-radius:11px;min-height:49px;padding:9px 14px;font-size:14px;font-weight:800}.primary:hover{background:#d4baff}.primary span{font-size:20px}.panel small,.hint{color:var(--muted);font-size:12px;line-height:1.55}.solo small{display:block;margin-top:9px}
.work{padding-block:34px 48px}.results-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:9px}h2{font-size:clamp(24px,3.1vw,37px);letter-spacing:-.05em;line-height:1.1;margin:0}.result-count{white-space:nowrap;color:var(--accent);font-size:11px;padding:5px 9px;background:#241b35;border-radius:8px}.hint{margin:0 0 16px}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}.card{min-width:0;background:var(--panel);border:1px solid var(--border);border-radius:16px;overflow:hidden}.poster{height:clamp(190px,25vw,330px);position:relative;background:#251c34}.poster img{width:100%;height:100%;display:block;object-fit:cover;object-position:center 24%}.poster:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#100d19b0,transparent 37%);pointer-events:none}.poster span{position:absolute;z-index:1;top:12px;left:12px;border:1px solid #ffffff40;border-radius:7px;background:#151121e8;padding:4px 7px;font-size:10px}.card-body{padding:14px 16px 16px}.card h3{margin:0 0 5px;font-size:19px;letter-spacing:-.04em}.meta{font-size:11px;color:#d2cae5}.card p{color:#d0c7e2;font-size:13px;line-height:1.55;margin:10px 0 0}.card strong{color:var(--accent);font-size:11px;display:block;margin-top:11px}.empty{grid-column:1/-1;background:var(--panel);border:1px solid var(--border);padding:22px;border-radius:15px;color:#e4d9f6}.footer{display:flex;justify-content:space-between;align-items:center;gap:15px;border-top:1px solid var(--border);padding:20px 0 28px;color:var(--muted);font-size:11px}.footer a{font-size:17px;font-weight:800;color:#e7dbf8}
body[data-mode=pair] .hero-inner,body[data-mode=family] .hero-inner{padding-block:44px 36px}body:not([data-mode=solo]) .hero h1{font-size:clamp(42px,5.7vw,74px)}body:not([data-mode=solo]) .work{display:grid;grid-template-columns:minmax(310px,.86fr) minmax(0,1.64fr);gap:24px;align-items:start}body:not([data-mode=solo]) .poster{height:clamp(155px,17vw,240px)}body:not([data-mode=solo]) .cards{gap:10px}body:not([data-mode=solo]) .card-body{padding:12px}.group{display:grid;gap:14px}.group h2{font-size:25px}.group .eyebrow,.group .hint{margin:0}.group select{margin-top:6px}.columns{display:grid;grid-template-columns:1fr 1fr;gap:8px}.columns label{min-width:0}.group fieldset{border:0;padding:0;margin:0;min-width:0}.group legend{margin:0 0 6px;padding:0}.checks label{display:flex;align-items:center;gap:5px;font-weight:600}.checks input{accent-color:#b79ae9;width:16px;height:16px;margin:0}.ages{display:flex;gap:8px;flex-wrap:wrap}.ages input{width:75px}.add{justify-self:start;color:#e0ccff}.add:disabled{opacity:.5}
@media(max-width:1000px){.wrap{width:calc(100% - 48px)}body:not([data-mode=solo]) .work{grid-template-columns:minmax(272px,1fr) minmax(0,1fr)}body:not([data-mode=solo]) .cards{grid-template-columns:1fr}body:not([data-mode=solo]) .card{display:grid;grid-template-columns:92px minmax(0,1fr)}body:not([data-mode=solo]) .poster{height:100%;min-height:140px}}
@media(max-width:650px){.wrap{width:calc(100% - 32px)}.top-inner{height:58px}.brand{font-size:19px}.mark{width:29px;height:29px}.top-note{font-size:10px}.hero-inner,.hero .hero-inner{padding-block:36px 24px}.hero:before{background-position:62% center;opacity:.52}.hero:after{background:linear-gradient(90deg,#0b0a16e8,#0d0b194d),linear-gradient(0deg,#0a0a14 0%,transparent 88%)}.hero h1{font-size:clamp(42px,12vw,65px)}.intro{font-size:13px;margin-bottom:16px}.modes{display:flex}.modes a{flex:1;padding-inline:5px;font-size:12px}.panel{padding:15px}.solo{margin-top:13px}.work{padding-block:23px 33px}.cards,body:not([data-mode=solo]) .cards{grid-template-columns:1fr;gap:10px}.card,body:not([data-mode=solo]) .card{display:grid;grid-template-columns:92px minmax(0,1fr)}.poster,body:not([data-mode=solo]) .poster{height:100%;min-height:142px}.poster span{left:7px;top:7px;font-size:9px}.card-body{padding:11px 12px}.card h3{font-size:17px}.card p{font-size:12px}body:not([data-mode=solo]) .work{display:grid;grid-template-columns:minmax(0,1fr);gap:23px}body[data-mode=pair] .hero-inner,body[data-mode=family] .hero-inner{padding-block:30px 21px}.footer{align-items:flex-start}.footer span:last-child{text-align:right}}

.hero:before{opacity:1;background: radial-gradient(ellipse at 74% 64%,#897eb568 0%,transparent 40%),radial-gradient(ellipse at 82% 75%,#2e375c 0%,transparent 59%),linear-gradient(160deg,#121020,#090b19 75%);background-size:cover}
.hero:after{background:linear-gradient(90deg,#0b0b16 2%,#0b0b16bb 48%,transparent 100%),linear-gradient(0deg,#090a13,transparent 63%)}
.result-actions button,.card-actions button{border:1px solid #544664;background:#211a30;color:#eadcff;border-radius:9px;min-height:44px;padding:7px 12px;font-weight:750}

.viewer-list{display:grid;gap:10px}.viewer{display:grid;gap:8px;padding:12px;border:1px solid #3c344d;border-radius:12px;background:#100f1b}.viewer textarea{margin-top:0}.optional{color:var(--muted);font-size:11px;font-weight:500}.example{font-size:12px;color:var(--muted)}.example .chips{margin:6px 0 0}
.card-actions{display:flex;flex-wrap:wrap;gap:5px;margin-top:12px}.card-actions button{font-size:11px;padding-inline:8px;flex:1 0 auto}.card-actions button[aria-pressed=true]{border-color:#ad8bdf;background:#433256;color:#fff}.result-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.result-actions button{font-size:13px}.result-actions button:disabled{opacity:.48;cursor:default}.action-status:not(:empty){margin-top:12px;margin-bottom:0}.ages>div{display:flex;gap:4px}.ages>div button{min-width:44px}
@media(max-width:650px){.hero:after{background:linear-gradient(90deg,#0b0a16d9,#0b0a164d),linear-gradient(0deg,#090a13,transparent 72%)}.result-actions button{flex:1 1 auto}.card-actions button{font-size:11px}}

/* Cinema edition */
.hero:before{background:#171522 url(assets/cinema-vip-couple.png) right 42%/cover no-repeat;opacity:1}
.hero:after{background:linear-gradient(90deg,#090a14 0%,#090a14d9 32%,#090a143b 68%,#090a141a 100%),linear-gradient(0deg,#090a13,transparent 48%)}
.hero-inner{padding-block:48px 39px}
.card-actions button{flex:1 1 auto;font-size:12px}.watch-button{width:auto}.card-actions .details-button{background:#382946;border-color:#71598a}
.original-cover{display:grid;place-items:center;padding:12px;background:linear-gradient(145deg,#a8a0be,#3b304e 42%,#12101c 83%)}.original-cover b{z-index:1;color:#fff;overflow-wrap:anywhere;font-size:clamp(12px,2.6vw,26px)}
@media(max-width:650px){
 .hero .hero-inner{padding-block:clamp(160px,45vw,210px) 18px}
 .hero:before{background-position:right top;background-size:auto clamp(210px,58vw,300px)}
 .hero:after{background:linear-gradient(180deg,transparent 85px,#151523 225px)}
 .hero h1{margin-bottom:12px}.intro{margin-bottom:12px}.solo{padding:13px}
 .card-actions button{font-size:11px}.result-actions button,.chips button{min-height:44px}
}

/* Film details and viewing preferences */
body:has(dialog[open]) { overflow: hidden; }
#cards > .card:only-child { max-width: 410px; }

#watch, #subscription-settings, #watch-options {
  --dialog-pad: 24px;
  box-sizing: border-box;
  position: fixed;
  width: min(730px, calc(100% - 32px));
  max-height: calc(100dvh - 32px);
  padding: var(--dialog-pad);
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  color: #f5f3ff;
  background: linear-gradient(145deg, #201a30, #151422 55%);
  border: 1px solid #59496d;
  border-radius: 20px;
  box-shadow: 0 22px 90px #0009;
}
#subscription-settings { width: min(460px, calc(100% - 32px)); }
#watch::backdrop, #subscription-settings::backdrop, #watch-options::backdrop { background: #05040bd9; }

#watch button, #watch-options .result-actions a, #subscription-settings button, #watch-options button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 44px;
  padding: 7px 12px;
  border: 1px solid #5d4d73;
  border-radius: 9px;
  background: #251e35;
  color: #f0e4ff;
  font-size: 13px;
  font-weight: 750;
}
#watch button:hover, #watch-options .result-actions a:hover, #subscription-settings button:hover {
  background: #38294b;
}
#watch .dialog-close, #subscription-settings .dialog-close, #watch-options .dialog-close {
  position: sticky;
  top: 0;
  z-index: 2;
  display: grid;
  place-items: center;
  float: right;
  width: 44px;
  padding: 0;
  margin-bottom: -44px;
  background: #211a30;
  font-size: 24px;
  line-height: 1;
}

.film-layout {
  display: grid;
  grid-template-columns: 184px minmax(0, 1fr);
  gap: 22px;
  align-items: start;
}
#detail-poster .poster {
  height: auto;
  min-height: 0;
  aspect-ratio: 2 / 3;
  border-radius: 11px;
  overflow: hidden;
}
#detail-poster img { object-position: center; }
#detail-poster .poster::after { display: none; }
#watch-title, #subscriptions-title {
  padding-right: 51px;
  overflow-wrap: anywhere;
}
#watch-title { font-size: clamp(25px, 4vw, 40px); }
#detail-meta { margin: 8px 0; font-size: 13px; line-height: 1.5; }
#detail-rating {
  display: inline-block;
  margin: 0;
  padding: 4px 8px;
  border-radius: 7px;
  background: #38294b;
  color: #f3deff;
  font-size: 12px;
  font-weight: 750;
}
#detail-description, #detail-reason { font-size: 14px; line-height: 1.5; }
#detail-description { margin: 13px 0; color: #e4def2; }
.film-reason {
  padding: 10px 12px;
  border-left: 2px solid #aa8cde;
  border-radius: 0 9px 9px 0;
  background: #231d32;
}
#watch h3 { margin: 0 0 4px; font-size: 14px; color: #ead9ff; }
#detail-reason { margin: 0; color: #ded5ef; }

.film-commands { margin-top: 19px; padding-top: 14px; border-top: 1px solid #493b59; }
#detail-actions, .film-links { display: flex; flex-wrap: wrap; gap: 6px; }
#watch #detail-actions button { font-weight: 650; }
#watch #detail-actions button[aria-pressed=true] { background: #4c3767; border-color: #b99ae4; }
#watch #detail-actions button[aria-pressed=true]::before { content: "✓" / ""; }
#detail-status, #watch-status { margin: 6px 0; color: #dbc6ff; font-size: 12px; }
#detail-status:empty, #watch-status:empty { display: none; }
#film-score {
  display: grid;
  grid-template-columns: auto minmax(0, 200px) 1fr;
  align-items: center;
  gap: 8px 12px;
  margin-top: 12px;
  padding: 10px;
  border-radius: 10px;
  background: #211a30;
}
#score-note { margin: 0; color: #dbc6ff; }
#film-score label, #watch-options label { font-size: 13px; font-weight: 750; }
#watch select, .search-query input { min-height: 44px; }
.film-links { margin-top: 10px; }
#watch #toggle-watch { background: #c2a6f2; border-color: #c2a6f2; color: #171022; }
#watch #toggle-watch:hover { background: #d4baff; }

#watch-options { width:min(470px,calc(100% - 24px)); }
#watch-options label { display: block; margin-bottom: 5px; }
#country { width: min(100%, 220px); margin-bottom: 8px; }
#watch-options .hint { margin-bottom: 12px; }
.search-query { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px; }
.search-query input {
  width: 100%;
  min-width: 0;
  padding: 8px 10px;
  background: #100f1d;
  border: 1px solid #504663;
  border-radius: 9px;
  font-size: 16px;
}
#subscriptions-title { font-size: 28px; }
#subscription-settings .hint { margin: 13px 0 0; }
#subscriptions { margin-top: 12px; }
#subscriptions label { cursor: pointer; padding-inline: 11px; }
#open-subscriptions { color: #ded0f8; }

@media (max-width: 650px) {
  #watch, #subscription-settings, #watch-options {
    --dialog-pad: 14px;
    width: calc(100% - 16px);
    max-height: calc(100dvh - 16px);
    border-radius: 15px;
    scrollbar-gutter: auto;
  }
  .film-layout { grid-template-columns: 78px minmax(0, 1fr); gap: 0 11px; }
  .film-copy { display: contents; }
  #detail-poster { grid-row: 1 / 4; }
  #watch-title { grid-column: 2; align-self: end; font-size: clamp(22px, 6.3vw, 30px); }
  #detail-meta { grid-column: 2; margin-block: 6px; }
  #detail-rating { grid-column: 2; justify-self: start; align-self: start; }
  #detail-description, .film-reason { grid-column: 1 / -1; }
  #detail-description { margin-block: 12px; }
  .film-commands { margin-top: 13px; padding-top: 10px; }
  #watch #detail-actions button { padding-inline: 7px; font-size: 12px; }
  #film-score { grid-template-columns: 1fr; gap: 6px; }
}