:root {
  --ink: #173035;
  --ink-soft: #486066;
  --paper: #f5f0e6;
  --paper-deep: #e9e0d1;
  --sea: #5e7f84;
  --sea-deep: #29494e;
  --sand: #d4b98c;
  --amber: #ba8d48;
  --danger: #a4423e;
  --danger-dark: #6f2928;
  --line: rgba(23, 48, 53, .14);
  --shadow: 0 24px 70px rgba(6, 24, 28, .28);
  --radius: 22px;
  font-family: "Noto Sans SC", "Microsoft YaHei", system-ui, sans-serif;
}

* { box-sizing: border-box; }

html, body { margin: 0; min-height: 100%; background: #15282c; color: var(--ink); }

button, input { font: inherit; }
button { -webkit-tap-highlight-color: transparent; }

body { min-height: 100vh; overflow-x: hidden; }

.experience-shell {
  position: relative;
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 18px;
  overflow: hidden;
  background:
    radial-gradient(circle at 18% 12%, rgba(115, 153, 157, .28), transparent 36%),
    radial-gradient(circle at 86% 82%, rgba(180, 128, 71, .18), transparent 38%),
    linear-gradient(145deg, #102428, #233b3f 62%, #152a2e);
}

.ambient { position: absolute; border-radius: 999px; filter: blur(3px); opacity: .3; pointer-events: none; }
.ambient-one { width: 260px; height: 260px; background: #6f9698; left: -120px; top: -90px; }
.ambient-two { width: 220px; height: 220px; background: #9e6e48; right: -100px; bottom: -80px; }

.phone {
  position: relative;
  width: min(100%, 420px);
  height: min(900px, calc(100vh - 36px));
  min-height: 640px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 34px;
  background: var(--paper);
  box-shadow: var(--shadow), inset 0 0 0 7px rgba(255,255,255,.06);
  isolation: isolate;
}

.phone::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .3;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E");
}

.phone-island {
  position: absolute;
  width: 112px;
  height: 28px;
  border-radius: 0 0 18px 18px;
  background: #102024;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 40;
}

.system-bar {
  position: absolute;
  z-index: 30;
  top: 0;
  left: 0;
  right: 0;
  height: 45px;
  padding: 12px 18px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  color: currentColor;
  pointer-events: none;
}

.system-icons { display: flex; gap: 5px; font-size: 10px; }

.experience-tools {
  position: absolute;
  z-index: 45;
  right: 13px;
  top: 47px;
  display: flex;
  gap: 7px;
}

.icon-button {
  width: 34px;
  height: 34px;
  border: 1px solid rgba(255,255,255,.34);
  border-radius: 50%;
  background: rgba(28, 48, 52, .52);
  color: #fff;
  backdrop-filter: blur(10px);
  cursor: pointer;
}

.icon-button:focus-visible, .action:focus-visible, .choice:focus-visible { outline: 3px solid rgba(186, 141, 72, .52); outline-offset: 2px; }

.app { min-height: 100%; height: 100%; }

.screen {
  position: absolute;
  inset: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: none;
  animation: enter .55s cubic-bezier(.2,.8,.2,1) both;
}
.screen::-webkit-scrollbar { display: none; }

@keyframes enter { from { opacity: 0; transform: translateY(10px) scale(.995); } to { opacity: 1; transform: none; } }
@keyframes rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes pulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.04); } }
@keyframes drift { 0%,100% { transform: translate3d(0,0,0); } 50% { transform: translate3d(0,-8px,0); } }
@keyframes scan { from { transform: translateY(-120%); } to { transform: translateY(640%); } }

