:root {
  --v2-ink:#102f35;
  --v2-paper:#f5efe4;
  --v2-paper-strong:#fffaf1;
  --v2-red:#a8443f;
  --v2-gold:#d5b77e;
  --v2-sea:#315d63;
  --v2-line:rgba(16,47,53,.14);
  --v2-shadow:0 18px 50px rgba(6,24,28,.18);
}

* { -webkit-tap-highlight-color:transparent; }
body { font-family:"Times New Roman","Noto Sans SC","Microsoft YaHei",sans-serif; }
html,body { height:100%; overflow:hidden; }
button, input { font:inherit; }

.experience-shell { height:100dvh; min-height:100dvh; overflow:hidden; background:radial-gradient(circle at 50% 15%,#496f73 0,#17363b 48%,#0d2428 100%); }
.ambient { display:none; }
.phone { width:min(100vw,430px); height:min(920px,100dvh); overflow:hidden; border:1px solid rgba(255,255,255,.22); border-radius:38px; background:#102d32; box-shadow:0 32px 100px rgba(0,0,0,.45); }
.phone-island { width:112px; height:30px; top:0; border-radius:0 0 18px 18px; background:#091e22; }
.system-bar { z-index:80; height:42px; padding:12px 18px 0; color:#fff; text-shadow:0 1px 8px rgba(0,0,0,.8); font:700 14px/1 "Times New Roman",serif; }
.system-icons { gap:5px; font-size:12px; }
.experience-tools { z-index:85; top:48px; right:15px; gap:8px; }
.icon-button { width:42px; height:42px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.45); border-radius:14px; color:#fff; background:rgba(10,31,35,.62); backdrop-filter:blur(16px); box-shadow:0 8px 24px rgba(0,0,0,.18); }
.icon-button svg { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.icon-button svg path:first-child { fill:currentColor; stroke:none; }
.icon-button:active { transform:scale(.9); background:rgba(168,68,63,.82); }
.icon-button.is-muted .sound-wave { display:none; }

.app { background:#102f35; }
.screen { min-height:100%; padding-top:104px; isolation:isolate; overflow-x:hidden; animation:v2Enter .4s cubic-bezier(.2,.8,.2,1) both; }
.screen::before { pointer-events:none; }
.scene-bg { position:relative; color:#fff; background:#17363b; }
.scene-bg::before { content:""; position:absolute; z-index:-2; inset:0; min-height:100%; background-image:linear-gradient(180deg,rgba(8,27,31,.12) 0%,rgba(8,27,31,.44) 45%,rgba(8,27,31,.94) 100%),var(--scene-image); background-size:cover; background-position:center top; }
.scene-bg::after { content:""; position:absolute; z-index:-1; inset:0; pointer-events:none; background:linear-gradient(180deg,rgba(8,27,31,.04),rgba(8,27,31,.2) 38%,rgba(8,27,31,.84)); }
.bg-hotel { --scene-image:url("assets/scene-hotel-v2.jpg"); }
.bg-chat { --scene-image:url("assets/scene-hotel-v2.jpg"); }
.bg-survey { --scene-image:url("assets/scene-survey-v2.jpg"); }
.bg-verify { --scene-image:url("assets/scene-verify-v2.jpg"); }
.bg-purchase { --scene-image:url("assets/scene-purchase-v2.jpg"); }
.bg-departure { --scene-image:url("assets/scene-departure-v2.jpg"); }
.bg-handoff { --scene-image:url("assets/scene-handoff-v2.jpg"); }
.bg-reveal { --scene-image:url("assets/scene-reveal-v2.jpg"); }
.bg-evidence { --scene-image:url("assets/scene-evidence-v2.jpg"); }
.bg-migration { --scene-image:url("assets/scene-migration-v2.jpg"); }
.bg-score { --scene-image:url("assets/scene-score-v2.jpg"); }

.ai-badge { z-index:88; left:14px; bottom:12px; padding:5px 8px; border:1px solid rgba(255,255,255,.24); border-radius:7px; color:rgba(255,255,255,.88); background:rgba(6,27,31,.7); font-size:10px; letter-spacing:.04em; backdrop-filter:blur(10px); }

.chapter-header { margin:0 20px 14px; padding:0; color:#fff; text-shadow:0 2px 12px rgba(0,0,0,.55); }
.chapter-number { display:inline-flex; align-items:center; gap:7px; padding:6px 10px; border:1px solid rgba(255,255,255,.32); border-radius:999px; color:#fff; background:rgba(10,34,38,.46); backdrop-filter:blur(12px); font:700 12px/1 "Times New Roman",serif; letter-spacing:.08em; }
.chapter-number::before { content:""; width:6px; height:6px; border-radius:50%; background:var(--v2-gold); box-shadow:0 0 0 4px rgba(213,183,126,.18); }
.chapter-title { margin:12px 0 0; color:#fff; font-size:28px; line-height:1.2; letter-spacing:.01em; }
.progress { height:3px; margin:0 20px 20px; border-radius:99px; overflow:hidden; background:rgba(255,255,255,.18); }
.progress span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--v2-gold),#fff2ca); box-shadow:0 0 12px rgba(255,235,191,.7); }

.kicker,.truth-kicker,.scene-label { font:700 12px/1.2 "Times New Roman","Microsoft YaHei",sans-serif; letter-spacing:.12em; text-transform:uppercase; }
.start-screen { justify-content:flex-end; padding:112px 24px 38px; text-align:left; color:#fff; background:transparent; }
.start-screen::before { opacity:1; }
.start-screen::after { background:linear-gradient(180deg,rgba(5,25,30,.03),rgba(5,25,30,.22) 35%,rgba(5,25,30,.92) 78%); }
.start-screen .kicker { display:inline-flex; width:max-content; padding:7px 10px; border-radius:999px; background:rgba(255,255,255,.15); backdrop-filter:blur(10px); }
.title { margin:18px 0 12px; color:#fff; font-size:54px; line-height:.98; letter-spacing:-.04em; text-shadow:0 4px 24px rgba(0,0,0,.55); }
.title em { color:#f4dca9; font-style:normal; }
.subtitle { max-width:330px; margin:0; color:rgba(255,255,255,.86); font-size:17px; line-height:1.75; text-shadow:0 2px 12px rgba(0,0,0,.58); }
.start-visual { display:none; }
.start-actions { margin-top:30px; }
.microcopy { margin:14px 0 0; color:rgba(255,255,255,.64); font-size:12px; line-height:1.7; }

.action { min-height:54px; border-radius:16px; font-size:16px; font-weight:800; letter-spacing:.02em; box-shadow:0 10px 30px rgba(0,0,0,.15); transition:transform .16s ease,background .16s ease,box-shadow .16s ease; }
.action::after { content:"→"; margin-left:8px; font:700 20px/1 "Times New Roman",serif; }
.action:active,.action.is-selected { transform:scale(.975); box-shadow:0 5px 16px rgba(0,0,0,.18); }
.action-primary { color:var(--v2-ink); background:linear-gradient(135deg,#fff7e8,#e8d1a4); }
.action-dark { color:#fff; background:linear-gradient(135deg,#315d63,#17363b); border:1px solid rgba(255,255,255,.2); }
.action-ghost { color:#fff; border:1px solid rgba(255,255,255,.32); background:rgba(255,255,255,.08); }

.scene-screen { padding-bottom:28px; }
.scene-hero { min-height:310px; margin:0 20px; padding:22px; display:flex; flex-direction:column; justify-content:flex-end; border:1px solid rgba(255,255,255,.28); border-radius:24px; color:#fff; background:linear-gradient(180deg,rgba(4,22,27,.02),rgba(4,22,27,.78)); box-shadow:var(--v2-shadow); overflow:hidden; backdrop-filter:blur(2px); }
.scene-hero::after { background:linear-gradient(180deg,transparent 20%,rgba(7,29,33,.85)); }
.scene-label { color:#f2d49b; }
.scene-title { margin:10px 0 8px; font-size:32px; line-height:1.18; letter-spacing:-.025em; text-wrap:balance; }
.scene-copy { max-width:330px; color:rgba(255,255,255,.82); font-size:16px; line-height:1.7; }
.scene-copy mark,.bubble mark { padding:0 3px; color:#ffe5a9; background:rgba(168,68,63,.7); border-radius:4px; font-weight:800; }
.scroll-hint { width:max-content; margin-top:15px; padding:7px 11px; display:flex; align-items:center; gap:7px; border:1px solid rgba(255,255,255,.26); border-radius:999px; color:rgba(255,255,255,.82); background:rgba(255,255,255,.1); font-size:12px; font-weight:700; backdrop-filter:blur(8px); }
.scroll-hint span { font:700 20px/1 "Times New Roman",serif; animation:v2Nudge 1.6s ease-in-out infinite; }
.scene-body { margin:14px 12px 0; padding:18px 14px 30px; border:1px solid rgba(255,255,255,.24); border-radius:26px; color:var(--v2-ink); background:rgba(248,242,231,.94); box-shadow:var(--v2-shadow); backdrop-filter:blur(18px); }

.task-box { display:flex; align-items:flex-start; gap:12px; margin:16px 0 12px; padding:14px; border:1px solid rgba(49,93,99,.17); border-radius:17px; color:var(--v2-ink); background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(242,232,215,.96)); box-shadow:0 10px 24px rgba(16,47,53,.08); }
.task-icon { flex:0 0 38px; width:38px; height:38px; display:grid; place-items:center; border-radius:12px; color:#fff; background:var(--v2-sea); }
.task-icon svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.task-box small { display:block; margin-bottom:4px; color:var(--v2-red); font-size:11px; font-weight:800; letter-spacing:.08em; }
.task-box p { margin:0; font-size:16px; line-height:1.55; font-weight:800; }
.prompt { margin:16px 0 10px; padding:13px 14px; border-left:4px solid var(--v2-red); border-radius:0 14px 14px 0; color:var(--v2-ink); background:rgba(255,255,255,.78); font-size:16px; line-height:1.6; font-weight:800; }

.choice-grid { display:grid; gap:10px; }
.choice { min-height:64px; padding:13px 13px 13px 16px; display:flex; align-items:center; justify-content:space-between; gap:12px; border:1px solid rgba(16,47,53,.12); border-radius:17px; color:var(--v2-ink); text-align:left; background:rgba(255,255,255,.96); box-shadow:0 8px 22px rgba(16,47,53,.08); transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease; }
.choice:hover { border-color:rgba(168,68,63,.35); }
.choice:active,.choice.is-selected { transform:translateY(2px) scale(.985); color:#fff; border-color:var(--v2-sea); background:var(--v2-sea); box-shadow:0 4px 12px rgba(16,47,53,.18); }
.choice-copy { flex:1; min-width:0; }
.choice strong { display:block; font-size:16px; line-height:1.45; }
.choice small { display:block; margin-top:4px; color:#687a7d; font-size:13px; line-height:1.45; }
.choice:active small,.choice.is-selected small { color:rgba(255,255,255,.72); }
.choice-arrow { flex:0 0 34px; width:34px; height:34px; display:grid; place-items:center; border-radius:11px; color:var(--v2-sea); background:#eef1ed; }
.choice-arrow svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.choice:active .choice-arrow,.choice.is-selected .choice-arrow { color:#fff; background:rgba(255,255,255,.16); }

.chat-screen { height:100%; min-height:100%; padding-bottom:0; display:flex; flex-direction:column; overflow:hidden; }
.chat-screen::after { background:linear-gradient(180deg,rgba(8,27,31,.18),rgba(8,27,31,.44) 45%,rgba(8,27,31,.78)); }
.chat-screen .chapter-header,.chat-screen .progress,.chat-screen .chat-header { flex:0 0 auto; }
.chat-header { position:relative; z-index:8; margin:0 14px; padding:12px 14px; display:flex; align-items:center; gap:12px; border:1px solid rgba(255,255,255,.34); border-radius:20px; color:#fff; background:rgba(10,34,38,.68); box-shadow:0 12px 28px rgba(0,0,0,.16); backdrop-filter:blur(18px); }
.chat-header .avatar { width:48px; height:48px; padding:0; border:2px solid rgba(255,255,255,.8); overflow:hidden; background:#d9e3e0; }
.chat-header .avatar img { width:100%; height:100%; object-fit:cover; }
.chat-person b { font-size:17px; }
.chat-person span { margin-top:3px; color:rgba(255,255,255,.68); font-size:12px; }
.chat-thread { flex:1 1 auto; min-height:0; margin:10px 10px 0; padding:18px 10px 24px; overflow-y:auto; overscroll-behavior:contain; border-radius:24px 24px 0 0; background:rgba(239,236,226,.93); box-shadow:0 -8px 40px rgba(0,0,0,.12); backdrop-filter:blur(18px); }
.day-stamp { width:max-content; margin:0 auto 18px; padding:5px 10px; border-radius:999px; color:#fff; background:rgba(28,51,55,.55); font-size:11px; }
.bubble-row { margin:0 0 16px; display:flex; align-items:flex-end; gap:9px; }
.bubble-row.me { flex-direction:row-reverse; }
.message-avatar { flex:0 0 42px; width:42px; height:42px; border:2px solid #fff; border-radius:14px; object-fit:cover; box-shadow:0 5px 14px rgba(16,47,53,.14); }
.message-stack { max-width:76%; }
.message-name { display:block; margin:0 5px 5px; color:#6c7a7c; font-size:11px; }
.bubble-row.me .message-name { text-align:right; }
.bubble { max-width:none; padding:12px 14px; border-radius:7px 18px 18px 18px; color:var(--v2-ink); background:#fff; box-shadow:0 7px 20px rgba(16,47,53,.08); font-size:16px; line-height:1.65; }
.bubble-row.me .bubble { color:#fff; border-radius:18px 7px 18px 18px; background:var(--v2-sea); }
.bubble > small { display:none; }
.chat-note { margin-top:9px; padding-top:9px; border-top:1px solid rgba(16,47,53,.12); color:#7e5c3d; font-size:12px; line-height:1.5; }
.bubble-row.me .chat-note { color:rgba(255,255,255,.68); border-color:rgba(255,255,255,.16); }
.bottom-panel { position:relative; z-index:9; flex:0 0 auto; max-height:48%; margin:0; padding:14px 16px max(24px,env(safe-area-inset-bottom)); overflow-y:auto; border-top:1px solid rgba(255,255,255,.42); color:var(--v2-ink); background:rgba(246,240,229,.97); box-shadow:0 -14px 38px rgba(5,25,29,.2); backdrop-filter:blur(20px); }

.form-card,.verification,.agreement,.product-list,.receipt,.boarding-pass,.transfer-card,.answer-feedback,.evidence-card { border:1px solid var(--v2-line); box-shadow:0 10px 28px rgba(16,47,53,.09); }
.form-card { padding:18px; border-radius:20px; background:rgba(255,255,255,.96); }
.form-label { font-size:17px; }
.fake-input { min-height:48px; margin-top:10px; padding:13px 14px; border-radius:13px; font-size:15px; background:#f4f1ea; }
.receipt { padding:20px; border-radius:20px; background:rgba(255,255,255,.97); }
.receipt-label,.receipt-meta { font-size:13px; }
.receipt-amount { display:block; margin:10px 0; color:var(--v2-red); font:700 42px/1 "Times New Roman",serif; }
.verification { margin-top:4px; padding:18px; border-radius:20px; color:var(--v2-ink); background:rgba(255,255,255,.97); }
.verification b { font-size:18px; }
.verification span { font-size:15px; }
.agreement { max-height:none; padding:19px; border-radius:20px; font-size:15px; line-height:1.75; background:rgba(255,255,255,.97); }
.agreement h3 { font-size:19px; }
.product-list { border-radius:20px; overflow:hidden; background:rgba(255,255,255,.97); }
.product { min-height:78px; padding:13px; }
.product b { font-size:16px; }
.product small { font-size:13px; }
.product-price,.total b { font:700 18px/1 "Times New Roman",serif; }
.total { padding:16px; font-size:16px; }
.boarding-pass { padding:18px; border-radius:20px; background:rgba(255,255,255,.96); }
.route b { font:700 32px/1 "Times New Roman",serif; }
.pass-meta { font-size:13px; }
.handoff-visual { display:none; }

.freeze-screen { min-height:100%; padding:120px 24px 44px; justify-content:flex-end; color:#fff; background:transparent; }
.freeze-screen::after { z-index:-1; opacity:1; background:linear-gradient(180deg,rgba(3,17,21,.08),rgba(3,17,21,.22) 30%,rgba(3,17,21,.94) 76%),repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,255,255,.025) 4px); }
.freeze-amount { padding:22px; border:1px solid rgba(255,255,255,.24); border-radius:22px; color:#f0d6a5; background:rgba(9,32,36,.72); box-shadow:var(--v2-shadow); backdrop-filter:blur(16px); }
.freeze-amount span,.freeze-amount small { font-size:13px; }
.freeze-amount b { display:block; margin:10px 0; color:#fff; font-size:29px; line-height:1.28; letter-spacing:-.02em; }
.reveal-lines { padding:22px; border-left:4px solid var(--v2-red); border-radius:0 22px 22px 0; background:rgba(7,26,30,.76); box-shadow:var(--v2-shadow); backdrop-filter:blur(16px); }
.reveal-lines p { font-size:18px; line-height:1.55; }
.reveal-lines strong { display:block; margin-top:18px; color:#ffe1a5; font-size:23px; line-height:1.5; }
.freeze-screen .action { margin-top:16px; }

.truth-screen { padding:112px 16px 36px; color:var(--v2-ink); background:transparent; }
.truth-screen::after { background:linear-gradient(180deg,rgba(8,27,31,.28),rgba(8,27,31,.52) 35%,rgba(8,27,31,.88)); }
.truth-head { margin:0 0 14px; padding:20px; border:1px solid rgba(255,255,255,.35); border-radius:22px; color:#fff; background:rgba(8,31,35,.68); box-shadow:var(--v2-shadow); backdrop-filter:blur(17px); }
.truth-kicker { display:block; margin-bottom:9px; color:#f2d39b; }
.truth-head h2 { color:#fff; font-size:29px; line-height:1.28; letter-spacing:-.02em; }
.truth-head > p { max-width:none; color:rgba(255,255,255,.78); font-size:16px; line-height:1.7; }
.truth-intro { margin:0; padding:15px 16px; border-left:3px solid #f2d39b; color:rgba(255,255,255,.86); background:rgba(255,255,255,.1); font-size:15px; }
.truth-screen > .choice-grid { padding:14px; border-radius:22px; background:rgba(246,240,229,.94); box-shadow:var(--v2-shadow); backdrop-filter:blur(17px); }
.nake-viewport { height:136px; padding:8px 18px; border:1px solid rgba(255,255,255,.24); border-radius:22px; background:rgba(10,46,51,.9); box-shadow:var(--v2-shadow); }
.nake-viewport img { width:110px; height:126px; }
.nake-viewport span { max-width:185px; font-size:15px; line-height:1.6; }
.evidence-stack { gap:13px; }
.evidence-card { padding:19px; border-radius:20px; background:rgba(255,250,241,.96); }
.evidence-card span { font-size:11px; }
.evidence-card h3 { margin:11px 0 7px; font-size:18px; }
.evidence-card p { font-size:15px; line-height:1.65; }
.chain { padding:14px; border-radius:22px; background:rgba(246,240,229,.94); box-shadow:var(--v2-shadow); }
.chain-node { min-height:76px; padding:15px; border-radius:16px; background:#fffaf1; }
.chain-node strong,.chain-node b { font-size:17px; }
.chain-node small { font-size:13px; }
.rule-banner { padding:18px; border-radius:20px; background:linear-gradient(135deg,rgba(168,68,63,.96),rgba(104,39,38,.96)); box-shadow:var(--v2-shadow); }
.rule-banner strong { margin:0; font-size:21px; }
.rule-banner p { font-size:14px; }
.transfer-card { padding:20px; border-radius:22px; background:rgba(255,250,241,.96); }
.transfer-card span { font-size:12px; color:var(--v2-red); font-weight:800; }
.transfer-card h3 { margin:10px 0; font-size:21px; line-height:1.45; }
.transfer-card p { font-size:15px; }
.answer-feedback { padding:18px; border-radius:20px; font-size:15px; background:rgba(255,250,241,.96); }

.score-screen { padding:112px 20px 38px; color:#fff; background:transparent; }
.score-screen::after { background:linear-gradient(180deg,rgba(7,28,32,.12),rgba(7,28,32,.5) 35%,rgba(7,28,32,.94) 75%); }
.score-ring { width:188px; height:188px; margin:16px auto 22px; box-shadow:0 0 0 1px rgba(255,255,255,.25),0 20px 55px rgba(0,0,0,.22); }
.score-value b { font:700 64px/1 "Times New Roman",serif; }
.score-screen h2 { font-size:27px; line-height:1.4; text-shadow:0 2px 14px rgba(0,0,0,.46); }
.score-screen > p { max-width:330px; color:rgba(255,255,255,.76); font-size:15px; }
.score-breakdown { gap:10px; }
.score-chip { min-height:54px; padding:13px; border:1px solid rgba(255,255,255,.16); border-radius:15px; background:rgba(9,35,39,.64); backdrop-filter:blur(12px); font-size:15px; }
.share-card { padding:22px; border-radius:24px; }
.share-score { font:900 54px/1 "Times New Roman",serif; }
.share-title { font-size:29px; }
.share-slogan { font-size:15px; }

.sheet { width:min(100%,430px); padding:22px 20px 30px; border-radius:28px 28px 0 0; }
.sheet-close { width:40px; height:40px; font-size:24px; }
.sheet-tab { min-height:40px; font-size:13px; }
.sheet-content { font-size:15px; line-height:1.85; }

@keyframes v2Enter { from { opacity:0; transform:translateY(10px) scale(.995); } to { opacity:1; transform:none; } }
@keyframes v2Pulse { 0%,100% { transform:scale(1); } 50% { transform:scale(1.04); } }
@keyframes v2Nudge { 0%,100% { transform:translateY(-2px); opacity:.65; } 50% { transform:translateY(3px); opacity:1; } }

@media (max-width:500px) {
  .phone { width:100vw; height:100dvh; min-height:620px; border:0; border-radius:0; }
  .phone-island { border-radius:0 0 17px 17px; }
}

@media (max-height:720px) {
  .screen { padding-top:96px; }
  .scene-hero { min-height:250px; }
  .start-screen { padding-top:98px; }
  .title { font-size:48px; }
}

@media (prefers-reduced-motion:reduce) {
  .screen { animation:none; }
  .choice,.action,.icon-button { transition:none; }
}