/*
 * AI Plompt · Electric Blue + Cyan Premium UI — optional, additive design layer.
 * Scope: presentation only; app.js handlers, APIs, storage, and merge logic are unchanged.
 * To revert the theme, remove the premium-theme.css <link> from the PHP pages.
 */
:root {
  color-scheme: light;
  --bg: #f3f8ff;
  --panel: #fff;
  --ink: #10213b;
  --muted: #64748b;
  --line: #dce9f8;
  --accent: #4282e9;
  --accent-dark: #3673d5;
  --gold: #f3b351;
  --good: #0ba580;
  --shadow: 0 21px 60px rgba(45,71,112,09), 0 2px 12px rgba(36,53,114,.025);
  --radius: 26px;
  --premium-indigo: #0c2149;
  --premium-azure: #06b6d4;
  --premium-violet: #5999ff;
}
html { scroll-behavior: smooth; }
body {
  min-height: 100vh;
  background: radial-gradient(ellipse 60% 32% at 95% 0%, rgba(151,191,255,19), transparent 75%),
              radial-gradient(ellipse 45% 32% at 1% 25%, rgba(85,203,255,.12), transparent 80%),
              linear-gradient(180deg, #f5f7ff 0%,#f9fbff 68%,#f5f8ff 100%);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
::selection { background: #cce0ff; color: #132f5d; }
button, a, summary { -webkit-tap-highlight-color: transparent; }
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible {
  outline: 3px solid #27b1ec; outline-offset: 3px;
}
.topbar {
  height: 78px;
  padding: 0 clamp(16px, 3vw, 46px);
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(20px) saturate(150%);
  -webkit-backdrop-filter: blur(20px) saturate(150%);
  border-bottom: 1px solid rgba(132,147,216,.2);
  box-shadow: 0 8px 30px rgba(48,80,132,035);
}
.topbar:after {
  content:"";position:absolute;inset:auto 0 0;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(73,134,232,42),rgba(66,195,255,.3),transparent);
}
.brand,.brand.plain {
  display:inline-flex;align-items:center;gap:12px;padding:0;
  font-weight:950;letter-spacing:.015em;font-size:17px;color:#1a2142;text-decoration:none;
}
.brand span { letter-spacing: .025em; }
.brand-mark { border-radius: 21px; background:linear-gradient(140deg,#eaf2ff,#e4f9ff);box-shadow:inset 0 1px #fff,0 12px 30px rgba(89,137,214,15); }
.brand.plain:hover,.topbar .brand:hover { color:var(--accent); }
.top-actions { gap:12px; }
.user-chip {background:#f3f5ff;color:#465371;border:1px solid #e7effb;padding:9px 13px;font-weight:700;}
.app-shell {max-width:1360px;padding:38px 28px 96px;}
.eyebrow {color:#558de7;font-size:12px;letter-spacing:.155em;font-weight:950;}
.muted,.lead {color:var(--muted);}

/* Buttons: responsive polish, clear focus and accessible motion */
.btn {
  min-height:45px;
  border-color:#e3e7f5;background:#fff;
  border-radius:15px;padding:11px 17px;color:#242d4b;
  box-shadow:0 3px 10px rgba(37,64,107,025);
  transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s ease,background .2s,border-color .2s;
}
.btn:hover:not(:disabled) {transform:translateY(-3px);border-color:#c2d7f9;box-shadow:0 12px 25px rgba(76,114,174,12);}
.btn:active:not(:disabled) {transform:translateY(0) scale(.985);}
.btn:disabled {opacity:.46;}
.btn.primary {
  background:linear-gradient(112deg,#659df7 0%,#4885e6 48%,#3f78d3 100%);
  color:white;border:1px solid rgba(255,255,255,.16);
  box-shadow:0 10px 28px rgba(66,123,215,29),inset 0 1px 0 rgba(255,255,255,.25);
}
.btn.primary:hover:not(:disabled) {box-shadow:0 15px 32px rgba(67,125,218,36),0 0 0 5px rgba(82,142,239,08);}
.btn.gold {
  background:linear-gradient(108deg,#ffe3a2,#ffbf67 50%,#f2a93d);
  color:#472c0b;border:1px solid #ffda8a;
  box-shadow:0 9px 22px rgba(222,141,42,.23),inset 0 1px rgba(255,255,255,.6);
}
.btn.flow {
  color:#fff;border:1px solid #293c70;
  background:linear-gradient(115deg,#132347,#243a6b 75%,#344c86);
  box-shadow:0 10px 23px rgba(14,33,77,.17);
}
.btn.ghost {background:rgba(249,251,255,76);border-color:#e9eff8;}
.btn.huge {min-height:60px;border-radius:18px;}
.btn.mega {border-radius:18px;}

/* Cinematic hero / visible artwork is decorative only */
.hero-simple {
  min-height:392px;padding:clamp(34px,5vw,64px);
  background: radial-gradient(ellipse at 87% 16%,rgba(74,138,242,48),transparent 33%),
              radial-gradient(ellipse at 67% 95%,rgba(19,164,233,.21),transparent 46%),
              linear-gradient(118deg,#0e183b 2%,#182453 49%,#21395f 100%);
  border:1px solid rgba(145,187,255,24);border-radius:34px;
  box-shadow:0 26px 58px rgba(25,50,90,24),inset 0 1px rgba(255,255,255,.12);
  isolation:isolate;overflow:hidden;
}
.hero-simple:before {
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px);
  background-size:38px 38px;mask-image:linear-gradient(90deg,transparent 16%,#000);
}
.hero-simple:after {
  content:"";position:absolute;right:-175px;top:-185px;width:630px;height:630px;
  border:1px solid rgba(153,192,255,18);border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,transparent 34%,rgba(85,146,243,08) 35%,transparent 50%);
  box-shadow:0 0 0 76px rgba(103,130,255,.018),0 0 0 150px rgba(103,130,255,.014);
}
.hero-simple> .eyebrow,.hero-simple>h1,.hero-simple>p,.hero-simple>.btn {position:relative;z-index:2;}
.hero-simple .eyebrow {color:#8de4ff;display:inline-flex;align-items:center;gap:9px;letter-spacing:.18em;}
.hero-simple .eyebrow:before {content:"";width:8px;height:8px;border-radius:50%;background:#59f4c7;box-shadow:0 0 0 4px rgba(77,235,197,.14),0 0 18px #50e6c9;}
.hero-simple h1 {font-size:clamp(39px,4.6vw,65px);max-width:675px;line-height:1.12;letter-spacing:-.045em;margin:19px 0 18px;text-wrap:balance;text-shadow:0 8px 30px rgba(0,0,0,.16);}
.hero-simple p {font-size:clamp(15px,1.5vw,18px);max-width:590px;line-height:1.82;color:#c6d5f3;margin-bottom:28px;}
.hero-simple .btn.primary {background:linear-gradient(106deg,#88b6ff,#5896fa 52%,#5d92e8);box-shadow:0 14px 36px rgba(76,139,240,43),0 0 35px rgba(93,155,255,17);}
.hero-cinema-art {position:absolute;top:8px;right:0;width:42%;height:100%;z-index:1;pointer-events:none;perspective:900px;}
.hero-cinema-art .hero-halo {position:absolute;inset:14% 8% 9% 2%;border-radius:50%;background:radial-gradient(ellipse,rgba(77,131,255,.2),transparent 65%);filter:blur(18px);animation:premiumGlow 6s ease-in-out infinite alternate;}
.hero-cinema-art .hero-film {
  position:absolute;display:flex;flex-direction:column;justify-content:space-between;
  width:clamp(135px,14.1vw,204px);height:clamp(226px,23vw,315px);
  border-radius:20px;padding:18px;overflow:hidden;
  border:1px solid rgba(220,233,255,32);color:white;
  background:radial-gradient(circle at 30% 29%,rgba(175,239,252,38),transparent 34%),linear-gradient(160deg,#5279b9,#1d3357 70%);
  box-shadow:0 28px 70px rgba(4,16,36,46),inset 0 1px rgba(255,255,255,.27);
}
.hero-cinema-art .hero-film:before {content:"";position:absolute;inset:0;background:linear-gradient(112deg,transparent 33%,rgba(255,255,255,.1) 48%,transparent 62%);transform:translateX(-95%);animation:premiumShine 7s ease-in-out infinite;}
.hero-cinema-art .hero-film-back {right:15%;top:14%;transform:rotate(14deg) translate(22px,3px) scale(.91);opacity:.78;background:radial-gradient(circle at 60% 32%,rgba(98,235,240,.58),transparent 30%),linear-gradient(160deg,#2c7f99,#163050 70%);animation:posterBack 6s ease-in-out infinite;}
.hero-cinema-art .hero-film-front {right:36%;top:12%;transform:rotate(-10deg);animation:posterFront 6s ease-in-out infinite;}
.hero-cinema-art .film-label {font-size:10px;letter-spacing:.22em;font-weight:900;opacity:.92;position:relative;z-index:1;}
.hero-cinema-art .film-emblem {font-size:88px;text-align:center;line-height:1;filter:drop-shadow(0 13px 24px rgba(0,0,0,.22));position:relative;z-index:1;}
.hero-cinema-art .film-bottom {display:flex;justify-content:space-between;font-size:12px;font-weight:900;letter-spacing:.14em;position:relative;z-index:1;}
.hero-cinema-art .film-play {width:64px;height:64px;border-radius:50%;display:grid;place-items:center;margin:auto;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.37);backdrop-filter:blur(10px);font-size:22px;box-shadow:0 0 0 13px rgba(255,255,255,.045),0 8px 23px rgba(0,0,0,.1);}
.hero-cinema-art .hero-star {position:absolute;color:#ccf5ff;text-shadow:0 0 22px #68d6fd;animation:premiumTwinkle 3.2s ease-in-out infinite;}
.hero-cinema-art .hero-star.one {top:14%;right:9%;font-size:28px;}
.hero-cinema-art .hero-star.two {bottom:13%;left:4%;font-size:17px;animation-delay:1s;}
@keyframes posterFront {0%,100%{transform:rotate(-10deg) translateY(0)}50%{transform:rotate(-8deg) translateY(-9px)}}
@keyframes posterBack {0%,100%{transform:rotate(14deg) translate(22px,3px) scale(.91)}50%{transform:rotate(12deg) translate(24px,12px) scale(.91)}}
@keyframes premiumShine {0%,44%,100%{transform:translateX(-120%)}62%{transform:translateX(135%)}}
@keyframes premiumGlow {from{opacity:.4;transform:scale(.91)}to{opacity:1;transform:scale(1.07)}}
@keyframes premiumTwinkle {0%,100%{opacity:.4;transform:scale(.85)}50%{opacity:1;transform:scale(1.1)}}

/* Home choices */
.simple-choice-wrap {margin-top:40px;}
.simple-choice-wrap h2,.section-head h2 {color:#1a2450;letter-spacing:-.03em;}
.simple-choice-grid {gap:18px;}
.simple-choice {
  min-height:192px;padding:24px;border-radius:25px;position:relative;overflow:hidden;
  background:rgba(255,255,255,.92);border:1px solid rgba(208,218,247,.91);
  box-shadow:0 10px 30px rgba(41,65,103,048),inset 0 1px rgba(255,255,255,.8);
  transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .3s,border-color .25s;
}
.simple-choice:after {content:"→";position:absolute;right:23px;top:29px;color:#a2aacf;font-size:23px;transition:transform .2s,color .2s;}
.simple-choice:hover {transform:translateY(-7px);border-color:#abcbff;box-shadow:0 23px 44px rgba(62,98,155,16);}
.simple-choice:hover:after {transform:translateX(5px);color:#4984e4;}
.simple-choice span {display:grid;place-items:center;margin:0 0 18px;width:59px;height:59px;border-radius:19px;background:linear-gradient(140deg,#e7f0ff,#e2eafe);box-shadow:inset 0 1px #fff,0 9px 17px rgba(88,139,222,09);font-size:29px;transition:transform .3s;}
.simple-choice:nth-child(2) span {background:linear-gradient(140deg,#e5f9ff,#ddedff);}
.simple-choice:nth-child(3) span {background:linear-gradient(140deg,#fff2e7,#ebfcff);}
.simple-choice:hover span {transform:scale(1.09) rotate(-5deg);}
.simple-choice b {font-size:19px;color:#20294a;}
.simple-choice small {color:#66728c;font-size:13px;}
.home-tool-card {
  margin-top:31px;border-radius:26px;padding:24px 28px;gap:20px;
  border:1px solid #d9e8fa;background:linear-gradient(103deg,rgba(231,243,255,.95),rgba(244,248,255,96) 60%,rgba(255,245,230,.92));
  box-shadow:0 14px 36px rgba(55,81,154,.065),inset 0 1px #fff;
}
.home-tool-icon {background:linear-gradient(135deg,#152c67,#416fba);color:#fff;border-radius:20px;box-shadow:0 12px 20px rgba(73,115,183,23);}
.home-tool-copy h2 {color:#1d2b4e;}
.home-tool-copy p {color:#66718b;}
.my-films {margin-top:45px;}
.project-card {border-radius:23px;background:rgba(255,255,255,.94);border:1px solid #e0e5f5;padding:24px;transition:transform .25s,box-shadow .25s,border-color .25s;}
.project-card:hover {transform:translateY(-5px);border-color:#a8c6f5;box-shadow:0 16px 38px rgba(64,99,156,12);}
.project-card h3 {color:#1b2750;}
.progress-track {background:#eef1fc;}
.progress-bar {background:linear-gradient(90deg,#4b87e8,#6aacf9,#3fe0d7);}
.empty-card {background:rgba(255,255,255,.73);border:2px dashed #d6dcf3;color:#69768e;padding:44px 22px;border-radius:24px;}

/* Wizard and chapter navigation */
.wizard {max-width:870px;}
.stepper {gap:10px;margin:0 0 24px;}
.step-dot {height:7px;background:#e0e5f6;}
.step-dot.on {background:linear-gradient(90deg,#548ce6,#49c9f5);box-shadow:0 3px 10px rgba(93,142,221,25);}
.panel,.easy-workflow,.auth-card {background:rgba(255,255,255,.95);border:1px solid #e1e7f7;box-shadow:var(--shadow);}
.panel {border-radius:27px;}
.wizard-panel {padding:clamp(22px,4vw,38px);}
.wizard-panel h2,.overview-head h1,.episode-hero-clean h1 {letter-spacing:-.035em;color:#19254c;}
.choice {border:1px solid #e2e7f7;background:#fafbff;border-radius:20px;transition:.24s ease;align-items:center;min-height:96px;}
.choice:hover {transform:translateY(-2px);border-color:#acc8f4;box-shadow:0 7px 20px rgba(65,98,152,08);}
.choice.selected {border:2px solid #5d93e9;background:linear-gradient(135deg,#eef5ff,#eef4ff);box-shadow:0 8px 20px rgba(68,126,220,09);}
.choice .ico {width:51px;height:51px;display:grid;place-items:center;border-radius:15px;background:#e6f0ff;flex-shrink:0;}
.genre {border-color:#e0e5f3;background:#fff;border-radius:14px;min-height:50px;transition:.2s;}
.genre:hover {border-color:#b0cbf6;background:#f5f9ff;transform:translateY(-2px);}
.genre.selected {border:2px solid #518be8;background:#ecf3ff;color:#336cc8;box-shadow:0 4px 14px rgba(78,135,226,1);}
input,textarea,select {border:1px solid #dae0f1;border-radius:15px;background:#fbfcff;color:#1e294b;transition:border-color .2s,box-shadow .2s;}
input:focus,textarea:focus,select:focus {border-color:#70a3f4;box-shadow:0 0 0 4px rgba(84,137,222,13);}
input::placeholder,textarea::placeholder {color:#a0a8bf;}
.advanced {border-top:1px solid var(--line);padding-top:13px;}
.overview-head {margin-top:18px;}
.story-plan-card {border-radius:27px;}
.story-map-row {background:#fafbff;border-color:#e5eafa;border-radius:17px;transition:transform .2s,border-color .2s;}
.story-map-row:hover {transform:translateX(4px);border-color:#b6d0f9;}
.story-map-row .num {background:linear-gradient(135deg,#e7f0ff,#e0eeff);color:#457fdc;}

/* Studio keeps two-action structure, adds legible levels and polish */
.episode-count {background:rgba(255,255,255,.88);border-color:#e0e5f6;color:#4e7ecb;}
.back-link {color:#626e8e;}
.back-link:hover {color:var(--accent);}
.episode-hero-clean {padding-top:22px;}
.scene-dot {transition:transform .2s;}
.scene-dot:hover {transform:translateY(-3px);}
.scene-dot span {background:#e5e9f7;color:#53617e;}
.scene-dot.active span {background:linear-gradient(135deg,#5c97f7,#4f6ce4);box-shadow:0 7px 21px rgba(81,134,219,32);}
.easy-workflow {border-radius:30px;padding:clamp(20px,3vw,38px);}
.scene-number-badge {background:linear-gradient(110deg,#e6f0ff,#e8f5ff);color:#447ad2;border:1px solid #d9e8ff;}
.scene-info-clean h2 {color:#1c2851;letter-spacing:-.02em;}
.dialogue-clean {background:linear-gradient(110deg,#f7faff,#f8fcff);border-color:#e3ecfa;}
.dialogue-clean strong {color:#253359;}
.easy-step {border-radius:23px;background:#f8faff;border-color:#e2e8f6;transition:box-shadow .25s,border-color .25s;}
.easy-step:hover {border-color:#bed5fa;box-shadow:0 9px 27px rgba(67,100,153,07);}
.easy-step.flow-step {background:linear-gradient(122deg,#f2faff,#f5f9ff);border-color:#dbe6f9;}
.easy-step-no {background:linear-gradient(135deg,#629af3,#598ada);box-shadow:0 8px 19px rgba(76,132,223,22);}
.flow-step .easy-step-no {background:linear-gradient(135deg,#36b9f8,#5474ec);}
.easy-step-copy h3 {color:#202c54;}
.tiny-note {background:#fff;border-color:#e8effb;color:#66728b;}
.flow-arrow {color:#8fabd7;}
.episode-merge-cta {background:linear-gradient(116deg,#fff8eb,#fffdf8);border-color:#f5ddad;box-shadow:0 8px 26px rgba(188,126,57,.07);border-radius:22px;}
.episode-merge-no {background:linear-gradient(135deg,#ffcc7b,#f5a23f);color:#52330a;}
.advanced-tools>summary {color:#737c95;}
.prompt-box {background:#f8faff;border-color:#e2e9f6;}
.prompt-text {color:#52607c;}

/* Combine-video UI */
.merge-modal-backdrop,.prompt-modal-backdrop {background:rgba(11,20,53,.65);backdrop-filter:blur(13px);-webkit-backdrop-filter:blur(13px);}
.merge-modal,.prompt-modal {background:linear-gradient(160deg,#fff,#fafbff 85%);border:1px solid rgba(230,240,255,98);box-shadow:0 30px 110px rgba(7,21,44,3);}
.merge-modal h2,.prompt-modal h2 {letter-spacing:-.03em;color:#1f2b50;}
.prompt-modal-icon {background:#eafbf5;box-shadow:0 0 0 5px rgba(39,190,142,.07);}
.prompt-howto {background:#f3f7ff;border-color:#dfe9fc;}
.prompt-modal-text {background:#fafbff;border-color:#e0e6f5;color:#263454;}
.prompt-modal-text:focus {border-color:#6d9ce8;box-shadow:0 0 0 4px rgba(81,137,226,13);}
.merge-file-card,.general-file-picker {background:#f9fbff;border-color:#d2daf2;}
.merge-file-card:hover,.general-file-picker:hover {background:#f3f8ff;border-color:#8ab2f3;}
.merge-file-no,.general-merge-no,.general-picker-icon {background:linear-gradient(135deg,#eaf2ff,#e3efff);color:#477ed6;}
.merge-status,.general-count-card {background:#f4f7ff;border:1px solid #e5eafb;}
.merge-progress-track {background:#e8f0fe;}
.merge-progress-bar {background:linear-gradient(90deg,#5288df,#3cc5f7,#7ce2cf);}
.merge-privacy {background:#ecfbf6;border-color:#c7f0e3;}
.general-add-one {background:linear-gradient(120deg,#f0f6ff,#edf6ff);border:2px dashed #94b8f1;border-radius:19px;transition:transform .2s,box-shadow .2s;}
.general-add-one:hover {box-shadow:0 10px 27px rgba(72,121,201,13);}
.general-merge-row {border-color:#e3e8f5;background:#fff;}
.general-empty {background:#f7f9ff;}
.mini-order,.mini-remove {background:#fafdff;border-color:#e1e6f6;transition:background .2s;}
.mini-order:hover {background:#ecf3ff;}
.mini-remove:hover {background:#fff0f0;}

/* Login/admin */
.auth-body {background:radial-gradient(ellipse at 20% 15%,rgba(140,184,255,28),transparent 46%),radial-gradient(ellipse at 85% 84%,rgba(90,210,254,.2),transparent 44%),linear-gradient(160deg,#f7faff,#edf4ff);}
.auth-card {padding:clamp(26px,5vw,43px);border-radius:31px;position:relative;overflow:hidden;}
.auth-card:before {content:"";display:block;position:absolute;height:4px;left:0;right:0;top:0;background:linear-gradient(90deg,#558be3,#6499ed,#4ad3f4);}
.auth-card .brand-mark {background:linear-gradient(145deg,#193055,#538be6);color:#fff;box-shadow:0 12px 25px rgba(75,130,219,23);}
.auth-card h1 {color:#17224b;font-size:clamp(27px,3vw,35px);letter-spacing:-.03em;}
.auth-card .btn.big {width:100%;margin-top:21px;min-height:54px;}
.page.narrow {margin:0 auto;max-width:1120px;padding:35px 24px 90px;}
.page-title h1 {font-size:34px;letter-spacing:-.03em;color:#1e2850;}
.page .panel {margin-top:21px;}
.grid-form {gap:13px;}
.table-wrap table {min-width:520px;}
th {background:#f7f9ff;color:#5d6986;font-weight:900;}
th,td {border-bottom-color:#e9edfa;}
tr:hover td {background:#fbfcff;}
.alert {border-radius:14px;}
.toast {background:#162447;border:1px solid #3a4f86;box-shadow:0 13px 40px rgba(18,29,72,.22);}
.loading {color:#1d2b52;}
.spinner {border-color:#e6ecf6;border-top-color:#528ce9;}

/* Low-motion, battery-conscious interactions */
@media (max-width:1120px) {
  .hero-cinema-art {width:38%;opacity:.76;transform:translateX(26px);}
  .hero-simple h1 {max-width:620px;}
  .hero-simple p {max-width:490px;}
}
@media (max-width:900px) {
  .app-shell {padding:24px 16px 70px;}
  .topbar {height:68px;padding:0 16px;}
  .brand span {display:inline;font-size:14px;}
  .hero-simple {padding:35px;min-height:auto;}
  .hero-cinema-art {opacity:.19;width:58%;right:-26px;}
  .hero-simple h1,.hero-simple p {max-width:100%;}
  .simple-choice {min-height:0;padding:19px 21px;}
  .simple-choice span {margin-bottom:12px;}
}
@media (max-width:650px) {
  .topbar {gap:8px;}
  .brand span {font-size:12px;letter-spacing:0;}
  .top-actions {gap:5px;}
  .top-actions .btn {font-size:12px;padding:8px 10px;min-height:38px;border-radius:11px;}
  .app-shell {padding:18px 12px 56px;}
  .hero-simple {padding:34px 23px;border-radius:26px;}
  .hero-simple h1 {font-size:clamp(32px,8.5vw,44px);line-height:1.16;}
  .hero-simple p {font-size:15px;line-height:1.67;}
  .hero-cinema-art {display:none;}
  .hero-simple .btn {width:100%;}
  .simple-choice-wrap {margin-top:29px;}
  .simple-choice-wrap h2,.section-head h2 {font-size:24px;}
  .simple-choice-grid {gap:12px;}
  .simple-choice {padding:17px 18px;border-radius:19px;}
  .simple-choice span {width:48px;height:48px;font-size:24px;border-radius:15px;}
  .simple-choice b {font-size:18px;}
  .home-tool-card {padding:17px;gap:12px;border-radius:20px;}
  .home-tool-copy h2 {font-size:20px;}
  .home-tool-copy p {font-size:13px;}
  .panel {padding:20px;border-radius:22px;}
  .wizard-panel h2 {font-size:26px;}
  .episode-hero-clean h1 {font-size:26px;}
  .easy-workflow {padding:18px;border-radius:22px;}
  .easy-step {padding:16px;border-radius:18px;}
  .easy-step-copy h3 {font-size:19px;}
  .btn.mega {font-size:16px;}
  .merge-modal,.prompt-modal {border-radius:22px;}
  .grid-form {grid-template-columns:1fr;}
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after {scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;}
}


/* Electric Blue + Cyan theme (v2): final brand accents for every screen */
:root {
  --bg: #f3f8ff;
  --panel: #ffffff;
  --ink: #10213b;
  --muted: #64748b;
  --line: #dce9f8;
  --accent: #2563eb;
  --accent-dark: #1d4ed8;
  --premium-indigo: #0c2149;
  --premium-azure: #06b6d4;
  --premium-violet: #2563eb;
  --shadow: 0 21px 60px rgba(28,75,145,.09), 0 2px 12px rgba(20,69,134,.03);
}
body {
  background: radial-gradient(ellipse 60% 32% at 95% 0%, rgba(37,99,235,.12), transparent 75%),
              radial-gradient(ellipse 46% 34% at 1% 25%, rgba(6,182,212,.10), transparent 80%),
              linear-gradient(180deg,#f3f8ff 0%,#fbfdff 68%,#f0f7ff 100%);
}
::selection { background: #bfdbfe; color:#12396e; }
.topbar:after {background:linear-gradient(90deg,transparent,rgba(37,99,235,.34),rgba(6,182,212,.36),transparent);}
.eyebrow { color:#2563eb; }
.btn.primary {
  background:linear-gradient(110deg,#2563eb 0%,#1d4ed8 58%,#06b6d4 100%);
  color:#fff;border:1px solid rgba(255,255,255,.16);
  box-shadow:0 10px 28px rgba(37,99,235,.24),inset 0 1px rgba(255,255,255,.24);
}
.btn.primary:hover:not(:disabled) {
  box-shadow:0 15px 32px rgba(37,99,235,.29),0 0 0 5px rgba(6,182,212,.09);
}
.hero-simple {
  background:radial-gradient(ellipse at 87% 16%,rgba(6,182,212,.34),transparent 33%),
             radial-gradient(ellipse at 67% 95%,rgba(37,99,235,.30),transparent 46%),
             linear-gradient(118deg,#0c1e3b 2%,#123160 49%,#0b4660 100%);
  border-color:rgba(96,165,250,.28);
  box-shadow:0 26px 58px rgba(10,46,99,.23),inset 0 1px rgba(255,255,255,.12);
}
.hero-simple:after {border-color:rgba(56,189,248,.18);background:radial-gradient(circle,transparent 34%,rgba(6,182,212,.10) 35%,transparent 50%);}
.hero-simple .eyebrow {color:#a5f3fc;}
.hero-simple .btn.primary {background:linear-gradient(105deg,#2563eb,#1d4ed8 53%,#06b6d4);box-shadow:0 14px 35px rgba(37,99,235,.35),0 0 32px rgba(6,182,212,.13);}
.hero-cinema-art .hero-film {border-color:rgba(186,230,253,.35);}
.hero-cinema-art .hero-film-front {background:radial-gradient(circle at 30% 29%,rgba(125,211,252,.37),transparent 34%),linear-gradient(160deg,#2563a9,#102c58 70%);}
.hero-cinema-art .hero-film-back {background:radial-gradient(circle at 60% 32%,rgba(103,232,249,.54),transparent 30%),linear-gradient(160deg,#0891b2,#143650 70%);}
.simple-choice:hover {border-color:#93c5fd;box-shadow:0 23px 44px rgba(37,99,235,.13);}
.simple-choice:hover:after {color:#2563eb;}
.simple-choice span {background:linear-gradient(140deg,#dbeafe,#ecfeff);box-shadow:inset 0 1px #fff,0 9px 17px rgba(37,99,235,.10);}
.home-tool-card {background:linear-gradient(103deg,rgba(219,234,254,.86),rgba(236,254,255,.76) 63%,rgba(248,250,252,.94));}
.home-tool-icon {background:linear-gradient(135deg,#1e40af,#0891b2);box-shadow:0 12px 20px rgba(37,99,235,.22);}
.project-card:hover {border-color:#93c5fd;box-shadow:0 16px 38px rgba(37,99,235,.11);}
.progress-bar,.step-dot.on,.merge-progress-bar {background:linear-gradient(90deg,#2563eb,#06b6d4);}
.choice.selected {border-color:#2563eb;background:linear-gradient(135deg,#eff6ff,#ecfeff);box-shadow:0 8px 20px rgba(37,99,235,.09);}
.choice .ico {background:#dbeafe;}
.genre.selected {border-color:#2563eb;background:#eff6ff;color:#1d4ed8;box-shadow:0 4px 14px rgba(37,99,235,.11);}
input:focus,textarea:focus,select:focus {border-color:#3b82f6;box-shadow:0 0 0 4px rgba(37,99,235,.12);}
.scene-dot.active span,.easy-step-no {background:linear-gradient(135deg,#2563eb,#06b6d4);box-shadow:0 7px 21px rgba(37,99,235,.26);}
.scene-number-badge {background:linear-gradient(110deg,#dbeafe,#ecfeff);color:#1d4ed8;border-color:#bfdbfe;}
.flow-step .easy-step-no {background:linear-gradient(135deg,#06b6d4,#2563eb);}
.general-add-one {background:linear-gradient(120deg,#eff6ff,#ecfeff);border-color:#93c5fd;}
.prompt-modal-text:focus {border-color:#3b82f6;box-shadow:0 0 0 4px rgba(37,99,235,.12);}
.auth-body {background:radial-gradient(ellipse at 20% 15%,rgba(37,99,235,.13),transparent 46%),radial-gradient(ellipse at 85% 84%,rgba(6,182,212,.15),transparent 44%),linear-gradient(160deg,#f4f9ff,#edf8ff);}
.auth-card:before {background:linear-gradient(90deg,#2563eb,#3b82f6,#06b6d4);}
.auth-card .brand-mark {background:linear-gradient(145deg,#1e40af,#2563eb 66%,#0891b2);color:#fff;box-shadow:0 12px 25px rgba(37,99,235,.23);}
.spinner {border-top-color:#2563eb;}


/* Minimal Premium Header — UI-only adjustment (2026-10-09)
   Keep every existing screen, control and handler unchanged. */
.topbar {
  height: 60px;
  padding: 0 clamp(16px, 2.3vw, 34px);
  background: rgba(255, 255, 255, .96);
  border-bottom: 1px solid #e3ebf7;
  box-shadow: 0 2px 8px rgba(39, 82, 145, .06);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.topbar::after { display: none; }
@media (max-width: 900px) {
  .topbar { height: 58px; padding: 0 16px; }
}
@media (max-width: 650px) {
  .topbar { height: 56px; padding: 0 12px; }
}


/* ============================================================
   AI Plompt — Aurora Cinema Hero (UI-only, 2026-10-10)
   Scope: homepage .hero-simple only. No markup / JS / API change.
   Use with Electric Blue + Cyan, Minimal Premium Header baseline.
   ============================================================ */
.hero-simple {
  background:
    radial-gradient(ellipse 50% 66% at 93% 15%, rgba(0,212,255,.36) 0%, rgba(6,182,212,.08) 43%, transparent 72%),
    radial-gradient(ellipse 65% 95% at 58% 114%, rgba(48,113,249,.34) 0%, transparent 67%),
    radial-gradient(ellipse 38% 55% at 16% -18%, rgba(55,137,244,.15), transparent 76%),
    linear-gradient(118deg, #0a1b36 0%, #103363 49%, #084c66 100%);
  background-size: 150% 150%, 140% 140%, 130% 130%, 100% 100%;
  background-position: 75% 28%, 30% 90%, 0% 0%, center;
  border-color: rgba(115,211,252,.33);
  box-shadow: 0 24px 55px rgba(15,55,102,.18), 0 8px 23px rgba(10,75,123,.09), inset 0 1px rgba(220,244,255,.16);
  animation: ap-aurora-shift 18s ease-in-out infinite alternate;
  transition: border-color .35s ease, box-shadow .35s ease;
}
/* Sparse floating stars over the subtle digital grid, away from main text. */
.hero-simple::before {
  background-image:
    radial-gradient(circle, rgba(175,237,255,.74) 0 1px, transparent 2px),
    radial-gradient(circle, rgba(111,207,255,.47) 0 1px, transparent 2px),
    linear-gradient(rgba(203,230,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(203,230,255,.04) 1px, transparent 1px);
  background-size: 167px 149px, 237px 181px, 40px 40px, 40px 40px;
  background-position: 8px 12px, 90px 58px, 0 0, 0 0;
  mask-image: linear-gradient(90deg, transparent 18%, #000 57%);
  -webkit-mask-image: linear-gradient(90deg, transparent 18%, #000 57%);
  opacity: .72;
  animation: ap-stars-drift 30s ease-in-out infinite alternate;
}
.hero-simple::after {
  z-index: 0;
  border-color: rgba(110,222,255,.22);
  background: radial-gradient(circle at 30% 32%, rgba(58,175,245,.12), transparent 55%);
  box-shadow: 0 0 0 80px rgba(47,164,239,.025), 0 0 0 156px rgba(52,146,248,.014), inset 0 0 48px rgba(23,189,244,.045);
  animation: ap-ring-breathe 10s ease-in-out infinite alternate;
}
/* Crisp typography and the subtle green status indicator are retained. */
.hero-simple h1 {
  text-shadow: 0 6px 34px rgba(2,12,35,.24), 0 0 45px rgba(153,219,255,.045);
}
.hero-simple .eyebrow::before {
  animation: ap-status-pulse 3.3s ease-in-out infinite;
}
/* Gentle animated highlight, only on the existing primary CTA. */
.hero-simple .btn.primary {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: linear-gradient(105deg, #2563eb 0%, #1e60e1 44%, #04b8da 100%);
  border: 1px solid rgba(178,240,255,.34);
  box-shadow: 0 12px 31px rgba(5,98,219,.28), 0 0 28px rgba(9,196,237,.12), inset 0 1px rgba(255,255,255,.29);
  transition: transform .22s ease, box-shadow .25s ease, border-color .25s ease;
}
.hero-simple .btn.primary::before {
  content: "";
  position: absolute;
  inset: -50% auto -50% -72%;
  width: 50%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.26), transparent);
  transform: skewX(-24deg);
  animation: ap-cta-glint 5.2s linear infinite;
}
/* Decoration layers never cover or intercept interactive elements. */
.hero-cinema-art { isolation: isolate; }
.hero-cinema-art::before {
  content: "";
  position: absolute;
  z-index: 0;
  width: 79%;
  height: 82%;
  top: 6%;
  left: 10%;
  border: 1px solid rgba(110,229,255,.22);
  border-radius: 50%;
  transform: rotate(-18deg);
  box-shadow: 0 0 0 18px rgba(91,186,255,.025), 0 0 38px rgba(40,186,244,.08), inset 0 0 37px rgba(15,149,220,.06);
  animation: ap-orbit-float 12s ease-in-out infinite alternate;
}
.hero-cinema-art::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 19% 26%, rgba(218,255,255,.95) 0 1.5px, transparent 3px),
    radial-gradient(circle at 78% 76%, rgba(141,230,255,.8) 0 1.4px, transparent 3px),
    radial-gradient(circle at 11% 79%, rgba(113,219,255,.75) 0 1px, transparent 2.5px),
    radial-gradient(circle at 87% 18%, rgba(208,255,253,.8) 0 1.5px, transparent 3px);
  filter: drop-shadow(0 0 7px rgba(49,207,247,.5));
  animation: ap-particles 5.6s ease-in-out infinite alternate;
}
.hero-cinema-art .hero-halo { z-index: 0; }
.hero-cinema-art .hero-film { z-index: 2; }
.hero-cinema-art .hero-film::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(145deg, rgba(209,247,255,.12), transparent 35%, transparent 78%, rgba(13,195,237,.12));
}
.hero-cinema-art .hero-film-front {
  box-shadow: 0 30px 75px rgba(1,13,41,.49), 0 0 37px rgba(18,149,255,.13), inset 0 1px rgba(255,255,255,.32);
}
.hero-cinema-art .hero-film-back {
  box-shadow: 0 25px 66px rgba(1,15,42,.45), 0 0 38px rgba(6,217,232,.16), inset 0 1px rgba(255,255,255,.25);
}
.hero-cinema-art .hero-star { z-index: 3; }
.hero-cinema-art .hero-star.one { text-shadow: 0 0 22px rgba(111,235,255,.86), 0 0 40px rgba(6,182,212,.35); }

@keyframes ap-aurora-shift {
  0% { background-position: 75% 20%, 25% 88%, 0% 0%, center; }
  100% { background-position: 95% 44%, 50% 65%, 12% 12%, center; }
}
@keyframes ap-stars-drift {
  from { background-position: 8px 12px, 90px 58px, 0 0, 0 0; opacity: .55; }
  to { background-position: 24px -10px, 76px 84px, 0 9px, 0 9px; opacity: .84; }
}
@keyframes ap-ring-breathe {
  from { opacity: .56; transform: scale(.985); }
  to { opacity: .98; transform: scale(1.055); }
}
@keyframes ap-status-pulse {
  0%, 100% { box-shadow: 0 0 0 3px rgba(77,235,197,.13), 0 0 10px rgba(80,230,201,.48); }
  50% { box-shadow: 0 0 0 6px rgba(77,235,197,.08), 0 0 18px rgba(80,230,201,.82); }
}
@keyframes ap-cta-glint {
  0%{left:-72%;opacity:0}
  10%{opacity:.9}
  78%{left:138%;opacity:.9}
  100%{left:138%;opacity:0}
}
@keyframes ap-orbit-float {
  from { transform: rotate(-18deg) translateY(2px); opacity: .48; }
  to { transform: rotate(3deg) translateY(-11px); opacity: .9; }
}
@keyframes ap-particles {
  from { opacity: .28; transform: translateY(5px); }
  to { opacity: .77; transform: translateY(-9px); }
}
@media (hover: hover) and (pointer: fine) {
  .hero-simple:hover {
    border-color: rgba(119,233,253,.46);
    box-shadow: 0 28px 66px rgba(15,55,102,.22), 0 8px 23px rgba(10,75,123,.11), inset 0 1px rgba(220,244,255,.19);
  }
  .hero-simple .btn.primary:hover:not(:disabled) {
    transform: translateY(-3px);
    border-color: rgba(211,255,255,.62);
    box-shadow: 0 18px 36px rgba(12,109,227,.37), 0 0 36px rgba(9,196,237,.24);
  }
}
@media (max-width: 900px) {
  .hero-cinema-art::before { opacity: .6; }
  .hero-cinema-art::after { opacity: .5; }
}
@media (max-width: 650px) {
  /* Keep the small-screen header uncluttered and preserve contrast. */
  .hero-simple {
    background:
      radial-gradient(ellipse at 115% 16%, rgba(6,182,212,.22), transparent 65%),
      radial-gradient(ellipse at 20% 108%, rgba(37,99,235,.25), transparent 72%),
      linear-gradient(118deg, #0a1b36, #123460 68%, #0d4660);
    background-size: 100% 100%;
    animation: none;
  }
  .hero-simple::before { opacity: .35; }
  .hero-simple::after { opacity: .45; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-simple, .hero-simple::before, .hero-simple::after,
  .hero-simple .eyebrow::before, .hero-simple .btn.primary::before,
  .hero-cinema-art::before, .hero-cinema-art::after { animation: none !important; }
  .hero-simple .btn.primary::before { display: none; }
}


/* ======================================================================
   AI Plompt · VISIBLE CINEMATIC FX (2026-10-10)
   Visual-only homepage animation. No changes to API, auth or film logic.
   Layer is behind headings and button, pointer-events never intercept clicks.
   ====================================================================== */
.hero-simple {
  background:
    radial-gradient(ellipse 44% 83% at 90% 22%, rgba(0,225,255,.28) 0%, rgba(0,151,236,.10) 54%, transparent 82%),
    radial-gradient(ellipse 43% 68% at 65% 94%, rgba(32,99,255,.33) 0%, transparent 84%),
    linear-gradient(115deg,#071c39 0%,#102e5a 49%,#07576d 100%);
  box-shadow: 0 24px 60px rgba(19,58,116,.25), inset 0 0 0 1px rgba(130,226,255,.20);
  border: 1px solid rgba(115,225,251,.40);
}
.hero-simple::before {
  background-image:
    linear-gradient(rgba(164,228,255,.055) 1px, transparent 1px),
    linear-gradient(90deg,rgba(164,228,255,.055) 1px,transparent 1px);
  background-size:44px 44px;
  opacity:.76;
  animation: pl-grid-scroll 16s linear infinite;
}
/* Orbital glow follows the cards and remains in the right-hand art space. */
.hero-fx {
  position:absolute;
  inset:0;
  z-index:1;
  overflow:hidden;
  pointer-events:none!important;
  border-radius:inherit;
  isolation:isolate;
}
.hero-fx > * { pointer-events:none!important; position:absolute; display:block; }
.hero-fx-orb {
  width:550px; height:550px; right:-75px; top:-90px;
  border-radius:50%;
  background:
    radial-gradient(circle at center,rgba(50,222,255,.18) 0%,rgba(23,134,239,.15) 29%,rgba(0,195,239,.09) 41%,transparent 67%),
    radial-gradient(circle at center,transparent 48%,rgba(103,244,255,.21) 48.4%,transparent 49%,transparent 62%,rgba(43,178,246,.23) 62.3%,transparent 63%);
  filter:drop-shadow(0 0 22px rgba(11,183,241,.24));
  animation: pl-orb 9s ease-in-out infinite alternate;
}
/* Three luminous light ribbons, visible even in a still screenshot. */
.hero-fx-trail {
  height:2px;
  width:53%;
  right:-6%;
  border-radius:100px;
  transform-origin:70% 50%;
  background:linear-gradient(90deg,transparent 0%,rgba(37,211,252,.08) 16%,rgba(106,250,255,.81) 54%,rgba(68,194,255,.22) 76%,transparent 100%);
  box-shadow:0 0 12px rgba(24,215,255,.80),0 0 31px rgba(37,139,247,.39);
  opacity:.8;
}
.hero-fx-trail.trail-one {top:31%;transform:rotate(-22deg);animation:pl-trail-one 5.4s ease-in-out infinite alternate;}
.hero-fx-trail.trail-two {top:69%;right:-8%;transform:rotate(19deg);opacity:.5;animation:pl-trail-two 6.5s ease-in-out infinite alternate;}
.hero-fx-trail.trail-three {top:91%;right:11%;width:33%;height:1px;transform:rotate(-12deg);opacity:.4;animation:pl-trail-three 8s ease-in-out infinite alternate;}
/* Twinkling starbursts: 2 crossed filaments each, no text or extra controls. */
.hero-fx-spark {
  width:5px;height:5px;
  border-radius:50%;
  background:#c7fcff;
  box-shadow:0 0 9px 4px rgba(43,234,255,.75),0 0 31px 8px rgba(0,163,255,.25);
  animation:pl-spark 3s ease-in-out infinite;
}
.hero-fx-spark::before,.hero-fx-spark::after {
  content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  background:linear-gradient(transparent,#e2ffff,transparent);
  border-radius:30px;
}
.hero-fx-spark::before {width:2px;height:23px;}
.hero-fx-spark::after {width:21px;height:2px;background:linear-gradient(90deg,transparent,#e2ffff,transparent);}
.hero-fx-spark.s1 {left:57%;top:20%;animation-delay:-1.4s;}
.hero-fx-spark.s2 {left:75%;top:11%;animation-delay:-2.1s;transform:scale(.75);}
.hero-fx-spark.s3 {left:96%;top:77%;animation-delay:-.7s;}
.hero-fx-spark.s4 {left:61%;top:83%;animation-delay:-2.4s;transform:scale(.65);}
.hero-fx-spark.s5 {left:89%;top:93%;animation-delay:-1.9s;transform:scale(.6);}
/* Accent ribbon through the inside bottom edge. */
.hero-fx-edge {
  left:25%;right:4%;bottom:0;height:3px;
  background:linear-gradient(90deg,transparent 0%,rgba(43,150,255,.21) 23%,rgba(29,238,255,.95) 70%,transparent 100%);
  filter:drop-shadow(0 -2px 12px rgba(12,224,255,.90));
  opacity:.8;
  animation:pl-edge-flow 5s ease-in-out infinite alternate;
}
.hero-cinema-art {z-index:2;}
.hero-cinema-art .hero-film-front {
  border:1px solid rgba(166,241,255,.73);
  box-shadow:0 30px 65px rgba(2,14,35,.54),0 0 26px rgba(27,195,255,.40),inset 0 0 14px rgba(127,236,255,.12);
  animation:pl-card-front 4.3s ease-in-out infinite;
}
.hero-cinema-art .hero-film-back {
  border:1px solid rgba(74,223,251,.48);
  box-shadow:0 25px 58px rgba(3,23,54,.53),0 0 26px rgba(6,211,231,.31);
  animation:pl-card-back 5.1s ease-in-out infinite;
}
.hero-cinema-art .film-play {
  background:rgba(146,237,255,.22);
  border:1px solid rgba(205,252,255,.90);
  box-shadow:0 0 0 12px rgba(129,236,255,.09),0 0 24px rgba(58,209,255,.43);
  animation:pl-play-pulse 2.5s ease-in-out infinite;
}
.hero-cinema-art .hero-star.one {color:#d7ffff;font-size:36px;animation:premiumTwinkle 2.2s ease-in-out infinite;}
.hero-simple .btn.primary {
  background:linear-gradient(102deg,#1f67ef 0%,#2063ea 43%,#08c4ee 100%);
  border-color:rgba(194,248,255,.53);
  box-shadow:0 12px 30px rgba(15,104,231,.40),0 0 24px rgba(35,213,255,.23),inset 0 1px rgba(255,255,255,.45);
}
.hero-simple .btn.primary::before {
  width:56%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.60),transparent);
  animation:pl-cta-flash 1.7s linear infinite;
}
@keyframes pl-grid-scroll {from{background-position:0 0,0 0;}to{background-position:0 44px,44px 0;}}
@keyframes pl-orb {from{transform:translate(-15px,-7px) scale(.95) rotate(-8deg);opacity:.70;}to{transform:translate(22px,15px) scale(1.10) rotate(8deg);opacity:1;}}
@keyframes pl-trail-one {from{transform:rotate(-23deg) translateX(-16px);opacity:.48;}to{transform:rotate(-18deg) translateX(24px);opacity:1;}}
@keyframes pl-trail-two {from{transform:rotate(18deg) translateX(16px);opacity:.32;}to{transform:rotate(23deg) translateX(-20px);opacity:.78;}}
@keyframes pl-trail-three {from{transform:rotate(-12deg) translateX(-15px);opacity:.2;}to{transform:rotate(-7deg) translateX(22px);opacity:.68;}}
@keyframes pl-spark {0%,100%{opacity:.25;filter:brightness(.8) scale(.8);}46%{opacity:1;filter:brightness(1.65);}66%{opacity:.68;filter:brightness(1.1);}}
@keyframes pl-edge-flow {from{filter:drop-shadow(0 -1px 8px rgba(12,224,255,.53));opacity:.45;}to{filter:drop-shadow(0 -2px 16px rgba(12,224,255,1));opacity:.95;}}
@keyframes pl-card-front {0%,100%{transform:rotate(-10deg) translateY(0);}50%{transform:rotate(-6deg) translateY(-16px);}}
@keyframes pl-card-back {0%,100%{transform:rotate(14deg) translate(22px,3px) scale(.91);}50%{transform:rotate(18deg) translate(28px,12px) scale(.91);}}
@keyframes pl-play-pulse {0%,100%{box-shadow:0 0 0 10px rgba(129,236,255,.08),0 0 18px rgba(58,209,255,.35);}50%{box-shadow:0 0 0 17px rgba(129,236,255,.045),0 0 36px rgba(58,209,255,.7);}}
@keyframes pl-cta-flash {
  0%{left:-72%;opacity:0;}
  10%{opacity:1;}
  78%{left:165%;opacity:1;}
  100%{left:165%;opacity:0;}
}
@media (max-width:1120px) {
  .hero-fx-trail {right:-16%;width:60%;}
  .hero-fx-orb {right:-160px;}
}
@media (max-width:900px) {
  .hero-fx-orb {width:480px;height:480px;right:-240px;top:-50px;opacity:.68;}
  .hero-fx-trail {opacity:.34;}
  .hero-fx-spark.s1,.hero-fx-spark.s4 {display:none;}
}
@media (max-width:650px) {
  /* Visible, restrained glow for narrow screens; no card overlap with text. */
  .hero-simple {
    background:radial-gradient(ellipse at 110% 12%,rgba(10,201,249,.31),transparent 62%),
    radial-gradient(ellipse at 50% 109%,rgba(35,109,248,.24),transparent 70%),
    linear-gradient(115deg,#091c39,#103464 65%,#0b5466);
  }
  .hero-fx-orb {width:270px;height:270px;right:-162px;top:-86px;opacity:.58;}
  .hero-fx-trail {width:75%;right:-31%;opacity:.27;}
  .hero-fx-trail.trail-one {top:19%;}
  .hero-fx-trail.trail-two {top:89%;}
  .hero-fx-trail.trail-three {display:none;}
  .hero-fx-spark {opacity:.7;transform:scale(.6);}
  .hero-fx-spark.s2 {left:89%;top:16%;}
  .hero-fx-spark.s3 {left:96%;top:82%;}
  .hero-fx-edge {left:5%;right:5%;opacity:.62;}
}
@media (prefers-reduced-motion: reduce) {
  .hero-simple::before,.hero-fx >*,.hero-cinema-art .hero-film-front,
  .hero-cinema-art .hero-film-back,.hero-cinema-art .film-play,
  .hero-simple .btn.primary::before {animation:none!important;transition:none!important;}
  .hero-simple .btn.primary::before {display:none;}
}