/* ミレルナビ（/mirerunavi/） */
/* hidden 属性よりクラスの display が勝ってしまうのを防ぐ（これが無いとモーダルの背景が常に画面を覆う）。消さないこと。 */
[hidden]{display:none!important}
*{box-sizing:border-box}
/* 2026-10-15 サイト全体を「映画館」の色に（暗い場内・チケットの金と赤）。--accent は金色なので、金の上の文字は暗い色（--on-accent）にする */
:root{--bg:#07080f;--card:#12142a;--ink:#ecebf3;--sub:#9aa0bd;--line:#262a45;--accent:#ffc94a;--accent-soft:#2c2614;--on-accent:#1b1200;--field:#0c0e1d;--red:#d1192a;color-scheme:dark}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI","Hiragino Sans","Yu Gothic",Meiryo,sans-serif}
body.noscroll{overflow:hidden}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}

.top{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;padding:12px 16px;background:var(--card);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.brand b{font-size:20px;letter-spacing:.02em}
.brand span{margin-left:8px;color:var(--sub);font-size:13px}
.search{display:flex;flex:1 1 280px;max-width:560px}
.search input{flex:1;min-width:0;height:40px;padding:0 12px;border:1px solid var(--line);border-right:0;border-radius:8px 0 0 8px;background:#fff}
.search button{height:40px;padding:0 18px;border:0;border-radius:0 8px 8px 0;background:var(--accent);color:#fff;font-weight:700}
.stats{margin-left:auto;color:var(--sub);font-size:12.5px}
.notice{margin:12px 16px 0;padding:10px 14px;border:1px solid #f1d38a;border-radius:8px;background:#fff8e1;font-size:14px}

.layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:16px;padding:16px;align-items:start}
.filters{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:4px 14px 14px;position:sticky;top:76px;max-height:calc(100vh - 92px);overflow:auto}
.filter-toggle{display:none}
.filters section{padding:12px 0;border-bottom:1px solid var(--line)}
.filters h2{margin:0 0 8px;font-size:13px;color:var(--sub);font-weight:700}
.filters h2 small{margin-left:6px;font-weight:400}
.filters select,.filters input[type=number],.filters input[type=text]{width:100%;height:36px;padding:0 8px;border:1px solid var(--line);border-radius:6px;background:#fff}
.range{display:flex;align-items:center;gap:6px}
.range span{color:var(--sub)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chips button{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border:1.5px solid var(--line);border-radius:999px;background:#fff;font-size:13.5px;font-weight:600}
.chips button small{font-weight:400;color:var(--sub);font-size:11.5px}
.chips button.on{border-color:var(--c,var(--accent));background:var(--c,var(--accent));color:#fff}
.chips button.on small{color:#fff;opacity:.85}
.chips.small button{padding:3px 9px;font-size:12.5px;font-weight:500}
.seg{display:flex;margin-top:8px;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.seg button{flex:1;padding:6px 4px;border:0;border-right:1px solid var(--line);background:#fff;font-size:12.5px}
.seg button:last-child{border-right:0}
.seg button.on{background:var(--accent-soft);color:var(--accent);font-weight:700}
.check{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:13px}
.person{position:relative}
.person ul{position:absolute;z-index:5;left:0;right:0;margin:2px 0 0;padding:4px 0;list-style:none;background:#fff;border:1px solid var(--line);border-radius:6px;box-shadow:0 6px 18px rgba(0,0,0,.12);max-height:260px;overflow:auto}
.person li{display:flex;justify-content:space-between;gap:8px;padding:6px 10px;cursor:pointer;font-size:13.5px}
.person li:hover{background:var(--accent-soft)}
.person li.none{cursor:default;color:var(--sub)}
.person li small{color:var(--sub)}
.picked{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px;padding:6px 10px;border-radius:6px;background:var(--accent-soft);font-size:13.5px;font-weight:700}
.picked button{border:0;background:none;color:var(--accent);font-size:12.5px}
.reset{width:100%;margin-top:14px;padding:8px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--sub)}

.bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}
.count{font-size:16px;font-weight:700}
.bar-right{display:flex;gap:8px;align-items:center}
.bar select{height:36px;padding:0 8px;border:1px solid var(--line);border-radius:6px;background:#fff}
.btn{display:inline-flex;align-items:center;height:36px;padding:0 12px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink);text-decoration:none;font-size:13.5px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.card{position:relative;display:flex;flex-direction:column;padding:0;border:0;background:none;text-align:left}
.card img,.card .noimg{width:100%;aspect-ratio:2/3;border-radius:8px;background:#d9dde3;object-fit:cover;box-shadow:0 1px 4px rgba(0,0,0,.15)}
.card .noimg{display:flex;align-items:center;justify-content:center;padding:10px;color:var(--sub);font-size:13px;text-align:center}
.card:hover img,.card:focus-visible img{box-shadow:0 0 0 3px var(--accent)}
.card .provs{display:flex;flex-wrap:wrap;gap:3px;margin-top:6px;min-height:18px}
.card .provs i{padding:0 6px;border-radius:4px;background:var(--c);color:#fff;font-size:10.5px;font-style:normal;font-weight:700;line-height:17px}
.card .name{margin-top:4px;font-size:13.5px;font-weight:700;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card .sub{color:var(--sub);font-size:12px}
.empty{padding:40px 16px;text-align:center;color:var(--sub)}
.more{display:block;margin:20px auto 0;padding:10px 28px;border:1px solid var(--line);border-radius:999px;background:#fff;font-weight:700}

.modal{position:fixed;inset:0;z-index:50;display:flex;align-items:flex-start;justify-content:center;padding:24px 12px;background:rgba(15,20,30,.6);overflow:auto}
.modal-card{position:relative;width:100%;max-width:820px;padding:22px;border-radius:12px;background:var(--card)}
.modal-close{position:absolute;top:8px;right:10px;width:36px;height:36px;border:0;border-radius:50%;background:#eef0f3;font-size:20px;line-height:1}
.loading{padding:40px 0;text-align:center;color:var(--sub)}
.detail{display:flex;gap:20px}
.detail .poster{width:210px;align-self:flex-start;border-radius:8px}
.detail .info{flex:1;min-width:0}
.detail h2{margin:0 36px 2px 0;font-size:22px;line-height:1.35}
.detail .orig{margin:0;color:var(--sub);font-size:13px}
.detail h3{margin:18px 0 6px;font-size:13px;color:var(--sub)}
.detail .facts{margin:8px 0;font-size:13.5px}
.detail .facts span{margin:0 2px;color:var(--sub)}
.detail .genres{display:flex;flex-wrap:wrap;gap:6px;margin:0}
.detail .genres span{padding:1px 9px;border-radius:999px;background:#eef0f3;font-size:12px}
.detail .genres .country{background:var(--accent-soft)}
.watches{display:flex;flex-wrap:wrap;gap:8px}
.watch{display:flex;flex-direction:column;min-width:150px;padding:8px 14px;border-radius:8px;background:var(--c);color:#fff;font-weight:700;text-decoration:none}
.watch small{font-weight:400;font-size:11.5px;opacity:.9}
.others{margin:10px 0 0;padding:0;list-style:none;font-size:13.5px}
.others b{display:inline-block;min-width:70px;color:var(--sub);font-weight:700}
.note{margin:6px 0 0;color:var(--sub);font-size:12px}
.overview{margin:0;white-space:pre-wrap}
.people{display:flex;flex-wrap:wrap;gap:6px;margin:0}
.person-link{padding:2px 10px;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:13px}
.person-link:hover{border-color:var(--accent);color:var(--accent)}

.foot{display:flex;gap:16px;align-items:center;margin-top:24px;padding:16px;border-top:1px solid var(--line);color:var(--sub);font-size:12px}
.foot p{margin:0}

@media (max-width:820px){
  .layout{grid-template-columns:1fr;padding:12px}
  .filters{position:static;max-height:none;padding:10px 14px}
  .filter-toggle{display:block;width:100%;padding:8px;border:1px solid var(--line);border-radius:8px;background:#fff;font-weight:700}
  .filter-body{display:none}
  .filters.open .filter-body{display:block}
  .stats{margin-left:0;width:100%}
  .grid{grid-template-columns:repeat(auto-fill,minmax(105px,1fr));gap:10px}
  .detail{flex-direction:column}
  .detail .poster{width:140px}
}


/* APIキーの入力（はじめに） */
.key-change{margin-left:auto;padding:6px 12px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--sub);font-size:12.5px}
.setup{max-width:720px;margin:28px auto;padding:24px 26px;border:1px solid var(--line);border-radius:12px;background:var(--card)}
.setup h1{margin:0 0 10px;font-size:20px;line-height:1.4}
.setup ol{padding-left:22px}
.setup li{margin:6px 0}
.key-row{display:flex;gap:8px;margin-top:16px}
.key-row input{flex:1;min-width:0;height:44px;padding:0 12px;border:1px solid var(--line);border-radius:8px;background:#fff}
.key-row button{height:44px;padding:0 20px;border:0;border-radius:8px;background:var(--accent);color:#fff;font-weight:700;white-space:nowrap}
.key-row button:disabled{opacity:.6}
.key-msg{min-height:1.6em;margin:8px 0 0;color:#b42318;font-size:14px}
.key-notes{margin:14px 0 0;padding-left:20px;color:var(--sub);font-size:13px}
.cond-note{margin:0 0 12px;padding:8px 12px;border-radius:8px;background:var(--accent-soft);font-size:13px}
.card .provs i.none{background:#9aa3ad;font-weight:500}
@media (max-width:820px){.setup{margin:12px;padding:18px}.key-row{flex-direction:column}}

/* Streaming Availability API 版で足したもの */
.quota{margin-left:auto;padding:4px 10px;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-size:12.5px;font-weight:700;white-space:nowrap}
.quota:empty{display:none}
.quota.low{background:#fde8e8;color:#b42318}
.quota + .key-change{margin-left:0}
.run{width:100%;margin-top:14px;padding:10px;border:0;border-radius:8px;background:var(--accent);color:#fff;font-weight:700}
.run.dirty{box-shadow:0 0 0 3px #f5b301}
.run:disabled{opacity:.6}
.run-note{margin:6px 0 0;color:var(--sub);font-size:12px}
.reset{margin-top:8px}
.card .provs i.paid{background:#fff;color:var(--sub);box-shadow:inset 0 0 0 1px var(--line);font-weight:500}
.card .provs i.soon{background:#b42318}
.others a{color:var(--accent);font-weight:700}
.plain{margin:0;font-size:13.5px}
.foot a{color:inherit}

/* ほかのサービスで探す（国内サービスの検索リンク） */
.search-links{display:flex;flex-wrap:wrap;gap:6px}
.search-links a{padding:5px 12px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);font-size:13px;font-weight:600;text-decoration:none}
.search-links a:hover{border-color:var(--accent);color:var(--accent)}

/* はじめての方への登録案内 */
.setup .lead{font-size:15px}
.steps{margin:18px 0 0;padding:0;list-style:none;counter-reset:st}
.steps>li{position:relative;margin:0 0 18px;padding:14px 16px 14px 58px;border:1px solid var(--line);border-radius:10px;background:#fafbfc;counter-increment:st}
.steps>li::before{content:counter(st);position:absolute;left:14px;top:14px;width:32px;height:32px;border-radius:50%;background:var(--accent);color:#fff;font-weight:700;text-align:center;line-height:32px}
.steps h2{margin:3px 0 6px;font-size:16px}
.steps p{margin:6px 0}
.steps img{display:block;width:100%;height:auto;margin-top:10px;border:1px solid var(--line);border-radius:8px}
.steps .hint{color:var(--sub);font-size:13px}
.big-link{display:inline-block;padding:10px 20px;border-radius:8px;background:var(--accent);color:#fff;font-weight:700;text-decoration:none}
.key-paste{height:44px;padding:0 14px;border:1px solid var(--line);border-radius:8px;background:#fff;font-weight:700;white-space:nowrap}
.faq-title{margin:24px 0 8px;font-size:16px}
.setup details{margin:0 0 8px;padding:10px 14px;border:1px solid var(--line);border-radius:8px;background:#fff}
.setup summary{cursor:pointer;font-weight:700}
.setup details p{margin:8px 0 0;font-size:14px}
@media (max-width:820px){.steps>li{padding-left:50px}.steps>li::before{left:10px}}

/* タイトル検索の案内（国内サービスの検索ボタン） */
.search-help{align-items:center;margin:0 0 12px}
.search-help span{color:var(--sub);font-size:13px;margin-right:4px}
.empty .empty-title{font-size:16px;font-weight:700;color:var(--ink)}
.empty p{margin:8px auto;max-width:640px}
.search-links.big{justify-content:center;margin:16px 0}
.search-links.big a{padding:8px 16px;font-size:14px}

/* マイリスト */
.ml-open{padding:5px 12px;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:13px;font-weight:700;white-space:nowrap}
.ml-open b{margin-left:2px;color:var(--accent)}
.ml-open:not([hidden]) + .quota{margin-left:0}
.top .ml-open{margin-left:auto}
.ml-tabs{margin-top:0;min-width:220px}
.ml-btns{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 0}
.ml-btn{padding:6px 14px;border:1px solid var(--line);border-radius:8px;background:#fff;font-size:13.5px;font-weight:700}
.ml-btn.on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}
.card .ml-mark{position:absolute;top:6px;left:6px;z-index:1;padding:2px 6px;border-radius:6px;background:rgba(255,255,255,.92);font-size:14px;line-height:1.3;box-shadow:0 1px 3px rgba(0,0,0,.25)}

/* 紹介（キーをまだ入れていない人の最初の画面）。「おうち映画館」— 幕・電球の看板・光るスクリーン・客席。ここだけ暗い色 */
body.on-intro{background:#07080f}
body.on-intro .top{background:#07080f;border-bottom-color:#1d2033;color:#fff}
body.on-intro .brand span{color:#9aa0bd}
body.on-intro .foot{border-top-color:#1d2033;color:#7d83a0}
.intro{--gold:#ffc94a;--red:#a3111c;color:#e8eaf6}
.theater{position:relative;overflow:hidden;padding:64px 16px 0;background:radial-gradient(ellipse at 50% 35%,#24284a 0%,#0c0e1c 60%,#07080f 100%)}
.valance{position:absolute;top:0;left:0;right:0;height:34px;z-index:3;background:repeating-linear-gradient(90deg,#7a0a14 0 30px,#b0141f 30px 46px,#7a0a14 46px 60px);
  -webkit-mask:radial-gradient(circle 30px at 30px -6px,#000 99%,transparent) 0 0/60px 34px;mask:radial-gradient(circle 30px at 30px -6px,#000 99%,transparent) 0 0/60px 34px;filter:drop-shadow(0 4px 6px rgba(0,0,0,.5))}
.curtain{position:absolute;top:0;bottom:0;width:13%;z-index:2;background:repeating-linear-gradient(90deg,#5c0610 0,#a3111c 14px,#c91d2a 22px,#a3111c 30px,#5c0610 44px);box-shadow:0 0 40px rgba(0,0,0,.7)}
.curtain.left{left:0;border-radius:0 0 60% 0}
.curtain.right{right:0;border-radius:0 0 0 60%}
.marquee{position:relative;z-index:1;display:table;margin:0 auto 22px;padding:8px 22px;border-radius:8px;background:#1a1408;color:var(--gold);font-weight:800;letter-spacing:.2em;font-size:14px;
  box-shadow:0 0 0 3px #3a2a08,0 0 24px rgba(255,201,74,.35);background-image:radial-gradient(circle,#ffe08a 2px,transparent 3px);background-size:14px 14px;background-position:0 0;
  animation:bulbs 1.2s steps(2) infinite}
.marquee span{display:block;padding:4px 10px;background:#1a1408;border-radius:4px}
@keyframes bulbs{50%{background-position:7px 0}}
.screen{position:relative;z-index:1;max-width:760px;margin:0 auto;padding:44px 32px 40px;border-radius:10px;text-align:center;
  background:linear-gradient(180deg,#f7f8ff,#dfe4fb);color:#141729;box-shadow:0 0 0 6px #111427,0 0 80px 10px rgba(160,180,255,.35),0 40px 80px rgba(0,0,0,.6)}
.eyebrow{margin:0 0 8px;color:#a3111c;font-size:14px;font-weight:800;letter-spacing:.06em}
.screen h1{margin:0;font-size:clamp(34px,6.5vw,60px);line-height:1.15;letter-spacing:.02em}
.screen h1 em{font-style:normal;color:#d1192a}
.screen-sub{margin:16px auto 26px;max-width:560px;color:#3d4360;font-size:16px;line-height:1.8}
.cta{padding:15px 36px;border:0;border-radius:999px;background:linear-gradient(90deg,#ffb300,#ff6f3c);color:#1b1200;font-size:17px;font-weight:800;box-shadow:0 8px 24px rgba(255,140,40,.4);transition:transform .15s}
.cta:hover{transform:translateY(-2px)}
.cta-note{margin:10px 0 0;color:#5b6180;font-size:13px}
.seats{position:relative;z-index:1;display:flex;justify-content:center;gap:10px;margin:46px auto 0;max-width:760px}
.seats i{flex:1;max-width:72px;height:46px;border-radius:18px 18px 4px 4px;background:linear-gradient(180deg,#3a0d14,#1d060a);box-shadow:inset 0 3px 0 rgba(255,255,255,.08)}
.lineup{padding:40px 16px 8px;background:#07080f;text-align:center}
.intro-h{margin:0 0 16px;font-size:22px;text-align:center;color:#fff}
.lineup-note{margin:18px 0 10px;color:#9aa0bd;font-size:14px}
.lineup-note b{color:var(--gold)}
.svc{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:900px;margin:0 auto;padding:0;list-style:none}
.svc li{display:flex;align-items:center;justify-content:center;width:84px;height:84px;padding:6px;border-radius:18px;background:#161a2e;border:1px solid #262b45;
  color:var(--t,#fff);font-size:14px;font-weight:800;line-height:1.2;text-align:center}
.svc-main li{width:104px;height:104px;border-radius:22px;font-size:17px;background:#0f1222;border:2px solid var(--t);box-shadow:0 0 18px color-mix(in srgb,var(--t) 35%,transparent)}
.intro-body{padding:40px 16px 16px;background:#07080f}
.intro-body>*{max-width:1040px;margin-left:auto;margin-right:auto}
.features{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:44px;padding:0;list-style:none}
.features li{padding:20px 18px;border-radius:14px;background:#12152a;border:1px solid #232845}
.f-icon{display:block;font-size:30px;margin-bottom:8px}
.features b{color:#fff;font-size:15.5px}
.features p{margin:6px 0 0;color:#9aa0bd;font-size:13.5px}
/* 3ステップは映画のチケット風（左に半券のミシン目） */
.tickets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:0;list-style:none}
.tickets li{position:relative;padding:18px 18px 18px 30px;border-radius:10px;background:linear-gradient(135deg,#ffd76a,#ffb43a);color:#2a1a00;
  -webkit-mask:radial-gradient(circle 9px at 0 50%,transparent 98%,#000);mask:radial-gradient(circle 9px at 0 50%,transparent 98%,#000)}
.tickets li::after{content:"";position:absolute;left:16px;top:10px;bottom:10px;border-left:2px dashed rgba(42,26,0,.35)}
.t-no{display:block;font-size:12px;font-weight:800;letter-spacing:.15em;color:#8a3b00}
.tickets b{font-size:17px}
.tickets p{margin:4px 0 0;font-size:13.5px;color:#4a3300}
.flow-cta{margin:28px auto;text-align:center}
.why{max-width:720px;margin-bottom:20px;padding:12px 16px;border-radius:10px;background:#12152a;border:1px solid #232845}
.why summary{cursor:pointer;font-weight:700;color:#fff}
.why p{margin:8px 0 0;font-size:14px;color:#c4c8de}
.back{margin:0 0 10px}
.back-link{padding:0;border:0;background:none;color:var(--accent);font-size:14px;font-weight:700}
@media (prefers-reduced-motion:reduce){.marquee{animation:none}}
@media (max-width:820px){
  .theater{padding:52px 12px 0}
  .curtain{width:7%}
  .screen{padding:30px 18px 28px}
  .cta{width:100%}
  .seats{gap:6px}
  .features{grid-template-columns:1fr 1fr}
  .tickets{grid-template-columns:1fr}
  .svc li{width:74px;height:74px;font-size:12.5px;border-radius:16px}
  .svc-main li{width:82px;height:82px;font-size:14px}
}
@media (max-width:480px){.features{grid-template-columns:1fr}}

/* ロゴ（2026-10-15 決定。チケット＝img/logo.svg、アイコン＝img/icon.svg「ミ」。作り方は ~/mirerunavi/logo/） */
.brand{display:flex;align-items:center}
.brand-icon{width:30px;height:30px;margin-right:8px;flex:none}
.hero-logo{display:block;width:min(340px,88%);height:auto;margin:0 auto 18px;transform:rotate(-5deg);filter:drop-shadow(0 8px 14px rgba(20,10,30,.35))}
@media (prefers-reduced-motion:no-preference){.hero-logo{animation:tk-in .7s ease-out both}}
@keyframes tk-in{from{transform:rotate(-14deg) translateY(10px) scale(.94)}to{transform:rotate(-5deg)}}

/* 全話完結（目安）の説明 */
.hint-s{margin:6px 0 0;color:var(--sub);font-size:12px;line-height:1.5}

/* リンクフリーの表示（フッター） */
.foot .linkfree{color:inherit;font-weight:700}

/* ===== 映画館の雰囲気（サイト全体・2026-10-15）=====
   上の各部品は白い背景を直接書いているものが多いので、ここでまとめて暗い色に置き換える。 */
body{background:radial-gradient(ellipse 1200px 520px at 50% -120px,#1d2142 0%,rgba(7,8,15,0) 70%) no-repeat,var(--bg)}
/* 上の帯：暗い幕の色と、下に金色の電球の列 */
.top{background:#0a0b16;border-bottom:0;box-shadow:0 1px 0 #1d2033}
.top::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:3px;background:radial-gradient(circle,#ffd76a 1.2px,transparent 1.8px) 0 0/12px 3px;opacity:.75}
.brand span{color:var(--sub)}
/* 入力欄・選択欄 */
.search input,.filters select,.filters input[type=number],.filters input[type=text],.bar select,.key-row input{background:var(--field);border-color:var(--line);color:var(--ink)}
.search input::placeholder,.filters input::placeholder,.key-row input::placeholder{color:#6d7394}
/* 金色のボタン（文字は暗く） */
.search button,.run,.key-row button,.big-link{background:linear-gradient(90deg,#ffb300,#ff8a3c);color:var(--on-accent)}
.steps>li::before{background:var(--red);color:#fff}
.run.dirty{box-shadow:0 0 0 3px rgba(255,201,74,.45),0 0 18px rgba(255,170,60,.45)}
/* 小さなボタン・札 */
.chips button,.seg button,.reset,.more,.btn,.person-link,.key-change,.key-paste,.ml-open,.ml-btn,.search-links a,.filter-toggle{background:var(--card);border-color:var(--line);color:var(--ink)}
.chips.small button.on{color:var(--on-accent)}
.seg{border-color:var(--line)}
.seg button{border-right-color:var(--line)}
.seg button.on,.ml-btn.on{background:var(--accent-soft);color:var(--accent);border-color:var(--accent)}
.more:hover,.reset:hover,.chips button:hover,.search-links a:hover{border-color:var(--accent)}
.person ul{background:var(--card);border-color:var(--line)}
.quota.low{background:#3a1216;color:#ff8a8a}
.key-msg{color:#ff8a8a}
.notice{background:#2c2614;border-color:#6a4a10}
/* 絞り込みの枠：客席のような落ち着いた面 */
.filters{background:linear-gradient(180deg,#14172e,#0f1124);border-color:var(--line)}
/* 作品カード：ポスターに金色のスポットライト */
.card img,.card .noimg{background:#1a1d33;box-shadow:0 2px 10px rgba(0,0,0,.6)}
.card .noimg{color:var(--sub)}
.card:hover img,.card:focus-visible img{box-shadow:0 0 0 2px var(--accent),0 0 22px rgba(255,201,74,.35)}
.card .provs i.paid{background:transparent;color:var(--sub);box-shadow:inset 0 0 0 1px var(--line)}
.card .provs i.none{background:#3a3f5c}
.card .ml-mark{background:rgba(10,11,22,.85);box-shadow:0 1px 3px rgba(0,0,0,.5)}
.card .sub{color:var(--sub)}
.count{color:#fff}
.count::before{content:"NOW SHOWING";display:inline-block;margin-right:10px;padding:1px 8px;border-radius:4px;background:var(--red);color:#fff;font-size:11px;letter-spacing:.12em;vertical-align:2px}
.count:empty::before{content:none}
/* 作品の詳細：上に赤い幕の帯 */
.modal{background:rgba(3,4,10,.78)}
.modal-card{background:var(--card);border:1px solid var(--line);border-top:0;overflow:hidden}
.modal-card::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:repeating-linear-gradient(90deg,#7a0a14 0 10px,#c91d2a 10px 18px)}
.modal-close{background:#20243f;color:var(--ink)}
.detail .genres span{background:#20243f}
.detail .genres .country{background:var(--accent-soft)}
.others a{color:var(--accent)}
/* 登録の案内 */
.setup{background:var(--card);border-color:var(--line)}
.steps>li{background:#0e1023;border-color:var(--line)}
.setup details{background:#0e1023;border-color:var(--line)}
.steps img{border-color:#3a3f5c}
.cond-note{background:var(--accent-soft);color:#ffe2a0}
.foot{border-top-color:#1d2033;color:#7d83a0}

/* アカウント（ログイン・登録・設定。2026-10-15） */
.acct-open{padding:5px 12px;border:1px solid var(--accent);border-radius:999px;background:var(--accent-soft);color:var(--accent);font-size:13px;font-weight:700;white-space:nowrap}
.acct-card{max-width:460px;margin-top:6vh}
.acct-card h2{margin:4px 36px 6px 0;font-size:20px}
.lead2{margin:0 0 14px;color:var(--sub);font-size:14px}
.lead2 b{color:var(--ink)}
.af{display:flex;flex-direction:column;gap:4px;margin:0 0 12px;font-size:13.5px;font-weight:700}
.af input{height:44px;padding:0 12px;border:1px solid var(--line);border-radius:8px;background:var(--field);color:var(--ink);font-weight:400}
.af input:focus{outline:2px solid var(--accent);outline-offset:1px}
.af small{color:var(--sub);font-weight:400;font-size:12px}
.af-note{margin:10px 0;color:var(--sub);font-size:12.5px;line-height:1.6}
.af-agree a{color:var(--accent)}
.af-go{width:100%;height:46px;margin-top:6px;border:0;border-radius:8px;background:linear-gradient(90deg,#ffb300,#ff8a3c);color:var(--on-accent);font-weight:800;font-size:15px}
.af-go:disabled{opacity:.6}
.af-go.danger,.af-menu .danger{background:#3a1216;color:#ff9a9a;border:1px solid #6a2228}
.af-links{margin:12px 0 0;text-align:center}
.link-btn{padding:0;border:0;background:none;color:var(--accent);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.af-forgot{margin-top:10px;font-size:13px;color:var(--sub)}
.af-forgot summary{cursor:pointer}
.af-menu{display:flex;flex-direction:column;gap:8px}
.af-menu button{height:44px;border:1px solid var(--line);border-radius:8px;background:var(--field);color:var(--ink);font-weight:700;text-align:left;padding:0 14px}
.af-menu button:hover{border-color:var(--accent)}
/* 紹介ページ（白いスクリーンの上）と登録の案内のログイン入口 */
.acct-line{margin:12px 0 0;color:#5b6180;font-size:14px}
.screen .link-btn{color:#a3111c}
.acct-box{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:0 0 16px;padding:12px 14px;border:1px solid var(--accent);border-radius:10px;background:var(--accent-soft)}
.acct-box span{color:var(--sub);font-size:13.5px;flex:1 1 200px}
.acct-box button{padding:8px 16px;border:0;border-radius:8px;background:linear-gradient(90deg,#ffb300,#ff8a3c);color:var(--on-accent);font-weight:800}
/* 個人情報の取り扱いのページ */
.policy{max-width:760px;margin:0 auto;padding:28px 16px 48px;line-height:1.85}
.policy h1{font-size:24px;line-height:1.4}
.policy h2{margin:30px 0 8px;font-size:18px;color:var(--accent)}
.policy h3{margin:16px 0 4px;font-size:15px}
.policy a{color:var(--accent)}
.policy .tbl{overflow-x:auto}
.policy table{border-collapse:collapse;width:100%;min-width:520px;font-size:14px}
.policy th,.policy td{padding:8px 10px;border:1px solid var(--line);text-align:left;vertical-align:top}
.policy th{background:var(--card)}
.policy .todo{color:#ff9a9a;font-weight:700}
.policy .draft{padding:10px 14px;border:1px solid #6a2228;border-radius:8px;background:#3a1216;color:#ffb0b0;font-weight:700}
a.brand{color:inherit;text-decoration:none}

/* 登録の案内の最後のアカウント登録欄（全員登録・2026-10-15） */
.reg-box{margin-top:14px;padding:14px;border:1px solid var(--line);border-radius:10px;background:var(--field)}
.reg-box .af-agree{margin:4px 0 8px}

/* お知らせメールの同意（2026-10-16） */
.af-optin{align-items:flex-start;margin:4px 0 8px;font-size:13px;line-height:1.6}
.af-optin input{margin-top:4px}
.af-optin small{display:block;color:var(--sub);font-size:12px}

/* 登録＝お知らせメールに同意の表示（2026-10-16） */
.af-notice{margin:8px 0;padding:10px 12px;border-left:3px solid var(--accent);border-radius:4px;background:var(--accent-soft);color:#ffe2a0;font-size:13px;line-height:1.65}

/* お問い合わせ（2026-10-16） */
.notice-box{margin:16px 0 20px;padding:16px 18px;border-left:4px solid var(--red);border-radius:6px;background:var(--card)}
.notice-box p{margin:6px 0 12px}
.notice-box ul{margin:6px 0 12px;padding-left:20px}
.contact-form{max-width:640px;margin-top:16px}
.af select,.af textarea{padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--field);color:var(--ink);font:inherit;font-weight:400}
.af select{height:44px}
.af textarea{resize:vertical;min-height:160px}
.af select:focus,.af textarea:focus{outline:2px solid var(--accent);outline-offset:1px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.foot{flex-direction:column;align-items:flex-start;gap:6px}
.foot-links{font-size:11.5px;opacity:.85}
.foot-links a{color:inherit}

/* 会社概要の表（個人情報の取り扱い 8章） */
.policy table.company{min-width:0}
.policy table.company th{width:34%;white-space:normal}
@media (max-width:560px){.policy table.company th,.policy table.company td{display:block;width:auto}.policy table.company th{border-bottom:0}}