*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#130d10;color:#f7dbb0;overscroll-behavior:none}html{position:fixed;inset:0}body{position:fixed;inset:0;display:block;font-family:"Noto Serif SC","Songti SC","SimSun",serif;touch-action:manipulation;-webkit-text-size-adjust:100%}button,input{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:5px solid #f5dab0;outline-offset:4px}[hidden]{display:none!important}#stage{position:absolute;width:1080px;height:1920px;overflow:hidden;background:#130d10;transform-origin:top left;flex:none}#scene,#scene video,#result,#resultArt,#choices,#choiceArt,#hotspots,#gate,#loading{position:absolute;inset:0;width:100%;height:100%}#scene video{object-fit:fill;visibility:hidden;background:#130d10;-webkit-transform:translateZ(0);transform:translateZ(0)}#scene video.active{visibility:visible}#scene{background:center/cover url('assets/opening.jpg')}#question{position:absolute;left:60px;top:530px;width:960px;min-height:215px;padding:24px 30px;border-radius:14px;background:rgba(31,19,18,.94);pointer-events:none}#question small{font:28px/1.35 "Noto Sans SC","Microsoft YaHei",sans-serif}#question p{font-size:38px;line-height:1.4;margin:10px 0 0;white-space:pre-line}#choices{pointer-events:none;opacity:0;transition:opacity .6s ease-out}#choices.shown{opacity:1}#choiceArt{object-fit:fill;pointer-events:none}#hotspots button{position:absolute;background:transparent;border:0;color:transparent;border-radius:10px;pointer-events:auto;transition:background .15s,box-shadow .15s}#hotspots button:active{background:#e9bc6320;box-shadow:inset 0 0 0 3px #f2cd8b}#nickname{position:absolute;left:100px;top:1380px;width:880px;padding:34px 38px;background:rgba(28,19,17,.95);border:2px solid #a77c43;border-radius:12px;transition:transform .22s ease-out;will-change:transform}html.keyboard-open #nickname{transform:translateY(-540px)}#nickname label{font-size:42px;display:block;margin-bottom:22px}#nickname input{display:block;width:100%;height:106px;border:0;border-radius:4px;background:#f1deb6;color:#352519;padding:18px 26px;font-family:"Microsoft YaHei",sans-serif;font-size:38px;-webkit-appearance:none;appearance:none}#nickname small{display:block;font-size:25px;margin:18px 0;color:#cfb184}#nickname button,.gateContent button,#resume{border:0;border-radius:5px;background:#ae753c;color:#ffebc4;font-size:40px;height:112px;width:100%}#nameError{font:24px sans-serif;color:#ffd2be;margin:0 0 12px;min-height:0}#loading{background:#130d10;z-index:8}.loadingGroup{position:absolute;top:846px;left:240px;width:600px;text-align:center}.track{height:12px;background:#3b2a23;border-radius:6px;overflow:hidden}#progress{display:block;height:100%;width:0;background:#c39859;border-radius:6px}#progress.run{animation:fill 1.35s ease-in-out forwards}.loadingGroup p{font-size:42px;margin-top:42px}#result{z-index:9;background:#130d10}#resultArt{object-fit:fill}.pill{position:absolute;top:36px;left:36px;width:236px;height:96px;border:2px solid #b58750;border-radius:48px;background:#211820ed;color:#e3c28e;font:28px "Microsoft YaHei",sans-serif}.record{position:absolute;top:36px;right:36px;width:104px;height:104px;border:2px solid #b58750;border-radius:50%;background:#211820;color:#e6c48f}.grooves{position:absolute;inset:10px;border-radius:50%;border:1px solid #8e6a46;background:repeating-radial-gradient(circle,#231724 0 9px,#604333 10px,#231724 11px)}.record.playing .grooves{animation:spin 8s linear infinite}.bars{display:flex;position:absolute;inset:34px;align-items:center;justify-content:center;gap:5px}.bars i{display:block;width:4px;height:18px;background:#eccb92}.bars i:nth-child(2){height:30px}.record.playing .bars i{animation:eq .65s ease-in-out infinite alternate}.record.playing .bars i:nth-child(2){animation-delay:-.35s}.record.playing .bars i:nth-child(3){animation-delay:-.15s}#gate{z-index:10;background:linear-gradient(transparent 35%,#160e13e8)}.gateContent{position:absolute;bottom:155px;left:150px;width:780px;text-align:center}.gateContent p{font-size:42px}.gateContent small{font-size:27px;display:block;margin-top:28px}#resume{position:absolute;z-index:20;width:680px;left:200px;top:1410px}#status{position:absolute;z-index:30;left:100px;right:100px;bottom:80px;padding:22px;background:#1c1415ee;border:1px solid #b58750;border-radius:10px;font:28px/1.4 sans-serif;text-align:center}@keyframes fill{to{width:100%}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes eq{to{transform:scaleY(.4)}}@media(prefers-reduced-motion:reduce){#choices{transition:none}.record.playing .grooves,.record.playing .bars i{animation:none}}

