
:root{--bg:#080913;--card:rgba(14,15,29,.88);--line:rgba(190,159,102,.22);--text:#f6f0e4;--muted:#a9a1b4;--gold:#d9b76e;--violet:#9a8bce;--cyan:#8cc5d2}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text)}body{font-family:Inter,system-ui,sans-serif;background:radial-gradient(ellipse at 50% -15%,#252039 0,#080913 54%);overflow-x:hidden}.ambient{position:fixed;inset:0;pointer-events:none;z-index:0;background:radial-gradient(circle at 8% 35%,rgba(121,81,156,.13),transparent 30%),radial-gradient(circle at 92% 68%,rgba(194,145,68,.08),transparent 32%)}.topbar{position:relative;z-index:5;min-height:68px;padding:0 28px;display:flex;align-items:center;gap:20px;border-bottom:1px solid rgba(217,183,110,.12);background:rgba(5,6,14,.72);backdrop-filter:blur(16px)}.logo{font:700 19px Cinzel,serif;color:var(--gold);text-decoration:none;letter-spacing:.12em}.top-links{display:flex;gap:10px;align-items:center;margin-left:auto;color:#938ba4;font-size:9px;letter-spacing:.14em}.top-links i{width:3px;height:3px;border-radius:50%;background:var(--gold)}.sound-toggle{border:1px solid #393044;background:#14121f;color:#d2c2a1;border-radius:999px;padding:8px 12px;font:600 9px Inter;letter-spacing:.12em;cursor:pointer}.screen{display:none;position:relative;z-index:1}.screen.active{display:block}.start-shell{width:min(1180px,100%);min-height:calc(100svh - 68px);margin:auto;display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:54px;padding:30px 38px 44px}.start-art{position:relative;min-height:590px;display:grid;place-items:center;overflow:hidden;border:1px solid rgba(217,183,110,.18);border-radius:230px 230px 28px 28px;background:#0c0c19;box-shadow:0 20px 90px #0008}.start-bg{position:absolute;width:100%;height:100%;inset:0;object-fit:cover;object-position:center;opacity:.82}.art-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,7,16,.08),rgba(7,7,16,.15) 45%,#080913 100%)}.sigil{position:absolute;z-index:1;width:72%;aspect-ratio:1;border:1px solid rgba(217,183,110,.45);border-radius:50%;box-shadow:0 0 60px #8d65b52a,inset 0 0 45px #8d65b522}.sigil:before,.sigil:after{content:"";position:absolute;inset:9%;border:1px solid rgba(217,183,110,.24);border-radius:50%;transform:rotate(45deg)}.sigil:after{transform:rotate(-45deg);border-radius:3px}.rune{position:absolute;z-index:2;color:var(--gold);font-size:38px;text-shadow:0 0 20px #d9b76e66}.rune1{top:16%;left:17%}.rune2{right:15%;top:34%}.floating-card{position:absolute;z-index:3;min-width:145px;padding:12px 14px;border:1px solid #d9b76e38;border-radius:10px;background:#0b0b16d9;backdrop-filter:blur(12px);color:#a79bb3;font-size:8px;letter-spacing:.14em}.floating-card b{display:block;margin-top:5px;color:#e3c98d;font-size:11px}.fc1{top:22%;left:4%}.fc2{bottom:17%;right:4%}.start-copy{padding:18px 0}.eyebrow{margin:0 0 14px;color:var(--gold);font-size:10px;font-weight:700;letter-spacing:.19em;line-height:1.6}.start-copy h1,.result-copy h1{margin:0;font:700 clamp(32px,4vw,54px)/1.13 Cinzel,Georgia,serif;letter-spacing:-.035em}.start-copy h1 em{font-style:normal;color:var(--gold);display:block}.lead{max-width:520px;margin:22px 0;color:#b5aec0;font-size:15px;line-height:1.8}.feature-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;color:#8f879f;font-size:11px;margin:24px 0}.cta{border:1px solid #e4c782;background:linear-gradient(110deg,#b98f4f,#e2c781);color:#1a1420;padding:15px 22px;border-radius:5px;font:800 11px Inter;letter-spacing:.12em;cursor:pointer;box-shadow:0 8px 28px #c29a4b26;transition:transform .18s,filter .18s}.cta:hover{transform:translateY(-2px);filter:brightness(1.07)}.cta span{margin-left:24px;font-size:17px}.note,.quiz-note{font-size:11px;color:#81798f;line-height:1.6}.ad-mount{margin-top:26px;min-height:1px}.quiz-shell{width:min(850px,100%);min-height:calc(100svh - 68px);margin:auto;padding:46px 26px 70px}.quiz-top{display:flex;align-items:center;gap:26px;margin-bottom:34px}.back-btn{border:1px solid #393044;background:#12111d;color:#c9bed1;padding:10px 13px;border-radius:5px;font:600 11px Inter;cursor:pointer}.progress-wrap{flex:1}.progress-meta{display:flex;justify-content:space-between;color:#a99db2;font-size:10px;letter-spacing:.1em;margin-bottom:9px}.progress{height:4px;border-radius:9px;background:#272334;overflow:hidden}.progress div{height:100%;width:0;background:linear-gradient(90deg,#8f73ad,#e1c27a);transition:width .25s}.question-card{border:1px solid var(--line);border-radius:15px;padding:clamp(24px,5vw,46px);background:linear-gradient(140deg,#151321eF,#0e0e19f2);box-shadow:0 25px 80px #0004}.question-kicker{color:var(--gold);font-size:10px;font-weight:700;letter-spacing:.18em}.question-card h2{font:600 clamp(24px,4vw,36px)/1.35 Cinzel,Georgia,serif;margin:17px 0 12px}.question-hint{font-size:12px;color:#938a9f;margin-bottom:28px}.answers{display:grid;gap:11px}.answer{width:100%;display:flex;align-items:center;gap:14px;text-align:left;padding:17px 18px;border:1px solid #343044;background:#11111d;color:#e9e2ed;border-radius:8px;cursor:pointer;font:500 13px/1.55 Inter;transition:border-color .16s,background .16s,transform .16s}.answer:hover,.answer:focus-visible{border-color:#c8a765;background:#211c2b;transform:translateX(3px);outline:none}.answer .letter{display:grid;place-items:center;flex:0 0 28px;width:28px;height:28px;border:1px solid #64516c;border-radius:50%;color:#d9bb7a;font-size:10px}.quiz-note{text-align:center;margin-top:18px}.result-shell{width:min(1080px,100%);margin:auto;padding:42px 28px 60px}.result-topline{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.result-index{color:#90879d;font-size:10px;letter-spacing:.12em}.result-layout{display:grid;grid-template-columns:minmax(280px,.9fr) 1.1fr;gap:45px;align-items:center}.result-visual{position:relative;min-height:490px;display:grid;place-items:center;isolation:isolate}.portrait-glow{position:absolute;inset:15%;border-radius:50%;background:radial-gradient(circle,#b894562b,transparent 68%);filter:blur(8px);z-index:-1}.result-portrait{width:min(82%,360px);height:450px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 15px 35px #0009);z-index:1}.result-frame{position:absolute;width:min(100%,475px);height:auto;max-height:490px;object-fit:contain;inset:50% auto auto 50%;transform:translate(-50%,-50%);z-index:2;pointer-events:none}.result-copy h1{font-size:clamp(34px,4vw,48px)}.pathway{margin:11px 0 17px;color:var(--gold);font:600 16px Cinzel,Georgia,serif;letter-spacing:.04em}.tags{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 20px}.tags span{border:1px solid #c7a75a40;background:#c7a75a0b;color:#d4c3a2;padding:7px 10px;border-radius:3px;font-size:9px;letter-spacing:.06em}.result-description{color:#c0b7c8;font-size:14px;line-height:1.85}.insight{margin:22px 0;padding:17px 18px;border-left:2px solid var(--gold);background:#c5a45a0c}.insight span{font-size:9px;font-weight:700;color:var(--gold);letter-spacing:.16em}.insight p{margin:8px 0 0;color:#b9afc3;font-size:12px;line-height:1.75}.result-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:23px}.result-actions .cta{padding:14px 17px}.secondary-btn{padding:14px 17px;border:1px solid #4a4054;border-radius:5px;background:#11111d;color:#c8bfd0;font:700 10px Inter;letter-spacing:.1em;cursor:pointer}.match-section{margin-top:52px;padding-top:30px;border-top:1px solid #d9b76e26}.section-heading{display:flex;justify-content:space-between;align-items:center}.section-heading h2{font:600 25px Cinzel,Georgia,serif;margin:0}.section-heading>span{font-size:25px;color:var(--gold)}.close-list{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-top:22px}.close-card{display:flex;align-items:center;gap:11px;min-width:0;padding:11px;border:1px solid #3b3042;background:#11111c;border-radius:8px}.close-card img{width:48px;height:58px;object-fit:cover;object-position:top;border-radius:4px;background:#242033}.close-card strong{display:block;font:600 11px Cinzel,Georgia,serif;line-height:1.35}.close-card small{display:block;color:#a99aaf;font-size:9px;margin-top:5px}.close-card .percent{color:var(--gold)}.result-ad{margin:32px 0}.disclaimer{color:#6f687b;font-size:10px;line-height:1.6;text-align:center;margin-top:30px}.toast{position:fixed;z-index:10;left:50%;bottom:25px;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#eee0bd;color:#21182a;padding:12px 18px;border-radius:7px;font-size:12px;transition:.2s;box-shadow:0 10px 35px #0006}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:850px){.start-shell{grid-template-columns:1fr;gap:22px;padding:20px 22px 40px}.start-art{min-height:390px;max-height:440px;border-radius:190px 190px 22px 22px}.start-bg{object-position:center 42%}.start-copy{padding:10px 4px}.start-copy h1{font-size:clamp(32px,7vw,47px)}.lead{margin:15px 0}.feature-row{margin:17px 0}.result-layout{grid-template-columns:1fr;gap:18px}.result-visual{min-height:400px}.result-portrait{height:370px}.result-frame{max-height:420px;width:min(100%,400px)}.result-copy{max-width:680px;margin:auto}.close-list{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.topbar{min-height:58px;padding:0 14px;gap:10px}.logo{font-size:15px}.top-links{font-size:7px;gap:6px}.sound-toggle{font-size:8px;padding:7px 8px}.start-shell{padding:15px 17px 32px}.start-art{min-height:330px}.floating-card{min-width:110px;padding:9px;font-size:7px}.fc1{left:2%}.fc2{right:2%}.start-copy h1{font-size:32px}.lead{font-size:13px}.feature-row{font-size:10px}.cta{padding:14px 15px;font-size:10px}.quiz-shell{padding:28px 15px 50px}.quiz-top{gap:12px;margin-bottom:22px}.back-btn{padding:9px}.question-card{padding:24px 17px}.question-card h2{font-size:25px}.answer{padding:14px 12px;font-size:12px;gap:10px}.result-shell{padding:27px 16px 45px}.result-visual{min-height:340px}.result-portrait{height:320px}.result-frame{width:min(100%,340px);max-height:350px}.result-copy h1{font-size:35px}.result-description{font-size:13px}.result-actions{display:grid}.result-actions button{width:100%}.close-list{gap:8px}.close-card{padding:8px;gap:8px}.close-card img{width:39px;height:48px}.close-card strong{font-size:10px}.close-card small{font-size:8px}.section-heading h2{font-size:21px}}


/* Result reveal refinement: cleaner hierarchy, tighter portrait framing, and true mobile width. */
#result{width:100%;min-width:0}
#result .result-shell{width:min(1080px,100%);max-width:100%;padding-left:clamp(14px,3vw,28px);padding-right:clamp(14px,3vw,28px)}
#result .result-topline{padding:0 2px 14px;border-bottom:1px solid rgba(217,183,110,.16)}
#result .result-layout{gap:clamp(22px,4vw,45px);align-items:start}
#result .result-visual{min-width:0;min-height:480px;margin:0;border:1px solid rgba(217,183,110,.22);border-radius:18px;background:radial-gradient(ellipse at 50% 38%,rgba(111,75,142,.22),transparent 60%),linear-gradient(155deg,#171426,#090a13 78%);overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.32)}
#result .result-visual:after{content:"BEYONDER ARCHIVE  •  CLASSIFIED";position:absolute;z-index:3;bottom:15px;left:12px;right:12px;text-align:center;color:rgba(220,190,125,.72);font-size:8px;letter-spacing:.2em}
#result .result-portrait{height:420px;width:82%;max-width:340px;object-fit:contain;object-position:center center;filter:drop-shadow(0 18px 28px rgba(0,0,0,.55));}
#result .result-frame{width:min(100%,440px);max-height:460px;}
#result .result-copy{min-width:0;padding:14px 0 0}
#result .result-copy>.eyebrow{margin-bottom:9px}
#result .result-copy h1{overflow-wrap:anywhere;letter-spacing:-.025em}
#result .pathway{font-size:clamp(13px,1.5vw,16px);line-height:1.55}
#result .result-description{font-size:14px;line-height:1.8}
#result .insight{border:1px solid rgba(217,183,110,.13);border-left:3px solid var(--gold);border-radius:0 9px 9px 0;background:linear-gradient(110deg,rgba(197,164,90,.09),rgba(18,15,27,.55));padding:18px 17px}
#result .result-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
#result .result-actions button{min-width:0;line-height:1.4}
#result .match-section{margin-top:40px;padding-top:27px}
#result .close-card{background:linear-gradient(135deg,#171522,#0e0e18);border-color:rgba(217,183,110,.18)}
@media(max-width:850px){
 #result .result-layout{grid-template-columns:minmax(0,1fr);gap:22px}
 #result .result-visual{min-height:clamp(300px,76vw,390px);width:100%;max-width:460px;margin:0 auto}
 #result .result-portrait{height:clamp(275px,68vw,350px);width:78%}
 #result .result-frame{width:min(100%,370px);max-height:390px}
 #result .result-copy{width:100%;max-width:none;padding:0 2px}
 #result .result-copy h1{font-size:clamp(34px,8vw,46px)}
}
@media(max-width:520px){
 #result .result-shell{padding:22px 14px 38px}
 #result .result-topline{gap:8px;align-items:flex-start}
 #result .result-topline .eyebrow{font-size:9px}
 #result .result-index{font-size:8px;text-align:right}
 #result .result-layout{gap:20px}
 #result .result-visual{min-height:300px;border-radius:13px}
 #result .result-portrait{height:275px;width:78%}
 #result .result-frame{width:min(100%,320px);max-height:315px}
 #result .result-visual:after{font-size:7px;bottom:10px}
 #result .result-copy h1{font-size:clamp(31px,9vw,39px);line-height:1.12}
 #result .pathway{margin:9px 0 14px;font-size:13px}
 #result .tags{gap:6px;margin-bottom:16px}
 #result .tags span{padding:6px 8px;font-size:8px}
 #result .result-description{font-size:13px;line-height:1.75}
 #result .insight{margin:18px 0;padding:15px 14px}
 #result .result-actions{grid-template-columns:1fr}
 #result .result-actions button{width:100%;min-height:46px}
 #result .match-section{margin-top:32px;padding-top:23px}
 #result .section-heading h2{font-size:20px}
 #result .close-list{grid-template-columns:1fr 1fr;gap:8px}
 #result .close-card{align-items:center;padding:8px;gap:8px}
 #result .close-card img{width:42px;height:52px;flex:0 0 42px}
 #result .close-card strong{font-size:9px}
 #result .close-card small{font-size:8px;line-height:1.35}
}

/* The supplied character portraits already contain the ornate gold frame.
   Do not shrink them inside a second frame or overlay a duplicate frame asset. */
#result .result-visual{width:min(100%,430px);aspect-ratio:1/1;min-height:0;height:auto;margin-inline:auto;position:relative;overflow:visible;border:0;border-radius:0;background:transparent;box-shadow:none;}
#result .result-visual:after{display:none;}
#result .result-portrait{position:relative;display:block;width:100%;height:100%;max-width:none;object-fit:contain;object-position:center;padding:0;margin:0;z-index:1;filter:drop-shadow(0 15px 28px rgba(0,0,0,.4));}
#result .result-frame{display:none;}
#result .portrait-glow{inset:18%;}
@media(max-width:850px){#result .result-visual{width:min(100%,390px);min-height:0;}#result .result-portrait{height:100%;width:100%;padding:0;}}
@media(max-width:520px){#result .result-visual{width:min(100%,340px);min-height:0;}#result .result-portrait{height:100%;width:100%;padding:0;}}

/* Result redesign: a centered, layered profile card inspired by the Tensura reveal. */
body.result-active .topbar{display:none}
#result .result-shell{width:100%;max-width:none;margin:0;padding:18px 16px 58px;}
#result .result-card{position:relative;isolation:isolate;overflow:hidden;width:min(100%,900px);min-height:0;margin:0 auto;padding:22px clamp(16px,4vw,44px) 28px;border:1px solid rgba(217,183,110,.34);border-radius:26px;background:#0b0b17;box-shadow:0 32px 100px rgba(0,0,0,.46);text-align:center;}
#result .result-backdrop{display:block;position:absolute;z-index:0;inset:0;background-image:linear-gradient(180deg,rgba(8,8,18,.18),rgba(7,7,16,.6) 42%,rgba(7,7,15,.92)),url('assets/mystery-background.webp');background-size:cover;background-position:center 24%;filter:blur(2px);transform:scale(1.025);opacity:.58;pointer-events:none;}
#result .result-card-glow{position:absolute;z-index:1;inset:0;background:radial-gradient(circle at 50% 27%,rgba(143,105,194,.2),transparent 31%),linear-gradient(180deg,rgba(18,13,29,.08),rgba(7,7,15,.25));pointer-events:none;}
#result .result-site-header,#result .result-brand,#result .result-kicker,#result .result-portrait-stage,#result .result-label,#result .result-card h1,#result .pathway,#result .tags,#result .result-message,#result .score-block,#result .result-actions,#result .result-credit{position:relative;z-index:2;}
#result .result-site-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 2px 15px;border-bottom:1px solid rgba(217,183,110,.22);margin-bottom:14px;text-align:left;}
#result .result-site-logo{font:700 clamp(15px,2.2vw,22px) Cinzel,Georgia,serif;letter-spacing:.1em;color:#f4e8cc;text-decoration:none;white-space:nowrap;}
#result .result-site-sub{font-size:8px;color:#c4b394;letter-spacing:.16em;text-align:right;}
#result .result-index{color:#d9b76e;font-size:9px;letter-spacing:.12em;white-space:nowrap;}
#result .result-brand{margin-top:4px;color:#e8d8b0;font:600 clamp(18px,2.3vw,25px) Cinzel,Georgia,serif;letter-spacing:.14em;text-shadow:0 0 28px rgba(217,183,110,.16);}
#result .result-kicker{margin-top:5px;color:#ad9fc0;font-size:8px;letter-spacing:.24em;}
#result .result-portrait-stage{position:relative;width:min(100%,430px);aspect-ratio:1/1;margin:8px auto 1px;isolation:isolate;}
#result .result-portrait-glow{position:absolute;inset:18%;z-index:0;border-radius:50%;background:radial-gradient(circle,rgba(172,128,222,.27),rgba(202,157,86,.12) 45%,transparent 73%);filter:blur(15px);}
#result .result-portrait-stage #resultPortrait{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center 44%;padding:0;margin:0;border:0;border-radius:0;clip-path:ellipse(35% 31% at 50% 48%);filter:none;z-index:1;}
#result .result-portrait-stage .result-frame{display:block;position:absolute;inset:0;width:100%;height:100%;max-width:none;max-height:none;object-fit:contain;object-position:center;transform:none;padding:0;margin:0;border:0;border-radius:0;z-index:2;pointer-events:none;}
#result .result-label{margin-top:-2px;color:#d9b76e;font-size:9px;font-weight:800;letter-spacing:.24em;}
#result .result-card h1{margin:9px 0 0;color:#f7f0e4;font:700 clamp(35px,5vw,58px)/1.1 Cinzel,Georgia,serif;letter-spacing:-.025em;text-shadow:0 4px 30px #0008;}
#result .result-card .pathway{margin:8px 0 13px;color:#d9b76e;font:600 clamp(13px,2vw,18px)/1.4 Cinzel,Georgia,serif;letter-spacing:.035em;}
#result .tags.centered{justify-content:center;gap:8px;margin:0 auto 17px;}
#result .tags span{padding:7px 11px;border-color:rgba(217,183,110,.32);background:rgba(14,12,24,.68);color:#e2d0aa;font-size:8px;letter-spacing:.11em;}
#result .result-message{max-width:650px;margin:0 auto;color:#e0d9e6;font-size:13px;line-height:1.8;text-shadow:0 2px 16px rgba(0,0,0,.35);}
#result .score-block{display:flex;flex-direction:column;gap:4px;margin:18px 0 16px;}
#result .score-block strong{color:#f7e6bc;font:700 32px Cinzel,Georgia,serif;text-shadow:0 0 26px rgba(217,183,110,.17);}
#result .score-block span{color:#b7a9c7;font-size:8px;letter-spacing:.22em;}
#result .result-actions.centered-actions{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:15px;}
#result .share-button,#result .profile-button{position:relative;z-index:2;width:min(100%,300px);min-height:46px;margin:0;padding:13px 18px;border:1px solid rgba(241,218,164,.56);border-radius:8px;background:linear-gradient(105deg,#b88e4c,#e3c982);color:#21172a;font:800 10px Inter,sans-serif;letter-spacing:.12em;box-shadow:0 10px 28px rgba(0,0,0,.2);cursor:pointer;}
#result .profile-button{border-color:rgba(217,183,110,.28);background:rgba(13,12,23,.78);color:#d9cbb5;box-shadow:none;}
#result .share-button:hover,#result .profile-button:hover{filter:brightness(1.08);transform:translateY(-1px);}
#result .result-credit{margin-top:17px;color:#8e829e;font-size:7px;letter-spacing:.19em;}
#result .result-extras{display:grid;grid-template-columns:1fr;gap:13px;width:min(100%,900px);margin:14px auto 0;}
#result .quick-panel{position:relative;overflow:hidden;padding:22px 24px;border:1px solid rgba(217,183,110,.22);border-radius:17px;background:linear-gradient(135deg,rgba(20,17,32,.92),rgba(9,10,20,.94));box-shadow:0 18px 55px rgba(0,0,0,.18);}
#result .quick-heading{display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:12px;color:#d9b76e;}
#result .quick-heading span{font-size:13px;opacity:.8;}
#result .quick-title{color:#e5d0a0;font-size:10px;font-weight:800;letter-spacing:.2em;text-align:center;}
#result .insight-panel>p{max-width:760px;margin:0 auto;color:#c7bdcf;font-size:13px;line-height:1.8;text-align:center;}
#result .panel-subtitle{margin:-1px 0 15px;color:#93879e;font-size:11px;text-align:center;}
#result .close-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:0;}
#result .close-card{min-width:0;display:flex;align-items:center;gap:10px;padding:10px;border:1px solid rgba(217,183,110,.16);border-radius:10px;background:rgba(7,8,17,.6);}
#result .close-card img{flex:0 0 48px;width:48px;height:52px;object-fit:cover;object-position:center 36%;border:1px solid rgba(217,183,110,.2);border-radius:6px;background:#171322;}
#result .close-card strong{display:block;color:#eee5d5;font:600 10px/1.35 Cinzel,Georgia,serif;}
#result .close-card small{display:block;color:#ac9eb7;font-size:8px;line-height:1.4;margin-top:4px;}
#result .result-ad{width:min(100%,900px);margin:24px auto 0;}
#result .disclaimer{max-width:760px;margin:24px auto 0;color:#786e85;font-size:9px;line-height:1.7;text-align:center;}
@media(max-width:760px){
 #result .result-shell{padding:10px 10px 40px;}
 #result .result-card{padding:17px 14px 23px;border-radius:21px;}
 #result .result-site-header{gap:8px;padding-bottom:12px;}
 #result .result-site-logo{font-size:14px;letter-spacing:.07em;}
 #result .result-site-sub{display:none;}
 #result .result-index{font-size:8px;}
 #result .result-brand{font-size:18px;letter-spacing:.1em;}
 #result .result-kicker{font-size:7px;}
 #result .result-portrait-stage{width:min(100%,370px);margin-top:6px;}
 #result .result-card h1{font-size:clamp(33px,9vw,46px);}
 #result .result-card .pathway{font-size:12px;}
 #result .result-message{font-size:12px;line-height:1.75;}
 #result .result-actions.centered-actions{display:grid;grid-template-columns:1fr;gap:8px;max-width:360px;margin:16px auto 0;}
 #result .share-button,#result .profile-button{width:100%;min-height:46px;}
 #result .quick-panel{padding:18px 13px;border-radius:15px;}
 #result .close-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
 #result .close-card{padding:8px;gap:7px;}
 #result .close-card img{flex-basis:38px;width:38px;height:44px;}
 #result .close-card strong{font-size:9px;}
 #result .close-card small{font-size:7px;}
}
@media(max-width:360px){#result .result-index{font-size:7px;}#result .result-brand{font-size:16px;}#result .tags span{padding:6px 8px;}#result .close-card{align-items:flex-start;flex-direction:column;}#result .close-card img{width:45px;height:45px;}}

/* Desktop refinement: preserve the mobile layout, but make the reveal more restrained on larger screens. */
@media (min-width: 761px) {
  #result .result-shell { padding: 16px 24px 46px; }
  #result .result-card {
    width: min(100%, 780px);
    padding: 18px clamp(24px, 3vw, 34px) 23px;
    border-radius: 22px;
  }
  #result .result-site-header { padding-bottom: 11px; margin-bottom: 10px; }
  #result .result-site-logo { font-size: clamp(15px, 1.6vw, 19px); }
  #result .result-site-sub { font-size: 7px; }
  #result .result-brand { margin-top: 2px; font-size: clamp(16px, 1.7vw, 21px); }
  #result .result-kicker { margin-top: 3px; font-size: 7px; }
  #result .result-portrait-stage { width: min(100%, 340px); margin: 4px auto 0; }
  #result .result-label { font-size: 8px; }
  #result .result-card h1 { font-size: clamp(32px, 3.2vw, 46px); }
  #result .result-card .pathway { margin: 7px 0 10px; font-size: clamp(12px, 1.35vw, 16px); }
  #result .tags.centered { gap: 7px; margin-bottom: 12px; }
  #result .tags span { padding: 6px 9px; font-size: 7px; }
  #result .result-message { max-width: 570px; font-size: 12px; line-height: 1.7; }
  #result .score-block { gap: 3px; margin: 11px 0 10px; }
  #result .score-block strong { font-size: 27px; }
  #result .result-actions.centered-actions { margin-top: 11px; }
  #result .share-button, #result .profile-button { width: min(100%, 265px); min-height: 42px; padding: 11px 15px; font-size: 9px; }
  #result .result-credit { margin-top: 12px; }
  #result .result-extras { width: min(100%, 780px); grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 12px; margin-top: 12px; }
  #result .quick-panel { padding: 17px 17px; border-radius: 14px; }
  #result .quick-heading { margin-bottom: 9px; gap: 9px; }
  #result .quick-title { font-size: 9px; }
  #result .insight-panel > p { font-size: 11px; line-height: 1.7; }
  #result .panel-subtitle { margin-bottom: 10px; font-size: 10px; }
  #result .close-list { gap: 7px; }
  #result .close-card { gap: 7px; padding: 7px; }
  #result .close-card img { flex-basis: 38px; width: 38px; height: 44px; }
  #result .close-card strong { font-size: 9px; }
  #result .close-card small { font-size: 7px; }
  #result .result-ad { width: min(100%, 780px); margin-top: 18px; }
  #result .disclaimer { margin-top: 18px; }
}


/* Final responsive correction: desktop reveal scale and character-specific crop support. */
#result .result-portrait-stage #resultPortrait { object-position: center 10%; }
@media (min-width: 761px) {
  #result .result-shell { padding: 8px 20px 32px; }
  #result .result-card { width: min(100%, 700px); padding: 12px 26px 18px; border-radius: 20px; }
  #result .result-site-header { padding-bottom: 8px; margin-bottom: 7px; }
  #result .result-brand { margin-top: 0; font-size: clamp(15px, 1.55vw, 19px); }
  #result .result-kicker { margin-top: 2px; }
  #result .result-portrait-stage { width: min(100%, 275px); margin: 2px auto 0; }
  #result .result-label { font-size: 7px; }
  #result .result-card h1 { margin-top: 5px; font-size: clamp(30px, 3vw, 42px); }
  #result .result-card .pathway { margin: 5px 0 8px; font-size: clamp(11px, 1.2vw, 14px); }
  #result .tags.centered { margin-bottom: 9px; }
  #result .tags span { padding: 5px 8px; font-size: 7px; }
  #result .result-message { max-width: 520px; font-size: 11px; line-height: 1.6; }
  #result .score-block { margin: 9px 0 8px; }
  #result .score-block strong { font-size: 24px; }
  #result .result-actions.centered-actions { margin-top: 8px; gap: 8px; }
  #result .share-button, #result .profile-button { width: min(100%, 230px); min-height: 38px; padding: 9px 12px; font-size: 8px; }
  #result .result-credit { margin-top: 9px; }
  #result .result-extras { width: min(100%, 700px); margin-top: 10px; gap: 10px; }
  #result .quick-panel { padding: 13px 14px; }
  #result .quick-heading { margin-bottom: 7px; }
  #result .insight-panel > p { font-size: 10px; line-height: 1.55; }
  #result .panel-subtitle { margin-bottom: 8px; font-size: 9px; }
  #result .close-list { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 6px; }
  #result .close-card { gap: 6px; padding: 6px; }
  #result .close-card img { flex-basis: 32px; width: 32px; height: 38px; }
  #result .close-card strong { font-size: 8px; }
  #result .close-card small { font-size: 7px; }
  #result .result-ad { width: min(100%, 700px); margin-top: 12px; }
  #result .disclaimer { margin-top: 12px; }
}

/* Cache-proof desktop compact mode: override earlier desktop sizing rules intentionally.
   Keep the mobile composition unchanged. Portrait size scales with viewport height so
   the primary reveal card fits comfortably on common laptop screens. */
@media screen and (min-width: 761px) {
  #result .result-shell {
    width: 100% !important;
    padding: 8px 12px 22px !important;
  }
  #result .result-card {
    width: min(100%, 640px) !important;
    max-width: 640px !important;
    padding: 8px 22px 12px !important;
    border-radius: 18px !important;
  }
  #result .result-site-header {
    padding: 0 1px 7px !important;
    margin-bottom: 6px !important;
    gap: 10px !important;
  }
  #result .result-site-logo { font-size: 15px !important; }
  #result .result-site-sub { font-size: 6px !important; }
  #result .result-index { font-size: 7px !important; }
  #result .result-brand {
    margin-top: 0 !important;
    font-size: clamp(14px, 1.5vw, 18px) !important;
    line-height: 1.2 !important;
  }
  #result .result-kicker { margin-top: 1px !important; font-size: 6px !important; }
  #result .result-portrait-stage {
    width: min(100%, clamp(165px, 25svh, 225px)) !important;
    margin: 0 auto !important;
  }
  #result .result-label { margin-top: -1px !important; font-size: 7px !important; }
  #result .result-card h1 {
    margin: 3px 0 0 !important;
    font-size: clamp(28px, 3vw, 38px) !important;
    line-height: 1.08 !important;
  }
  #result .result-card .pathway {
    margin: 4px 0 6px !important;
    font-size: clamp(10px, 1.1vw, 13px) !important;
    line-height: 1.3 !important;
  }
  #result .tags.centered { gap: 5px !important; margin-bottom: 6px !important; }
  #result .tags span { padding: 4px 7px !important; font-size: 6px !important; }
  #result .result-message {
    max-width: 500px !important;
    font-size: 10px !important;
    line-height: 1.48 !important;
  }
  #result .score-block { gap: 2px !important; margin: 5px 0 5px !important; }
  #result .score-block strong { font-size: 21px !important; }
  #result .score-block span { font-size: 6px !important; }
  #result .result-actions.centered-actions { gap: 7px !important; margin-top: 5px !important; }
  #result .share-button,
  #result .profile-button {
    width: min(100%, 205px) !important;
    min-height: 32px !important;
    padding: 7px 10px !important;
    font-size: 7px !important;
  }
  #result .result-credit { margin-top: 6px !important; font-size: 6px !important; }
  #result .result-extras { width: min(100%, 640px) !important; margin-top: 8px !important; gap: 8px !important; }
  #result .quick-panel { padding: 10px 11px !important; border-radius: 11px !important; }
  #result .quick-heading { margin-bottom: 5px !important; gap: 6px !important; }
  #result .quick-heading span { font-size: 10px !important; }
  #result .quick-title { font-size: 7px !important; }
  #result .insight-panel > p { font-size: 9px !important; line-height: 1.45 !important; }
  #result .panel-subtitle { margin-bottom: 6px !important; font-size: 8px !important; }
  #result .close-list { gap: 5px !important; }
  #result .close-card { gap: 5px !important; padding: 5px !important; }
  #result .close-card img { flex-basis: 28px !important; width: 28px !important; height: 32px !important; }
  #result .close-card strong { font-size: 7px !important; }
  #result .close-card small { font-size: 6px !important; }
  #result .result-ad { width: min(100%, 640px) !important; margin-top: 8px !important; }
  #result .disclaimer { margin-top: 8px !important; font-size: 8px !important; }
}


/* Character match percentages in the closest-match list. */
#result .close-info{flex:1;min-width:0;}
#result .close-percent{display:flex;flex:0 0 auto;flex-direction:column;align-items:flex-end;justify-content:center;gap:1px;margin-left:auto;color:#d9b76e;white-space:nowrap;}
#result .close-percent b{font:700 13px/1 Inter,sans-serif;letter-spacing:-.02em;}
#result .close-percent small{font:700 6px/1.1 Inter,sans-serif;color:#9788a5;letter-spacing:.08em;margin:2px 0 0;}
@media(max-width:760px){#result .close-percent b{font-size:11px;}#result .close-percent small{font-size:5px;}}
