:root{--red:#dc243e;--gold:#d2ad6b;--ink:#f5f0e8;--muted:#d1c2ba;--line:#b894563c;--paper:#111013}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 12% 28%,#50132170,transparent 45%),radial-gradient(ellipse at 90% 65%,#321219,transparent 50%),#111013;color:var(--ink);font:16px/1.7 system-ui,-apple-system,"Hiragino Kaku Gothic ProN",sans-serif}body:before{content:'';position:fixed;inset:0;pointer-events:none;background:repeating-linear-gradient(60deg,transparent 0 100px,#d2ad6b03 101px 102px,transparent 103px 200px);z-index:-1}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:var(--gold)}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--gold);outline-offset:4px}[hidden]{display:none!important}header{border-bottom:1px solid var(--line);background:#0d0c0ee6}.header-inner{max-width:1260px;margin:auto;padding:16px 28px;display:flex;justify-content:space-between;align-items:center;gap:16px}.logo{display:flex;align-items:center;text-decoration:none}.logo img{width:190px;height:auto;max-height:60px;object-fit:contain}.logo-fallback{display:none}.preview-label{font-size:15px;letter-spacing:.15em;color:var(--gold);border:1px solid var(--line);padding:6px 12px}.preview-label span{display:block;font-size:15px;color:var(--muted);letter-spacing:0}main{max-width:1260px;margin:auto;padding:36px 28px}.eyebrow{color:var(--gold);font-size:15px;letter-spacing:.13em;font-weight:700}h1{font-size:clamp(24px,3.4vw,44px);letter-spacing:-.035em;line-height:1.4;margin:12px 0;white-space:nowrap}h2{font-size:28px;line-height:1.6;margin:10px 0 18px}h3{line-height:1.6}.intro-copy{font-size:16px;color:var(--muted);margin:8px 0 28px}.experience{display:grid;grid-template-columns:43% minmax(0,57%);align-items:center;gap:0;scroll-margin-top:12px;position:relative}.genie-stage{min-height:600px;position:relative;display:flex;justify-content:center;align-items:center;isolation:isolate;background:radial-gradient(ellipse,#6e17284d,transparent 68%);overflow:visible}.character-frame{position:relative;width:310px;height:600px;z-index:2;animation:float-genie 6s ease-in-out infinite;filter:drop-shadow(0 8px 25px #0009)}.character-layer{position:absolute;inset:0;opacity:0;transform:translateY(5px) scale(.985);transition:opacity .4s,transform .5s;object-fit:contain;object-position:center;max-width:100%;pointer-events:none}.character-layer.active{opacity:1;transform:translateY(0) scale(1)}
.halo{position:absolute;width:350px;height:350px;top:90px;border:1px solid #d2ad6b35;border-radius:50%;transform:rotate(30deg)}.halo:after{content:'';position:absolute;inset:14px;border:1px dashed #d2ad6b20;border-radius:50%}.smoke{position:absolute;width:85%;height:130px;bottom:110px;background:radial-gradient(ellipse,#bba69b26,transparent 70%);filter:blur(22px);animation:smoke 8s ease-in-out infinite;pointer-events:none}.smoke-b{bottom:210px;animation-delay:-4s;width:65%}.stage-caption{display:none}.chat{container-type:inline-size;position:relative;padding:28px 30px;border:1px solid var(--line);border-top:3px solid var(--red);border-radius:6px;background:linear-gradient(145deg,#282023ee,#171417f5);box-shadow:0 20px 70px #0005;min-width:0}.chat:before{content:'';position:absolute;left:-8px;top:100px;width:14px;height:14px;background:#282023;border-left:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(45deg)}.chat-top{display:flex;justify-content:space-between;font-size:15px;color:var(--gold)}.progress{height:2px;background:#ffffff12;margin:16px 0}.progress>div{height:100%;width:0;background:linear-gradient(90deg,var(--red),var(--gold));transition:width .3s}.question-number{font-size:15px;letter-spacing:.16em;color:var(--muted);display:flex;align-items:baseline;gap:8px}.question-number strong{font-size:42px;letter-spacing:-.03em;color:var(--gold)}.question-number span{letter-spacing:0}.reaction{font-size:19px;font-weight:750;color:var(--gold);margin:16px 0 4px}.conversation h2{font-size:clamp(22px,2.3vw,30px);outline:none;overflow-wrap:anywhere}.conversation.enter{animation:enter .3s ease-out}#question-note{font-size:16px;color:var(--muted);min-height:22px;margin:4px 0 22px}.options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.options button{min-height:54px;line-height:1.6;padding:12px 15px;text-align:left;color:var(--ink);background:#30282d;border:1px solid #6b555b;border-radius:4px;font-size:16px;font-weight:650;display:flex;align-items:center;justify-content:space-between;gap:8px;transition:background .16s,border-color .16s,transform .16s}.options button:hover,.options button:active{background:#841a2e;border-color:var(--gold);transform:translateY(-1px)}.options button:last-child:nth-child(odd){grid-column:1/-1}.options .start{grid-column:1/-1;background:#ac2036;border-color:#d2ad6b80;padding:16px 20px}.answer-arrow{color:var(--gold)}.options.five-choice button:nth-child(3){grid-column:1/-1;grid-row:3}.chat-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:18px;color:var(--muted);font-size:15px}.text-button{color:var(--muted);border:0;background:none;min-height:44px;font-size:16px;padding:8px;text-decoration:underline;text-underline-offset:5px}#history-wrap{font-size:16px;color:var(--muted);border-bottom:1px solid var(--line);padding:5px 0 10px}summary{cursor:pointer;min-height:32px}#history{padding-left:20px}.answer-bubble{font-size:15px;background:#ffffff08;color:var(--muted);padding:6px 12px;margin:12px 0 8px;text-align:right;border-radius:4px}.answer-bubble:before{content:'お前： '}.busy .chat{animation:veil .9s ease-out}.busy .smoke{opacity:.8}.is-result #question{font-size:clamp(44px,5.5vw,76px);color:#f04754;letter-spacing:-.05em;line-height:1.2;text-shadow:0 1px 0 #e2b36d,0 0 35px #d62a3a33;animation:decide .5s ease-out}.is-result .question-number{display:none}.is-result .chat{border-color:#c0a06380}.is-result .genie-stage .halo{box-shadow:0 0 70px #bd233733;border-color:#d2ad6b65}#results{padding-top:24px;scroll-margin-top:12px}.result-heading{text-align:center;margin-bottom:24px}.result-heading h2{font-size:22px;outline:none}.result-heading .eyebrow{margin-bottom:4px}#result-note{font-size:16px;color:var(--muted);max-width:700px;margin:auto}.result-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.photo-card{border:1px solid var(--line);background:#211b20;border-radius:5px;overflow:hidden;animation:enter .4s ease-out both}.photo-card:nth-child(2){animation-delay:.08s}.photo-card:nth-child(3){animation-delay:.16s}.photo-card>img{width:100%;height:250px;object-fit:cover;background:#100d0f;display:block}.photo-info{padding:18px}.photo-info h3{font-size:16px;margin:8px 0 12px}.match{font-size:15px;color:var(--gold)}.reasons{display:flex;gap:6px;flex-wrap:wrap}.reasons span{background:#ffffff0a;border:1px solid var(--line);padding:3px 7px;font-size:15px;color:var(--muted)}.photo-link{display:flex;align-items:center;justify-content:space-between;background:#b52139;color:white;font-weight:800;padding:12px 16px;margin-top:16px;text-decoration:none;min-height:48px;border:1px solid #d2ad6b70}.photo-link small{font-size:15px;font-weight:400}.result-actions{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0 40px;align-items:center}.primary,.secondary{min-height:54px;border-radius:4px;font:inherit;padding:12px 20px;cursor:pointer}.secondary{background:#3a2b31;color:white;border:1px solid var(--gold)}.secondary span{font-size:15px;margin-left:10px;color:var(--muted)}.primary{background:#5f1324;color:#f4e7d4;border:1px solid #b42b42}.recommendations{border-top:1px solid var(--line);padding-top:22px}.recommendations>p{font-size:16px;color:var(--muted)}.related-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}.related-card{text-decoration:none;font-size:15px;color:var(--muted)}.related-card img{display:block;width:100%;height:115px;object-fit:cover;margin-bottom:8px}footer{border-top:1px solid var(--line);margin-top:36px;padding:22px 0;color:#9a8f8c;font-size:15px}footer p{margin:8px 0}.prototype-info{margin-top:18px}pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:15px}.chaotic .smoke{background:radial-gradient(ellipse,#bf274760,transparent 70%)}.chaotic .halo{animation:chaos .9s ease-out}.nod .character-layer.active{animation:nod .3s ease-out}.surprised .character-layer.active{animation:surprise .4s ease-out}@keyframes float-genie{50%{transform:translateY(-7px)}}@keyframes smoke{50%{transform:translate(12px,-10px) scale(1.06);opacity:.4}}@keyframes enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes decide{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}@keyframes veil{30%{filter:brightness(.65)}to{filter:brightness(1)}}@keyframes nod{50%{transform:translateY(2px)}}@keyframes surprise{45%{transform:translateY(-4px) rotate(-1deg)}}@keyframes chaos{50%{box-shadow:0 0 70px #bf27395f;transform:rotate(35deg) scale(1.04)}}
@media(max-width:760px){.header-inner{padding:12px 18px}.logo img{width:150px}.preview-label{font-size:15px;padding:5px 8px}main{padding:24px 18px}.eyebrow{font-size:15px;letter-spacing:.02em}h1{font-size:clamp(19px,6vw,32px);letter-spacing:-.055em}.intro-copy{font-size:16px;line-height:1.8;margin-bottom:10px}.desktop{display:none}.experience{grid-template-columns:1fr;scroll-margin-top:8px}.genie-stage{min-height:290px;height:290px}.character-frame{width:145px;height:280px}.halo{width:235px;height:235px;top:20px}.smoke{bottom:30px;width:90%}.smoke-b{bottom:110px}.chat{padding:20px 18px;min-height:0}.chat:before{top:-8px;left:50%;transform:rotate(135deg)}.conversation h2{font-size:21px}.question-number strong{font-size:34px}.reaction{font-size:19px}.options{gap:8px}.options button{font-size:16px;padding:12px;min-height:52px}#question-note{font-size:16px;margin-bottom:18px}.is-result #question{font-size:clamp(40px,12vw,68px)}.result-grid{grid-template-columns:1fr;gap:20px}.photo-card>img{height:280px}.result-heading h2{font-size:18px}.result-actions{display:grid;grid-template-columns:1fr}.result-actions .primary{white-space:normal;font-size:16px}.related-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.related-card img{height:95px}.chat-bottom{margin-top:10px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Readability + isolated approved V1 display. No source-sheet viewports or neighboring poses. */
.character-layer{display:block;width:100%;height:100%;clip-path:none}
.options.five-choice button:nth-child(3){grid-column:1/-1;grid-row:3}.options.five-choice button:last-child{grid-column:auto}
.question-number{font-size:15px}.reaction{font-size:19px;line-height:1.65}
.chat-top{gap:12px;flex-wrap:wrap}.chat-bottom{gap:12px;flex-wrap:wrap}
#question-note{font-size:16px;line-height:1.85}.answer-bubble{font-size:16px}#history-wrap{font-size:16px}summary{min-height:44px}
.options button:focus{background:#841a2e;border-color:var(--gold);box-shadow:inset 3px 0 var(--gold)}
.is-result #history-wrap,.is-result #last-answer,.is-result .question-number,.is-result .progress{display:none}
.is-result .chat-top{margin-bottom:24px}.is-result .chat-bottom{margin-top:22px}
.is-result #question{white-space:nowrap;font-size:clamp(48px,13cqi,88px);margin:18px 0 24px;letter-spacing:-.06em;color:#ff485a;text-shadow:0 2px 0 #e9bf78,0 0 40px #c9283944;animation:decide .65s cubic-bezier(.2,.75,.25,1)}
.is-result .reaction{font-size:20px}.is-result #question-note{font-size:18px;font-weight:700;color:#eee1ce;line-height:1.85}
.result-heading h2{font-size:clamp(22px,2.3vw,29px);margin:8px 0 18px}.result-heading .eyebrow{font-size:16px}#result-note{font-size:16px;line-height:1.9}
.photo-info h3{font-size:18px}.match,.reasons span,.photo-link small{font-size:15px}.photo-link{font-size:19px;gap:12px;flex-wrap:wrap}
.secondary span{font-size:16px}.related-card{font-size:15px}.recommendations>p{font-size:16px}
@keyframes decide{0%{opacity:0;transform:scale(.86);filter:blur(2px)}65%{opacity:1;transform:scale(1.035);filter:blur(0)}100%{transform:scale(1)}}
@media(max-width:760px){
 .header-inner{padding:12px 16px;gap:10px}.logo img{width:132px}.preview-label{padding:4px 6px;font-size:15px;letter-spacing:.02em}.preview-label span{font-size:15px}
 main{padding:20px 16px}.intro .eyebrow{font-size:15px;line-height:1.65;letter-spacing:0}.intro-copy{font-size:16px;line-height:1.8}
 .chat{padding:20px 18px}.conversation h2{font-size:23px;line-height:1.65}.reaction{font-size:18px}.chat-top{font-size:15px}
 .options button{font-size:16px;min-height:56px;padding:12px 13px}.options{gap:10px}
 .question-number strong{font-size:32px}.text-button{font-size:16px}.chat-bottom{font-size:15px}
 .is-result .chat{padding:22px 18px}.is-result .chat-top{margin-bottom:18px}.is-result #question{font-size:clamp(32px,15cqi,62px);margin:20px 0 24px}
 .is-result #question-note{font-size:17px;overflow-wrap:anywhere}.is-result .chat-bottom{margin-top:14px}
 .result-heading h2{font-size:22px;line-height:1.7}.photo-card>img{height:auto;aspect-ratio:3/2}.photo-info{padding:18px}.result-actions .primary{font-size:16px}
 .secondary span{display:block;margin:4px 0 0}.related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.related-card img{height:120px}
 footer{font-size:15px}.eyebrow{font-size:15px}pre{font-size:15px}
}
@media(min-width:761px) and (max-width:1000px){.chat{padding:24px}.character-frame{width:270px;height:522px}.genie-stage{min-height:550px}.options{grid-template-columns:1fr}.is-result #question{font-size:12cqi}}

@media(max-width:760px){.is-result #question-note span{display:block}.is-result #question-note .result-subject{white-space:nowrap}.result-heading h2{text-wrap:balance}}

/* Limited preview: the conversation has no progress chrome or answer history. */
.experience:not(.is-result) #question-note{display:none}
.chat .reaction{margin-top:0}.conversation h2{margin-top:12px;margin-bottom:24px}
.is-result .reaction{margin-top:0}.is-result .chat{padding-top:34px;padding-bottom:34px}
.demo-hero{max-width:760px;margin:40px auto 32px}.demo-hero h1{white-space:normal;font-size:clamp(28px,4vw,44px)}
.demo-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:24px 0 120px}.demo-gallery img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;border:1px solid var(--line);border-radius:4px}.demo-gallery p{font-size:16px;margin:8px 0;color:var(--muted)}
.genie-launcher{position:fixed;right:24px;bottom:24px;z-index:20;display:flex;align-items:center;gap:10px;max-width:calc(100vw - 32px);min-height:56px;padding:12px 18px;color:#f5e6c9;background:linear-gradient(135deg,#25191d,#591326);border:1px solid #cfac6a;border-radius:6px;box-shadow:0 6px 28px #0008;text-decoration:none;font-size:16px;font-weight:750;line-height:1.5}
.genie-launcher svg{width:34px;height:28px;flex:none;transform-origin:50% 80%;transition:transform .25s}.genie-launcher:before{content:'';position:absolute;inset:-12px 5px;pointer-events:none;background:radial-gradient(ellipse,#decbb522,transparent 65%);opacity:0;transition:opacity .25s}
.genie-launcher:hover,.genie-launcher:active,.genie-launcher:focus-visible{background:linear-gradient(135deg,#4c1725,#841a30);border-color:#f3ca7e}.genie-launcher:hover svg,.genie-launcher:active svg{transform:rotate(-8deg)}.genie-launcher:hover:before,.genie-launcher:active:before{opacity:1}
@media(max-width:760px){.chat{padding-top:24px;padding-bottom:24px}.genie-launcher{right:16px;bottom:calc(16px + env(safe-area-inset-bottom));padding:12px 14px;min-height:56px}.demo-hero{margin-top:24px}.demo-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}}
/* Quiet, one-time invitation on the prototype demo only. */
.genie-launcher-wrap{position:fixed;right:24px;bottom:24px;z-index:50;max-width:calc(100vw - 32px)}
.genie-launcher-wrap .genie-launcher{position:relative;right:auto;bottom:auto;max-width:100%;white-space:nowrap}
.genie-prompt{position:absolute;right:0;bottom:calc(100% + 14px);display:flex;align-items:center;gap:8px;width:max-content;max-width:min(300px,calc(100vw - 32px));background:#201519;border:1px solid #c7a264;color:#f8e2ba;padding:5px 8px 5px 16px;font-size:16px;box-shadow:0 8px 30px #0008;line-height:1.5}
.genie-prompt[hidden]{display:none}
.genie-prompt:after{content:'';position:absolute;right:32px;bottom:-7px;width:12px;height:12px;background:#201519;border-right:1px solid #c7a264;border-bottom:1px solid #c7a264;transform:rotate(45deg)}
.genie-prompt button{border:0;background:transparent;color:#e7c894;min-width:44px;min-height:44px;font-size:22px;padding:0;flex-shrink:0}
.is-nudging .genie-launcher{animation:lamp-invitation 1.6s ease-out}
.is-nudging .genie-launcher svg{animation:lamp-rock 1.4s ease-in-out}
.is-nudging .genie-launcher:before{animation:lamp-puff 1.6s ease-out}
@keyframes lamp-invitation{0%,100%{transform:scale(1);box-shadow:0 8px 24px #0006}35%{transform:scale(1.035);box-shadow:0 0 22px #c19a593f}65%{box-shadow:0 0 12px #bc24472f}}
@keyframes lamp-rock{0%,100%{transform:rotate(0)}20%,55%{transform:rotate(-7deg)}38%,72%{transform:rotate(6deg)}}
@keyframes lamp-puff{0%,100%{opacity:0;transform:translateY(0) scale(.8)}45%{opacity:.4;transform:translateY(-13px) scale(1.2)}}
@media(max-width:600px){.genie-launcher-wrap{right:16px;bottom:max(16px,env(safe-area-inset-bottom))}.genie-launcher-wrap .genie-launcher{font-size:16px;min-height:56px;padding:10px 14px;gap:9px}}
@media(prefers-reduced-motion:reduce){.is-nudging .genie-launcher,.is-nudging .genie-launcher svg,.is-nudging .genie-launcher:before{animation:none!important}}

/* Compact reveal: the verdict flows directly into the photos. */
.intro h1{margin-top:0}.intro-copy{margin-bottom:14px}
.is-result .genie-stage{height:330px;min-height:330px}
.is-result .character-frame{width:170px;height:330px}
.is-result .halo{width:260px;height:260px;top:25px}
.is-result .smoke{bottom:45px}.is-result .smoke-b{bottom:130px}
.is-result .chat{padding:22px 26px;scroll-margin-top:16px}
.is-result #question{margin:4px 0 8px}
.is-result #question-note{min-height:0;margin:0;font-size:17px;line-height:1.6}
.is-result .options:empty{display:none}
#results{padding-top:12px}
.photo-image-link{display:block;background:#100d0f}
.photo-card .result-photo{display:block;width:100%;height:300px;object-fit:contain;background:#100d0f}
.photo-info{padding:14px 16px}.photo-info h3{margin:0 0 8px}.match{display:block;margin-bottom:8px}
.photo-link{margin-top:12px}
@media(max-width:760px){
 .intro-copy{margin-bottom:4px}
 .is-result .genie-stage{height:210px;min-height:210px}
 .is-result .character-frame{width:105px;height:204px}
 .is-result .halo{width:175px;height:175px;top:12px}
 .is-result .smoke{bottom:28px}.is-result .smoke-b{bottom:82px}
 .is-result .chat{padding:14px 16px;scroll-margin-top:12px}
 .is-result .reaction{font-size:17px;line-height:1.5;margin:0 0 4px}
 .is-result #question{font-size:clamp(28px,8vw,36px);line-height:1.15;margin:4px 0 8px;letter-spacing:-.05em}
 .is-result #question-note{font-size:16px;line-height:1.55}
 .is-result #question-note span{display:inline}.is-result #question-note .result-subject{white-space:normal}
 #results{padding-top:10px}.result-grid{gap:16px}
 .photo-card .result-photo{height:auto;max-height:460px;aspect-ratio:auto;object-fit:contain}
 .photo-info{padding:14px}.photo-info h3{font-size:18px}
}

.result-share{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:18px 0 30px}.result-share #share-status{width:100%;margin:0;font-size:15px}.result-share input{width:100%;max-width:100%;padding:12px;color:#fff;background:#23191b;border:1px solid #b49359;font-size:16px}[hidden]{display:none!important}

/* Keep the rotating decoration inside narrow screens without clipping V1. */
@media(max-width:760px){.halo{max-width:65%;height:auto;aspect-ratio:1}}

/* Result controls: photos first, chaos as the primary action. */
.photo-info h3{margin:0}.photo-info .photo-link{margin-top:12px}
.result-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:min(100%,620px);margin:28px auto 12px;gap:10px 18px;align-items:center;justify-items:center}
.result-actions #chaos{grid-column:1/-1;width:100%;min-height:74px;padding:18px 26px;font-size:21px;font-weight:800;line-height:1.5;letter-spacing:.01em;background:linear-gradient(135deg,#a51f36,#641426);border:1px solid #d2ad6b;box-shadow:0 6px 26px #9f19362b,inset 0 1px #eed29b30}
.result-actions #chaos:hover,.result-actions #chaos:focus-visible{background:linear-gradient(135deg,#bd2942,#83192f);box-shadow:0 6px 32px #b9274144;outline:2px solid #e3be79;outline-offset:3px}
.result-actions #retry{min-height:44px;padding:8px 12px;font-size:16px;background:#32242b;border-color:#796149;line-height:1.5}
.result-actions #retry span{font-size:15px;margin-left:6px}.result-actions #reset{font-size:16px}
.result-share{justify-content:center;gap:8px 22px;margin:8px auto 28px;max-width:620px;text-align:center}
.result-share #share-x,.result-share #copy-url{min-height:44px;padding:8px 6px;border:0;background:none;font-size:15px;font-weight:400;color:var(--muted);text-decoration:underline;text-underline-offset:4px}
.result-share #share-status:empty{display:none}
@media(max-width:760px){.result-actions{margin-top:20px;gap:8px}.result-actions #chaos{min-height:72px;padding:14px 22px;font-size:18px;text-wrap:balance}.result-actions #retry{font-size:16px;padding:8px}.result-actions #retry span{display:none}.result-actions #reset{font-size:15px;padding:8px 4px}.result-share{margin-bottom:24px;gap:6px 18px}.photo-info{padding:14px}}