.choice-hit{overflow:visible!important}.choice-copy{position:absolute;left:0;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:13px 16px 15px;border:1px solid rgba(190,139,72,.34);border-radius:10px;background:rgba(25,14,13,.985);color:#f5d59f;text-align:center;white-space:normal;box-shadow:0 8px 20px rgba(0,0,0,.28);pointer-events:none}.choice-copy strong{display:block;font:600 35px/1.26 "Noto Sans SC","Microsoft YaHei",sans-serif;letter-spacing:.2px;white-space:pre-line}.choice-copy small{display:block;margin-top:9px;color:#e8c68d;font:29px/1.34 "Noto Sans SC","Microsoft YaHei",sans-serif;white-space:pre-line}#choices[data-question="5"] .choice-copy strong{font-size:31px;line-height:1.2}#choices[data-question="5"] .choice-copy small{font-size:27px;margin-top:7px}#choiceHint{position:absolute;z-index:2;left:300px;top:1817px;width:480px;height:68px;margin:0;display:flex;align-items:center;justify-content:center;border-radius:34px;background:rgba(16,9,9,.9);color:#f3c778;font:600 31px/1 "Noto Sans SC","Microsoft YaHei",sans-serif;letter-spacing:1px;pointer-events:none}.pill{top:24px;left:24px;width:214px;height:104px;border:0;background:transparent;color:#d8b780;font-size:24px;opacity:.86}.pill::before{content:"";position:absolute;inset:18px 10px;border:1.5px solid rgba(181,135,80,.78);border-radius:38px;background:rgba(28,20,27,.72);z-index:-1}.share{position:absolute;top:46px;right:166px;width:84px;height:84px;padding:20px;border:1.5px solid rgba(181,135,80,.82);border-radius:50%;background:rgba(33,24,32,.82);color:#e2bf87}.share svg{display:block;width:100%;height:100%;overflow:visible}.share path{fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.share:active,.pill:active{filter:brightness(1.25)}

.choice-copy strong,.choice-copy small{white-space:pre}.choice-copy.dense strong{font-size:32px;line-height:1.05}.choice-copy.dense small{font-size:27px;line-height:1.18;margin-top:7px}#choiceHint{display:none}

.share{top:36px;right:166px;width:104px;height:104px;padding:28px;border-width:2px}#resume{display:none!important}

/* Refined tavern panels */
#question{border:1.5px solid rgba(185,129,65,.72);border-left-width:4px;border-radius:18px;background:linear-gradient(135deg,rgba(42,25,22,.97),rgba(24,14,15,.97));box-shadow:0 15px 34px rgba(7,3,4,.42),inset 0 1px 0 rgba(255,223,164,.13),inset 0 0 26px rgba(128,75,38,.08)}
#question::before{content:"";position:absolute;left:34px;top:-2px;width:118px;height:3px;border-radius:2px;background:linear-gradient(90deg,#d6a764,rgba(214,167,100,0));box-shadow:0 0 12px rgba(214,167,100,.28)}
#question small{color:#d9b77e;letter-spacing:.6px}
#question p{color:#f5d9aa;text-shadow:0 1px 1px rgba(0,0,0,.5)}
.choice-copy{border:1.5px solid rgba(175,116,54,.66);border-top-color:rgba(220,165,92,.78);border-radius:13px;background:linear-gradient(180deg,rgba(43,24,20,.985),rgba(22,12,13,.99));box-shadow:0 13px 22px rgba(6,2,3,.38),inset 0 1px 0 rgba(255,225,174,.12),inset 0 -14px 24px rgba(0,0,0,.12)}
.choice-copy::before{content:"";position:absolute;left:24px;right:24px;top:-2px;height:3px;border-radius:3px;background:linear-gradient(90deg,transparent,rgba(225,174,100,.82),transparent)}
.choice-copy strong{color:#f5d49a;text-shadow:0 1px 1px rgba(0,0,0,.65)}
.choice-copy small{color:#dfbd83}
#hotspots button:active .choice-copy{border-color:#e7b76f;background:linear-gradient(180deg,rgba(67,38,26,.99),rgba(31,17,15,.99));box-shadow:0 8px 16px rgba(0,0,0,.35),inset 0 0 0 2px rgba(232,184,111,.14)}
#nickname.name-in{animation:nickname-in .32s ease-out both}
@keyframes nickname-in{from{opacity:0}to{opacity:1}}

/* Animated cocktail loading meter */
#loading{background:radial-gradient(circle at 50% 48%,#211519 0,#130d10 46%,#0d090b 100%)}
.loadingGroup{top:820px}
.track{position:relative;height:18px;border:2px solid rgba(190,137,72,.72);border-radius:10px;background:#2b1b1b;overflow:visible;box-shadow:inset 0 2px 5px rgba(0,0,0,.65),0 0 18px rgba(192,132,62,.08)}
#progress{position:absolute;left:0;top:0;height:14px;overflow:hidden;border-radius:8px;background:linear-gradient(90deg,#9f5e2c,#d49a4a 55%,#f0c775);box-shadow:0 0 15px rgba(222,165,86,.42)}
#progress::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 20%,rgba(255,238,185,.46) 48%,transparent 72%);animation:pour-shine .55s linear infinite}
.progressGlass{position:absolute;z-index:2;left:-36px;top:-76px;width:72px;height:82px;filter:drop-shadow(0 7px 5px rgba(0,0,0,.5));transform:translateX(0)}
.progressGlass svg{display:block;width:100%;height:100%;transform-origin:50% 82%;animation:glass-sway .34s ease-in-out infinite alternate}
.progressGlass .glassBowl{fill:rgba(239,226,205,.12);stroke:#edcf99;stroke-width:3;stroke-linejoin:round}
.progressGlass .glassDrink{fill:url(#none);fill:#c27a36;stroke:#f1c276;stroke-width:1.5}
.progressGlass .glassShine{fill:none;stroke:rgba(255,255,255,.7);stroke-width:2.3;stroke-linecap:round}
.progressGlass circle{fill:#ffe0a0}
.progressGlass.run{animation:glass-travel 1.35s ease-in-out forwards}
.loadingGroup p{margin-top:54px;color:#e7c58e;text-shadow:0 2px 10px rgba(203,143,67,.25)}
@keyframes glass-travel{to{transform:translateX(600px)}}
@keyframes glass-sway{from{transform:rotate(-3deg)}to{transform:rotate(3deg)}}
@keyframes pour-shine{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
@media(prefers-reduced-motion:reduce){.progressGlass svg,#progress::after{animation:none}}

/* Lighter, glass-like dialogue and choice panels */
#question{border-color:rgba(181,124,61,.48);background:linear-gradient(135deg,rgba(43,27,23,.86),rgba(22,14,15,.88));box-shadow:0 11px 24px rgba(7,3,4,.3),inset 0 1px 0 rgba(255,225,177,.1),inset 0 0 22px rgba(128,75,38,.045);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
#question::before{opacity:.68}
.choice-copy{border-color:rgba(172,113,52,.46);border-top-color:rgba(211,155,82,.58);background:linear-gradient(180deg,rgba(45,28,23,.86),rgba(22,14,14,.9));box-shadow:0 9px 17px rgba(6,2,3,.27),inset 0 1px 0 rgba(255,225,174,.09),inset 0 -10px 20px rgba(0,0,0,.08);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.choice-copy::before{opacity:.64}
#question[data-question="1"]{left:48px;top:530px;width:984px;height:150px;min-height:150px;padding:24px 30px;border-radius:16px}
#question{background:linear-gradient(135deg,rgba(43,27,23,.82),rgba(22,14,15,.85))}
.choice-copy{background:linear-gradient(180deg,rgba(45,28,23,.82),rgba(22,14,14,.86))}

/* Mobile readability and natural keyboard following */
.choice-copy{padding:8px 14px 10px}
.choice-copy strong{font-size:37px}
.choice-copy small{font-size:31px}
.choice-copy.dense strong{font-size:34px;line-height:1.05}
.choice-copy.dense small{font-size:29px;line-height:1.18;margin-top:7px}
#choices[data-question="5"] .choice-copy strong{font-size:33px}
#choices[data-question="5"] .choice-copy small{font-size:29px}
#nickname{transition:transform .26s cubic-bezier(.22,.8,.24,1)}
html.keyboard-open #nickname{transform:translateY(var(--keyboard-shift,0px))}

/* Compact question-panel spacing on phones */
@media(max-width:600px){
  #question{min-height:0;padding-top:16px;padding-bottom:14px}
  #question p{margin-top:6px}
  #question[data-question="1"]{height:auto;min-height:0;padding-top:16px;padding-bottom:14px}
}