
:root{--bg:#070812;--card:#0e1120;--line:#242947;--text:#f6f7ff;--muted:#8e94ad;--purple:#8e7bff;--blue:#5c96ff;--cyan:#73d5ff;--glow:rgba(112,142,255,.28)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;min-height:100%;background:#070812;color:var(--text)}body{font-family:Inter,system-ui,sans-serif;background:radial-gradient(circle at 50% -10%,#191744 0,#070812 48%);overflow-x:hidden}.ambient{position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 15% 25%,rgba(81,112,255,.12),transparent 30%),radial-gradient(circle at 85% 65%,rgba(157,81,255,.1),transparent 30%);z-index:0}.topbar{position:relative;z-index:5;height:68px;padding:0 28px;display:flex;align-items:center;gap:20px;border-bottom:1px solid rgba(159,168,255,.08);background:rgba(5,7,17,.5);backdrop-filter:blur(16px)}.logo{font:700 24px Cinzel,serif;color:#fff;text-decoration:none;letter-spacing:.12em}.sound-toggle{margin-left:auto;border:1px solid #2b3152;background:#11152a;color:#b9c4ff;border-radius:999px;padding:8px 13px;font:600 9px Inter;letter-spacing:.12em;cursor:pointer}.top-links{display:flex;gap:10px;align-items:center;color:#737b96;font-size:9px;letter-spacing:.14em}.dot{width:3px;height:3px;border-radius:50%;background:#6774a9}.screen{display:none;position:relative;z-index:1}.screen.active{display:block}
.start-shell{width:min(1180px,100%);min-height:calc(100svh - 68px);margin:0 auto;display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:55px;padding:28px 40px 50px}.start-art{position:relative;min-height:570px;display:grid;place-items:center}.orb{position:absolute;width:430px;height:430px;border-radius:50%;background:radial-gradient(circle at 35% 28%,rgba(115,213,255,.65),rgba(86,92,255,.22) 42%,transparent 70%);filter:blur(1px);box-shadow:0 0 100px rgba(91,123,255,.25)}.tensura-mascot{position:relative;width:320px;height:540px;object-fit:contain;object-position:center;filter:drop-shadow(0 22px 38px rgba(50,73,255,.28));z-index:1}.slime-mascot{position:relative;width:265px;height:220px;border-radius:50% 50% 47% 47%/58% 58% 42% 42%;background:radial-gradient(circle at 36% 27%,#c8fbff 0,#70dcff 15%,#598bff 52%,#6548dc 100%);box-shadow:inset -22px -28px 40px rgba(34,34,122,.32),0 28px 55px rgba(50,73,255,.35);display:grid;place-items:center;transform:translateY(8px);border:1px solid rgba(215,241,255,.5)}.slime-mascot:after{content:"";position:absolute;inset:8px;border-radius:inherit;border:1px solid rgba(255,255,255,.2)}.slime-mascot span{font:700 84px Cinzel;color:#fff;text-shadow:0 4px 24px rgba(24,49,160,.65)}.magic-rune{position:absolute;color:#9ec6ff;font-size:38px;text-shadow:0 0 22px rgba(111,166,255,.7)}.r1{top:12%;left:13%}.r2{top:25%;right:9%}.r3{bottom:14%;right:17%}.floating-card{position:absolute;min-width:120px;padding:10px 12px;border-radius:11px;border:1px solid rgba(152,171,255,.2);background:rgba(11,14,29,.72);backdrop-filter:blur(14px);color:#858eae;font-size:8px;letter-spacing:.14em}.floating-card b{display:block;margin-top:4px;font:600 18px Cinzel;color:#c8d5ff}.fc1{top:18%;left:3%}.fc2{top:34%;right:0}.fc3{bottom:18%;left:10%}.start-copy{padding:0 10px}.eyebrow{font-size:10px;color:#8392cf;letter-spacing:.18em;margin:0 0 15px}.start-copy h1{font:600 clamp(42px,5vw,70px)/.98 Cinzel,serif;margin:0 0 18px;letter-spacing:-.03em}.start-copy h1 span{color:#e8ebff}.start-copy h1 em{font-style:normal;color:#91b4ff}.lead{max-width:520px;color:#a7aec4;font:400 15px/1.7 Georgia,serif;margin:0 0 22px}.feature-row{display:flex;gap:10px;align-items:center;color:#737c98;font-size:9px;letter-spacing:.1em;margin-bottom:24px}.cta{border:1px solid rgba(144,184,255,.45);background:linear-gradient(135deg,#7257df,#447fe8);color:#fff;border-radius:12px;padding:15px 19px;font:700 11px Inter;letter-spacing:.1em;box-shadow:0 12px 38px rgba(79,93,218,.28);cursor:pointer;min-width:240px;text-align:left}.cta span{float:right;font-size:16px;line-height:10px}.note{color:#616a84;font-size:9px;margin:11px 0 0}.quiz-shell{width:min(760px,100%);min-height:calc(100svh - 68px);margin:0 auto;padding:32px 22px 50px}.quiz-top{display:flex;align-items:center;gap:18px}.back-btn{border:none;background:none;color:#8b93ad;font-size:10px;cursor:pointer}.progress-wrap{flex:1}.progress-meta{display:flex;justify-content:space-between;color:#7a83a2;font-size:9px;letter-spacing:.08em;margin-bottom:8px}.progress{height:6px;border-radius:999px;background:#171a2a;overflow:hidden}.progress div{height:100%;width:0;background:linear-gradient(90deg,#6d54dc,#5fb8ff);transition:width .25s}.question-card{margin-top:40px;padding:34px 30px 32px;border:1px solid rgba(141,161,255,.14);border-radius:24px;background:rgba(10,13,27,.7);box-shadow:0 30px 90px rgba(0,0,0,.25);backdrop-filter:blur(14px)}.question-kicker{color:#8d9cff;font:600 9px Inter;letter-spacing:.18em}.question-card h2{font:600 clamp(30px,4.2vw,48px)/1.12 Cinzel,serif;margin:16px 0 10px}.question-hint{color:#6f7690;font-size:11px;margin-bottom:24px}.answers{display:grid;gap:10px}.answer{width:100%;border:1px solid rgba(133,149,223,.12);background:#0b0e1c;color:#e9edff;border-radius:13px;padding:16px 18px;text-align:left;font:500 13px/1.45 Inter;cursor:pointer;transition:.18s}.answer:hover{transform:translateY(-1px);border-color:rgba(127,163,255,.48);background:#10162b}.answer:disabled{opacity:.6;cursor:wait}.result-page{padding:28px 16px 60px;display:flex;flex-direction:column;align-items:center}.result-card{position:relative;overflow:hidden;width:min(100%,520px);min-height:720px;padding:18px 30px 14px;border-radius:28px;border:1px solid rgba(182,196,255,.34);background:linear-gradient(160deg,#151836 0,#0b0e1e 100%);box-shadow:0 35px 110px rgba(0,0,0,.45)}.result-card-glow{position:absolute;inset:-30%;background:radial-gradient(circle at 50% 18%,rgba(106,145,255,.2),transparent 28%),radial-gradient(circle at 50% 80%,rgba(126,71,255,.12),transparent 36%);pointer-events:none}.result-backdrop{position:absolute;inset:0;background:radial-gradient(circle at 50% 26%,rgba(89,164,255,.14),transparent 30%),linear-gradient(180deg,rgba(8,10,24,.05),rgba(8,10,24,.45));pointer-events:none}.result-brand,.result-kicker,.character-orb,.result-label,.result-card h1,.result-card h2,.result-message,.chips,.score-block,.share-button,.profile-button,.result-credit{position:relative;z-index:2}.result-brand{text-align:center;font:600 24px Cinzel;color:#bcd2ff}.result-kicker{text-align:center;color:#8f9cc4;font-size:8px;letter-spacing:.18em;margin-top:3px}.character-orb{width:188px;height:188px;margin:18px auto 9px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,rgba(106,143,255,.17),transparent 70%)}.character-orb:before{content:"";position:absolute;width:174px;height:174px;border-radius:50%;border:1px solid rgba(178,196,255,.6);background:linear-gradient(145deg,#1b2147,#090c18);box-shadow:0 0 45px rgba(85,118,255,.22),inset 0 0 30px rgba(255,255,255,.03)}.result-avatar{position:relative;width:154px;height:154px;border-radius:50%;display:grid;place-items:center;background:transparent;font:700 50px Cinzel;color:#fff;box-shadow:0 10px 22px rgba(0,0,0,.35);border:3px solid rgba(235,243,255,.9);z-index:1}.orb-ring{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(134,160,255,.3);z-index:0}.orb-tick{position:absolute;width:8px;height:8px;border-radius:50%;background:#9cc8ff;box-shadow:0 0 14px #86afff}.t1{top:8%;left:50%;transform:translateX(-50%)}.t2{right:5%;top:48%}.t3{left:8%;bottom:18%}.result-label{text-align:center;color:#8892bd;font-size:8px;letter-spacing:.18em}.result-card h1{text-align:center;font:600 44px/1 Cinzel;margin:7px 0 2px;color:#f7f8ff}.result-card h2{text-align:center;font:italic 17px Georgia;color:#9db8ff;margin:0}.result-message{max-width:410px;margin:11px auto 7px;text-align:center;color:#b4bbcf;font:400 12px/1.5 Georgia}.chips{display:flex;justify-content:center;gap:7px;flex-wrap:wrap}.chips span{font-size:8px;padding:5px 10px;border-radius:999px;border:1px solid rgba(133,156,255,.26);background:rgba(101,115,220,.12);color:#c9d7ff}.score-block{text-align:center;margin:13px 0 12px}.score-block strong{display:block;font:600 29px Cinzel;color:#fff}.score-block span{font-size:8px;letter-spacing:.18em;color:#707b9b}.share-button,.profile-button{display:block;width:min(100%,360px);margin:0 auto;border-radius:11px;cursor:pointer;font:700 10px Inter;letter-spacing:.11em}.share-button{border:1px solid rgba(143,181,255,.5);background:linear-gradient(135deg,#7159df,#4d88e9);color:#fff;padding:12px 18px;box-shadow:0 14px 35px rgba(73,87,211,.22)}.profile-button{margin-top:7px;background:none;border:0;color:#7d87a8;padding:8px}.result-credit{text-align:center;color:#515a76;font-size:7px;letter-spacing:.1em;margin-top:8px}.quick-result{width:min(100%,760px);display:grid;grid-template-columns:1.1fr .9fr;gap:14px;margin-top:16px}.quick-panel,.panel{border:1px solid rgba(130,144,210,.12);border-radius:18px;background:rgba(10,13,25,.8);backdrop-filter:blur(12px);box-shadow:0 15px 50px rgba(0,0,0,.16)}.quick-panel{padding:20px}.quick-heading{display:flex;justify-content:center;gap:10px;align-items:center}.quick-heading>span{color:#87b7ff;font-size:12px}.quick-title{font:600 11px Cinzel;letter-spacing:.18em;color:#c4ccf0}.trait-axis{display:grid;grid-template-columns:86px 1fr 86px;gap:9px;align-items:center;margin:13px 0}.axis-label{font-size:8px;color:#6f7795;text-align:right}.axis-label.right{text-align:left}.axis-track{height:7px;border-radius:99px;background:#1a1e33;position:relative}.axis-track:before{content:"";position:absolute;left:50%;top:-4px;width:1px;height:15px;background:#4d5676}.axis-track i{position:absolute;top:-2px;width:11px;height:11px;transform:translateX(-50%);border-radius:50%;background:#9ec5ff;box-shadow:0 0 13px rgba(113,170,255,.7)}.close-characters p{font-size:10px;color:#727b96;margin:6px 0 14px}.close-list{display:grid;gap:8px}.close-character-card{display:grid;grid-template-columns:20px 42px 1fr auto;gap:9px;align-items:center;background:#0c101e;border:1px solid rgba(123,147,227,.1);padding:9px;border-radius:11px}.close-rank{font:600 10px Cinzel;color:#5e6783;text-align:center}.close-avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:transparent;font:700 16px Cinzel;color:#fff}.close-info strong{display:block;font:600 12px Cinzel}.close-info em{display:block;font:italic 9px Georgia;color:#858da6;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.close-score{text-align:right}.close-score b{display:block;color:#a8c4ff;font:600 13px Cinzel}.close-score span{font-size:7px;color:#5d6680;letter-spacing:.1em}.full-profile{width:min(100%,760px);margin-top:16px;display:none}.full-profile.open{display:block}.profile-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.profile-heading h2{font:600 30px Cinzel;margin:0}.close-profile{border:1px solid var(--line);background:#0e1120;color:#d6ddf3;border-radius:50%;width:34px;height:34px;font-size:22px;cursor:pointer}.result-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:14px;margin-bottom:14px}.result-grid.three{grid-template-columns:repeat(3,1fr)}.panel{padding:20px}.panel-title{font:600 9px Inter;letter-spacing:.16em;color:#7e89aa}.archetype-symbol{color:#96c8ff;font-size:28px;margin:6px 0}.panel h3{font:600 18px Cinzel;margin:6px 0}.panel p{color:#8a93ac;font-size:11px;line-height:1.55}.quote-box{margin-top:14px;border-left:2px solid #788dff;padding:8px 11px;color:#c5ceef;font:italic 11px Georgia;line-height:1.55}.connections-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}.muted{margin:4px 0 0;color:#69738c!important}.opposite{text-align:right}.opposite small{display:block;font-size:7px;letter-spacing:.14em;color:#626b85}.opposite strong{display:block;font:600 13px Cinzel}.opposite b{color:#8cbaff;font:600 16px Cinzel}.connection-row{display:grid;grid-template-columns:44px 1fr auto;gap:11px;align-items:center;padding:10px 0;border-bottom:1px solid rgba(132,145,198,.1)}.connection-avatar{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:transparent;font:700 14px Cinzel}.connection-row strong{font:600 12px Cinzel}.connection-row span{display:block;font-size:9px;color:#74809c;margin-top:2px}.connection-score{font:600 15px Cinzel;color:#abc7ff}.trait-bar-row{margin:10px 0}.trait-bar-meta{display:flex;justify-content:space-between;font-size:8px;color:#7c86a3;margin-bottom:4px}.trait-bar{height:7px;background:#1b2034;border-radius:999px;overflow:hidden}.trait-bar i{display:block;height:100%;background:linear-gradient(90deg,#7653e0,#61bfff);border-radius:inherit}.action-bar{display:flex;gap:10px;margin-top:14px}.again-button{flex:1;border:1px solid #242947;background:#0b0e1a;color:#8e97b2;border-radius:11px;padding:12px;font:700 9px Inter;letter-spacing:.08em;cursor:pointer}.action-bar .share-button{margin:0;flex:1}.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(15px);opacity:0;background:#151b31;color:#dce8ff;border:1px solid #36416e;border-radius:999px;padding:9px 14px;font-size:9px;z-index:20;transition:.25s}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media(max-width:800px){
.topbar{padding:0 14px;height:60px}.top-links{display:none}.start-shell{grid-template-columns:1fr;gap:12px;padding:10px 18px 40px;min-height:calc(100svh - 60px)}.start-art{min-height:300px}.orb{width:285px;height:285px}.tensura-mascot{position:relative;width:320px;height:540px;object-fit:contain;object-position:center;filter:drop-shadow(0 22px 38px rgba(50,73,255,.28));z-index:1}.slime-mascot{width:210px;height:175px}.tensura-mascot{width:250px;height:360px}.slime-mascot span{font-size:68px}.floating-card{min-width:100px}.fc1{top:8%;left:0}.fc2{top:22%;right:0}.fc3{bottom:12%;left:9%}.start-copy{padding:5px 2px}.start-copy h1{font-size:42px}.lead{font-size:13px}.question-card{margin-top:25px;padding:26px 18px;border-radius:20px}.question-card h2{font-size:31px}.answer{font-size:12px;padding:14px}.result-card{min-height:0;padding:14px 20px 12px}.character-orb{width:165px;height:165px}.character-orb:before{width:153px;height:153px}.result-avatar{width:136px;height:136px;font-size:43px}.result-card h1{font-size:36px}.quick-result{grid-template-columns:1fr;width:100%;}.result-grid,.result-grid.three{grid-template-columns:1fr}.action-bar{flex-direction:column}.connections-heading{flex-direction:column}.opposite{text-align:left}.result-page{padding:14px 8px 40px}}

.result-avatar-img{width:100%;height:100%;display:block;object-fit:cover;object-position:center;border-radius:50%;background:transparent;}.close-avatar-img{width:100%;height:100%;display:block;object-fit:cover;object-position:center;border-radius:50%;background:transparent;}.connection-avatar-img{width:100%;height:100%;display:block;object-fit:cover;object-position:center;border-radius:50%;background:transparent;}

/* v4 scene-art reveal treatment */
.result-backdrop{background-size:cover;background-position:center;filter:blur(2.5px);transform:scale(1.025);opacity:.58}
.result-avatar-img,.close-avatar-img,.connection-avatar-img{object-fit:cover;object-position:center;width:100%;height:100%;display:block}
.result-avatar{overflow:hidden;background:#11162b}
.close-avatar,.connection-avatar{overflow:hidden;background:#11162b}

/* v5 scene-portrait crop: keeps reveal artwork cinematic and pushes baked subtitles/text outside the circular frame */
.result-avatar-img,.close-avatar-img,.connection-avatar-img{object-fit:cover;transform:scale(1.08);transform-origin:center center;}
.result-avatar-img{object-position:center 38%;}
.close-avatar-img,.connection-avatar-img{object-position:center 42%;}
.result-avatar:has(img[alt="ZEGION"]) img{transform:scale(1.22);object-position:center 38%;}
.close-avatar:has(img[alt="ZEGION"]) img,.connection-avatar:has(img[alt="ZEGION"]) img{transform:scale(1.18);object-position:center 38%;}

/* v6 image corrections: scene-aware crops */
.result-avatar-img,.close-avatar-img,.connection-avatar-img{object-fit:cover;transform-origin:center center;}
.result-avatar-img[data-character="rimuru"]{object-position:center 42%;transform:scale(1.02);}
.close-avatar-img[data-character="rimuru"],.connection-avatar-img[data-character="rimuru"]{object-position:center 42%;transform:scale(1.04);}

.result-avatar-img[data-character="milim"]{object-position:center 45%;transform:scale(1.04);}
.close-avatar-img[data-character="milim"],.connection-avatar-img[data-character="milim"]{object-position:center 44%;transform:scale(1.06);}

.result-avatar-img[data-character="ultima"]{object-position:center 44%;transform:scale(1.03);}
.close-avatar-img[data-character="ultima"],.connection-avatar-img[data-character="ultima"]{object-position:center 44%;transform:scale(1.05);}

.result-avatar-img[data-character="zegion"]{object-position:center 44%;transform:scale(1.0);}
.close-avatar-img[data-character="zegion"],.connection-avatar-img[data-character="zegion"]{object-position:center 44%;transform:scale(1.02);}

/* Explicitly reset the old generic Zegion crop rules. */
.result-avatar:has(img[data-character="zegion"]) img,
.close-avatar:has(img[data-character="zegion"]) img,
.connection-avatar:has(img[data-character="zegion"]) img{transform:scale(1);object-position:center 44%;}


/* v8 image reliability */
.result-avatar-img,.close-avatar-img,.connection-avatar-img{display:block;width:100%;height:100%;object-fit:cover;}

/* v9 final reveal redesign — inspired by the supplied Tensura reference */
.result-page{
  position:relative;
  isolation:isolate;
  width:100%;
  min-height:calc(100svh - 68px);
  padding:24px 18px 70px;
  overflow:hidden;
}
.result-page:before{
  content:"";
  position:fixed;
  inset:-18px;
  z-index:-3;
  background-image:url("backgorund-for-reveal.webp");
  background-size:cover;
  background-position:center top;
  filter:blur(2px) saturate(1.03);
  transform:scale(1.025);
  opacity:.9;
}
.result-page:after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(6,10,27,.10) 0%,rgba(6,10,27,.08) 32%,rgba(6,10,27,.34) 72%,rgba(6,10,27,.62) 100%),
    radial-gradient(circle at 50% 22%,rgba(75,105,255,.12),transparent 36%);
}
.result-card{
  width:min(100%,860px);
  min-height:0;
  padding:28px 34px 18px;
  border-radius:30px 30px 18px 18px;
  border:1px solid rgba(160,191,255,.35);
  background:linear-gradient(180deg,rgba(8,14,35,.20),rgba(8,12,30,.30));
  box-shadow:0 32px 110px rgba(0,0,0,.28), inset 0 0 0 1px rgba(255,255,255,.025);
  backdrop-filter:blur(3px) saturate(1.04);
}
.result-card-glow{inset:-35%;opacity:.65;background:radial-gradient(circle at 50% 17%,rgba(104,164,255,.16),transparent 26%),radial-gradient(circle at 50% 72%,rgba(138,77,255,.14),transparent 38%)}
.result-backdrop{display:none}
.result-brand{font:600 25px Cinzel;letter-spacing:.09em;text-shadow:0 2px 20px rgba(80,155,255,.3)}
.result-kicker{font-size:9px;color:#aab7da;letter-spacing:.22em}
.character-orb{width:202px;height:202px;margin:20px auto 14px}
.character-orb:before{width:188px;height:188px;border:2px solid rgba(194,219,255,.7);background:rgba(7,11,26,.2);box-shadow:0 0 50px rgba(96,144,255,.24),inset 0 0 25px rgba(255,255,255,.06)}
.result-avatar{width:168px;height:168px;border:3px solid rgba(236,245,255,.94);background:rgba(7,11,26,.18);overflow:hidden}
.result-avatar-img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 40%;transform:scale(1.05);}
.result-label{color:#b3bfdc;font-size:9px;letter-spacing:.22em}
.result-card h1{font-size:clamp(44px,6vw,72px);letter-spacing:.01em;text-shadow:0 5px 30px rgba(0,0,0,.32);margin:7px 0 3px}
.result-card h2{font-size:20px;color:#bfd3ff}
.result-message{max-width:650px;margin:15px auto 10px;font-size:13px;line-height:1.65;color:#edf2ff;text-shadow:0 2px 18px rgba(0,0,0,.3)}
.chips{gap:9px;margin:4px 0 3px}
.chips span{font-size:9px;padding:7px 13px;border-color:rgba(157,191,255,.42);background:rgba(44,66,123,.28);color:#e4ebff;backdrop-filter:blur(6px)}
.score-block{margin:17px 0 15px}
.score-block strong{font-size:44px;color:#f1f5ff;text-shadow:0 0 25px rgba(255,255,255,.15)}
.score-block span{font-size:9px;color:#b5c0dc;letter-spacing:.24em}
.share-button{width:min(100%,560px);padding:14px 20px;border-radius:14px;background:linear-gradient(90deg,#ec3ca8,#7750ed,#4b8ff5);border-color:rgba(235,224,255,.38);box-shadow:0 16px 45px rgba(89,85,235,.28);font-size:11px}
.profile-button{width:min(100%,360px);margin-top:10px;color:#d4ddf7;font-size:10px}
.result-credit{font-size:8px;color:#7581a0;margin-top:12px}
.quick-result{width:min(100%,860px);display:block;margin-top:12px}
.quick-panel{padding:23px 24px;border-radius:24px;background:linear-gradient(180deg,rgba(8,13,31,.56),rgba(7,11,27,.68));border-color:rgba(143,177,255,.28);box-shadow:0 18px 60px rgba(0,0,0,.22);backdrop-filter:blur(9px)}
.trait-reading{margin-top:0}
.trait-reading .quick-heading{padding-bottom:2px}
.trait-reading .quick-title{font-size:13px;letter-spacing:.16em;color:#e0e9ff}
.trait-axis{grid-template-columns:130px 1fr 130px;gap:14px;margin:18px 0}
.axis-label{font-size:10px;color:#d9e1f4}
.axis-label.right{text-align:left}
.axis-track{height:9px;background:rgba(25,35,63,.85);box-shadow:inset 0 0 0 1px rgba(149,178,255,.08)}
.axis-track i{top:-2.5px;width:14px;height:14px;background:#eef4ff;box-shadow:0 0 18px rgba(112,168,255,.8)}
.axis-track:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(241,79,178,.98),rgba(145,111,255,.95),rgba(88,163,255,.92));opacity:.95;border-radius:999px;clip-path:inset(0 calc(100% - var(--fill,50%)) 0 0)}
.axis-track i{z-index:2}
.close-characters{margin-top:14px}
.close-list{gap:10px}
.close-character-card{grid-template-columns:24px 48px 1fr auto;padding:11px 12px;background:rgba(7,12,26,.66);border-color:rgba(122,159,232,.14)}
.close-avatar{width:48px;height:48px;border:1px solid rgba(167,196,255,.2);overflow:hidden}
.close-avatar-img{width:100%;height:100%;display:block;object-fit:cover;object-position:center 42%;transform:scale(1.05)}
.close-info strong{font-size:13px}.close-info em{font-size:9px}
.full-profile{width:min(100%,860px)}
@media(max-width:800px){
  .result-page{padding:10px 8px 48px}
  .result-card{width:100%;padding:22px 16px 15px;border-radius:22px}
  .result-brand{font-size:21px}
  .character-orb{width:178px;height:178px}
  .character-orb:before{width:166px;height:166px}
  .result-avatar{width:148px;height:148px}
  .result-card h1{font-size:44px}
  .result-card h2{font-size:18px}
  .result-message{font-size:12px;max-width:92%}
  .quick-result{width:100%}
  .quick-panel{padding:18px 13px;border-radius:20px}
  .trait-axis{grid-template-columns:72px 1fr 72px;gap:8px;margin:14px 0}
  .axis-label{font-size:8px}
}


/* V11 reveal UI: trait bars fixed so the colored fill reaches the actual marker position. */
.topbar{transition:opacity .2s ease}
body.result-active .topbar{display:none}
.result-page{padding:0 16px 70px;align-items:center;background:#070812}
.result-card{width:min(100%,900px);min-height:1020px;padding:22px 34px 28px;border-radius:30px;border:1px solid rgba(145,176,255,.42);background:#0a1020;box-shadow:0 35px 120px rgba(0,0,0,.42);isolation:isolate}
.result-backdrop{display:block;position:absolute;inset:0;z-index:0;background-image:linear-gradient(180deg,rgba(7,12,28,.16),rgba(7,12,28,.38)),url('backgorund-for-reveal.webp');background-size:cover;background-position:center top;filter:blur(2.7px);transform:scale(1.02);opacity:.72;pointer-events:none}
.result-card-glow{z-index:1;inset:0;background:radial-gradient(circle at 50% 15%,rgba(118,187,255,.2),transparent 28%),linear-gradient(180deg,rgba(9,13,29,.02) 0%,rgba(7,10,22,.08) 55%,rgba(7,10,22,.32) 100%);pointer-events:none}
.result-site-header,.result-brand,.result-kicker,.character-orb,.result-label,.result-card h1,.result-card h2,.result-message,.chips,.score-block,.share-button,.profile-button,.result-credit{position:relative;z-index:3}
.result-site-header{display:grid;grid-template-columns:1fr auto auto;align-items:end;gap:26px;padding:2px 4px 20px;border-bottom:1px solid rgba(185,207,255,.16);margin-bottom:12px}
.result-site-logo{color:#eef5ff;text-decoration:none;font:600 29px Cinzel;letter-spacing:.08em;text-shadow:0 0 22px rgba(121,175,255,.25)}
.result-slime-dot{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#c7fbff,#65bfff 55%,#6250dc);color:transparent;vertical-align:2px;box-shadow:0 0 18px rgba(91,170,255,.45);margin-right:7px}
.result-site-sub{color:#a7b6de;font-size:9px;letter-spacing:.2em;align-self:end;margin-bottom:3px;white-space:nowrap}
.result-nav{display:flex;gap:30px;align-items:center;justify-content:flex-end}
.result-nav a{color:#e7edff;text-decoration:none;font:500 12px Georgia;opacity:.94}
.result-nav a:hover{color:#b9d4ff}
.result-brand{font:600 30px Cinzel;letter-spacing:.08em;color:#cfe1ff;text-align:center;margin-top:3px}
.result-kicker{font-size:9px;color:#aab9dc;letter-spacing:.25em;margin-top:4px;text-align:center}
.character-orb{width:238px;height:238px;margin:26px auto 13px}
.character-orb:before{width:220px;height:220px;border:2px solid rgba(220,238,255,.72);background:rgba(7,11,26,.18);box-shadow:0 0 65px rgba(97,154,255,.26),inset 0 0 24px rgba(255,255,255,.06)}
.result-avatar{width:198px;height:198px;border:3px solid rgba(242,249,255,.96);background:rgba(6,10,24,.16)}
.result-avatar-img{object-fit:cover;object-position:center 40%;transform:scale(1.02)}
.result-label{font-size:9px;letter-spacing:.24em;color:#afbfdf}
.result-card h1{font-size:clamp(46px,5.8vw,76px);margin:8px 0 1px;letter-spacing:.01em;text-shadow:0 3px 26px rgba(0,0,0,.35)}
.result-card h2{font-size:21px;color:#c7d9ff}
.result-message{max-width:700px;margin:17px auto 11px;font-size:13px;line-height:1.65;color:#f0f4ff;text-shadow:0 2px 18px rgba(0,0,0,.5)}
.chips{gap:10px}
.chips span{font-size:9px;padding:7px 14px;background:rgba(63,89,170,.22);border-color:rgba(153,187,255,.42);color:#e3edff;box-shadow:0 7px 20px rgba(40,70,145,.12)}
.score-block{margin:20px 0 17px}
.score-block strong{font-size:54px;color:#f5fbff;text-shadow:0 0 26px rgba(169,217,255,.22)}
.score-block span{font-size:9px;letter-spacing:.26em;color:#c0cee9}
.share-button{width:min(100%,620px);padding:15px 22px;border-radius:14px;background:linear-gradient(90deg,#f13aa7,#8258ee,#4b95f6);border-color:rgba(244,237,255,.52);box-shadow:0 18px 50px rgba(86,90,228,.3);font-size:11px}
.profile-button{width:min(100%,380px);margin-top:11px;color:#e0e8ff;font-size:10px;text-transform:uppercase}
.result-credit{font-size:8px;color:#8e9bbb;letter-spacing:.16em;margin-top:10px}
.quick-result{width:min(100%,900px);display:block;margin-top:16px}
.quick-panel{background:rgba(8,12,27,.78);border:1px solid rgba(131,160,235,.28);border-radius:22px;backdrop-filter:blur(12px);box-shadow:0 20px 70px rgba(0,0,0,.22);padding:24px}
.trait-reading .quick-heading{margin-bottom:8px}
.trait-reading .quick-title{font-size:13px;color:#e3ebff}
.trait-axis{grid-template-columns:150px 1fr 150px;gap:16px;margin:16px 0}
.axis-label{font-size:9px;color:#aeb8d0}
.axis-label.right{color:#dce5ff}
.axis-track{height:8px;background:#1b2440}
.axis-track i{width:13px;height:13px;top:-2.5px;background:#f7fbff;box-shadow:0 0 18px rgba(191,222,255,.78)}
.close-characters{margin-top:14px}
.close-characters p{font-size:11px;color:#9da9c5}
.close-character-card{grid-template-columns:26px 56px 1fr auto;padding:11px 13px;border-radius:14px;background:rgba(8,13,28,.72);border-color:rgba(128,157,227,.2)}
.close-avatar{width:56px;height:56px}
.close-info strong{font-size:14px}
.close-info em{font-size:10px}
.close-score b{font-size:15px;color:#bdd5ff}
.full-profile{width:min(100%,900px)}
@media(max-width:800px){
  .result-page{padding:0 7px 48px}
  .result-card{width:100%;min-height:860px;padding:17px 16px 18px;border-radius:23px}
  .result-site-header{grid-template-columns:1fr auto;grid-template-areas:'logo nav' 'sub nav';gap:3px 10px;padding-bottom:14px}
  .result-site-logo{font-size:22px}.result-site-sub{grid-area:sub;font-size:7px}.result-nav{grid-area:nav;gap:16px}.result-nav a{font-size:10px}
  .result-brand{font-size:24px}.result-kicker{font-size:7px}
  .character-orb{width:198px;height:198px;margin-top:19px}.character-orb:before{width:184px;height:184px}.result-avatar{width:164px;height:164px}
  .result-card h1{font-size:48px}.result-card h2{font-size:18px}.result-message{max-width:94%;font-size:11px;line-height:1.55}
  .chips span{font-size:8px;padding:6px 10px}.score-block strong{font-size:46px}.share-button{width:92%}.profile-button{width:84%}
  .quick-result{width:100%}.quick-panel{padding:18px 13px;border-radius:19px}.trait-axis{grid-template-columns:72px 1fr 72px;gap:8px;margin:13px 0}.axis-label{font-size:8px}
}

/* V11 trait-bar layering */
.axis-track{position:relative;overflow:hidden}.axis-track:before{z-index:1}.axis-track:after{z-index:0}.axis-track i{z-index:2}

/* V13 bipolar trait axis: only the side the user actually leans toward is filled. */
.trait-axis .axis-label{font-weight:500;opacity:.58;transition:opacity .2s, color .2s, font-weight .2s;}
.trait-axis.left .left-label,.trait-axis.right .right-label{opacity:1;font-weight:700;color:#eef4ff;}
.trait-axis.center .axis-label{opacity:.82;}
.axis-track{position:relative!important;overflow:hidden!important;}
.axis-track:after{display:none!important;}
.axis-track .axis-fill{position:absolute;top:0;height:100%;display:block;border-radius:999px;background:linear-gradient(90deg,#e74cae,#8e68ff,#61bfff);z-index:1;}
.axis-track i{z-index:3!important;}
@media(max-width:700px){.trait-axis{grid-template-columns:72px 1fr 72px!important;gap:8px!important;}.axis-label{font-size:8px!important;}}

/* V15 character image corrections: evolved Gabiru, scenic Ranga, human-form Veldora, stronger Guy. */
.result-avatar-img[data-character="gabiru"],.close-avatar-img[data-character="gabiru"],.connection-avatar-img[data-character="gabiru"]{object-position:center 52%!important;transform:scale(1.04)!important;}
.result-avatar-img[data-character="ranga"],.close-avatar-img[data-character="ranga"],.connection-avatar-img[data-character="ranga"]{object-position:center 48%!important;transform:scale(1.02)!important;}
.result-avatar-img[data-character="veldora"],.close-avatar-img[data-character="veldora"],.connection-avatar-img[data-character="veldora"]{object-position:center 42%!important;transform:scale(1.0)!important;}
.result-avatar-img[data-character="guy"],.close-avatar-img[data-character="guy"],.connection-avatar-img[data-character="guy"]{object-position:center 48%!important;transform:scale(1.0)!important;}

/* v16 user-provided reveal image framing */
.result-avatar-img[data-character="rimuru"],
.close-avatar-img[data-character="rimuru"],
.connection-avatar-img[data-character="rimuru"]{object-position:center 24%!important;transform:scale(1.0)!important;}
.result-avatar-img[data-character="guy"],
.close-avatar-img[data-character="guy"],
.connection-avatar-img[data-character="guy"]{object-position:center 44%!important;transform:scale(1.0)!important;}
.result-avatar-img[data-character="ultima"],
.close-avatar-img[data-character="ultima"],
.connection-avatar-img[data-character="ultima"]{object-position:center 46%!important;transform:scale(1.0)!important;}
.result-avatar-img[data-character="veldora"],
.close-avatar-img[data-character="veldora"],
.connection-avatar-img[data-character="veldora"]{object-position:center 45%!important;transform:scale(1.0)!important;}

/* Persistent native ad unit: initialized once and moved between visible screens. */
.persistent-ad-unit{display:flex;justify-content:center;align-items:center;overflow:hidden;}
.ad-mount{display:flex;justify-content:center;align-items:center;width:100%;margin:22px auto 0;padding:4px 0;min-height:0;}
.ad-mount .persistent-ad-unit{position:relative;left:auto;top:auto;overflow:hidden;pointer-events:auto;}
.ad-mount .persistent-native-unit{width:min(320px,100%);min-height:250px;text-align:center;}
.ad-mount .persistent-native-unit #container-0090829c2855fb7111c08f64df238236{width:100%;min-height:250px;}
.ad-mount-result{margin-top:30px;padding-top:18px;border-top:1px solid rgba(181,133,255,.12);}
@media(max-width:800px){
 .ad-mount .persistent-native-unit{width:min(320px,calc(100vw - 28px));}
 .ad-mount .persistent-native-unit #container-0090829c2855fb7111c08f64df238236{max-width:100%;overflow:hidden;}
}

/* One Piece homepage artwork */
.one-piece-mascot{position:relative;width:320px;height:540px;object-fit:contain;object-position:center;filter:drop-shadow(0 22px 38px rgba(50,73,255,.28));z-index:1;} .start-art{overflow:visible;} .start-art .orb{opacity:.55;}

@media(max-width:760px){.one-piece-mascot{width:250px;height:360px;}}

/* One Piece start-page polish: keep the transparent mascot airy and align the hero. */
#start .start-shell{align-items:center;padding-top:12px;padding-bottom:24px;min-height:calc(100svh - 68px);}
#start .start-art{min-height:510px;transform:translateY(-16px);}
#start .one-piece-mascot{width:340px;height:500px;object-fit:contain;object-position:center;transform:translateY(-18px);filter:drop-shadow(0 22px 34px rgba(50,73,255,.30));}
#start .start-copy{max-width:570px;padding:0 8px;}
#start .start-copy h1{max-width:650px;}
#start .ad-mount-start{width:min(calc(100% - 40px),760px);min-height:0;margin:0 auto 34px;padding:12px 0 24px;display:flex;justify-content:center;align-items:center;clear:both;}
#start .ad-mount-start .persistent-native-unit{width:100%;max-width:728px;min-height:0;margin:0 auto;padding:10px;overflow:hidden;border:1px solid rgba(132,151,220,.12);border-radius:14px;background:rgba(11,14,29,.62);box-sizing:border-box;}
#start .ad-mount-start #container-0090829c2855fb7111c08f64df238236{max-width:100%;}
@media(max-width:800px){#start .start-shell{min-height:auto;grid-template-columns:1fr;gap:0;padding:22px 22px 18px;}#start .start-art{min-height:350px;transform:none;order:0;}#start .one-piece-mascot{width:240px;height:350px;transform:translateY(-8px);}#start .start-copy{padding:0 2px 18px;}#start .start-copy h1{font-size:clamp(36px,9vw,52px);}#start .ad-mount-start{width:calc(100% - 28px);margin:0 auto 24px;}}

/* One Piece reveal asset correction */
#result .result-page:before{background-image:url("backgorund-for-reveal.webp")!important;background-size:cover;background-position:center top;opacity:.88;}
#result .result-backdrop{display:block!important;background-image:linear-gradient(180deg,rgba(7,12,28,.12),rgba(7,12,28,.48)),url("backgorund-for-reveal.webp")!important;background-size:cover;background-position:center top;opacity:.72;}
#result .result-avatar{overflow:hidden;background:rgba(7,11,26,.18)!important;}
#result .result-avatar-img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 35%;border-radius:50%;transform:none!important;}
#result .close-avatar-img,#result .connection-avatar-img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 35%;border-radius:50%;}
