/* S7: world layers and Home-only presentation. All runtime values use CSSOM. */
.worldSky{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.worldSky .skyStage{position:absolute;inset:0;opacity:0}
.worldSky .sky0{background:linear-gradient(180deg,#E9CDA9 0%,#E3AA8F 45%,#CA90A1 100%);opacity:1}
.worldSky .sky1{background:linear-gradient(180deg,#D9A590 0%,#A87990 55%,#7E6288 100%)}
.worldSky .sky2{background:linear-gradient(180deg,#B08AA0 0%,#7E5F85 55%,#574668 100%)}
/* 夜はf01(葡萄 #241A26系)へ寄せた色相(2026-10-14本人指示)——Folioの夜の門と同じ刻 */
.worldSky .sky3{background:linear-gradient(180deg,#5E5378 0%,#3E3858 60%,#2B2040 100%)}
.worldSky .sky4{background:linear-gradient(180deg,#312439 0%,#241A2B 50%,#1A1222 100%)}
.worldSun{position:absolute;left:62%;top:30%;width:46vmax;height:46vmax;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(255,220,180,.55),rgba(255,200,160,.18) 38%,transparent 68%);mix-blend-mode:screen}
.worldStars{position:absolute;inset:0;opacity:0}
.worldStar{position:absolute;border-radius:50%;background:#EADFF2;animation:worldTwinkle var(--tw,4s) ease-in-out var(--twd,0s) infinite alternate}
@keyframes worldTwinkle{from{opacity:.12}to{opacity:var(--so,.75)}}
.worldMoon{position:absolute;right:12%;top:14%;width:52px;height:52px;border-radius:50%;opacity:0;background:radial-gradient(circle at 38% 36%,#F6EFE2,#D9CFC2 70%);box-shadow:0 0 34px rgba(246,239,226,.45),0 0 90px rgba(246,239,226,.2)}
.worldLight,.worldMotes,.worldPetals{position:fixed;inset:0;pointer-events:none;overflow:hidden}
.worldLight{z-index:1}.worldMotes,.worldPetals{z-index:40}
.worldPool{position:absolute;width:72vmax;height:72vmax;border-radius:50%;mix-blend-mode:soft-light;background:radial-gradient(circle,rgba(255,240,210,.55),transparent 62%)}
.poolOne{top:-24vmax;left:-14vmax;animation:worldDriftOne 47s ease-in-out infinite alternate}
.poolTwo{bottom:-30vmax;right:-16vmax;animation:worldDriftTwo 61s ease-in-out infinite alternate}
@keyframes worldDriftOne{to{transform:translate(16vw,9vh) scale(1.18)}}
@keyframes worldDriftTwo{to{transform:translate(-13vw,-7vh) scale(.9)}}
.worldMote{position:absolute;border-radius:50%;background:#FFF2D9;box-shadow:0 0 6px rgba(255,236,200,.8);animation:worldMoteFloat var(--d,18s) linear var(--delay,0s) infinite;opacity:0}
@keyframes worldMoteFloat{0%{transform:translateY(10vh);opacity:0}14%{opacity:var(--o,.4)}48%{transform:translateY(-4vh) translateX(1.6vw);opacity:.3}78%{opacity:var(--o,.4)}100%{transform:translateY(-18vh) translateX(-1vw);opacity:0}}
.worldPetal{position:absolute;top:-6vh;width:9px;height:9px;border-radius:9px 0;background:rgba(232,180,160,.62);animation:worldFall var(--fall,18s) linear var(--delay,0s) infinite}
@keyframes worldFall{to{transform:translate3d(-10vw,112vh,0) rotate(300deg)}}
.worldHome{position:relative;z-index:2}
.worldHome .hero{min-height:calc(100svh - 71px);background:transparent;color:#2F2A28;overflow:visible;padding:60px 24px 90px}
.worldHome .heroInner{grid-template-columns:1.15fr .85fr;padding:0;gap:48px}
.worldHome .heroCopy{font-size:clamp(26px,3.1vw,38px);line-height:2;text-shadow:0 1px 14px rgba(255,244,230,.55)}
.worldHome .heroRule{background:linear-gradient(90deg,#8A5B49,transparent)}
.worldHome .heroRule::before{background:#8A5B49}
.worldHome .heroSub{color:#453C37;font-size:14px;line-height:2.4;letter-spacing:.08em;text-shadow:0 1px 10px rgba(255,244,230,.4)}
.worldHome .heroCta{flex-direction:column;align-items:flex-start;gap:12px;margin-top:38px}
.worldHome .btnGhost{color:#6E463A;border-color:rgba(110,70,58,.4);background:rgba(255,248,240,.25)}
.worldHome .scrollCue{color:#8A5B49;bottom:26px}
.memoryDrift{position:relative;justify-self:center;width:min(100%,330px);aspect-ratio:3/4;transform:rotate(2deg)}
.memoryCard{position:absolute;inset:0;overflow:hidden;border-radius:4px;border:1px solid rgba(255,250,240,.75);box-shadow:0 0 0 6px rgba(255,250,240,.35),0 18px 50px rgba(70,40,40,.3),0 0 60px rgba(255,220,180,.25);display:grid;place-items:center}
.memoryCard img{width:100%;height:100%;object-fit:cover}.memoryCard svg{width:56px;height:56px;opacity:.45}
.memoryGlow{position:absolute;inset:-22%;border-radius:50%;pointer-events:none;mix-blend-mode:screen;background:radial-gradient(circle,rgba(255,230,195,.4),transparent 65%)}
.memoryCaption{position:absolute;left:0;right:0;bottom:-40px;text-align:center;font-family:var(--latin);font-style:italic;font-size:13px;letter-spacing:.12em;color:#5A4038;text-shadow:0 1px 8px rgba(255,244,230,.5)}
.worldHome section:not(.hero):not(.folioCta){position:relative;background:transparent;padding:30px 24px}
.worldHome section:not(.hero):not(.folioCta)>.sectionInner{background:rgba(251,248,241,.84);backdrop-filter:blur(7px);border:1px solid rgba(255,250,240,.5);border-radius:6px;box-shadow:0 14px 44px rgba(40,25,30,.18);padding:52px 56px 58px}
.worldHome .about{padding-top:50px!important}.worldHome .aboutLead{max-width:640px}
.worldHome .folioCta{position:relative;max-width:var(--maxw);margin:70px auto 0;border-radius:6px;border:1px solid rgba(216,164,143,.4);background:radial-gradient(ellipse 70% 90% at 85% 15%,rgba(216,164,143,.14),transparent 65%),rgba(26,20,30,.62);backdrop-filter:blur(6px);padding:58px 56px}
.worldHome .news{margin-top:30px}
.worldHome .connect{margin-top:30px;margin-bottom:80px}
.worldHome .connect>.sectionInner{background:transparent!important;backdrop-filter:none!important;border:0!important;box-shadow:none!important}
.worldHome .connect .secTitle{color:#F6EDE6}.worldHome .connect .secEn{color:var(--rose)}
/* SUPPORT/COMMUNITYの小見出しも夜に沈まないようTOGETHERと同色(2026-10-14本人指示) */
.worldHome .connect .connectEn{color:var(--rose)}
.worldHome .connectCard{background:rgba(251,248,241,.1);backdrop-filter:blur(6px);border:1px solid rgba(240,228,218,.25);color:#EFE3DA;display:flex;flex-direction:column}
.worldHome .connectTitle{color:#F6EDE6}.worldHome .connectDesc{color:rgba(235,222,212,.8)}
.worldHome .connectBtns{display:flex;flex-direction:column;gap:10px;margin-top:auto;padding-top:24px}
.worldHome .connectBtns .btn,.worldHome .connectBtns .btnLine{display:flex;align-items:center;justify-content:center;width:100%;margin:0}
.worldHome .connectBtns .btnLine{background:rgba(251,248,241,.08);color:#E8C9B8;border-color:rgba(216,164,143,.45)}
.worldHome .connectMain{font-size:12.5px;padding:11px 26px}
.worldSeam{position:relative;height:96px;display:grid;place-items:center}.worldSeam>span{position:relative;width:min(46%,420px);height:1px;background:rgba(255,246,232,.28);overflow:hidden}
.worldSeam>span::after{content:'';position:absolute;top:0;left:-45%;width:45%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,240,215,.95),transparent)}
.worldSeam.lit>span::after{animation:worldSeamRun 1.4s cubic-bezier(.3,.6,.3,1) both}
@keyframes worldSeamRun{to{left:105%}}
.worldLetter{display:inline-block}
body.worldInk .worldHome .heroRule{transform-origin:left;animation:worldRule .9s ease var(--ink-end,1.7s) both}
@keyframes worldRule{from{transform:scaleX(0)}to{transform:scaleX(1)}}
body.worldInk .worldHome .heroSub{animation:worldFade 1.2s ease calc(var(--ink-end,1.7s) + .5s) both}
body.worldInk .worldHome .heroCta{animation:worldFade 1.1s ease calc(var(--ink-end,1.7s) + 1.1s) both}
body.worldInk .memoryDrift{animation:worldMemoryIn 1.6s ease calc(var(--ink-end,1.7s) + .3s) both}
body.worldInk .memoryCaption{animation:worldFade 1.2s ease calc(var(--ink-end,1.7s) + 1.6s) both}
@keyframes worldFade{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
@keyframes worldMemoryIn{from{opacity:0;transform:rotate(5.5deg) translate(70px,-34px)}to{opacity:1;transform:rotate(2deg)}}
body.worldBreath .memoryCard{animation:worldBreath 8s ease-in-out infinite alternate}
@keyframes worldBreath{to{transform:translateY(-6px) rotate(.5deg)}}
body.worldBreath .memoryGlow{animation:worldGlow 6s ease-in-out infinite alternate}
@keyframes worldGlow{to{opacity:.75}}
body:has(.worldHome) footer{position:relative;z-index:2;background:rgba(16,12,18,.82)}
body:has(.worldHome) .spotCard{width:min(660px,100%);grid-template-columns:34% 1fr;background:#FBF8F1;border-radius:2px;transform:rotate(-.8deg);border:1px solid rgba(150,110,80,.3);box-shadow:0 24px 60px rgba(40,25,15,.4)}
body:has(.worldHome) .spotCard::before{content:'';position:absolute;inset:6px;border:1px solid var(--hairline-soft);pointer-events:none}
body:has(.worldHome) .spotVisual{min-height:280px}.letterSeal{position:absolute;top:-1px;right:58px;z-index:3;width:44px;height:44px;border-radius:50%;background:radial-gradient(circle at 36% 32%,#E0B29C,var(--rose-deep) 70%);box-shadow:0 3px 10px rgba(90,50,30,.35);display:grid;place-items:center;font-family:var(--latin);font-size:17px;color:#FFF3EA}
/* 手紙の結び: CTAと「そっと、しおりに戻す ✕」を同じ行に(左=CTA・右=静かな文字・上下中央)——mock-09のletterActionsの文法 */
body:has(.worldHome) .spotBody{display:grid;grid-template-columns:1fr auto;column-gap:16px;align-content:start}
body:has(.worldHome) .spotLabel,body:has(.worldHome) .spotTitle,body:has(.worldHome) .spotLead{grid-column:1/-1}
body:has(.worldHome) .spotCta{grid-column:1;align-self:center}
/* 手紙のCTAはmock-09同様ひと回り小さく(12.5px)・折り返さない */
body:has(.worldHome) .spotCta .btn{font-size:12.5px;padding:10px 22px;white-space:nowrap}
body:has(.worldHome) .spotClose{grid-column:2;position:static;align-self:center;justify-self:end;width:auto;height:auto;padding:6px 0;margin-top:12px;border:0;border-radius:0;background:none;box-shadow:none;font-family:var(--serif);font-size:12px;letter-spacing:.1em;color:var(--gray);white-space:nowrap;flex-shrink:0}
/* v1の✕ボタン用ホバー回転(style.css)は文章ボタンでは縦回転事故になるため無効化。色だけ応える */
body:has(.worldHome) .spotClose:hover{transform:none;color:var(--rose-deep)}
/* フォーカスリングの装いを柔らかく(本人要望): 全体の3px濃輪郭→CTA外枠と同族の薔薇の細枠のみ。
   box-shadowは透明ボタンだと輪郭の影(内側の境界線)が出るため使わない */
body:has(.worldHome) .spotClose:focus,body:has(.worldHome) .spotClose:focus-visible,
body:has(.worldHome) .spotCta .btn:focus,body:has(.worldHome) .spotCta .btn:focus-visible{outline:1px solid var(--rose);outline-offset:6px;border-radius:2px}
body:has(.worldHome) .spotClose:focus,body:has(.worldHome) .spotClose:focus-visible{box-shadow:none}
body:has(.worldHome) .spotVisual img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
/* 絵のある栞は縦積みにして、絵を原寸比率の全幅で見せる(切り抜かない) */
body:has(.worldHome) .spotCard:has(.spotVisual.hasImage){grid-template-columns:1fr;max-height:92vh;overflow:auto}
body:has(.worldHome) .spotVisual.hasImage{min-height:0}
body:has(.worldHome) .spotVisual.hasImage img{position:static;height:auto;object-fit:unset;display:block}
@media(max-width:900px){.worldHome .hero{padding:44px 24px 80px}.worldHome .heroInner{grid-template-columns:1fr;gap:56px}.memoryDrift{width:min(72%,280px)}.worldHome .heroCta{align-items:stretch}.worldHome section:not(.hero):not(.folioCta)>.sectionInner{padding:32px 24px 40px}.worldHome .folioCta{margin:42px 20px 0;padding:40px 24px}.worldHome .connect{margin-bottom:40px}.worldHome .connectGrid{grid-template-columns:1fr}body:has(.worldHome) .spotCard{grid-template-columns:1fr}body:has(.worldHome) .spotVisual{min-height:190px}}
@media(prefers-reduced-motion:reduce){.worldPool,.worldMote,.worldPetal,.worldStar,.worldHome .scrollCue span,body.worldInk .worldHome .heroRule,body.worldInk .worldHome .heroSub,body.worldInk .worldHome .heroCta,body.worldInk .memoryDrift,body.worldInk .memoryCaption,body.worldBreath .memoryCard,body.worldBreath .memoryGlow,.worldSeam.lit>span::after{animation:none!important;opacity:1!important;transform:none!important}.worldMoon,.worldStars{opacity:0!important}}