/* 入口ページ（/start）専用。共有の style.css / soft-white-ui.css は読まない——
共有CSSは管理SPA向けに html,body{height:100%;overflow:hidden} を敷いており、
#main を持たないこのページでは内容が縦にクリップされて登録ボタンに到達できなくなる
（本番で実測）。打ち消し合戦をやめ、依存そのものを断ってある。 */
/* ★この入口ページは**完全に独立**させる（/css/style.css も /css/soft-white-ui.css も読まない）。
共有 style.css は管理SPA向けに html,body{height:100%;overflow:hidden} を敷いており、
#main を持たないこのページでは内容が縦にクリップされて登録ボタンに到達できなくなる
（本番で実測・打ち消しで凌いでいた）。打ち消し合戦をやめ、依存そのものを断つ。
配色・書体は noren-ai.jp（/privacy）の実値に合わせてここに写す。 */
:root {
--stage: min(100%, 460px);
/* 暖簾AI 本体サイトのトークン（noren-studio.css の :root と同値） */
--ai-950:#050b1c; --ai-900:#0a1530; --ai-800:#0f2148; --ai-700:#15305f;
--glow:#6f9cff; --red:#e0553c; --red-deep:#b93b24; --ok:#1f8f5f;
--ink:#0b1730; --ink-2:#3a465f; --ink-3:#6f7a94;
/* ニューモーフィズム（明るい器）。--neo* は本体サイトにも同名で在る */
--surface:#eaedf2; --surface-hi:#f4f6f9;
--neo-dark:rgba(158,167,184,.55); --neo-light:rgba(255,255,255,.95);
--neo-in:inset 6px 6px 12px rgba(158,167,184,.46), inset -6px -6px 12px rgba(255,255,255,.9);
--neo-out:7px 7px 15px rgba(150,159,177,.5), -7px -7px 15px rgba(255,255,255,.92);
--sans:"Inter","Zen Kaku Gothic New","Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP",system-ui,sans-serif;
--ease:cubic-bezier(.2,.7,.2,1);
--flip:.86s cubic-bezier(.2,.74,.2,1);
}
* { box-sizing: border-box; }
html { min-height: 100%; background: var(--ai-950); }
body {
margin: 0; min-height: 100vh; min-height: 100dvh;
color: #fff;
/* ★背景色は html にだけ置く。body に不透明な背景を敷くと、負の z-index の
.st-bg は**その下**に塗られて暖簾が1画素も出ない（四隅の実画素で確認）。 */
background: transparent;
font-family: var(--sans); font-size: 16px; line-height: 1.85;
font-feature-settings: "palt" 1, "kern" 1;
-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
overflow-x: clip;
}
button, input { font: inherit; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
/* ── 背景：/privacy のヒーローと同じ暖簾。ぼかし＋スモークの二層 ──
★filter を持つ要素は position:fixed の子の包含ブロックになる。この層は
空のままにして、中に何も置かない（[[backdrop-filterの中のfixedは潰れる]]）。 */
.st-bg, .st-smoke { position: fixed; inset: 0; z-index: -2; pointer-events: none; }
.st-bg {
background: url("/img/hero-noren-sp.webp") center 40%/cover no-repeat;
filter: blur(5px) saturate(1.18) brightness(1.16) contrast(1.05);
transform: scale(1.06);
}
@media (min-width: 900px) { .st-bg { background-image: url("/img/hero-noren.webp"); } }
.st-smoke {
z-index: -1;
background:
linear-gradient(180deg, rgba(5,11,28,.66) 0%, rgba(5,11,28,.53) 44%, rgba(5,11,28,.72) 100%),
radial-gradient(130% 100% at 50% 0%, transparent 24%, rgba(5,11,28,.42) 100%);
}
/* ── 画面の外枠 ── */
.st-page {
position: relative;
display: flex; flex-direction: column; align-items: center; justify-content: center;
gap: 22px;
min-height: 100vh; min-height: 100dvh;
padding: 84px 16px 40px;
}
.st-home {
position: absolute; top: 20px; left: 20px;
display: inline-flex; align-items: center; gap: 10px;
text-decoration: none; color: rgba(255,255,255,.94);
font-size: .84rem; font-weight: 700; letter-spacing: .06em;
text-shadow: 0 1px 12px rgba(5,11,28,.6);
}
.st-home img { width: 30px; height: 30px; opacity: .95; }
.st-home:hover { color: #fff; }
/* ★作成ツールへ送っている最中は、登録の器を**先に**隠す（契約: 登録フォームを出さずに送る）。
display:none にすると器の高さが消えて画面が跳ねるので visibility で場所は残す。
CSSは の （描画をブロックする）で先に効くので、defer の start.js が
このクラスを付けた時点で、登録フォームは一度も見えない。 */
html.st-leaving .st-stage, html.st-leaving .st-outside { visibility: hidden; }
#st-leaving {
max-width: 34em; padding: 16px 20px; border-radius: 14px;
background: rgba(5,11,28,.72); border: 1px solid rgba(255,255,255,.22);
font-size: .88rem; line-height: 1.9;
}
/* ── 素のHTMLの出口 ⇄ 作り込んだ画面（漸進的強化）──
★向きが**逆**なのが要点。既定（クラスが1つも付いていない状態）は
「本物のリンクが3本見えている」で、/js/start.js が**配線を終えたとき**だけ
に `st-ready` が付いて作り込んだ画面へ差し替わる。
以前は