:root{--black:#111310;--panel:#191b17;--red:#e32d25;--paper:#eeeadd;--ink:#24251f;--muted:#9a9e90;--line:#383b32;--display:'Barlow Condensed',Impact,sans-serif;--jp:'Noto Sans JP',sans-serif;--mono:ui-monospace,SFMono-Regular,Consolas,monospace}*{box-sizing:border-box}html{background:var(--black);color:var(--paper);scroll-behavior:smooth}body{margin:0;font-family:var(--jp);font-size:14px;-webkit-font-smoothing:antialiased}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}a{color:inherit;text-underline-offset:4px}button{border:0}button:disabled{cursor:not-allowed}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #f6c985;outline-offset:5px}button:active:not(:disabled){transform:translateY(2px)}.board-grid{position:fixed;inset:0;z-index:0;pointer-events:none}.app-shell{position:relative;width:100%;max-width:480px;margin:0 auto;min-height:100svh;background:#111310f2;border-left:1px solid #ffffff0b;border-right:1px solid #ffffff0b;isolation:isolate}.app-shell:before{content:'';position:absolute;inset:0;pointer-events:none;z-index:9;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.7' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}.header{height:65px;margin:0 24px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;position:relative;z-index:10}.wordmark{background:none;padding:0;font:800 28px/1 var(--display);color:var(--red);letter-spacing:-.4px}.wordmark span{color:var(--paper);font-size:16px;letter-spacing:1px}.header-code{font:9px var(--mono);letter-spacing:1px;display:flex;align-items:center;gap:7px}.header-code i{width:5px;height:5px;border-radius:50%;background:var(--red)}#app{min-height:calc(100svh - 200px)}.desktop-marks{position:fixed;inset:0;pointer-events:none;overflow:hidden;opacity:.5}.desktop-marks>span{position:absolute;left:5vw;top:14vh;font:600 32px/1.2 var(--display);letter-spacing:2px;color:#6e7264}.desktop-marks>b{position:absolute;right:-37px;top:45%;font:900 150px var(--display);color:#30362b;transform:rotate(90deg);transform-origin:center}.desktop-marks>small{position:absolute;bottom:7vh;left:5vw;color:#787e6a;font:10px/2 var(--mono)}.mono{font:10px/1.5 var(--mono);letter-spacing:1.4px}.intro{padding:26px 24px 0;position:relative;overflow:hidden}.eyebrow{display:flex;align-items:center;gap:10px;font:9px var(--mono);letter-spacing:1.2px;color:#b9bdaf}.red-square{width:7px;height:7px;background:var(--red);display:inline-block;flex-shrink:0}.intro h1{font-weight:900;font-size:clamp(47px,14.2vw,65px);line-height:1.25;letter-spacing:-.065em;margin:24px 0 16px;position:relative;z-index:2}.intro h1 em{font-style:normal;color:var(--red)}.intro-copy{font-size:12px;line-height:2;letter-spacing:.04em;color:#bfc1b3;margin:0}.intro-copy strong{font-weight:500;color:var(--paper)}.case-collage{height:238px;position:relative;margin:20px -24px 0;perspective:700px}.red-string{position:absolute;width:120%;height:2px;background:#b32821;transform:rotate(-16deg);top:100px;left:-15px;box-shadow:0 2px 2px #0005}.red-string.two{top:160px;transform:rotate(16deg)}.polaroid{position:absolute;background:var(--paper);color:var(--ink);padding:7px 7px 0;margin:0;width:136px;box-shadow:0 8px 18px #0007;top:16px;left:18px;transform:rotate(-10deg);z-index:1;animation:photo-in 850ms cubic-bezier(.16,1,.3,1) both;--rotation:-10deg}.polaroid.right{left:auto;right:18px;top:31px;transform:rotate(10deg);--rotation:10deg;animation-delay:120ms}.polaroid:before{content:'';position:absolute;top:-9px;left:37px;width:57px;height:18px;background:#d2bea0e0;transform:rotate(-5deg);clip-path:polygon(2% 0,98% 4%,96% 24%,100% 62%,96% 99%,0 96%,4% 59%,0 25%);z-index:2}.polaroid img{width:100%;height:138px;object-fit:cover;object-position:50% 14%;display:block;filter:grayscale(1);background:#353830}.polaroid figcaption{padding:9px 3px;display:flex;align-items:baseline;justify-content:space-between;gap:5px}.polaroid b{font-size:22px;font-weight:900;line-height:1}.polaroid small{font:8px var(--display);letter-spacing:1px}.dossier{position:absolute;background:var(--red);height:135px;width:164px;left:50%;top:80px;transform:translateX(-50%) rotate(-3deg);z-index:3;box-shadow:0 7px 15px #0006;padding:16px 14px;animation:dossier-in 900ms 230ms cubic-bezier(.16,1,.3,1) both}.dossier:before{content:'';width:11px;height:11px;position:absolute;left:50%;top:8px;border-radius:50%;background:#761710;border:3px solid #b62018;box-shadow:1px 3px 3px #0005}.dossier .mono{font-size:7px;letter-spacing:1px;display:block;border-bottom:1px solid #ffb9a255;padding-bottom:10px}.dossier strong{font-size:44px;letter-spacing:12px;display:block;text-align:center;margin:1px 0 0 10px;line-height:1.5}.dossier small{font:8px var(--mono);letter-spacing:1.7px;display:block;text-align:center}.collage-coord{position:absolute;left:24px;bottom:0;color:#73796a;font:8px var(--mono);letter-spacing:1px}.intro-start{position:relative;z-index:4;margin-top:12px}.intro-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;font-size:10px;color:#bbbfb0}.intro-meta b{color:var(--paper);font-size:12px;letter-spacing:1px;font-weight:500}.intro-meta span>i{font-style:normal;color:var(--red);font-size:15px;margin:0 6px}.cta{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:58px;background:var(--red);color:#fff4e8;padding:15px 20px;text-align:left;font-size:14px;font-weight:700;letter-spacing:.05em;transition:background .2s,transform .2s}.cta:hover{background:#f0392e}.cta>span{font-size:23px;font-weight:400}.cta:disabled{background:#2d3028;color:#6f7665}.intro .cta{box-shadow:4px 4px 0 #e32d2538}.start-note{text-align:center;color:#818777;font-size:9px;letter-spacing:.08em;line-height:1.9;margin:14px 0 8px}.text-button{background:none;font-size:11px;padding:12px;color:#babdad;text-decoration:underline;text-underline-offset:4px}.resume-actions{display:flex;justify-content:center}.photo-credit{font-size:8px;color:#686f5d;text-align:center;line-height:1.9;margin:25px 0 0}.photo-credit a{text-decoration:none}.footer{padding:30px 24px 23px;text-align:center;color:#6f7665;position:relative}.footer>span{font:8px var(--mono);letter-spacing:1.4px}.footer p{font-size:8px;line-height:1.9;margin:10px 0}.footer>a{font-size:9px;color:#939985;text-decoration:none}.quiz{padding:22px 24px 0;min-height:calc(100svh - 65px);display:flex;flex-direction:column}.quiz-topline{display:flex;align-items:center;justify-content:space-between}.back{background:transparent;padding:7px 10px 7px 0;min-height:38px;color:#aab09e;font-size:11px;display:flex;gap:9px;align-items:center}.back span{font-size:20px}.quiz-counter{font:22px var(--display);letter-spacing:2px}.quiz-counter span{color:#7d8470;font-size:13px;margin-left:6px}.steps{display:flex;gap:5px;margin:12px 0 24px}.step{padding:0;height:3px;flex:1;background:#383e31;position:relative}.step:after{content:'';position:absolute;inset:-12px 0}.step.complete{background:#a84c36}.step.current{background:var(--red)}.step.current:before{content:'';height:5px;width:5px;border-radius:50%;position:absolute;right:0;top:-1px;background:var(--red)}.question-stage{flex:1;position:relative;outline:none}.question-heading{position:relative;background:var(--paper);color:var(--ink);padding:20px 22px 23px;transform:rotate(-.8deg);box-shadow:3px 4px 0 #464a3c;margin:2px 2px 22px;isolation:isolate}.question-heading:before{content:'';position:absolute;width:66px;height:17px;background:#be352ce8;left:50%;top:-8px;transform:translateX(-50%) rotate(4deg)}.question-meta{display:flex;justify-content:space-between;align-items:center;color:#797c6d;font:8px var(--mono);letter-spacing:.6px;position:relative;z-index:1}.question-meta>span:first-child{font-family:var(--jp);font-size:9px;color:#8e352d;letter-spacing:.5px}.question-heading h1{font-size:22px;font-weight:800;line-height:1.65;letter-spacing:-.045em;margin:18px 0 11px;position:relative;z-index:1}.question-heading p{font-size:11px;line-height:1.9;color:#646756;margin:0;position:relative;z-index:1}.ghost-number{position:absolute;right:13px;top:13px;z-index:0;font:800 95px/1 var(--display);color:#dad6c8;opacity:.6;letter-spacing:-5px}.options{border:0;margin:0;padding:0;display:grid;gap:9px}.option{width:100%;text-align:left;position:relative;padding:15px 14px;display:flex;align-items:center;gap:13px;min-height:65px;background:#1b1e18;border:1px solid #414735;color:#d6d9cb;transition:border-color .18s,background .18s,transform .18s}.option .letter{font:600 18px var(--display);color:#8c947b;flex:0 0 17px}.option .option-text{font-size:12px;line-height:1.8;flex:1}.option .check{width:18px;height:18px;flex-shrink:0;border:1px solid #555e46;display:grid;place-items:center;color:transparent;font-size:12px;font-weight:800}.option:hover{border-color:#7f8a6b}.option.selected{border-color:var(--red);background:#301c17;box-shadow:inset 3px 0 0 var(--red)}.option.selected .letter{color:#f07659}.option.selected .check{background:var(--red);border-color:var(--red);color:var(--paper);animation:check-in .25s cubic-bezier(.2,1.8,.6,1)}.answer-hint{display:flex;justify-content:space-between;gap:10px;font-size:9px;color:#858e75;margin:15px 0 0;min-height:15px}.answer-hint .recorded{color:#da765a;font:8px var(--mono);letter-spacing:1px}.quiz-controls{position:sticky;bottom:0;background:var(--black);padding:18px 0 max(20px,env(safe-area-inset-bottom));margin-top:5px;z-index:8}.quiz-controls .cta{min-height:55px}.screen-reader{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.loading-screen{min-height:calc(100svh - 65px);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 24px;overflow:hidden}.loading-target{width:170px;height:170px;border:1px solid #505941;border-radius:50%;position:relative;display:grid;place-items:center;margin:40px}.loading-target:before{content:'';position:absolute;inset:12px;border:1px dashed #7e8b66;border-radius:50%;animation:rotate 10s linear infinite}.loading-target:after{content:'';position:absolute;inset:-12px;border:1px solid #39432e;border-radius:50%;animation:target-pulse 1.6s infinite}.loading-target strong{font:800 71px var(--display);color:var(--red)}.target-cross{position:absolute;width:200px;height:1px;background:#48563a;z-index:-1}.target-cross.vertical{transform:rotate(90deg)}.loading-screen h1{font-size:23px;letter-spacing:2px}.loading-screen>.mono{color:#9eaa8a}.loading-lines{width:100%;max-width:250px;margin:30px auto}.loading-line{border-bottom:1px solid #39402f;display:flex;justify-content:space-between;padding:12px 0;font:10px var(--mono);color:#798769;opacity:.2}.loading-line.visible{opacity:1;color:#c2c8b4;transition:opacity .3s}.loading-line b{font-size:9px;color:#c55d43}.result{padding:27px 24px 0}.result-eyebrow{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;color:#aeb69d}.result-eyebrow .mono{font-size:8px}.result-card{background:var(--paper);color:var(--ink);position:relative;padding:22px;box-shadow:5px 5px 0 #575c45;transform:rotate(-1deg);isolation:isolate}.result-card:before{content:'';position:absolute;left:calc(50% - 38px);top:-10px;width:76px;height:22px;background:#d1bea1df;transform:rotate(4deg)}.result-card-top{display:flex;justify-content:space-between;align-items:center;font:8px var(--mono);letter-spacing:1px;color:#71755f;border-bottom:1px solid #c2c5ad;padding-bottom:13px}.result-card-top b{font:700 17px var(--display);color:var(--red)}.result-type{position:relative;min-height:210px;padding:21px 0 15px;overflow:hidden}.result-type>span{font:9px var(--mono);letter-spacing:2px;color:#71755f;position:relative;z-index:2}.result-type h1{font-size:90px;line-height:1.18;letter-spacing:-.09em;font-weight:900;margin:14px 0 7px;color:var(--red);position:relative;z-index:2;white-space:pre-line}.result-type h1.long{font-size:52px;line-height:1.2;letter-spacing:-.04em}.result-type p{font:700 14px var(--display);letter-spacing:2px;margin:0;position:relative;z-index:2}.result-symbol{position:absolute;right:-5px;top:20px;font:120px Georgia,serif;color:#d5d5bf;transform:rotate(10deg);z-index:0}.result-card-stamp{font-size:11px;letter-spacing:2px;font-weight:800;border:2px solid var(--red);color:var(--red);padding:5px 8px;transform:rotate(-12deg);position:absolute;right:1px;top:34px;z-index:3;animation:stamp-in .5s .3s cubic-bezier(.2,1.2,.4,1) both}.result-card-bottom{border-top:1px solid #c2c5ad;display:flex;justify-content:space-between;align-items:center;padding-top:14px;gap:10px}.result-card-bottom .mono{font-size:7px;color:#777c64;letter-spacing:1px}.barcode{height:22px;display:flex;gap:2px;align-items:stretch}.barcode i{width:2px;background:#3f4432}.barcode i:nth-child(3n){width:4px}.barcode i:nth-child(4n){width:1px}.result-description{padding-top:30px}.result-description h2{font-size:22px;line-height:1.7;letter-spacing:-.04em;margin:0 0 15px;white-space:pre-line}.result-description>p{font-size:12px;line-height:2.1;color:#abb59a;margin:0}.traits{display:grid;gap:0;margin:22px 0;border-top:1px solid #434c35}.trait{display:flex;align-items:center;gap:15px;padding:14px 2px;border-bottom:1px solid #434c35;font-size:12px}.trait span{font:12px var(--mono);color:#bd654c}.result-index{padding:20px;background:#22281b;border:1px solid #454f35;margin:23px 0}.index-header{display:flex;justify-content:space-between;align-items:baseline}.index-header>span{font-size:11px;color:#aebc98}.index-header strong{font:600 35px var(--display);color:var(--paper)}.index-header strong small{font-size:15px;color:#75845e}.index-track{height:4px;background:#4b553b;position:relative;margin:18px 2px 12px}.index-track:before{content:'';position:absolute;height:10px;width:1px;background:#899575;left:50%;top:-3px}.index-track i{height:12px;width:5px;position:absolute;top:-4px;left:var(--score);background:var(--red);transform:translateX(-50%);transition:left .7s ease}.index-labels{display:flex;justify-content:space-between;color:#aab990;font-size:10px}.score-note{font-size:9px;color:#84916f;line-height:1.8;margin:12px 0 0}.field-note{padding:20px 0 20px 19px;border-left:2px solid #b55137;margin:24px 0}.field-note>.mono{color:#bd684c;font-size:9px}.field-note p{font-size:12px;line-height:2;color:#b2bca0;margin:10px 0 0}.result-actions{display:grid;gap:12px;padding-top:3px}.secondary{display:flex;align-items:center;justify-content:space-between;border:1px solid #536040;background:transparent;padding:16px 20px;font-size:12px;min-height:54px;color:#c7d0b6}.secondary:hover{background:#222a1a}.secondary span{font-size:20px}.result-edit{display:flex;justify-content:center;gap:18px;margin-top:17px}.result-edit .text-button{font-size:10px;padding:8px}.shared-label{background:#262d1d;border:1px solid #556441;padding:12px 15px;font-size:10px;color:#b1c096;margin-bottom:24px}.result-disclosure{margin-top:25px;font-size:10px;color:#9fac8b;border-top:1px solid #3d492e;padding:17px 0}.result-disclosure summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between}.result-disclosure p{font-size:10px;line-height:1.9;color:#86966f}.answer-review{padding:14px 0;border-bottom:1px solid #3a442d}.answer-review b{font-size:10px;color:#b7c79f}.answer-review p{margin:7px 0 0}.answer-review button{background:none;color:#bf7b5f;font-size:10px;padding:8px 0 0}.result .cta{background:var(--red)}#toast{position:fixed;left:50%;bottom:max(22px,env(safe-area-inset-bottom));transform:translate(-50%,15px);opacity:0;pointer-events:none;z-index:100;width:max-content;max-width:calc(100vw - 30px);background:var(--paper);color:var(--ink);padding:14px 20px;font-size:11px;line-height:1.7;border-left:4px solid var(--red);box-shadow:0 4px 25px #0005;transition:opacity .2s,transform .2s}#toast.show{opacity:1;transform:translate(-50%,0)}dialog{max-width:calc(100vw - 40px);width:380px;padding:27px;background:var(--paper);color:var(--ink);border:0;box-shadow:6px 6px 0 #e32d25}dialog::backdrop{background:#080a08df}dialog>.mono{color:#a83c2b}dialog h2{font-size:20px;margin:16px 0}dialog p{font-size:11px;color:#6c7360;line-height:2;margin-bottom:22px}dialog .text-button{display:block;margin:10px auto 0;color:#697258}dialog .cta{font-size:12px}.noscript{padding:24px;color:white;position:relative}.intro{animation:screen-in .65s cubic-bezier(.2,.7,.3,1) both}.result{animation:screen-in .6s cubic-bezier(.2,.7,.3,1) both}
@keyframes photo-in{from{opacity:0;transform:translateY(40px) rotate(0)}to{opacity:1;transform:translateY(0) rotate(var(--rotation))}}@keyframes dossier-in{from{opacity:0;transform:translateX(-50%) translateY(35px) rotate(8deg)}to{opacity:1;transform:translateX(-50%) translateY(0) rotate(-3deg)}}@keyframes check-in{from{transform:scale(.5) rotate(-20deg)}to{transform:scale(1) rotate(0)}}@keyframes screen-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes stamp-in{from{opacity:0;transform:scale(2) rotate(-20deg)}to{opacity:1;transform:scale(1) rotate(-12deg)}}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes target-pulse{0%,100%{transform:scale(.95);opacity:.4}50%{transform:scale(1.07);opacity:1}}
@media(min-width:700px){.app-shell{margin:30px auto;min-height:calc(100svh - 60px);box-shadow:0 12px 60px #0008;border:1px solid #3e4335}.intro{padding-top:32px}.intro h1{font-size:65px}.case-collage{height:254px;margin-top:28px}.polaroid{left:35px;width:151px}.polaroid.right{right:35px}.polaroid img{height:150px}.dossier{top:93px;width:183px}.quiz{min-height:calc(100svh - 126px)}.intro-start{margin-top:22px}.option{padding:17px 16px}.question-heading{padding:24px}.question-heading h1{font-size:24px}.question-heading p{font-size:12px}.option .option-text{font-size:13px}.result-type h1{font-size:105px}.result-type h1.long{font-size:58px}}
@media(max-width:360px){.header{margin:0 19px}.intro,.quiz,.result{padding-left:19px;padding-right:19px}.intro h1{font-size:49px}.eyebrow{font-size:8px}.case-collage{height:215px}.polaroid{width:119px;left:20px}.polaroid.right{right:20px}.polaroid img{height:120px}.dossier{width:143px;height:123px;padding:15px 10px;top:75px}.dossier strong{font-size:37px}.dossier .mono{font-size:6px}.intro-copy{font-size:11px}.question-heading h1{font-size:20px}.question-heading{padding:20px 17px}.option{padding:12px 11px;gap:10px}.option .option-text{font-size:11px}.result-type h1{font-size:76px}.result-type h1.long{font-size:43px}.result-description h2{font-size:20px}.result-card{padding:19px}}
@media(max-height:760px) and (max-width:699px){.intro{padding-top:22px}.intro h1{margin-top:19px;margin-bottom:13px;font-size:51px}.case-collage{height:210px;margin-top:13px}.polaroid{width:123px}.polaroid img{height:120px}.dossier{top:66px;height:125px}.dossier strong{font-size:38px}.intro-start{margin-top:9px}.start-note{margin-top:12px}.quiz{padding-top:12px}.steps{margin:8px 0 21px}.question-heading{padding-top:18px;padding-bottom:18px;margin-bottom:18px}.question-heading h1{margin-top:13px;font-size:20px}.option{padding-top:12px;padding-bottom:12px;min-height:58px}.quiz-controls{padding-top:14px;padding-bottom:15px}}
.dossier .mono{font-size:6px;letter-spacing:.5px;white-space:nowrap}.dossier small{font-size:7px;letter-spacing:.65px;white-space:nowrap}.dossier strong{margin-top:5px}.image-unavailable:after{content:'公式写真';display:block;min-height:100px;text-align:center;padding-top:40px;font-size:12px}.result-type>.result-symbol{position:absolute;right:-5px;top:20px;font:120px Georgia,serif;color:#d5d5bf;transform:rotate(10deg);z-index:0}
.share-invite{margin:25px 0 0;padding:16px 0;border-bottom:1px solid #454c38;display:flex;justify-content:space-between;align-items:center;gap:10px}.share-invite>span{font-size:10px;color:#9ba98b}.share-invite button{background:transparent;color:#ed7961;font-size:11px;padding:10px 0;display:flex;gap:10px;align-items:center}.shared-invite{position:relative;margin:-5px 0 26px;padding:17px;background:#e9e6d7;color:#262b20;border-top:3px solid var(--red)}.shared-invite .mono{font-size:7px;color:#9a4a36;display:block;margin-bottom:6px}.shared-invite strong{font-size:13px}.shared-invite button{width:100%;margin-top:13px;min-height:44px;background:var(--red);color:#fff0df;padding:10px 13px;display:flex;justify-content:space-between;align-items:center;font-size:12px}@media(max-width:360px){.share-invite>span{font-size:9px}.share-invite button{font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-delay:0ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* Questions are the primary heading, without a decorative substitute. */
.question-heading h1{font-size:clamp(20px,5.7vw,25px);line-height:1.65;letter-spacing:-.025em;margin:18px 0 0}.question-meta{font-size:8px}.result-description>.mono{display:block;color:#bd684c;margin-bottom:12px}

[hidden]{display:none!important}
/* Keep the next action anchored to the viewport on every question. */
body[data-screen="quiz"] .quiz{padding-bottom:116px}body[data-screen="quiz"] .quiz-controls{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,480px);padding:14px 24px max(18px,env(safe-area-inset-bottom));margin:0;border-top:1px solid #383b32;z-index:15;box-shadow:0 -10px 22px #11131060}@media(max-width:360px){body[data-screen="quiz"] .quiz-controls{padding-left:19px;padding-right:19px}}

/* Fixed image proportions reserve space before lazy loading. */
.result-image{margin:28px 0 0;padding:5px;border:1px solid #eeeadd70;background:var(--paper);color:var(--ink)}
.result-image img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;animation:none;transition:none}
.result-image figcaption{padding:9px 7px 5px;font-size:8px;line-height:1.5;letter-spacing:1.4px;color:#646756}
.result-image[hidden]{display:none}

/* Dialog motion shared by the exit dialog and share sheet. */
@media(prefers-reduced-motion:no-preference){
#exit-dialog[open]{animation:exit-in .55s cubic-bezier(.16,1,.3,1) both}
#exit-dialog[open]::backdrop{animation:backdrop-in .35s ease both}
#exit-dialog.closing{animation:exit-out .24s cubic-bezier(.55,0,.75,.2) both}
#exit-dialog.closing::backdrop{animation:backdrop-out .24s ease both}
#exit-dialog[open]>*{animation:rise .5s cubic-bezier(.16,1,.3,1) both}
#exit-dialog[open]>:nth-child(2){animation-delay:.07s}
#exit-dialog[open]>:nth-child(3){animation-delay:.13s}
#exit-dialog[open]>:nth-child(4){animation-delay:.19s}
#exit-dialog[open]>:nth-child(5){animation-delay:.24s}
}
@keyframes exit-in{0%{opacity:0;transform:translateY(24px) rotate(-2.5deg) scale(.94);box-shadow:0 0 0 #e32d25}60%{opacity:1;box-shadow:6px 6px 0 #e32d25}100%{transform:none;box-shadow:6px 6px 0 #e32d25}}
@keyframes exit-out{to{opacity:0;transform:translateY(14px) rotate(1.5deg) scale(.96)}}
@keyframes backdrop-in{from{opacity:0}to{opacity:1}}
@keyframes backdrop-out{to{opacity:0}}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* Intro: a faint photo behind the right side of the headline. */
.intro-backdrop{position:absolute;top:0;right:-24px;width:74%;height:430px;z-index:-1;pointer-events:none;-webkit-mask-image:linear-gradient(90deg,#0000 0%,#000 58%),linear-gradient(180deg,#000 45%,#0000 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,#0000 0%,#000 58%),linear-gradient(180deg,#000 45%,#0000 100%);mask-composite:intersect}
.intro-backdrop img{display:block;width:100%;height:100%;object-fit:cover;object-position:60% 30%;filter:grayscale(1) contrast(1.15) brightness(.75);opacity:.34}
.intro-backdrop:after{content:'';position:absolute;inset:0;background:radial-gradient(70% 55% at 85% 20%,#e32d2524,#0000 70%)}
@media(min-width:700px){.intro-backdrop{height:460px}}
@media(prefers-reduced-motion:no-preference){
.intro-backdrop img{animation:backdrop-reveal 1.6s .15s ease-out both,backdrop-drift 24s 1.75s ease-in-out infinite alternate}
}
@keyframes backdrop-reveal{from{opacity:0;transform:scale(1.08)}to{opacity:.34;transform:none}}
@keyframes backdrop-drift{from{transform:none}to{transform:scale(1.06) translateX(-2%)}}

/* Collage captions stay readable next to the centered dossier card. */
.polaroid figcaption{flex-wrap:nowrap;min-width:0}
.polaroid b{flex:none;white-space:nowrap}
.polaroid small{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.polaroid.right figcaption{flex-direction:row-reverse}
.intro-meta{flex-wrap:wrap;row-gap:6px}
.intro-meta>b,.intro-meta>span{white-space:nowrap}
@media(max-width:360px){.polaroid small,.collage-coord{display:none}.intro-meta b{font-size:11px}.intro-meta>span{font-size:9px}}
.dossier:before{top:-6px}