@import url("../would-you-rather/styles.css");:root{--purple:#fd2d68;--yellow:#ffd51f;--pink:#7834da}body{background:radial-gradient(circle at 8% 10%,rgba(31,136,255,.3),transparent 24rem),radial-gradient(circle at 94% 20%,rgba(253,45,104,.28),transparent 27rem),#f4f7ff}.game-title h1 span{color:#fd2d68}.game-card{background:linear-gradient(145deg,#fff 68%,#e9e2ff)}.detective-icons{display:flex;align-items:center;justify-content:center;gap:8px}.detective-icons span,.detective-icons b{display:grid;place-items:center;width:62px;height:62px;border:2px solid var(--ink);border-radius:18px;background:#42d7d1;box-shadow:4px 4px 0 var(--ink);font-size:31px}.detective-icons b{width:88px;height:80px;background:#ffd51f;font-size:37px;transform:rotate(-2deg)}.start-actions{display:flex;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap}.primary-button{background:#fd2d68;color:#fff}.facebook-game-button{min-height:48px;padding:0 18px;border:2px solid var(--ink);border-radius:13px;background:#1877f2;color:#fff;font:inherit;font-size:14px;font-weight:900;box-shadow:4px 4px 0 var(--ink);cursor:pointer}.choice-card{min-height:134px}.choice-a{background:linear-gradient(145deg,#9edbff,#2589ef)}.choice-b{background:linear-gradient(145deg,#ddaaff,#9a43e2)}.tag-prompt{margin:5px 0 10px!important;padding:8px 12px;border-radius:11px;background:#ffe55f;color:var(--ink)!important;font-size:14px!important;font-weight:900}.comparison-note{font-size:11px!important;line-height:1.45!important}.info{width:min(920px,calc(100% - 30px));display:grid;grid-template-columns:minmax(250px,.85fr) 1.15fr;gap:28px;align-items:center}.info img{display:block;width:100%;height:auto;border:2px solid var(--ink);border-radius:18px;box-shadow:5px 5px 0 var(--ink)}.info p{font-size:16px;line-height:1.6}.info nav{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.info nav a{color:var(--purple);font-size:14px;font-weight:900;text-decoration:none}@media(max-width:650px){.detective-icons span{width:48px;height:48px;font-size:25px}.detective-icons b{width:68px;height:64px;font-size:30px}.start-actions{flex-direction:column;width:100%}.start-actions button{width:min(300px,100%)}.info{grid-template-columns:1fr}.info img{max-width:420px;margin:auto}}
.question-panel{justify-content:flex-start}.question-panel>h2{max-width:760px;margin:10px auto 18px;font-size:clamp(28px,5vw,44px);line-height:1.08}.choice-grid{width:100%;flex:0 0 clamp(260px,48svh,420px)}.choice-card{min-height:0}.result-panel{justify-content:center;gap:5px}.result-head{margin:0 0 2px;text-align:center}.result-panel h2{font-size:clamp(27px,5vw,40px)}.result-score{width:min(380px,92%);margin:2px auto 4px;display:flex;flex-direction:column;align-items:center;border:2px solid var(--ink);border-radius:18px;background:linear-gradient(145deg,#ff668e,#e82f6c);box-shadow:4px 4px 0 var(--ink)}.result-score span{padding:4px 14px;border-radius:999px;background:var(--ink);color:#fff;font-size:12px;font-weight:950;letter-spacing:.06em}.result-score strong{display:block;color:#fff;font-size:clamp(54px,11vw,82px);line-height:1;text-shadow:3px 4px 0 #b91e54}.result-description{margin:3px auto!important;color:var(--ink);font-size:16px;font-weight:800;line-height:1.3}.trait-list{margin:5px auto}.trait-list span{padding:7px 10px;font-size:11px;text-transform:uppercase}.tag-prompt{margin:3px 0 7px!important;padding:8px 14px;font-weight:950}@media(max-width:650px){.question-panel>h2{margin:9px auto 16px;font-size:clamp(27px,7vw,36px)}.choice-grid{flex-basis:clamp(250px,48svh,390px)}.choice-card{padding:12px 7px}.choice-card strong{font-size:clamp(15px,4vw,19px)}.result-panel{padding:7px 5px 2px}.result-emoji{font-size:40px}.result-head{gap:7px}.result-panel h2{font-size:clamp(25px,6.6vw,34px)}.result-score{width:min(330px,94%)}.result-score strong{font-size:clamp(58px,17vw,78px)}.result-description{font-size:15px}.trait-list span{font-size:10px}.result-actions button{min-height:43px}}@media(max-height:700px){.question-panel>h2{margin:6px auto 10px;font-size:26px}.choice-grid{flex-basis:44svh}.result-score strong{font-size:54px}.result-description{font-size:14px}.tag-prompt{padding:6px 10px}}
body[data-screen="question"] .play-shell{height:auto;max-height:none;grid-template-rows:auto auto}body[data-screen="question"] .game-card{height:auto;min-height:0}body[data-screen="question"] .question-panel{height:auto}body[data-screen="question"] .choice-grid{height:clamp(220px,28svh,290px);flex:0 0 clamp(220px,28svh,290px)}@media(max-width:650px){body[data-screen="question"] .play-shell{padding-bottom:18px}body[data-screen="question"] .question-panel>h2{margin:8px auto 14px;font-size:clamp(29px,7.5vw,38px)}body[data-screen="question"] .choice-grid{height:clamp(215px,28svh,280px);flex-basis:clamp(215px,28svh,280px)}body[data-screen="question"] .choice-card span{width:35px;height:35px}body[data-screen="question"] .or-chip{width:32px;height:32px}}
body[data-screen="question"] .play-shell{height:calc(100svh - 60px);max-height:760px;grid-template-rows:auto minmax(0,1fr)}body[data-screen="question"] .game-card{height:auto;min-height:0}body[data-screen="question"] .question-panel{height:100%;display:grid;grid-template-rows:minmax(0,1fr) clamp(220px,28svh,290px)}body[data-screen="question"] .question-copy{min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:6px 8px 12px;text-align:center}body[data-screen="question"] .question-kicker{font-size:12px;font-weight:950}body[data-screen="question"] .question-copy>h2{max-width:760px;margin:10px auto 0;font-size:clamp(34px,6vw,50px);font-weight:950;line-height:1.04}body[data-screen="question"] .choice-grid{height:auto;min-height:0;flex:none}body[data-screen="question"] .choice-card strong{font-size:clamp(19px,3.5vw,26px);font-weight:950;line-height:1.18}@media(max-width:650px){body[data-screen="question"] .play-shell{height:calc(100svh - 60px);padding-bottom:10px}body[data-screen="question"] .question-panel{grid-template-rows:minmax(0,1fr) clamp(215px,28svh,280px)}body[data-screen="question"] .question-copy>h2{font-size:clamp(34px,9vw,44px);font-weight:950;line-height:1.03}body[data-screen="question"] .choice-card strong{font-size:clamp(18px,4.8vw,22px);font-weight:950}}
