:root {
  color-scheme: dark;
  --ink: #090a0c;
  --ink-2: #111216;
  --panel: #17181d;
  --paper: #f3f0e9;
  --muted: #a9a7a1;
  --dim: #77777c;
  --line: rgba(255,255,255,.11);
  --red: #ff3e62;
  --red-deep: #c92549;
  --lime: #b9ff66;
  --pad: clamp(18px, 4.2vw, 72px);
  --header: 68px;
}
* { box-sizing: border-box; }
html { background: var(--ink); scroll-behavior: smooth; }
body { margin: 0; min-height: 100vh; overflow-x: hidden; background: var(--ink); color: var(--paper); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
body::selection { background: var(--red); color: white; }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
img { display: block; }
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.topbar { position: fixed; inset: 0 0 auto; z-index: 60; display: flex; align-items: center; gap: 34px; height: var(--header); padding: 0 var(--pad); background: linear-gradient(180deg,rgba(6,7,9,.93),rgba(6,7,9,.42),transparent); transition: background .25s, backdrop-filter .25s; }
.topbar.scrolled, .topbar.solid { background: rgba(9,10,12,.89); border-bottom: 1px solid rgba(255,255,255,.07); backdrop-filter: blur(18px); }
.brand { display: inline-flex; align-items: center; gap: 8px; font-size: 1.18rem; font-weight: 900; letter-spacing: .15em; }
.brand-mark { width: 10px; height: 25px; background: var(--red); transform: skew(-8deg); box-shadow: 7px 0 0 rgba(255,62,98,.2); }
.nav { display: flex; align-items: center; gap: 24px; color: #c5c3bf; font-size: .875rem; }
.nav a { position: relative; padding: 25px 0 22px; transition: color .18s; }
.nav a:hover, .nav a[aria-current="page"] { color: white; }
.nav a[aria-current="page"]::after { content: ""; position: absolute; inset: auto 0 0; height: 2px; background: var(--red); }
.top-actions { display: flex; align-items: center; gap: 9px; margin-left: auto; }
.icon-button { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid transparent; border-radius: 50%; background: transparent; color: white; cursor: pointer; transition: background .18s, border-color .18s; }
.icon-button:hover { background: rgba(255,255,255,.08); border-color: var(--line); }
.icon-button svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.profile-trigger { position: relative; }
.profile-avatar { padding: 0; border: 0; background: none; color: white; cursor: pointer; }
.avatar { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 6px; background: linear-gradient(145deg,#ff8063,#ef315c 55%,#8f163f); font-size: .8rem; font-weight: 850; }
.profile-menu { position: absolute; top: 53px; right: 0; width: 220px; padding: 8px; border: 1px solid var(--line); background: rgba(18,19,23,.98); box-shadow: 0 20px 50px rgba(0,0,0,.45); text-align: left; }
.profile-menu::before { content: ""; position: absolute; top: -7px; right: 12px; width: 12px; height: 12px; border: 1px solid var(--line); border-right: 0; border-bottom: 0; background: #121317; transform: rotate(45deg); }
.profile-menu a, .profile-menu button { width: 100%; display: flex; align-items: center; gap: 10px; padding: 11px 10px; border: 0; background: transparent; color: #dedcd7; font-size: .88rem; text-align: left; cursor: pointer; }
.profile-menu a:hover, .profile-menu button:hover { background: rgba(255,255,255,.07); color: white; }
.mobile-nav { display: none; }

.hero { position: relative; min-height: 86vh; display: flex; align-items: flex-end; padding: calc(var(--header) + 64px) var(--pad) 11vh; isolation: isolate; }
.hero-media { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: center 42%; filter: saturate(.82) contrast(1.08); }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg,rgba(5,6,8,.97),rgba(5,6,8,.67) 34%,rgba(5,6,8,.08) 72%), linear-gradient(0deg,var(--ink) 0%,transparent 42%,rgba(6,7,9,.2)); }
.hero-copy { width: min(620px, 60vw); animation: reveal .7s cubic-bezier(.2,.7,.2,1) both; }
@keyframes reveal { from { opacity: 0; transform: translateY(18px); } }
.kicker { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; color: #e1dfda; font-size: .8rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.kicker::before { content: ""; width: 28px; height: 2px; background: var(--red); }
.display { margin: 0; max-width: 9ch; font-family: Georgia, "Times New Roman", serif; font-size: clamp(4.4rem, 8.5vw, 8.5rem); font-weight: 500; line-height: .81; letter-spacing: -.07em; }
.meta { display: flex; flex-wrap: wrap; align-items: center; gap: 11px; margin: 26px 0 15px; color: #deddd9; font-size: .9rem; font-weight: 650; }
.match { color: var(--lime); }
.quality { padding: 2px 5px; border: 1px solid rgba(255,255,255,.48); font-size: .7rem; }
.synopsis { max-width: 54ch; margin: 0; color: #d7d5d0; font-size: 1.05rem; line-height: 1.65; text-shadow: 0 2px 18px #000; }
.actions { display: flex; gap: 10px; margin-top: 28px; }
.button { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 0 22px; border: 1px solid transparent; border-radius: 4px; background: var(--paper); color: #0a0b0d; font-size: .95rem; font-weight: 800; cursor: pointer; transition: transform .16s, background .16s, border-color .16s; }
.button:hover { transform: translateY(-1px); background: white; }
.button.secondary { background: rgba(48,50,56,.76); color: white; backdrop-filter: blur(10px); }
.button.ghost { border-color: var(--line); background: transparent; color: white; }
.button.danger { background: var(--red); color: white; }
.button:disabled { opacity: .6; cursor: progress; transform: none; }
.button.small { min-height: 36px; padding: 0 14px; font-size: .85rem; }
.rent-line { margin: 14px 0 0; color: #cfcdc8; font-size: .86rem; line-height: 1.6; text-shadow: 0 2px 14px #000; }
.rent-line b { color: var(--lime); font-weight: 750; }
.rent-line .premiere-text { color: #ffb37a; }
.link-button { padding: 0; border: 0; background: none; color: var(--paper); font: inherit; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.link-button:hover { color: white; }
.grid-caption .link-button { margin-top: 6px; color: var(--muted); font-size: .78rem; }
.footer small a { text-decoration: underline; text-underline-offset: 3px; }
.i18n-pending body { opacity: 0; animation: i18n-reveal 0s 1.5s forwards; }
@keyframes i18n-reveal { to { opacity: 1; } }

.catalog { position: relative; z-index: 2; margin-top: -4vh; padding-bottom: 82px; }
.rail-section { margin-bottom: 38px; }
.section-head { display: flex; align-items: end; justify-content: space-between; gap: 24px; padding: 0 var(--pad); margin-bottom: 12px; }
.section-title { margin: 0; font-size: clamp(1.08rem,1.65vw,1.35rem); font-weight: 720; letter-spacing: -.025em; }
.section-link { color: var(--muted); font-size: .86rem; }
.section-link:hover { color: white; }
.rail-shell { position: relative; }
.rail { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(248px, 19vw); gap: 13px; overflow-x: auto; padding: 6px var(--pad) 18px; scroll-padding-left: var(--pad); scroll-snap-type: x mandatory; scrollbar-width: none; }
.rail::-webkit-scrollbar { display: none; }
.card { position: relative; aspect-ratio: 16/9; overflow: hidden; border: 1px solid rgba(255,255,255,.05); border-radius: 6px; background: #1b1c21; color: white; scroll-snap-align: start; cursor: pointer; box-shadow: 0 9px 26px rgba(0,0,0,.12); transition: transform .24s cubic-bezier(.2,.65,.25,1), box-shadow .24s, border-color .24s; }
.card:hover, .card:focus-visible { z-index: 3; transform: translateY(-5px) scale(1.018); border-color: rgba(255,255,255,.2); box-shadow: 0 20px 42px rgba(0,0,0,.38); outline: none; }
.card img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s, filter .24s; }
.card:hover img { transform: scale(1.03); filter: brightness(.83); }
.card-overlay { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 13px; background: linear-gradient(0deg,rgba(5,5,7,.92),rgba(5,5,7,.06) 64%); text-align: left; opacity: .86; }
.card-title { font-size: .91rem; font-weight: 760; letter-spacing: -.012em; }
.card-meta { margin-top: 4px; color: #c2c0bb; font-size: .72rem; }
.card-badges { position: absolute; top: 10px; left: 10px; display: flex; gap: 5px; }
.badge { padding: 5px 7px; background: rgba(7,8,10,.8); color: white; font-size: .64rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; backdrop-filter: blur(8px); }
.badge.red { background: var(--red); }
.badge.rented { background: var(--lime); color: #12160b; letter-spacing: .04em; text-transform: none; }
.badge.premiere, .premiere-chip { background: linear-gradient(90deg,var(--red),#ff8a3d); color: white; }
.badge.hot, .hot-chip { background: #ff8a3d; color: #1b0e05; }
.premiere-chip, .hot-chip { padding: 3px 9px; border-radius: 999px; font-size: .72rem; font-weight: 850; letter-spacing: .03em; }
.premiere-text { color: #ffb37a; }
.card-action { position: absolute; top: 9px; right: 9px; width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; background: rgba(7,8,10,.67); color: white; opacity: 0; cursor: pointer; }
.card:hover .card-action, .card:focus-within .card-action { opacity: 1; }
.rail-arrow { position: absolute; z-index: 4; top: 6px; bottom: 18px; width: 54px; border: 0; background: linear-gradient(90deg,rgba(9,10,12,.95),transparent); color: white; font-size: 2rem; opacity: 0; cursor: pointer; transition: opacity .18s; }
.rail-shell:hover .rail-arrow { opacity: 1; }
.rail-arrow.prev { left: 0; }
.rail-arrow.next { right: 0; transform: rotate(180deg); }

.page { min-height: 100vh; padding: calc(var(--header) + 58px) var(--pad) 100px; }
.page-intro { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: 32px; margin-bottom: 34px; border-bottom: 1px solid var(--line); padding-bottom: 26px; }
.page-title { margin: 0; font-family: Georgia,serif; font-size: clamp(3rem,7vw,6.8rem); font-weight: 500; line-height: .9; letter-spacing: -.06em; }
.page-description { max-width: 48ch; margin: 16px 0 0; color: var(--muted); font-size: 1rem; line-height: 1.65; }
.filters { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; max-width: 640px; }
.chip { min-height: 38px; padding: 0 14px; border: 1px solid var(--line); border-radius: 999px; background: transparent; color: #d6d4cf; font-size: .84rem; cursor: pointer; }
.chip:hover, .chip.active { border-color: var(--paper); background: var(--paper); color: var(--ink); }
.grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 30px 13px; }
.grid-item .card { width: 100%; }
.grid-caption { padding: 10px 2px 0; }
.grid-title { margin: 0; font-size: .91rem; font-weight: 720; }
.grid-meta { margin-top: 4px; color: var(--dim); font-size: .78rem; }
.empty-state { max-width: 560px; margin: 12vh auto; text-align: center; }
.empty-state h2 { font-family: Georgia,serif; font-size: 2.6rem; font-weight: 500; }
.empty-state p { color: var(--muted); line-height: 1.6; }

.search-page { padding-top: calc(var(--header) + 34px); }
.search-hero { position: sticky; top: var(--header); z-index: 20; margin: 0 calc(var(--pad) * -1) 34px; padding: 20px var(--pad) 24px; border-bottom: 1px solid var(--line); background: rgba(9,10,12,.94); backdrop-filter: blur(18px); }
.search-field { width: 100%; padding: 10px 0 14px; border: 0; border-bottom: 2px solid #45464c; outline: 0; background: transparent; color: white; font-family: Georgia,serif; font-size: clamp(2rem,5vw,4.4rem); letter-spacing: -.04em; }
.search-field:focus { border-color: var(--red); }
.search-count { margin: 12px 0 0; color: var(--muted); font-size: .84rem; }

.detail-page { min-height: 100vh; padding-bottom: 100px; }
.detail-hero { position: relative; min-height: 78vh; display: flex; align-items: flex-end; padding: calc(var(--header) + 70px) var(--pad) 74px; isolation: isolate; }
.detail-hero img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.detail-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg,rgba(7,8,10,.97),rgba(7,8,10,.56) 50%,transparent), linear-gradient(0deg,var(--ink),transparent 42%); }
.detail-content { width: min(650px,70vw); }
.detail-title { margin: 0; font-family: Georgia,serif; font-size: clamp(4rem,9vw,8rem); font-weight: 500; line-height: .82; letter-spacing: -.065em; }
.detail-body { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(240px,.7fr); gap: clamp(38px,7vw,110px); padding: 56px var(--pad); }
.detail-body p { margin-top: 0; color: #d6d4cf; font-size: 1.05rem; line-height: 1.75; }
.facts { color: var(--muted); font-size: .88rem; line-height: 1.8; }
.facts b { color: white; }
.catalog.detail-more { margin-top: 0; padding-bottom: 24px; }

.auth-page { min-height: 100vh; display: grid; grid-template-columns: minmax(0,1.15fr) minmax(420px,.85fr); background: #090a0c; }
.auth-art { position: relative; min-height: 100vh; overflow: hidden; }
.auth-art img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.7) contrast(1.05); }
.auth-art::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg,transparent 45%,#090a0c), linear-gradient(0deg,rgba(9,10,12,.72),transparent 58%); }
.auth-quote { position: absolute; z-index: 2; left: clamp(24px,6vw,88px); right: 60px; bottom: 70px; max-width: 660px; }
.auth-quote p { margin: 0; font-family: Georgia,serif; font-size: clamp(2.5rem,5vw,5.4rem); line-height: .92; letter-spacing: -.055em; }
.auth-panel { display: flex; flex-direction: column; justify-content: center; padding: 70px clamp(32px,6vw,92px); }
.auth-panel .brand { position: absolute; top: 28px; }
.auth-panel h1 { margin: 0; font-family: Georgia,serif; font-size: clamp(3rem,5vw,5.2rem); font-weight: 500; line-height: .9; letter-spacing: -.055em; }
.auth-lead { margin: 18px 0 32px; color: var(--muted); font-size: 1rem; line-height: 1.6; }
.form-field { display: grid; gap: 8px; margin-bottom: 18px; }
.form-field label { color: #d8d6d1; font-size: .86rem; font-weight: 700; }
.form-field input { width: 100%; min-height: 52px; padding: 0 14px; border: 1px solid #35363b; border-radius: 4px; outline: 0; background: #121318; color: white; }
.form-field input:focus, .form-field select:focus { border-color: #9a9ba0; }
.form-field select { width: 100%; min-height: 52px; padding: 0 12px; border: 1px solid #35363b; border-radius: 4px; outline: 0; background: #121318; color: white; }
.field-hint { color: var(--dim); font-size: .78rem; }
.signup-region { margin: 0 0 16px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 4px; color: var(--muted); font-size: .84rem; line-height: 1.5; }
.signup-region strong { color: white; }
.auth-switch { margin: 18px 0 0; color: var(--muted); font-size: .9rem; }
.auth-switch a, .auth-note a { color: white; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.form-row { display: flex; justify-content: space-between; gap: 20px; margin: 2px 0 24px; color: var(--muted); font-size: .82rem; }
.auth-note { margin-top: 18px; padding: 13px 14px; border-left: 2px solid var(--red); background: rgba(255,255,255,.04); color: var(--muted); font-size: .78rem; line-height: 1.5; }
.form-error { min-height: 20px; margin: -8px 0 10px; color: #ff8098; font-size: .82rem; }

.profiles-page { min-height: 100vh; display: grid; place-items: center; padding: 80px var(--pad); background: radial-gradient(circle at 50% 15%,#24212a,#090a0c 46%); }
.profiles { width: min(950px,100%); text-align: center; }
.profiles h1 { margin: 0 0 52px; font-family: Georgia,serif; font-size: clamp(3.2rem,7vw,6rem); font-weight: 500; letter-spacing: -.055em; }
.profile-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: clamp(16px,3vw,34px); }
.profile-card { border: 0; background: transparent; color: var(--muted); cursor: pointer; }
.profile-card:hover { color: white; }
.profile-face { aspect-ratio: 1; display: grid; place-items: center; margin-bottom: 14px; border: 3px solid transparent; border-radius: 7px; background: linear-gradient(145deg,#ff8063,#ef315c 55%,#8f163f); font-size: clamp(2rem,6vw,5rem); font-weight: 900; transition: border-color .18s, transform .18s; }
.profile-card:nth-child(2) .profile-face { background: linear-gradient(145deg,#6ba5ff,#2f5ad8 55%,#19317c); }
.profile-card:nth-child(3) .profile-face { background: linear-gradient(145deg,#ffd36c,#e37c32 55%,#81391e); }
.profile-card:nth-child(4) .profile-face { background: #202126; color: #8c8d92; }
.profile-card:hover .profile-face { border-color: white; transform: translateY(-3px); }
.profile-name { font-size: 1rem; }

.footer { display: grid; grid-template-columns: minmax(220px,1fr) 2fr; gap: 60px; padding: 58px var(--pad) 110px; border-top: 1px solid var(--line); color: var(--dim); }
.footer p { max-width: 36ch; line-height: 1.65; }
.footer-links { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px 28px; align-content: start; font-size: .86rem; }
.toast { position: fixed; z-index: 90; left: 50%; bottom: 28px; transform: translate(-50%,18px); padding: 11px 16px; border: 1px solid var(--line); border-radius: 999px; background: rgba(26,27,31,.97); color: white; box-shadow: 0 16px 44px rgba(0,0,0,.45); opacity: 0; pointer-events: none; transition: opacity .18s, transform .18s; }
.toast.show { opacity: 1; transform: translate(-50%,0); }

.rent-dialog { width: min(520px, calc(100vw - 32px)); max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); padding: 0; overflow: auto; border: 1px solid var(--line); border-radius: 10px; background: #121317; color: var(--paper); box-shadow: 0 30px 90px rgba(0,0,0,.6); }
.rent-dialog::backdrop { background: rgba(4,5,7,.74); backdrop-filter: blur(6px); }
.rent-sheet { position: relative; display: grid; gap: 18px; padding: 24px; }
.rent-close { position: absolute; top: 12px; right: 12px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: rgba(255,255,255,.07); color: white; font-size: 1.35rem; line-height: 1; cursor: pointer; }
.rent-close:hover { background: rgba(255,255,255,.14); }
.rent-head { display: grid; grid-template-columns: 136px minmax(0,1fr); gap: 16px; align-items: center; padding-right: 36px; }
.rent-head img { width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: 6px; }
.rent-head .kicker { margin-bottom: 8px; font-size: .7rem; }
.rent-head h2, .rent-done h2 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: 1.9rem; font-weight: 500; line-height: 1; letter-spacing: -.04em; }
.rent-head p { margin: 8px 0 0; color: var(--muted); font-size: .82rem; }
.rent-terms { margin: 0; padding: 12px 16px; list-style: none; border: 1px solid var(--line); border-radius: 8px; color: #d6d4cf; font-size: .86rem; line-height: 1.85; }
.rent-terms li::before { content: "—"; margin-right: 9px; color: var(--red); }
.rent-methods { display: grid; gap: 8px; min-width: 0; margin: 0; padding: 0; border: 0; }
.rent-methods legend { margin-bottom: 8px; padding: 0; color: var(--muted); font-size: .72rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.rent-methods label { display: flex; align-items: center; gap: 10px; min-height: 46px; padding: 0 14px; border: 1px solid #35363b; border-radius: 6px; cursor: pointer; }
.rent-methods label:has(input:checked) { border-color: var(--paper); background: rgba(255,255,255,.05); }
.rent-methods input { accent-color: var(--red); }
.rent-total { display: flex; align-items: baseline; justify-content: space-between; padding-top: 14px; border-top: 1px solid var(--line); color: var(--muted); }
.rent-total strong { color: white; font-size: 1.45rem; letter-spacing: -.02em; }
.rent-fine { margin: -6px 0 0; color: var(--dim); font-size: .76rem; line-height: 1.5; text-align: center; }
.rent-done { display: grid; justify-items: center; gap: 12px; padding: 18px 0 4px; text-align: center; }
.rent-done p { margin: 0; color: var(--muted); line-height: 1.6; }
.rent-done .actions { margin-top: 12px; }
.rent-check { width: 54px; height: 54px; display: grid; place-items: center; border-radius: 50%; background: var(--lime); color: #12160b; font-size: 1.5rem; font-weight: 900; }

.library-block + .library-block { margin-top: 56px; }
.block-title { margin: 0 0 18px; font-size: clamp(1.15rem,2vw,1.45rem); font-weight: 720; letter-spacing: -.02em; }
.block-empty { margin: 0; padding: 22px; border: 1px dashed var(--line); border-radius: 8px; color: var(--muted); line-height: 1.6; }
.library-block .empty-state { margin: 28px auto; }
.rent-accept { display: flex; align-items: flex-start; gap: 10px; color: #d6d4cf; font-size: .86rem; line-height: 1.5; cursor: pointer; }
.rent-accept input { flex: none; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--red); }
.rent-accept a, .rent-done a { color: white; text-decoration: underline; text-underline-offset: 3px; }
.table-scroll { overflow-x: auto; }
.data-table { width: 100%; border-collapse: collapse; font-size: .88rem; }
.data-table th { padding: 10px 12px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-align: left; text-transform: uppercase; }
.data-table td { padding: 12px; border-bottom: 1px solid rgba(255,255,255,.06); color: #dedcd7; }
.data-table th:last-child, .data-table td:last-child, .data-table .num { text-align: right; white-space: nowrap; }
.table-note { margin: 12px 0 0; color: var(--dim); font-size: .8rem; }
.table-note a { text-decoration: underline; }

.landing-hero { position: relative; min-height: 92vh; display: grid; place-items: center; padding: calc(var(--header) + 60px) var(--pad) 90px; overflow: hidden; isolation: isolate; text-align: center; }
.landing-collage { position: absolute; inset: -14% -10%; z-index: -2; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); align-content: center; gap: 14px; opacity: .78; transform: rotate(-7deg) scale(1.08); }
.landing-collage img { width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: 6px; }
.landing-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse at center,rgba(9,10,12,.72),rgba(9,10,12,.5) 58%,rgba(9,10,12,.82)), linear-gradient(0deg,var(--ink),transparent 30%), linear-gradient(180deg,rgba(9,10,12,.7),transparent 22%); }
.landing-copy { width: min(760px,100%); animation: reveal .7s cubic-bezier(.2,.7,.2,1) both; }
.landing-copy .kicker { justify-content: center; }
.landing-title { max-width: 12ch; margin: 0 auto; font-family: Georgia, "Times New Roman", serif; font-size: clamp(3rem,7vw,6.4rem); font-weight: 500; line-height: .9; letter-spacing: -.06em; }
.landing-lead { max-width: 52ch; margin: 22px auto 30px; color: #dedcd7; font-size: 1.1rem; line-height: 1.6; }
.landing-lead b { color: var(--lime); }
.email-cta { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; width: min(600px,100%); margin: 0 auto; }
.email-cta input { min-height: 56px; padding: 0 18px; border: 1px solid rgba(255,255,255,.3); border-radius: 4px; outline: 0; background: rgba(9,10,12,.72); color: white; font-size: 1rem; }
.email-cta input:focus { border-color: var(--paper); }
.email-cta .button { min-height: 56px; padding: 0 26px; font-size: 1.05rem; }
.email-cta .form-error { grid-column: 1 / -1; margin: 0; text-align: left; }
.landing-note { margin: 12px 0 0; color: var(--muted); font-size: .92rem; }
.landing-note a { color: white; text-decoration: underline; text-underline-offset: 3px; }
.landing-rail { padding: 10px 0 64px; }
.landing-features { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; padding: 0 var(--pad) 84px; }
.landing-features article { padding: 26px 22px; border: 1px solid var(--line); border-radius: 10px; background: linear-gradient(160deg,#17181d,#0f1013); }
.feature-mark { color: var(--red); font-size: .78rem; font-weight: 900; letter-spacing: .18em; }
.landing-features h3 { margin: 14px 0 8px; font-family: Georgia, "Times New Roman", serif; font-size: 1.6rem; font-weight: 500; letter-spacing: -.03em; }
.landing-features p { margin: 0; color: var(--muted); line-height: 1.6; }
.landing-faq { width: min(900px,calc(100% - var(--pad) * 2)); margin: 0 auto; padding-bottom: 90px; text-align: center; }
.landing-faq h2 { margin: 0 0 26px; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.2rem,4vw,3.4rem); font-weight: 500; letter-spacing: -.05em; }
.landing-faq details { margin-bottom: 8px; background: #17181d; text-align: left; }
.landing-faq summary { display: flex; justify-content: space-between; gap: 16px; padding: 22px 24px; font-size: 1.12rem; list-style: none; cursor: pointer; }
.landing-faq summary::-webkit-details-marker { display: none; }
.landing-faq summary::after { content: "+"; font-size: 1.6rem; line-height: .8; transition: transform .2s; }
.landing-faq details[open] summary::after { transform: rotate(45deg); }
.landing-faq details p { margin: 0; padding: 0 24px 24px; color: #d6d4cf; line-height: 1.7; }
.landing-faq details a { color: white; text-decoration: underline; }
.faq-cta-lead { margin: 40px 0 16px; color: #dedcd7; font-size: 1.05rem; }

.signup-page { min-height: 100vh; display: grid; place-items: center; padding: calc(var(--header) + 40px) var(--pad) 80px; background: radial-gradient(circle at 50% 0%,#24212a,var(--ink) 55%); }
.signup-card { width: min(480px,100%); }
.signup-card h1 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.4rem,5vw,3.5rem); font-weight: 500; line-height: .95; letter-spacing: -.05em; }

.terms-body { display: grid; grid-template-columns: 230px minmax(0,760px); gap: 56px; }
.terms-toc { position: sticky; top: calc(var(--header) + 24px); align-self: start; display: grid; gap: 12px; font-size: .88rem; }
.terms-toc a { color: var(--muted); }
.terms-toc a:hover { color: white; }
.terms-content section { margin-bottom: 40px; scroll-margin-top: calc(var(--header) + 24px); }
.terms-content h2 { margin: 0 0 12px; font-size: 1.35rem; font-weight: 720; letter-spacing: -.02em; }
.terms-content p { color: #d6d4cf; line-height: 1.75; }
.terms-region { margin: 18px 0; color: var(--muted); font-size: .9rem; }
.terms-region strong { color: white; }
.terms-disclaimer { padding: 14px 16px; border-left: 2px solid var(--red); background: rgba(255,255,255,.04); color: var(--muted); font-size: .84rem; }

@media (max-width: 1120px) { .grid { grid-template-columns: repeat(4,minmax(0,1fr)); } .nav { gap: 16px; } .page-intro { grid-template-columns: 1fr; } .filters { justify-content: flex-start; } }
@media (max-width: 900px) {
  :root { --header: 64px; }
  .nav { display: none; }
  .grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .hero { min-height: 78vh; }
  .hero-copy { width: min(650px,85vw); }
  .rail { grid-auto-columns: minmax(235px,54vw); }
  .auth-page { grid-template-columns: 1fr; }
  .auth-art { min-height: 42vh; }
  .auth-art::after { background: linear-gradient(0deg,#090a0c,transparent 65%); }
  .auth-quote { bottom: 38px; }
  .auth-panel { min-height: 58vh; padding-top: 90px; }
  .auth-panel .brand { top: calc(42vh + 20px); }
  .footer { grid-template-columns: 1fr; gap: 30px; }
  .landing-features { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .terms-body { grid-template-columns: 1fr; gap: 24px; }
  .terms-toc { position: static; display: flex; flex-wrap: wrap; gap: 8px 18px; }
}
@media (max-width: 640px) {
  :root { --pad: 17px; }
  body { padding-bottom: 62px; }
  .topbar { background: rgba(9,10,12,.78); backdrop-filter: blur(14px); }
  .top-actions > .icon-button:nth-child(2) { display: none; }
  .mobile-nav { position: fixed; z-index: 70; inset: auto 0 0; display: grid; grid-template-columns: repeat(5,1fr); min-height: 62px; border-top: 1px solid var(--line); background: rgba(12,13,16,.96); backdrop-filter: blur(18px); }
  .mobile-nav a { display: grid; place-items: center; gap: 2px; padding: 8px 2px; color: #9c9ca1; font-size: .66rem; }
  .mobile-nav a span:first-child { font-size: 1.1rem; }
  .mobile-nav a[aria-current="page"] { color: white; }
  .hero { min-height: 78vh; padding-bottom: 9vh; }
  .hero::before { background: linear-gradient(0deg,var(--ink) 2%,rgba(8,9,11,.23) 74%), linear-gradient(90deg,rgba(5,6,8,.82),transparent); }
  .display { font-size: clamp(4rem,21vw,6.7rem); }
  .hero-copy { width: 100%; }
  .synopsis { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
  .actions .button { flex: 1; padding: 0 13px; }
  .catalog { margin-top: -2vh; }
  .rail { grid-auto-columns: 79vw; }
  .rail-arrow { display: none; }
  .page { padding-top: calc(var(--header) + 34px); }
  .page-title { font-size: clamp(3.2rem,17vw,5.5rem); }
  .grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px 9px; }
  .grid-caption { padding-top: 8px; }
  .detail-hero { min-height: 72vh; padding-bottom: 45px; }
  .detail-content { width: 100%; }
  .detail-title { font-size: clamp(4rem,20vw,7rem); }
  .detail-body { grid-template-columns: 1fr; gap: 24px; padding-top: 35px; }
  .auth-art { min-height: 36vh; }
  .auth-quote { left: 22px; right: 22px; bottom: 25px; }
  .auth-quote p { font-size: clamp(2.3rem,12vw,4rem); }
  .auth-panel { min-height: 64vh; padding: 82px 22px 50px; }
  .auth-panel .brand { top: calc(36vh + 18px); }
  .profile-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .rent-dialog { width: 100%; max-width: 100%; max-height: 92vh; max-height: 92dvh; margin: auto 0 0; border-radius: 14px 14px 0 0; }
  .rent-sheet { gap: 13px; padding: 20px 18px calc(16px + env(safe-area-inset-bottom)); }
  .rent-head { grid-template-columns: 96px minmax(0,1fr); gap: 13px; }
  .rent-head h2 { font-size: 1.45rem; }
  .rent-terms { padding: 10px 14px; font-size: .8rem; line-height: 1.6; }
  .rent-methods legend { margin-bottom: 6px; }
  .rent-methods label { min-height: 40px; }
  .rent-total { padding-top: 10px; }
  .landing-hero { min-height: 86vh; padding-bottom: 60px; }
  .landing-collage { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .landing-lead { font-size: 1rem; }
  .email-cta { grid-template-columns: 1fr; }
  .landing-features { grid-template-columns: 1fr; }
  .landing-faq summary { padding: 18px; font-size: 1rem; }
  .landing-faq details p { padding: 0 18px 18px; }
  .profiles h1 { margin-bottom: 34px; }
  .footer-links { grid-template-columns: 1fr 1fr; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; } }