/* みんなで見る（minna.html）: 配信サービスのトップの形（docs/design/minna-layouts/ のA。2026-10-18）。
   minna.css（サイドパネルの作成画面 screening-create.html と共有）のあとに読み、body.minna-stream の中だけを変える。
   背景はほかのページと同じ明るい色。上の帯 → 一番上の上映 → 横に流れる列（いま上映中・これからの上映・チャンネル・
   終わった上映）→ お知らせの帯 → はじめての方へ → 畳んだ「上映を作る」。 */
body.minna-stream { background: #f5f5f7; color: #1c1d22; }
.minna-stream .minna-shell { max-width: 1080px; padding: 0 20px 56px; }

/* 上の帯 */
.minna-bar { display: flex; align-items: center; gap: 22px; padding: 14px max(20px, calc((100vw - 1080px) / 2)); border-bottom: 1px solid #e6e8ec; background: #fff; }
.minna-logo { color: #e50914; font-weight: 900; text-decoration: none; white-space: nowrap; }
.minna-logo span { margin-left: 6px; padding: 1px 8px; border-radius: 5px; background: #e50914; color: #fff; font-size: 12px; vertical-align: 2px; }
.minna-bar-nav { display: flex; gap: 18px; font-size: 14px; }
.minna-bar-nav a, .minna-bar-link { color: #5e6573; text-decoration: none; white-space: nowrap; }
.minna-bar-nav a:hover, .minna-bar-link:hover { color: #1c1d22; }
.minna-bar-link { margin-left: auto; font-size: 13px; }
.minna-renovating .minna-bar-nav { display: none; }

.minna-page-title { margin: 22px 0 0; font-size: 22px; line-height: 1.3; }
.minna-page-title small { display: block; margin-top: 2px; color: #5e6573; font-size: 13px; font-weight: 500; }
.minna-loading { margin: 18px 0 0; }

/* 一番上の上映: 写真を枠いっぱいに敷き、左下に文字とボタンを重ねる（docs/design/minna-feature/ のB）。
   ページの背景は明るいまま、この枠だけ写真の色。文字が読めるよう、写真の左側（スマホでは下側）を暗くする。 */
.minna-feature { position: relative; display: grid; align-items: end; min-height: 380px; margin-top: 16px; overflow: hidden; border-radius: 20px; background: #1c1d22; color: #fff; isolation: isolate; box-shadow: 0 10px 30px rgba(0, 0, 0, .12); }
.minna-feature[hidden] { display: none; }
.minna-feature-art { position: absolute; inset: 0; z-index: 0; display: block; }
.minna-feature-art::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10, 10, 14, .9) 0%, rgba(10, 10, 14, .68) 45%, rgba(10, 10, 14, .08) 85%); pointer-events: none; }
.minna-feature-art .minna-feature-artwork { width: 100%; height: 100%; border-radius: 0; }
.minna-feature-art .minna-feature-artwork img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.minna-feature-art:hover .minna-feature-artwork img { transform: scale(1.02); }
/* 写真のない作品（Netflix・Prime Video・Disney+ の一部）は、サービスの絵柄を右に寄せる */
.minna-feature-art .minna-feature-artwork.public-watch-room-cover { display: flex; align-items: center; justify-content: flex-end; padding: 40px 8%; background: #f3f4f7; }
.minna-feature-art .minna-feature-artwork .public-watch-room-cover-logo { width: 34%; height: auto; max-height: 120px; object-fit: contain; }
.minna-feature-art .minna-feature-artwork .public-watch-room-cover-title { display: none; }
.minna-feature-info { position: relative; z-index: 1; display: grid; gap: 6px; max-width: 560px; padding: 30px 34px; pointer-events: none; }
.minna-feature-info a, .minna-feature-info button { pointer-events: auto; }
.minna-feature-top { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0; font-size: 13px; font-weight: 800; }
.minna-feature-label { padding: 1px 9px; border-radius: 5px; background: #e50914; color: #fff; font-size: 12px; font-weight: 800; }
.minna-feature-place { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }
.minna-feature-place:empty { display: none; }
.minna-feature-place .screening-badge { background: rgba(255, 255, 255, .2); color: #fff; }
.minna-feature-channel { color: #fff; text-decoration: none; }
.minna-feature-channel:hover { text-decoration: underline; }
.minna-feature-title { margin: 2px 0 0; font-size: 2rem; line-height: 1.25; overflow-wrap: anywhere; }
.minna-feature-videos { margin: 0; color: rgba(255, 255, 255, .78); font-size: 13px; overflow-wrap: anywhere; }
.minna-feature-videos:empty { display: none; }
.minna-feature-start { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; margin: 8px 0 0; font-variant-numeric: tabular-nums; line-height: 1.1; }
.minna-feature-start[hidden] { display: none; }
.minna-feature-start-day { align-self: center; padding: 2px 10px; border-radius: 6px; background: #fff; color: #c4000f; font-size: 15px; font-weight: 900; }
.minna-feature-start-day[hidden] { display: none; }
.minna-feature-start-date { font-size: 22px; font-weight: 800; }
.minna-feature-start-time { font-size: 44px; font-weight: 900; letter-spacing: .01em; }
.minna-feature-start-word { font-size: 18px; font-weight: 800; }
.minna-feature-row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 18px; margin: 6px 0 0; font-size: 15px; font-weight: 800; font-variant-numeric: tabular-nums; }
.minna-feature-clock { color: #ffd0d3; }
.minna-feature-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.minna-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 10px 22px; border: 0; border-radius: 999px; font: inherit; font-size: 15px; font-weight: 800; text-decoration: none; white-space: nowrap; cursor: pointer; }
.minna-btn[hidden] { display: none; }
.minna-btn--red { background: #e50914; color: #fff; }
.minna-btn--red:hover { background: #c40812; }
/* 写真の上のもう1つのボタン（上映のページへ）は、すりガラスのように控えめに */
.minna-btn--glass { border: 1px solid rgba(255, 255, 255, .45); background: rgba(255, 255, 255, .14); color: #fff; }
.minna-btn--glass:hover { background: rgba(255, 255, 255, .24); }
.minna-btn[aria-pressed="true"] { border: 1px solid rgba(255, 255, 255, .45); background: #fff; color: #c4000f; }
.minna-btn:disabled { opacity: .6; cursor: default; }
.minna-feature-note { margin: 4px 0 0; color: rgba(255, 255, 255, .82); font-size: 12px; }
.minna-feature-status { margin: 0; color: #ffd0d3; font-size: 13px; font-weight: 700; }
.minna-feature-status:empty { display: none; }

/* 横に流れる列 */
.minna-row { margin: 30px 0 0; }
.minna-row[hidden] { display: none; }
.minna-row > h2 { margin: 0 0 12px; font-size: 18px; }
.minna-row > h2 small { margin-left: 10px; color: #5e6573; font-size: 13px; font-weight: 500; }
.minna-row-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
/* 列の中の上映のカード（minna.css の screening-card を縦のタイルにする） */
.minna-stream .minna-row-list .screening-card { display: grid; grid-template-columns: minmax(0, 1fr); align-content: start; gap: 8px; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
.minna-stream .minna-row-list .screening-card:hover .screening-card-title { text-decoration: underline; }
.minna-stream .minna-row-list .screening-card-artwork { border-radius: 10px; box-shadow: 0 4px 14px rgba(0, 0, 0, .08); }
.minna-stream .minna-row-list .screening-card--live .screening-card-artwork { box-shadow: 0 0 0 2px #e50914; }
.minna-stream .minna-row-list .screening-card-body { gap: 1px; }
.minna-stream .minna-row-list .screening-card-when { order: 3; font-size: 13px; }
.minna-stream .minna-row-list .screening-card-title { order: 1; font-size: 14px; }
.minna-stream .minna-row-list .screening-card-videos { order: 2; }
.minna-stream .minna-row-list .screening-card-meta { order: 4; }
.minna-more { margin-top: 12px; }

/* これからの上映の予定表: 1行に日付・写真・題名と添える情報・ボタン。いちばん近い上映は赤い枠 */
.minna-sched-list { display: grid; gap: 10px; }
.minna-sched { display: grid; grid-template-columns: 140px 180px minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 12px 16px; border-radius: 14px; background: #fff; box-shadow: 0 4px 16px rgba(0, 0, 0, .05); }
.minna-sched.is-next { outline: 2px solid #e50914; }
.minna-sched-date { display: grid; justify-items: center; align-content: center; gap: 2px; margin: 0; padding: 10px 6px; border-radius: 12px; background: #f5f5f7; line-height: 1.1; text-align: center; font-variant-numeric: tabular-nums; }
.minna-sched.is-next .minna-sched-date { background: #fff1f2; color: #b3000c; }
.minna-sched-date .minna-sched-day { font-size: 30px; font-weight: 900; line-height: 1.05; white-space: nowrap; letter-spacing: -.01em; }
.minna-sched-weekday { margin-left: 1px; font-size: .55em; font-weight: 800; }
.minna-sched-time { margin-top: 2px; padding: 2px 10px; border-radius: 999px; background: #1c1d22; color: #fff; font-size: 15px; font-weight: 900; white-space: nowrap; }
.minna-sched.is-next .minna-sched-time { background: #e50914; }
.minna-sched-date .minna-sched-dayword { margin-bottom: 2px; padding: 0 8px; border-radius: 5px; background: #e50914; color: #fff; font-size: 12px; font-weight: 800; }
.minna-sched-art { display: block; overflow: hidden; border-radius: 10px; }
.minna-sched-art .minna-sched-artwork { width: 100%; aspect-ratio: 16 / 9; border-radius: 10px; }
.minna-sched-art .minna-sched-artwork img { display: block; width: 100%; height: 100%; object-fit: cover; }
.minna-sched-art .minna-sched-artwork.public-watch-room-cover { display: flex; align-items: center; justify-content: center; padding: 10px 14px; background: #f3f4f7; }
.minna-sched-art .minna-sched-artwork .public-watch-room-cover-logo { width: 100%; max-height: 40px; object-fit: contain; }
.minna-sched-art .minna-sched-artwork .public-watch-room-cover-title { display: none; }
.minna-sched-info { display: grid; gap: 2px; min-width: 0; }
.minna-sched-title { color: #1c1d22; font-size: 16px; font-weight: 800; line-height: 1.4; text-decoration: none; overflow-wrap: anywhere; }
.minna-sched-title:hover { text-decoration: underline; }
.minna-sched-videos { color: #5e6573; font-size: 12px; overflow-wrap: anywhere; }
.minna-sched-count { margin-top: 2px; color: #c4000f; font-size: 13px; font-weight: 800; font-variant-numeric: tabular-nums; }
.minna-sched-status { color: #c4000f; font-size: 12px; font-weight: 700; }
.minna-sched-actions { display: grid; justify-items: end; }
.minna-btn--ghost { border: 1px solid #c9cdd4; background: #fff; color: #1c1d22; }
.minna-btn--ghost:hover { border-color: #9aa0aa; }
.minna-sched .minna-btn[aria-pressed="true"] { border-color: #f3b6b9; background: #fff1f2; color: #c4000f; }

/* チャンネルのカード */
.minna-channel { display: grid; align-content: start; gap: 8px; padding: 14px; border-radius: 14px; background: #fff; box-shadow: 0 4px 16px rgba(0, 0, 0, .05); color: #1c1d22; text-decoration: none; }
.minna-channel:hover { box-shadow: 0 6px 22px rgba(0, 0, 0, .1); }
.minna-channel.is-official { outline: 2px solid #e50914; }
.minna-channel-head { display: flex; align-items: center; gap: 10px; min-width: 0; }
.minna-channel-mark { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; background: linear-gradient(135deg, #e50914, #7b4dff); color: #fff; font-size: 20px; font-weight: 900; }
.minna-channel-name { display: flex; flex-wrap: wrap; align-items: center; gap: 0 6px; min-width: 0; }
.minna-channel-name b { font-size: 15px; line-height: 1.35; overflow-wrap: anywhere; }
.minna-channel-name small { flex-basis: 100%; color: #5e6573; font-size: 12px; }
.minna-channel-desc { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 3; -webkit-box-orient: vertical; color: #3b3f48; font-size: 12px; line-height: 1.6; }
.minna-channel-desc:empty { display: none; }
.minna-channel-next { padding: 6px 10px; border-radius: 10px; background: #f5f5f7; font-size: 12px; font-weight: 800; }
.minna-channel-next.is-live { background: #fff1f2; color: #c4000f; }

/* 終わった上映（列の中のカード） */
.minna-stream .screening-ended-row { padding: 12px; border-radius: 12px; background: #fff; box-shadow: 0 4px 16px rgba(0, 0, 0, .05); }

/* お知らせの帯（上映が1つもないとき・ホストが作れないあいだ。minna.js の renderBand） */
.minna-create-band { margin: 30px 0 0; padding: 12px 16px; border-radius: 12px; background: #fff8e1; color: #6b4a00; font-size: 14px; }
.minna-create-band[hidden] { display: none; }
.minna-create-band p { margin: 0; }
.minna-create-band-none { font-weight: 800; }
.minna-create-band-none[hidden] { display: none; }
.minna-create-band p a { color: #c4000f; font-weight: 700; }
.minna-create-band-official[hidden] { display: none; }
.minna-create-band-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-top: 10px; }
.minna-create-band-row[hidden] { display: none; }

/* はじめての方へ */
.minna-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.minna-steps li { padding: 14px; border-radius: 12px; background: #fff; box-shadow: 0 4px 16px rgba(0, 0, 0, .05); color: #5e6573; font-size: 13px; line-height: 1.6; }
.minna-steps b { display: block; margin-bottom: 2px; color: #1c1d22; font-size: 15px; }
.minna-step-tag { color: #c4000f; font-size: 12px; font-weight: 800; }
.minna-stream .minna-guide-flow { margin-top: 14px; padding: 16px; border-radius: 12px; background: #fff; box-shadow: 0 4px 16px rgba(0, 0, 0, .05); }
.minna-ok-list { display: flex; flex-wrap: wrap; align-content: start; gap: 8px; margin: 0; padding: 0; list-style: none; }
.minna-ok-list li { padding: 4px 12px; border-radius: 999px; background: #fff1f2; color: #c4000f; font-size: 13px; font-weight: 800; }
.minna-stream .minna-guide-lead { margin: 0 0 12px; color: #3b3f48; font-size: 14px; }
.minna-guide-friend { margin: 12px 0 0; color: #5e6573; font-size: 13px; }

/* 上映を作る（畳んだもの）と自分の上映は、白いカードのまま */
.minna-stream .minna-section { margin: 30px 0 0; border: 0; box-shadow: 0 6px 22px rgba(0, 0, 0, .06); }

/* 上映を作る（docs/design/minna-create-card/ のB）: 左に入力、右に「一覧にはこう出ます」の見本（screening-create-preview.js）。
   minna.css はサイドパネルの作成画面と共有なので、ここで body.minna-stream の中だけを変える。 */
.minna-stream .minna-create { padding: 0; overflow: hidden; border-radius: 18px; }
/* 外から来て頭を画面の上に合わせるとき（minna-create-reveal.js）、少し余白を残す */
.minna-stream #screening-create { scroll-margin-top: 16px; }
.minna-stream .minna-create-fold > summary { flex-wrap: nowrap; align-items: center; gap: 14px; margin: 0; padding: 18px 22px; }
.minna-stream .minna-create-fold > summary::before { content: none; }
.minna-stream .minna-create-fold > summary::after { content: ""; flex: none; width: 10px; height: 10px; margin: 0 4px 4px auto; border-right: 2px solid #9aa0aa; border-bottom: 2px solid #9aa0aa; transform: rotate(45deg); transition: transform .2s; }
.minna-stream .minna-create-fold[open] > summary::after { margin-bottom: -4px; transform: rotate(225deg); }
.minna-create-icon { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: #fdecee; color: #e50914; }
.minna-create-head { display: grid; gap: 2px; min-width: 0; }
.minna-stream .minna-create-fold > summary h2 { color: #1c1d22; font-size: 19px; line-height: 1.3; }
.minna-stream .minna-create-fold > summary .minna-create-head > span { color: #5e6573; font-size: 13px; }
.minna-create-layout { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 28px; margin: 0 22px; padding: 18px 0 4px; border-top: 1px solid #eef0f3; }
.minna-create-layout:has(#screening-form[hidden]) { grid-template-columns: minmax(0, 1fr); }
.minna-create-layout:has(#screening-form[hidden]) .minna-create-preview { display: none; }
.minna-create-main { min-width: 0; }
.minna-stream .minna-create form { gap: 8px; margin-top: 0; }
.minna-stream .minna-create label, .minna-stream .screening-start-mode legend { color: #1c1d22; font-size: 14px; font-weight: 800; }
.minna-stream .minna-create label[for="screening-title"], .minna-stream .screening-start-mode { margin-top: 10px; }
.minna-stream .minna-create input[type="url"], .minna-stream .minna-create input[type="text"], .minna-stream .minna-create select { padding: 12px 14px; border: 1px solid #dcdfe5; border-radius: 12px; background-color: #f7f8fa; color: #1c1d22; transition: border-color .15s, background-color .15s; }
.minna-stream .minna-create input[type="url"]:focus, .minna-stream .minna-create input[type="text"]:focus, .minna-stream .minna-create select:focus { outline: none; border-color: #e50914; background-color: #fff; box-shadow: 0 0 0 3px rgba(229, 9, 20, .12); }
.minna-stream .minna-create select { appearance: none; padding-right: 36px; background-image: linear-gradient(45deg, transparent 50%, #6b7280 50%), linear-gradient(135deg, #6b7280 50%, transparent 50%); background-position: calc(100% - 18px) 52%, calc(100% - 13px) 52%; background-size: 5px 5px; background-repeat: no-repeat; }
.minna-stream .screening-when label { color: #7a808b; font-size: 12px; font-weight: 700; }
.minna-stream .screening-url-services { color: #7a808b; font-size: 12px; }
/* 「日時を選ぶ／今すぐ始める」は丸い札。選んだほうを赤く */
.minna-stream .screening-start-mode { gap: 8px; }
.minna-stream .screening-start-mode label { position: relative; padding: 7px 16px; border: 1px solid #dcdfe5; border-radius: 999px; background: #fff; color: #5e6573; font-size: 14px; font-weight: 700; }
.minna-stream .screening-start-mode label:has(input:checked) { border-color: #e50914; background: #fff1f2; color: #c4000f; }
.minna-stream .screening-start-mode label:has(input:focus-visible) { outline: 2px solid #e50914; outline-offset: 2px; }
.minna-stream .minna-create .screening-start-mode input { position: absolute; opacity: 0; pointer-events: none; }
/* サムネイル（任意）: 左に今の画像（見本と同じ）、右に画像の部品（public-watch-thumbnail-editor.js）。部品の見出しは欄の上に出すので隠す */
.minna-stream .screening-thumbnail-label { margin: 10px 0 0; color: #1c1d22; font-size: 14px; font-weight: 800; }
.minna-stream .screening-thumbnail-label small { margin-left: 6px; color: #7a808b; font-size: 12px; font-weight: 400; }
.minna-stream .screening-thumbnail { display: flex; gap: 12px; align-items: center; padding: 10px 12px; border-radius: 12px; background: #f4f5f7; }
.minna-stream .screening-thumbnail-image { flex: none; width: 128px; height: auto; aspect-ratio: 16 / 9; border-radius: 8px; object-fit: cover; background: #2a2b31; }
.minna-stream .screening-thumbnail-image[hidden] { display: none; }
.minna-stream .screening-thumbnail .thumbnail-field { flex: 1; min-width: 0; margin: 0; padding: 0; border: 0; }
.minna-stream .screening-thumbnail .thumbnail-field > strong { display: none; }
.minna-stream .screening-thumbnail .thumbnail-field p { margin: 0 0 8px; color: #5e6573; }
.minna-stream .screening-thumbnail .thumbnail-field p[data-status] { margin: 6px 0 0; }
.minna-stream .screening-thumbnail .thumbnail-field p[data-status]:empty { display: none; }
.minna-stream .screening-thumbnail .thumbnail-field-actions button { padding: 6px 12px; border-color: #dcdfe5; border-radius: 999px; background: #fff; color: #1c1d22; font-size: 13px; font-weight: 700; }
.minna-stream .screening-thumbnail .thumbnail-field-actions button:hover:not(:disabled) { border-color: #e50914; color: #c4000f; }
.minna-stream .screening-thumbnail .thumbnail-field-actions button:disabled { opacity: .45; cursor: default; }
@media (max-width: 420px) { .minna-stream .screening-thumbnail-image { width: 96px; } }
/* 画像の調整の小窓も、ページと同じ明るい見た目にする（部品の既定は OS が暗いと暗くなる） */
.minna-stream .thumbnail-dialog { background: #fff; color: #25282d; }
/* 作ったあとの「配信しながら使う方へ」（docs/design/minna-create-thumbnail/ の3） */
.screening-created-overlay { display: flex; gap: 12px; align-items: flex-start; margin-top: 12px; padding: 12px 14px; border: 1px solid #d6e9dc; border-radius: 10px; background: #fff; }
.screening-created-overlay-icon { flex: none; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: #f2f4f7; color: #3b4452; }
.screening-created .screening-created-overlay p { margin: 0 0 4px; color: #3b4452; font-size: 13px; line-height: 1.6; }
.screening-created .screening-created-overlay .screening-created-overlay-title { color: #1c1d22; font-size: 14px; font-weight: 700; }
.screening-created .screening-created-overlay .screening-created-overlay-links { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 0; }
.screening-created-overlay-links a { color: #c4000f; font-weight: 700; }
/* 動画の写真は右の見本に大きく出すので、入力の下では作品名だけ */
.minna-stream .minna-create .screening-video-preview img { display: none; }
.minna-stream .minna-create .screening-video-preview { border-radius: 12px; font-size: 14px; }
.minna-stream .minna-create #screening-submit { justify-self: start; margin-top: 14px; padding: 10px 24px; background: #e50914; }
.minna-stream .minna-create #screening-submit:hover { background: #c40812; }
.minna-stream .minna-create #screening-submit:disabled { background: #b9bfc8; }
/* 見本: 一覧の列のタイル（.minna-row-list .screening-card）と同じ形 */
.minna-create-preview { align-self: start; position: sticky; top: 16px; min-width: 0; }
.minna-create-preview-label { margin: 0 0 8px; color: #7a808b; font-size: 12px; font-weight: 700; }
.minna-create-preview-card { display: grid; grid-template-columns: minmax(0, 1fr); align-content: start; gap: 8px; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
.minna-create-preview-card:hover { border: 0; box-shadow: none; }
.minna-create-preview-card .screening-card-body { gap: 1px; }
.minna-create-preview-card .screening-card-when { order: 3; font-size: 13px; }
.minna-create-preview-card .screening-card-title { order: 1; font-size: 15px; }
.minna-create-preview-card .screening-card-title.is-empty { color: #b0b4bc; }
.minna-create-preview-card .screening-card-videos { order: 2; }
.minna-create-preview-card .screening-card-meta { order: 4; }
.minna-create-preview-art { display: grid; place-items: center; border-radius: 10px; background: linear-gradient(135deg, #2a2b31, #43444d); box-shadow: 0 4px 14px rgba(0, 0, 0, .08); }
.minna-create-preview-art img { position: absolute; inset: 0; }
.minna-create-preview-art img[hidden], .minna-create-preview-empty[hidden], .minna-create-preview-card [hidden] { display: none; }
.minna-create-preview-empty { padding: 0 16px; color: rgba(255, 255, 255, .6); font-size: 12px; text-align: center; }
.minna-create-points { display: grid; gap: 8px; margin: 16px 0 0; padding: 0; list-style: none; }
.minna-create-points li { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 8px; color: #3b3f48; font-size: 13px; line-height: 1.5; }
.minna-create-points li::before { content: ""; width: 12px; height: 7px; margin: 4px 0 0 2px; border-left: 2px solid #1d7a46; border-bottom: 2px solid #1d7a46; transform: rotate(-45deg); }
/* 細かい決まりは畳む */
.minna-create-rules { margin: 14px 22px 0; padding: 12px 0 20px; border-top: 1px solid #eef0f3; }
.minna-create-rules > summary { color: #5e6573; font-size: 13px; font-weight: 700; cursor: pointer; }
.minna-stream .minna-create-rules .screening-rules { margin-top: 8px; font-size: 12.5px; line-height: 1.7; }

@media (max-width: 860px) {
  .minna-row-list { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 6px; }
  .minna-row-list > * { flex: 0 0 min(72%, 280px); scroll-snap-align: start; }
  .minna-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  .minna-bar { gap: 12px; padding: 12px 16px; }
  .minna-bar-nav { display: none; }
  .minna-stream .minna-shell { padding: 0 16px 48px; }
  /* スマホでは写真を上に16:9の帯で見せ（大きい画像の上下の黒い帯は切れる）、下の暗い所へなじませて文字を重ねる */
  .minna-feature { min-height: 0; }
  .minna-feature-art { bottom: auto; aspect-ratio: 16 / 9; }
  .minna-feature-art::after { background: linear-gradient(0deg, #1c1d22 0%, rgba(28, 29, 34, .55) 45%, rgba(28, 29, 34, 0) 100%); }
  .minna-feature-info { padding: 34% 18px 20px; }
  .minna-feature-title { font-size: 1.45rem; }
  .minna-feature-start-date { font-size: 18px; }
  .minna-feature-start-time { font-size: 36px; }
  .minna-feature-actions .minna-btn { flex: 1; }
  .minna-steps { grid-template-columns: minmax(0, 1fr); }
  /* 予定表はスマホでは写真を外し、ボタンを下の行に */
  .minna-sched { grid-template-columns: 104px minmax(0, 1fr); gap: 10px 12px; padding: 12px; }
  .minna-sched-art { display: none; }
  .minna-sched-actions { grid-column: 1 / -1; justify-items: stretch; }
  .minna-sched-date .minna-sched-day { font-size: 24px; }
  .minna-sched-time { font-size: 13px; padding: 2px 8px; }
  .minna-stream .minna-guide-flow { grid-template-columns: minmax(0, 1fr); }
  /* 上映を作る: 見本は入力の下に */
  .minna-stream .minna-create-fold > summary { padding: 16px; }
  .minna-create-layout { grid-template-columns: minmax(0, 1fr); gap: 18px; margin: 0 16px; }
  .minna-create-preview { position: static; }
  .minna-stream .minna-create #screening-submit { justify-self: stretch; }
  .minna-create-rules { margin: 12px 16px 0; }
}

