/* リンクページの入口（ゼリー×ネオン。2026-11-06 ユーザー決定）。/link/ ・ /link/start/ ・ /link/login/ ・ /link/help/ で共通。
   ドメインを分けてもそのまま動くように、ほかのページのCSSには頼らない */
:root{
  --bg:#07060E;--bg2:#100D1C;--fg:#F6F2FF;--sub:#A9A1BE;--line:#2A2340;
  --pink:#FF3DA5;--cyan:#3DF5FF;--gold:#FFD66B;
  --ff:"Zen Kaku Gothic New",system-ui,sans-serif;--fx:"Orbitron","Zen Kaku Gothic New",sans-serif;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--ff);line-height:1.8;overflow-x:hidden}
a{color:inherit}
img{max-width:100%}
.w{max-width:1120px;margin:0 auto;padding-left:max(18px,env(safe-area-inset-left,0px));padding-right:max(18px,env(safe-area-inset-right,0px))}

/* 上のバー */
.top{position:sticky;top:0;z-index:20;background:rgba(7,6,14,.72);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid #ffffff12}
.top .w{display:flex;align-items:center;gap:14px;height:58px}
.brand{font:900 17px var(--fx);letter-spacing:.04em;text-decoration:none;display:flex;align-items:center;gap:8px}
.brand i{width:18px;height:18px;border-radius:46% 54% 60% 40%/50% 40% 60% 50%;background:radial-gradient(circle at 30% 30%,#fff9,var(--pink) 45%,#7a0f4a);box-shadow:0 0 12px var(--pink)}
.top nav{margin-left:auto;display:flex;gap:6px;align-items:center}
.top nav a{text-decoration:none;font-size:13px;padding:7px 12px;border-radius:99px;color:var(--sub)}
.top nav a:hover{color:var(--fg)}
.top nav a.go{background:var(--pink);color:#fff;font-weight:700;box-shadow:0 0 18px #FF3DA566}
@media (max-width:520px){.top nav a.hd{display:none}}

/* ボタン */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 26px;border-radius:99px;font-weight:900;font-size:15px;text-decoration:none;border:0;cursor:pointer;font-family:inherit;transition:transform .2s,box-shadow .2s}
.btn.p{background:linear-gradient(135deg,var(--pink),#FF6BCB);color:#fff;box-shadow:0 0 0 1px #ffffff33 inset,0 10px 30px #FF3DA555}
.btn.p:hover{transform:translateY(-2px);box-shadow:0 0 0 1px #ffffff55 inset,0 14px 40px #FF3DA588}
.btn.g{border:1px solid #ffffff44;color:var(--fg);background:#ffffff08}
.btn.g:hover{border-color:var(--cyan);box-shadow:0 0 18px #3DF5FF44}
.btn:focus-visible,.top a:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}

/* ヒーロー */
.hero{position:relative;overflow:hidden;padding-block:56px 72px}
.blob{position:absolute;border-radius:46% 54% 60% 40%/50% 40% 60% 50%;filter:blur(1px);pointer-events:none;animation:wob 9s ease-in-out infinite alternate}
.blob.b1{width:min(46vw,420px);aspect-ratio:1;left:-12vw;top:-60px;background:radial-gradient(circle at 30% 30%,#ffffff99,var(--pink) 42%,#5c0a38 80%);box-shadow:0 0 90px #FF3DA577;opacity:.85}
.blob.b2{width:min(34vw,320px);aspect-ratio:1;right:-8vw;top:30%;background:radial-gradient(circle at 30% 30%,#ffffff99,var(--cyan) 42%,#0a4a5a 80%);box-shadow:0 0 90px #3DF5FF66;opacity:.75;animation-duration:12s}
.blob.b3{width:120px;aspect-ratio:1;left:38%;bottom:-30px;background:radial-gradient(circle at 30% 30%,#fff9,var(--gold) 45%,#7a4a00);box-shadow:0 0 50px #FFD66B55;opacity:.6;animation-duration:7s}
@keyframes wob{to{border-radius:60% 40% 45% 55%/40% 60% 40% 60%;transform:translate(16px,22px) rotate(24deg)}}
.hero .w{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:40px;align-items:center}
.ey{font:700 11px var(--fx);letter-spacing:.32em;color:var(--cyan);margin:0 0 14px}
.hero h1{font-size:clamp(32px,5.2vw,58px);line-height:1.22;margin:0;font-weight:900;text-wrap:balance;text-shadow:0 0 28px #FF3DA566}
.hero h1 em{font-style:normal;background:linear-gradient(90deg,var(--pink),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .lead{color:var(--sub);font-size:16px;margin:18px 0 0;max-width:34em}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.note{font-size:12px;color:var(--sub);margin-top:12px}

/* 動く見本（本物の @ページ） */
.stage{position:relative;height:620px;display:grid;place-items:center}
.phone{position:relative;width:290px;height:600px;border-radius:44px;padding:9px;background:#0d0b16;border:1px solid #ffffff2a;box-shadow:0 0 0 6px #ffffff08,0 30px 80px #000,0 0 60px #FF3DA544;z-index:2}
.phone iframe{width:100%;height:100%;border:0;border-radius:36px;background:#000;display:block}
.pop{position:absolute;width:96px;border-radius:16px;overflow:hidden;border:1px solid #ffffff66;box-shadow:0 0 22px #3DF5FF77;z-index:3;animation:pp 5.4s infinite;opacity:0}
.pop img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover}
.pop.p1{left:0;top:80px;--r:-9deg}.pop.p2{right:-6px;top:210px;--r:7deg;animation-delay:1.8s}.pop.p3{left:14px;bottom:70px;--r:-4deg;animation-delay:3.6s}
@keyframes pp{0%,100%{opacity:0;transform:scale(.3) rotate(0)}12%,62%{opacity:1;transform:scale(1) rotate(var(--r))}72%{opacity:0;transform:scale(.8) rotate(var(--r))}}
@media (max-width:860px){
  .hero .w{grid-template-columns:minmax(0,1fr)}
  .stage{height:540px}
  .phone{width:250px;height:520px}
  .pop{width:80px}
}

/* セクション */
.sec{padding-block:64px;border-top:1px solid #ffffff10}
.sec h2{font-size:clamp(22px,3.2vw,32px);line-height:1.4;margin:0 0 10px;font-weight:900;text-wrap:balance}
.sec .sl{color:var(--sub);margin:0 0 26px;max-width:40em}
.feat{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:12px;list-style:none;margin:0;padding:0}
.feat li{position:relative;padding:20px 18px;border-radius:22px;background:linear-gradient(160deg,#ffffff0d,#ffffff04);border:1px solid #ffffff17;overflow:hidden;min-width:0}
.feat li::before{content:"";position:absolute;width:70px;height:70px;right:-18px;top:-18px;border-radius:46% 54% 60% 40%/50% 40% 60% 50%;background:var(--c,var(--pink));filter:blur(16px);opacity:.5}
.feat b{display:block;font-size:16px;margin-bottom:4px}
.feat span{font-size:13.5px;color:var(--sub);line-height:1.75}
.feat .free{font:700 10px var(--fx);letter-spacing:.2em;color:var(--cyan);display:block;margin-bottom:8px}
.who{display:flex;flex-wrap:wrap;gap:8px}
.who span{padding:8px 16px;border-radius:99px;border:1px solid #ffffff22;background:#ffffff08;font-size:14px}
.who span:nth-child(3n+1){border-color:#FF3DA566}.who span:nth-child(3n+2){border-color:#3DF5FF55}
.tp{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 2px 18px;scrollbar-width:thin}
.tp figure{flex:0 0 min(44vw,180px);margin:0;scroll-snap-align:start;display:grid;gap:8px}
.tp img{width:100%;aspect-ratio:1/2;object-fit:cover;object-position:top;border-radius:24px;border:5px solid #1a1626;box-shadow:0 14px 30px #0008}
.tp figcaption{text-align:center;font-size:13px;color:var(--sub)}
.steps{list-style:none;counter-reset:s;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:12px}
.steps li{counter-increment:s;padding:20px;border-radius:22px;border:1px solid #ffffff17;background:#ffffff06}
.steps li::before{content:"0" counter(s);display:block;font:900 22px var(--fx);color:var(--pink);text-shadow:0 0 14px #FF3DA588;margin-bottom:6px}
.plus{margin-top:22px;padding:22px;border-radius:22px;border:1px dashed #FFD66B66;background:#FFD66B0a}
.plus b{color:var(--gold)}
.final{text-align:center}
.final .cta{justify-content:center}

/* フッター */
.foot{padding-block:36px 48px;border-top:1px solid #ffffff10;color:var(--sub);font-size:13px}
.foot .w{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center}
.foot a{text-decoration:none}.foot a:hover{color:var(--fg)}
.foot .c{margin-left:auto}

/* 登録・ログイン・ヘルプの小さいページ */
.card{max-width:460px;margin:48px auto;padding:30px 24px;border-radius:28px;border:1px solid #ffffff1c;background:linear-gradient(160deg,#ffffff0e,#ffffff04);position:relative;overflow:hidden}
.card h1{font-size:26px;line-height:1.35;margin:0 0 8px;font-weight:900}
.card p{color:var(--sub);margin:0 0 18px;font-size:14.5px}
.card ul{margin:0 0 22px;padding-left:1.2em;font-size:14.5px}
.card .btn{width:100%}
.card .alt{text-align:center;font-size:13px;margin:16px 0 0;color:var(--sub)}
.faq{max-width:760px;margin:0 auto}
.faq details{border-bottom:1px solid #ffffff17}
.faq summary{cursor:pointer;list-style:none;padding:18px 34px 18px 2px;font-weight:700;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"＋";position:absolute;right:4px;top:18px;color:var(--cyan)}
.faq details[open] summary::after{content:"－"}
.faq details p{margin:0 0 18px;color:var(--sub);font-size:14.5px}

.rv{animation:rv .8s cubic-bezier(.2,.7,.2,1) both}
@keyframes rv{from{opacity:0;transform:translateY(18px)}}
@media (prefers-reduced-motion:reduce){.blob,.pop,.rv{animation:none}.pop{opacity:1;transform:rotate(var(--r))}}

/* ORIGIN の残り（2026-11-07） */
.gen0{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:0 0 18px;padding:14px 16px;border-radius:18px;border:1px solid #FF3DA566;background:linear-gradient(160deg,#2a1030,#0b0914);box-shadow:0 0 24px #FF3DA522}
.gen0 .z{font:900 24px/1 var(--fx);letter-spacing:.12em;color:#FFE3F2;text-shadow:0 0 6px var(--pink),0 0 16px var(--pink),0 0 32px #FF3DA5aa;animation:z0 2.6s ease-in-out infinite}
.gen0 .no{font:800 14px var(--ff);color:var(--cyan);text-shadow:0 0 8px #3DF5FF88}
.gen0 small{flex-basis:100%;color:var(--sub);font-size:12.5px;line-height:1.6}.gen0 b{color:var(--fg)}
@keyframes z0{50%{text-shadow:0 0 3px var(--pink),0 0 8px #FF3DA5aa}}
@media (prefers-reduced-motion:reduce){.gen0 .z{animation:none}}

.btn.line{background:#06C755;color:#fff;border-color:#06C755}.btn.line:hover{filter:brightness(1.05)}
.lerr{color:#ff6b81;font-size:.9rem;margin:.6em 0 0}

.brand .edl{height:24px;width:auto;flex:none}.brand .edlw{height:15px;width:auto;display:block}.brand{gap:6px}