/* WHO WAS I? — V5のスタイルを統合（block1 → block2 の順でカスケードを維持） */
:root{--gold:#e8c77b}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top,#34304c,#0b1020 65%);color:#f7f2e9;font-family:Georgia,'Hiragino Kaku Gothic ProN',sans-serif}header{padding:22px 6%;border-bottom:1px solid #ffffff24;color:var(--gold);font-size:24px;letter-spacing:4px;font-weight:bold}main{max-width:760px;margin:auto;padding:35px 18px 80px}.page{display:none}.active{display:block}.hero{text-align:center;padding:70px 0}.eyebrow{color:var(--gold);letter-spacing:3px;font-size:11px;text-align:center}.hero h1{font-size:clamp(45px,10vw,80px);letter-spacing:5px}.hero h2{font-weight:normal;font-size:26px}.hero p,.muted{color:#b9b4c1;line-height:2}.btn{background:linear-gradient(110deg,#f8dfa3,#b48e49);border:1px solid var(--gold);border-radius:5px;padding:16px 25px;font-size:15px;font-weight:bold;cursor:pointer;color:#1d1720}.btn.outline{background:transparent;color:var(--gold)}.hero .btn{margin-top:24px}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.features div,.panel{border:1px solid #ffffff22;background:#151b2d;border-radius:8px;padding:23px}.features div{text-align:center;font-size:13px;color:var(--gold)}.features small{display:block;color:#aaa;margin-top:10px}.progress{display:flex;justify-content:space-between;color:var(--gold);font-size:12px;margin-top:25px}.track{background:#464355;height:3px;margin-top:15px}.fill{height:100%;background:var(--gold)}#question{text-align:center;font-size:28px;font-weight:normal;margin:70px 0 40px;line-height:1.6}.answer{display:block;width:100%;text-align:left;margin:12px 0;padding:20px;border:1px solid #675e70;background:#1b2236;color:white;border-radius:6px;font-size:15px;cursor:pointer}.answer:hover{border-color:var(--gold)}.answer b{color:var(--gold);margin-right:20px}.back{background:none;border:0;color:#aaa;display:block;margin:30px auto;cursor:pointer}.resultHead{text-align:center}.resultHead h2{font-size:clamp(26px,5vw,40px);color:var(--gold);margin:14px 0}.portrait{height:320px;border:1px solid #a48b58;border-radius:8px;background:radial-gradient(circle,#6c5b4d,#1b2031 70%);display:flex;flex-direction:column;align-items:center;justify-content:center}.portrait .emoji{font-size:125px}.portrait img{width:100%;height:100%;object-fit:cover;border-radius:7px}.portrait{overflow:hidden;height:390px;position:relative}.portrait .caption{position:absolute;bottom:0;left:0;right:0;text-align:center;background:linear-gradient(transparent,#0b1020);padding:38px 8px 15px}.portrait .caption{color:var(--gold);letter-spacing:4px;margin-top:12px}.facts{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#66574d;margin:18px 0;border-radius:6px;overflow:hidden}.facts div{padding:18px;background:#151b2d}.facts small{display:block;color:#aaa;margin-bottom:9px}.panel{margin:16px 0}.panel h3{color:var(--gold);font-weight:normal}.panel p{line-height:2;font-size:14px}.timeline p{border-left:1px solid var(--gold);padding-left:18px}.timeline b{color:var(--gold)}.quote{text-align:center;color:var(--gold);font-size:20px}.actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:25px 0}.actions button{flex:1;min-width:150px}.disclaimer{font-size:11px;text-align:center;color:#aaa;line-height:2}footer{text-align:center;border-top:1px solid #ffffff22;padding:25px;color:#888;font-size:12px}@media(max-width:550px){.features{grid-template-columns:1fr}.hero{padding:30px 0}.actions button{flex-basis:100%}}.galleryGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.galleryCard{border:1px solid #806b45;background:#151b2d;border-radius:8px;padding:0 0 14px;color:#f7f2e9;text-align:left;overflow:hidden;cursor:pointer}.galleryCard img{width:100%;height:145px;object-fit:cover}.galleryCard strong,.galleryCard small{display:block;padding:4px 12px}.galleryCard small{color:#c9b88d}@media(max-width:550px){.galleryGrid{grid-template-columns:repeat(2,1fr)}}
:root{--gold:#e8c77b;--cream:#f7ead2;--night:#07101d;--panel:#111b2a}
html{scroll-behavior:smooth}body{background:radial-gradient(ellipse 75% 45% at 50% 0%,#233249 0%,#091321 60%,#07101b 100%);font-family:'Noto Serif JP',Georgia,serif;color:#f5efe5;min-height:100vh}
body:before{content:'';position:fixed;inset:0;pointer-events:none;opacity:.18;background-image:radial-gradient(#d8c18e .6px,transparent .8px);background-size:32px 32px;mask-image:linear-gradient(#000,transparent 80%)}
header{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px clamp(16px,5vw,75px);background:rgba(7,15,26,.78);backdrop-filter:blur(16px);border-bottom:1px solid #c9a96b33;letter-spacing:normal}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:#f3d49a;font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(19px,2.5vw,27px);letter-spacing:2px;line-height:1}.brand img{width:49px;height:49px}.brand small{display:block;font:8px Georgia,serif;letter-spacing:2px;color:#b5a486;margin-top:6px}.nav-actions{display:flex;gap:10px;align-items:center}.nav-actions button{background:none;border:1px solid #bba06b55;border-radius:40px;color:#ead6a9;padding:10px 13px;font:11px Georgia,serif;cursor:pointer}.nav-actions .nav-link{border:0}
main{max-width:1050px;padding:0 20px 80px}.hero{position:relative;overflow:hidden;margin:24px auto 24px;padding:64px 20px 50px;min-height:670px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(180deg,#08132188 5%,#07101a70 44%,#07101af5 98%),url('../portraits/PL-001.webp') center 37%/cover no-repeat;border:1px solid #b89a625c;border-radius:18px;box-shadow:0 25px 90px #0009}
.hero:after{content:'';position:absolute;inset:11px;border:1px solid #d6b87b44;border-radius:10px;pointer-events:none}.hero>*{position:relative;z-index:1}.hero-emblem{width:112px;height:112px;filter:drop-shadow(0 0 28px #e2b75c88);margin-bottom:14px}.hero h1{font-family:'Cormorant Garamond',Georgia,serif;font-weight:500;letter-spacing:5px;font-size:clamp(55px,9vw,104px);color:#f5d79b;text-shadow:0 4px 30px #000;margin:5px 0 10px}.hero h2{font-size:clamp(19px,3vw,27px);letter-spacing:4px;color:#f7eee0}.hero p{max-width:520px;color:#f0e5d6;text-shadow:0 2px 15px #000;line-height:2.1}.hero-foot{font-size:12px;color:#d8bd8d;letter-spacing:2px;margin-top:38px}.eyebrow{font-size:10px;letter-spacing:4px;color:#e4c58c}.btn{border-radius:40px;padding:16px 30px;background:linear-gradient(110deg,#ffe4aa,#d2a657);color:#181923;border:1px solid #f2d69b;box-shadow:0 7px 22px #0005;transition:transform .2s,filter .2s}.btn:hover{transform:translateY(-2px);filter:brightness(1.1)}.btn.outline{background:#091320ba;color:#e9c988;box-shadow:none}.features div,.panel{background:linear-gradient(145deg,#152235,#0b1625);border:1px solid #d5b57440;border-radius:12px}.features div{padding:25px 12px}.features small{line-height:1.7}.progress{margin-top:70px}.track{height:6px;border-radius:20px;overflow:hidden}.fill{background:linear-gradient(90deg,#8c5ad8,#efc77b);transition:width .3s}#question{margin:58px 0 35px;font-size:clamp(22px,4vw,33px)}.answer{background:linear-gradient(115deg,#17263b,#0c1726);border-color:#c9a96966;border-radius:12px;min-height:70px;transition:transform .2s,background .2s}.answer:hover{transform:translateY(-2px);background:#27354b}.resultHead{padding-top:52px}.resultHead h1{font-weight:400;font-size:22px}.resultHead h2{font-size:clamp(28px,5vw,48px);font-weight:500}.portrait{height:min(65vw,520px);min-height:340px;border-radius:14px;border:1px solid #d7b77377;box-shadow:0 15px 50px #0008}.portrait img{object-fit:contain;background:#111927}.facts{margin:25px 0}.facts>div{background:#142034;border:1px solid #d2b57433;border-radius:8px}.panel{margin-top:17px;padding:26px}.panel h3{color:#e9c987;font-weight:500}.quote{background:linear-gradient(130deg,#172a38,#172037);border-color:#e6c17b;text-align:center;color:#f3d8a2;font-size:clamp(18px,3vw,24px);line-height:1.8}.galleryCard{border:1px solid #d5b57466;border-radius:11px;overflow:hidden;background:#142033;transition:transform .2s}.galleryCard:hover{transform:translateY(-4px)}.galleryCard img{object-fit:cover}.actions{margin-top:30px}.disclaimer{color:#9eabb5;font-size:11px;line-height:1.9}
@media(max-width:650px){header{padding:9px 14px}.brand img{width:36px;height:36px}.brand{font-size:18px}.brand small{font-size:6px}.nav-actions .nav-link{display:none}.nav-actions button{font-size:10px;padding:8px}main{padding:0 12px 65px}.hero{min-height:690px;margin:12px 0 24px;padding:65px 17px 35px;background-position:center center}.hero h1{letter-spacing:2px;font-size:clamp(51px,13vw,75px)}.hero h2{letter-spacing:1px}.hero p{font-size:12px}.hero-emblem{width:92px;height:92px}.hero-foot{font-size:9px;letter-spacing:1px}.features{grid-template-columns:1fr;gap:8px}.features div{padding:17px}.portrait{height:420px}.panel{padding:19px}.facts{gap:8px}.resultHead{padding-top:28px}}

/* ---- v5.1 追加 ---- */
.galleryCard{display:block;text-decoration:none}
.galleryCard .thumb{display:block;width:100%;height:145px;object-fit:cover}
.pending{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;width:100%;height:100%;background:radial-gradient(circle at 50% 40%,#22324a,#0b1625 75%);color:#cdb98c;font-size:13px;letter-spacing:1px;text-align:center}
.pending img{width:72px;height:72px;opacity:.75}
.pending.thumb{height:145px;font-size:11px;gap:8px}.pending.thumb img{width:46px;height:46px}
#portraitFrame>img{width:100%;height:100%;object-fit:contain;background:#111927}
.content-note{font-size:12px;color:#cdb98c;text-align:center;border:1px dashed #d5b57455;border-radius:8px;padding:10px 14px;margin:14px 0 0}
.back{font:13px 'Noto Serif JP',Georgia,serif}
.answer{font-family:inherit}
.answer:focus-visible,.btn:focus-visible,.nav-actions button:focus-visible,.galleryCard:focus-visible,.brand:focus-visible{outline:2px solid #f3d49a;outline-offset:3px}
[data-focus]:focus{outline:none}
.track{position:relative}
.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#f3d49a;color:#181923;padding:12px 20px;border-radius:30px;font-size:13px;box-shadow:0 8px 30px #0008;transition:opacity .25s,transform .25s;z-index:10;max-width:calc(100% - 32px);text-align:center}
.toast.show{opacity:1;transform:translate(-50%,0)}
.data-error{text-align:center;color:#f3b0a0;margin:16px auto;padding:16px;border:1px solid #f3b0a066;border-radius:12px;max-width:520px}
.data-error p{margin:0 0 12px;line-height:1.8}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* ---- v5.4 誕生日・傾向 ---- */
.bd-wrap{text-align:center;padding:70px 0 20px;max-width:520px;margin:auto}
.bd-wrap h2{font-weight:500;font-size:clamp(24px,4vw,32px);margin:18px 0 30px}
.bd-fields{display:flex;gap:14px;justify-content:center;margin-bottom:18px}
.bd-fields label{display:flex;align-items:center;gap:8px;color:#e9c987;font-size:15px}
.bd-fields select{appearance:none;-webkit-appearance:none;background:linear-gradient(115deg,#17263b,#0c1726);color:#f5efe5;border:1px solid #c9a96988;border-radius:10px;padding:14px 18px;font:16px 'Noto Serif JP',Georgia,serif;min-width:96px;text-align:center;cursor:pointer}
.bd-fields select:focus-visible{outline:2px solid #f3d49a;outline-offset:3px}
.bd-note{font-size:12px;color:#b9b4c1;line-height:1.9;margin:0 0 22px}
.bd-error{color:#f3b0a0;font-size:13px}
.match{font-family:'Cormorant Garamond',Georgia,serif;font-size:26px;color:#f3d49a;margin:4px 0 6px}
.traits-note{font-size:12px;color:#b9b4c1;margin:0 0 16px}
.traits{display:grid;gap:12px}
.trait{display:grid;grid-template-columns:4.5em 1fr;gap:12px;align-items:center;font-size:13px}
.trait-name{color:#e9c987}
.bars{display:grid;gap:4px}
.bar{height:8px;border-radius:8px;background:#26324a;overflow:hidden}
.bar>i{display:block;height:100%;border-radius:8px}
.bar.you>i{background:linear-gradient(90deg,#b48e49,#f3d49a)}
.bar.them>i{background:linear-gradient(90deg,#7b8798,#d7dde6)}
footer a{color:#cdb98c;margin-right:14px}
footer a:hover{color:#f3d49a}

/* ---- v5.5 結果の冒頭を1画面に収める ---- */
@media(min-width:651px){.resultHead{padding-top:28px}.resultHead h2{margin:8px 0}.portrait{height:min(40vh,420px);min-height:280px}.facts{margin:14px 0}.facts>div{padding:12px 16px}}
@media(max-width:650px){
  .resultHead{padding-top:18px}
  .resultHead h1{font-size:16px;margin:6px 0 0}
  .resultHead h2{margin:6px 0 4px}
  .resultHead .muted{margin:0 0 10px;line-height:1.6}
  .portrait{height:300px;min-height:0}
  .facts{margin:12px 0}
  .facts>div{padding:10px 12px}
  .facts small{margin-bottom:4px}
  .actions .btn{padding:14px 18px}
}