.start-screen {
  padding: 86px 30px 38px;
  display: flex;
  flex-direction: column;
  color: #f9f4e9;
  background:
    linear-gradient(180deg, rgba(20,42,46,.05), rgba(16,38,42,.72)),
    radial-gradient(circle at 70% 24%, rgba(210,185,144,.34), transparent 33%),
    linear-gradient(160deg, #5e7e81 0%, #385b60 46%, #1a373b 100%);
}

.start-screen::after {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .5;
  pointer-events: none;
  background:
    linear-gradient(164deg, transparent 0 58%, rgba(236,226,205,.12) 58.2% 58.8%, transparent 59%),
    linear-gradient(18deg, transparent 0 72%, rgba(236,226,205,.08) 72.2% 72.8%, transparent 73%);
}

.kicker { font-size: 12px; letter-spacing: .18em; text-transform: uppercase; opacity: .78; }
.title { margin: 18px 0 12px; font-family: "STSong", "SimSun", serif; font-size: clamp(38px, 11vw, 56px); line-height: 1.08; letter-spacing: -.05em; }
.title span { display: block; color: #e7d0aa; }
.subtitle { max-width: 270px; margin: 0; font-size: 15px; line-height: 1.8; color: rgba(255,255,255,.78); }

.start-visual { position: relative; flex: 1; min-height: 210px; margin: 18px 0; }
.moon { position: absolute; width: 84px; height: 84px; border-radius: 50%; background: #e6d8ba; right: 22px; top: 24px; box-shadow: 0 0 42px rgba(230,216,186,.26); }
.hotel-line { position: absolute; left: 4px; right: 0; bottom: 22px; height: 96px; border-bottom: 1px solid rgba(255,255,255,.32); }
.hotel-line::before, .hotel-line::after { content:""; position:absolute; bottom:0; border:1px solid rgba(255,255,255,.27); border-bottom:0; }
.hotel-line::before { left:0; width:55%; height:72px; }
.hotel-line::after { right:0; width:38%; height:46px; }
.suitcase { position: absolute; left: 36px; bottom: 23px; width: 74px; height: 86px; border: 2px solid rgba(255,255,255,.75); border-radius: 13px; animation: drift 4.8s ease-in-out infinite; }
.suitcase::before { content:""; position:absolute; width:28px; height:18px; left:21px; top:-20px; border:2px solid rgba(255,255,255,.75); border-bottom:0; border-radius:8px 8px 0 0; }
.suitcase::after { content:""; position:absolute; inset:10px 35px; border-left:1px solid rgba(255,255,255,.52); }

.start-actions { position: relative; z-index: 2; }
.microcopy { margin: 0 0 10px; font-size: 11px; line-height: 1.5; color: rgba(255,255,255,.6); }

.action {
  width: 100%;
  min-height: 52px;
  border: 0;
  border-radius: 16px;
  padding: 14px 18px;
  font-weight: 700;
  cursor: pointer;
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}
.action:active { transform: scale(.985); }
.action-primary { background: #f0e5d2; color: #17383c; box-shadow: 0 10px 28px rgba(4,20,22,.26); }
.action-dark { background: var(--sea-deep); color: #fff; }
.action-danger { background: var(--danger); color: #fff; }
.action-ghost { background: transparent; color: var(--ink); border: 1px solid var(--line); }
.action + .action { margin-top: 9px; }

.scene-screen { display: flex; flex-direction: column; padding-top: 45px; background: #e8e3d9; }
.scene-hero { position: relative; min-height: 220px; padding: 48px 24px 22px; color: #fff; overflow: hidden; background: linear-gradient(145deg, #5b797d, #2d4e53); }
.scene-hero::after { content:""; position:absolute; inset:0; background: linear-gradient(transparent 42%, rgba(13,34,38,.65)); }
.scene-hero > * { position: relative; z-index: 2; }
.hotel-scene .scene-hero { background-image: linear-gradient(180deg, rgba(14,31,38,.18), rgba(13,34,38,.9)), url("assets/hotel-night.jpg"); background-size:cover; background-position:center 64%; }
.shop-scene .scene-hero { background-image: linear-gradient(180deg, rgba(14,31,38,.12), rgba(13,34,38,.88)), url("assets/duty-free-pickup.jpg"); background-size:cover; background-position:center 56%; }
.airport-scene .scene-hero { background-image: linear-gradient(180deg, rgba(14,31,38,.16), rgba(13,34,38,.9)), url("assets/airport-handoff.jpg"); background-size:cover; background-position:center 52%; }
.scene-label { font-size: 11px; letter-spacing: .16em; opacity: .7; }
.scene-title { margin: 8px 0; font: 700 28px/1.3 "STSong", "SimSun", serif; }
.scene-copy { margin: 0; max-width: 300px; line-height: 1.7; font-size: 13px; opacity: .78; }
.scene-body { flex: 1; padding: 22px 20px 30px; background: var(--paper); }

.hotel-scene::before, .airport-scene::before, .shop-scene::before {
  content:"";
  position:absolute;
  inset:0;
  opacity:.38;
  pointer-events:none;
  background-size:cover;
  background-position:center;
}
.hotel-scene::before { background-image: radial-gradient(circle at 80% 18%, #dfd1b2 0 8%, transparent 8.5%), linear-gradient(125deg, transparent 52%, rgba(255,255,255,.18) 52.5% 53%, transparent 53.5%); }
.shop-scene::before { background-image: repeating-linear-gradient(90deg, transparent 0 48px, rgba(255,255,255,.13) 49px 50px), linear-gradient(0deg, rgba(218,196,159,.16), transparent); }
.airport-scene::before { background-image: linear-gradient(170deg, transparent 60%, rgba(255,255,255,.12) 60.4% 61%, transparent 61.4%), repeating-linear-gradient(90deg, transparent 0 72px, rgba(255,255,255,.1) 73px 74px); }

.chapter-header { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px; }
.chapter-number { font: 700 12px/1 system-ui; letter-spacing:.14em; color:var(--amber); }
.chapter-title { margin: 4px 0 0; font-size: 21px; }
.progress { display:flex; gap:4px; }
.progress i { display:block; width:18px; height:3px; border-radius:99px; background:#d8d1c4; }
.progress i.active { background:var(--amber); }

.chat-screen { padding: 46px 0 92px; background: #e7e4dc; }
.chat-header { position:sticky; top:0; z-index:4; min-height:58px; margin-top:-1px; padding:11px 54px 10px 18px; display:flex; align-items:center; gap:11px; background:rgba(245,240,230,.92); border-bottom:1px solid var(--line); backdrop-filter:blur(12px); }
.avatar { width:38px; height:38px; border-radius:14px; display:grid; place-items:center; color:#fff; font-weight:800; background:linear-gradient(145deg,#799497,#496a6f); }
.avatar.advisor { background:linear-gradient(145deg,#b39b71,#826944); }
.chat-person strong { display:block; font-size:14px; }
.chat-person span { font-size:10px; color:#6c7a7c; }
.chat-thread { padding:18px 14px; }
.day-stamp { margin:8px auto 18px; width:max-content; padding:4px 8px; font-size:10px; color:#7f8a8b; background:rgba(255,255,255,.55); border-radius:8px; }
.bubble-row { display:flex; gap:8px; margin:10px 0; animation:rise .35s ease both; }
.bubble-row.me { justify-content:flex-end; }
.bubble { max-width:78%; padding:11px 13px; border-radius:5px 16px 16px 16px; background:#fff; box-shadow:0 4px 14px rgba(27,48,51,.06); font-size:14px; line-height:1.62; }
.me .bubble { border-radius:16px 5px 16px 16px; color:#fff; background:#58777b; }
.chat-note { max-width:82%; margin:14px auto; padding:10px 12px; border-radius:12px; font-size:11px; line-height:1.5; text-align:center; color:#6d7778; background:rgba(255,255,255,.62); }
.typing { display:flex; gap:4px; padding:10px 13px; width:max-content; background:#fff; border-radius:5px 16px 16px 16px; }
.typing i { width:5px; height:5px; border-radius:50%; background:#819091; animation:pulse 1s ease infinite; }
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}

.bottom-panel { position:absolute; z-index:8; left:0; right:0; bottom:0; padding:13px 14px calc(13px + env(safe-area-inset-bottom)); background:linear-gradient(180deg,rgba(245,240,230,.12),rgba(245,240,230,.96) 20%); backdrop-filter:blur(9px); }
.prompt { margin:0 0 9px; text-align:center; font-size:11px; color:#6e7b7d; }
.choice-grid { display:grid; gap:8px; }
.choice { min-height:43px; padding:10px 13px; text-align:left; border:1px solid var(--line); border-radius:13px; background:#fff; color:var(--ink); cursor:pointer; box-shadow:0 5px 15px rgba(35,51,54,.05); }
.choice strong { display:block; font-size:13px; }
.choice small { display:block; margin-top:3px; color:#748184; font-size:10px; line-height:1.4; }
.choice.selected { border-color:var(--amber); background:#fbf6ed; box-shadow:0 0 0 2px rgba(186,141,72,.12); }

.form-card, .panel-card { padding:18px; border:1px solid var(--line); border-radius:20px; background:rgba(255,255,255,.76); box-shadow:0 12px 30px rgba(38,51,53,.08); }
.form-card + .form-card, .panel-card + .panel-card { margin-top:12px; }
.form-label { display:block; margin-bottom:8px; font-size:12px; font-weight:700; }
.fake-input { padding:13px 14px; border-radius:12px; background:#ede8dd; color:#596a6d; font-size:13px; }
.radio-list { display:grid; gap:8px; }
.radio { display:flex; align-items:center; gap:10px; padding:11px; border:1px solid var(--line); border-radius:12px; background:#fff; font-size:12px; }
.radio i { width:16px; height:16px; border:1px solid #839092; border-radius:50%; }
.radio.checked i { box-shadow:inset 0 0 0 4px #fff; background:var(--sea); }

.receipt { padding:18px; border-radius:18px; color:#fff; background:linear-gradient(145deg,#49696d,#29494e); box-shadow:0 14px 30px rgba(41,73,78,.24); }
.receipt-label { font-size:11px; opacity:.7; }
.receipt-amount { margin:7px 0 5px; font-size:38px; font-weight:800; letter-spacing:-.03em; }
.receipt-meta { font-size:11px; opacity:.65; }

.verification { position:relative; overflow:hidden; padding:22px; text-align:center; border-radius:22px; color:#fff; background:linear-gradient(145deg,#49686d,#243f44); }
.verification::before { content:""; position:absolute; left:0; right:0; height:42px; background:linear-gradient(transparent,rgba(255,255,255,.16),transparent); animation:scan 3s linear infinite; }
.id-orb { width:74px; height:74px; margin:2px auto 14px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.4); border-radius:50%; font-size:28px; }
.verification h3 { margin:0 0 6px; }
.verification p { margin:0; font-size:11px; line-height:1.6; opacity:.7; }

.agreement { max-height:230px; overflow:auto; padding:16px; border:1px solid var(--line); border-radius:16px; background:#f8f4eb; font-size:11px; line-height:1.8; color:#586a6d; }
.agreement mark { padding:2px 3px; background:rgba(212,185,140,.35); color:inherit; }

.product-list { display:grid; gap:10px; }
.product { display:grid; grid-template-columns:58px 1fr auto; align-items:center; gap:11px; padding:11px; border:1px solid var(--line); border-radius:15px; background:#fff; }
.product-visual { position:relative; width:58px; height:58px; display:grid; place-items:center; border-radius:13px; background:#e9e1d5; color:#9e7651; font-size:24px; }
.product-visual::after { content:""; position:absolute; inset:8px 17px; border:1px solid rgba(93,76,58,.32); border-radius:6px; }
.product strong { display:block; font-size:13px; }
.product span { display:block; margin-top:4px; font-size:10px; color:#7a8688; }
.product-price { font-size:13px; font-weight:800; }
.total { display:flex; justify-content:space-between; padding:15px 4px 0; font-weight:800; }

.boarding-pass { position:relative; padding:18px; border-radius:18px; background:#fff; box-shadow:0 12px 28px rgba(41,55,57,.09); overflow:hidden; }
.boarding-pass::after { content:""; position:absolute; top:0; bottom:0; right:66px; border-left:1px dashed #c8c0b4; }
.route { display:flex; align-items:center; gap:9px; margin:12px 0; }
.route b { font-size:25px; }
.route i { flex:1; height:1px; background:#899697; position:relative; }
.route i::after { content:"✈"; position:absolute; left:50%; top:-10px; transform:translateX(-50%); color:#6f8588; }
.pass-meta { display:flex; gap:16px; color:#778486; font-size:10px; }

.handoff-visual { position:relative; height:170px; margin-bottom:16px; border-radius:22px; overflow:hidden; background:linear-gradient(145deg,#557276,#294a4f); }
.handoff-visual::before { content:""; position:absolute; width:90px; height:115px; left:44px; bottom:-2px; border-radius:50px 50px 10px 10px; background:rgba(255,255,255,.18); }
.handoff-visual::after { content:""; position:absolute; width:74px; height:54px; right:53px; bottom:16px; border:2px solid rgba(238,224,197,.74); border-radius:8px; transform:rotate(-5deg); }
.handoff-line { position:absolute; width:100px; height:2px; background:rgba(238,224,197,.68); left:135px; bottom:53px; transform:rotate(4deg); transform-origin:left; }

.freeze-screen { padding:72px 28px 40px; color:#e9e5dc; background:#243438; display:flex; flex-direction:column; justify-content:center; }
.freeze-screen::after { content:""; position:absolute; inset:0; pointer-events:none; opacity:.12; background:repeating-linear-gradient(0deg,transparent 0 3px,#fff 4px); }
.freeze-amount { font-size:13px; letter-spacing:.12em; color:#c6b393; }
.freeze-screen h2 { margin:15px 0 28px; font-size:44px; line-height:1.05; }
.reveal-lines { display:grid; gap:9px; }
.reveal-lines p { margin:0; opacity:0; font-size:17px; line-height:1.6; animation:rise .6s ease forwards; }
.reveal-lines p:nth-child(2){animation-delay:.8s}.reveal-lines p:nth-child(3){animation-delay:1.6s}.reveal-lines p:nth-child(4){animation-delay:2.6s;color:#e2b6ae}.reveal-lines p:nth-child(5){animation-delay:3.4s;color:#f0dfc1;font-size:21px}

.truth-screen { padding:64px 20px 34px; background:#e7e3da; }
.truth-head { margin-bottom:18px; }
.truth-head > p { margin:10px 0 0; max-width:320px; color:#5a6b6e; font-size:13px; line-height:1.7; }
.nake-viewport { width:100%; height:126px; margin:10px 0 16px; padding:8px 18px; overflow:hidden; display:flex; align-items:center; justify-content:space-between; gap:16px; border-radius:18px; color:#fff; background:linear-gradient(135deg,#31565b,#17363a); }
.nake-viewport img { width:104px; height:118px; object-fit:contain; flex:0 0 auto; }
.nake-viewport span { max-width:170px; font-size:13px; line-height:1.65; text-align:right; }
.truth-kicker { margin:0 0 6px; font-size:10px; letter-spacing:.16em; color:var(--danger); }
.truth-head h2 { margin:0; font:700 28px/1.22 "STSong","SimSun",serif; }
.truth-intro { padding:14px 16px; border-left:3px solid var(--danger); background:rgba(255,255,255,.58); font-size:13px; line-height:1.7; }

.evidence-stack { display:grid; gap:11px; margin-top:16px; }
.evidence-card { position:relative; padding:16px; border-radius:18px; background:#f8f4eb; border:1px solid var(--line); overflow:hidden; }
.evidence-card::before { content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--danger); }
.evidence-card span { display:block; font-size:10px; letter-spacing:.12em; color:#8b5b56; }
.evidence-card strong { display:block; margin:5px 0 12px; font-size:14px; }
.evidence-card p { margin:0; padding-top:11px; border-top:1px dashed #cfc5b6; font-size:13px; line-height:1.6; color:#536467; }

.chain { display:grid; gap:10px; margin:18px 0; }
.chain-node { display:grid; grid-template-columns:34px 1fr; gap:12px; align-items:center; padding:13px; border-radius:15px; background:#fff; border:1px solid var(--line); }
.chain-node i, .chain-node > span { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; color:#fff; background:var(--sea-deep); font-style:normal; font-weight:800; grid-row:1 / span 2; }
.chain-node strong, .chain-node b { display:block; font-size:13px; }
.chain-node small { display:block; margin-top:3px; color:#788486; line-height:1.45; }
.chain-node.dashed { border-style:dashed; background:rgba(255,255,255,.55); }

.rule-banner { display:flex; align-items:center; gap:14px; margin:16px 0; padding:17px; border-radius:17px; color:#fff; text-align:left; background:linear-gradient(135deg,#8e3c39,#6f2928); }
.rule-banner img { flex:0 0 auto; width:62px; max-height:76px; object-fit:contain; filter:brightness(0) invert(1); }
.rule-banner p { margin:6px 0 0; font-size:12px; line-height:1.55; color:rgba(255,255,255,.78); }
.rule-banner small { display:block; opacity:.68; letter-spacing:.1em; }
.rule-banner strong { display:block; margin-top:7px; font-size:19px; line-height:1.45; }
.keywords { display:flex; flex-wrap:wrap; gap:7px; margin-top:13px; }
.keyword { padding:6px 9px; border-radius:99px; background:rgba(255,255,255,.13); font-size:11px; }

.transfer-card { padding:18px; border-radius:21px; background:#fff; border:1px solid var(--line); }
.transfer-card h3 { margin:0 0 8px; }
.transfer-card p { margin:0 0 14px; color:#5a6b6e; font-size:13px; line-height:1.7; }
.answer-feedback { margin-top:12px; padding:13px; border-radius:13px; background:#ebe5d9; font-size:12px; line-height:1.65; }
.answer-feedback.correct { color:#284d45; background:#dfebe4; }
.answer-feedback.good { color:#284d45; background:#dfebe4; }
.answer-feedback.partial { color:#6e572d; background:#efe6d3; }
.answer-feedback.risk { color:#782e2b; background:#f0dcd8; }

.score-screen { padding:70px 24px 34px; text-align:center; color:#f8f3e8; background:linear-gradient(155deg,#26464b,#152e32); }
.score-ring { width:184px; height:184px; margin:26px auto 20px; display:grid; place-items:center; border-radius:50%; background:conic-gradient(#d5b880 var(--score-angle),rgba(255,255,255,.11) 0); position:relative; }
.score-ring::before { content:""; position:absolute; inset:10px; border-radius:50%; background:#1b383d; }
.score-value { position:relative; z-index:2; }
.score-value strong, .score-value b { display:block; font-size:58px; line-height:1; }
.score-value span { font-size:11px; opacity:.68; }
.score-screen h2 { margin:0 0 9px; font-size:23px; }
.score-screen > p { margin:0 auto; max-width:290px; font-size:13px; line-height:1.7; color:rgba(255,255,255,.7); }
.score-breakdown { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:22px 0; text-align:left; }
.score-chip { padding:11px 12px; border-radius:13px; background:rgba(255,255,255,.08); }
.score-chip span { display:block; font-size:9px; opacity:.58; }
.score-chip strong { display:block; margin-top:3px; font-size:14px; }

.share-card { position:relative; margin:15px 0; padding:20px; overflow:hidden; border-radius:22px; color:var(--ink); text-align:left; background:#f3ecdf; box-shadow:0 18px 40px rgba(0,0,0,.17); }
.share-card::after { content:""; position:absolute; width:120px; height:120px; right:-48px; top:-48px; border:22px solid rgba(164,66,62,.1); border-radius:50%; }
.share-top { display:flex; align-items:center; justify-content:space-between; gap:15px; }
.share-top img { width:76px; height:auto; }
.share-score { font-size:44px; font-weight:900; color:var(--danger); }
.share-score small, .share-score span { display:block; font-size:9px; color:#7a8587; letter-spacing:.12em; }
.share-title { margin:22px 0 6px; font:700 26px/1.2 "STSong","SimSun",serif; }
.share-slogan { margin:0; color:#596b6e; font-size:13px; }
.share-tags { display:flex; gap:6px; margin:14px 0 22px; }
.share-tags span { padding:6px 9px; border:1px solid rgba(164,66,62,.25); border-radius:99px; color:#7d3d39; font-size:10px; }
.share-footer { display:flex; align-items:end; justify-content:space-between; padding-top:14px; border-top:1px solid var(--line); font-size:9px; color:#718083; }
.mini-qr { width:58px; height:58px; padding:3px; border-radius:4px; background:#fff; object-fit:contain; }

.ai-badge {
  position:absolute;
  z-index:50;
  left:13px;
  bottom:12px;
  padding:4px 7px;
  border-radius:7px;
  color:rgba(255,255,255,.8);
  background:rgba(16,35,39,.58);
  backdrop-filter:blur(8px);
  font-size:9px;
  letter-spacing:.08em;
  pointer-events:none;
}

.sheet-backdrop { position:fixed; inset:0; z-index:90; background:rgba(8,20,23,.52); opacity:0; pointer-events:none; transition:.25s; }
.sheet { position:fixed; z-index:100; left:50%; bottom:0; width:min(100%,420px); max-height:76vh; padding:18px 18px 28px; border-radius:26px 26px 0 0; background:#f5f0e6; transform:translate(-50%,105%); transition:.34s cubic-bezier(.2,.8,.2,1); box-shadow:0 -20px 50px rgba(0,0,0,.24); }
.sheet.open { transform:translate(-50%,0); }
.sheet-backdrop.open { opacity:1; pointer-events:auto; }
.sheet-close { position:absolute; right:15px; top:13px; width:32px; height:32px; border:0; border-radius:50%; background:#e4ddcf; color:#4c5d60; cursor:pointer; }
.sheet-tabs { display:flex; gap:5px; padding-right:39px; }
.sheet-tab { padding:8px 10px; border:0; border-radius:10px; background:transparent; color:#6f7c7e; font-size:11px; cursor:pointer; }
.sheet-tab.active { background:#ded6c7; color:var(--ink); font-weight:700; }
.sheet-content { margin-top:16px; max-height:56vh; overflow:auto; font-size:12px; line-height:1.8; color:#526467; }
.sheet-content h3 { color:var(--ink); font-size:17px; margin:0 0 8px; }
.sheet-content strong { color:var(--danger-dark); }
.source-link { color:#6c3b38; text-decoration:underline; text-underline-offset:3px; }

.toast { position:absolute; z-index:70; left:50%; bottom:74px; transform:translateX(-50%); width:max-content; max-width:82%; padding:10px 13px; border-radius:11px; color:#fff; background:rgba(22,42,46,.9); font-size:11px; box-shadow:0 9px 28px rgba(0,0,0,.2); animation:rise .25s ease both; }

@media (max-width: 500px) {
  .experience-shell { padding:0; }
  .phone { width:100vw; height:100dvh; min-height:620px; border-radius:0; border:0; box-shadow:none; }
  .phone-island { border-radius:0 0 16px 16px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; }
}