/* ═══════════════════════════════════════════════════════════
   theatre.css · 湘西六幕剧场 / 路线规划 / 高级视觉
   可能行动 · 湘西情绪文旅地图
   ═══════════════════════════════════════════════════════════ */

/* ── 舞台标识 ─────────────────────────────────────────── */
.stage-plaque{position:absolute;top:76px;left:50%;transform:translateX(-50%);z-index:3;text-align:center;pointer-events:none;animation:plaqueIn .9s .3s both}
.stage-plaque .plaque-mark{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1px solid rgba(222,183,107,.6);color:#eacb8c;font-size:13px;margin-bottom:6px;box-shadow:0 0 18px rgba(234,203,140,.25),inset 0 0 8px rgba(234,203,140,.15);animation:plaqueTwinkle 3.2s ease-in-out infinite}
.stage-plaque .plaque-title{margin:0;font:700 15px/1.4 "Noto Serif SC","Songti SC",serif;color:#efd9a6;letter-spacing:.34em;text-shadow:0 2px 14px rgba(0,0,0,.65)}
.stage-plaque .plaque-sub{margin:5px 0 0;font-size:9px;letter-spacing:.2em;color:#b9c6bd;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.stage-acts{position:absolute;top:126px;left:50%;transform:translateX(-50%);z-index:3;display:flex;gap:5px;padding:6px;background:rgba(4,20,22,.5);border:1px solid rgba(219,187,125,.28);border-radius:40px;backdrop-filter:blur(10px)}
.stage-acts button{display:flex;align-items:center;gap:5px;border:0;background:transparent;color:#9fb0a6;font-size:9px;letter-spacing:.08em;padding:5px 9px;border-radius:30px;cursor:pointer;transition:.25s;white-space:nowrap}
.stage-acts button i{font-style:normal;font:700 8px "Noto Sans SC";color:#7f9388}
.stage-acts button b{font:600 9px "Noto Sans SC"}
.stage-acts button span{font-size:8px;color:#74887e}
.stage-acts button:hover{color:#e8d3a4;background:rgba(232,211,164,.08)}
.stage-acts button.active{background:linear-gradient(135deg,#c8a25a,#e3c47b);color:#12291f;box-shadow:0 2px 12px rgba(227,196,123,.35)}
.stage-acts button.active i,.stage-acts button.active span{color:#1c3328}

/* 舞台聚光氛围 */
.map-stage::after{content:"";position:absolute;left:8%;right:8%;top:-34%;height:80%;z-index:1;pointer-events:none;background:radial-gradient(60% 55% at 50% 0%,rgba(244,201,109,.13),transparent 70%);animation:spotSway 11s ease-in-out infinite}

@keyframes plaqueIn{from{opacity:0;transform:translateX(-50%) translateY(-12px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
@keyframes plaqueTwinkle{0%,100%{box-shadow:0 0 12px rgba(234,203,140,.2)}50%{box-shadow:0 0 26px rgba(234,203,140,.5)}}
@keyframes spotSway{0%,100%{transform:translateX(-3%)}50%{transform:translateX(3%)}}

/* ── 足迹台账（已到访） ───────────────────────────────── */
.journey-ledger{position:absolute;left:3.2%;top:150px;z-index:6;display:flex;flex-direction:column;gap:3px;padding:13px 15px;background:rgba(4,20,22,.66);border:1px solid rgba(219,187,125,.3);border-radius:4px;backdrop-filter:blur(12px);box-shadow:0 10px 28px rgba(0,0,0,.28)}
.journey-ledger>span{font:600 11px "Noto Serif SC",serif;color:#e8cf9c;letter-spacing:.14em}
.journey-ledger>b{font:700 16px "Noto Sans SC";color:#f4e5c7;font-variant-numeric:tabular-nums}
.journey-ledger>small{font-size:8px;color:#8ea39a;letter-spacing:.1em}

/* 金线足迹 */
.journey-history{position:absolute;inset:0;width:100%;height:100%;z-index:6;pointer-events:none;overflow:visible}
.journey-history path{fill:none;stroke:rgba(242,200,110,.55);stroke-width:1.6;stroke-linecap:round;stroke-dasharray:3 5;filter:drop-shadow(0 0 6px rgba(245,185,75,.35))}

/* 到访点亮 */
.map-pin.has-arrived i{background:linear-gradient(135deg,#e3c47b,#c8a25a);color:#15291f;box-shadow:0 0 0 3px rgba(227,196,123,.25),0 0 18px rgba(242,200,110,.65)}
.map-pin.has-arrived::after{content:"✓ 已到访";position:absolute;left:50%;bottom:-20px;transform:translateX(-50%);font-size:8px;letter-spacing:.12em;color:#e8cf9c;background:rgba(4,20,22,.78);border:1px solid rgba(227,196,123,.45);padding:2px 7px;border-radius:20px;white-space:nowrap}
.map-pin.has-arrived .pin-pulse{animation:arrivedPulse 2s ease-out infinite}
@keyframes arrivedPulse{0%{box-shadow:0 0 0 0 rgba(242,200,110,.55)}70%{box-shadow:0 0 0 16px rgba(242,200,110,0)}100%{box-shadow:0 0 0 0 rgba(242,200,110,0)}}

/* 到达光环 */
.arrival-aura{position:absolute;left:0;top:0;width:0;height:0;pointer-events:none}
.arrival-aura i{position:absolute;left:0;top:0;width:130px;height:130px;border-radius:50%;border:1.5px solid rgba(242,200,110,.8);opacity:0;transform:translate(-50%,-50%) scale(.25);box-shadow:0 0 24px rgba(245,185,75,.35),inset 0 0 18px rgba(245,185,75,.2)}
.arrival-aura span{position:absolute;left:0;top:0;font-size:46px;color:#ffd67e;text-shadow:0 0 22px #ffb830;transform:translate(-50%,-50%) scale(.25);opacity:0}

/* 移动粒子拖尾 */
.trail-dot{position:absolute;width:7px;height:7px;border-radius:50%;background:radial-gradient(circle,#ffe9b0,#f2b94b);box-shadow:0 0 10px rgba(245,185,75,.85);pointer-events:none;z-index:1;opacity:0}

/* ── 剧场章节（地点弹窗内） ─────────────────────────── */
#theatreChapter{margin:0 0 70px;padding:44px 8% 40px;background:linear-gradient(160deg,#173531 0%,#0d2628 58%,#122a28 100%);color:#efe1c4;position:relative;overflow:hidden}
#theatreChapter::before{content:"";position:absolute;left:-6%;top:-60%;width:42%;height:220%;background:radial-gradient(closest-side,rgba(234,203,140,.14),transparent);transform:rotate(18deg);pointer-events:none}
#theatreChapter>header{position:relative;z-index:1;max-width:760px}
#theatreChapter>header .eyebrow{font-size:9px;color:#c9a86a;letter-spacing:.3em;margin-bottom:14px}
#theatreChapter>header h3{font:700 clamp(24px,3vw,34px)/1.35 "Noto Serif SC",serif;margin:0 0 12px;letter-spacing:.05em}
#theatreChapter>header>p{font:500 14px/1.9 "Noto Serif SC",serif;color:#cdd8c6;margin:0;max-width:640px}
.act-strip{display:flex;gap:6px;margin:26px 0 34px;overflow-x:auto;padding-bottom:8px;scrollbar-width:none}
.act-strip::-webkit-scrollbar{display:none}
.act-strip button{flex-shrink:0;display:flex;flex-direction:column;gap:3px;padding:11px 15px;background:rgba(255,255,255,.045);border:1px solid rgba(222,191,122,.22);color:#b9c9b6;font-size:11px;cursor:pointer;border-radius:3px;transition:.25s;min-width:0}
.act-strip button small{font-size:8px;letter-spacing:.18em;color:#8ea393}
.act-strip button:hover{background:rgba(234,203,140,.12);color:#f0dcae}
.act-strip button[aria-current="step"]{background:linear-gradient(135deg,#c8a25a,#e3c47b);color:#142a1f;border-color:transparent;box-shadow:0 4px 18px rgba(227,196,123,.3)}
.act-strip button[aria-current="step"] small{color:#37503f}
.chapter-scenes{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;position:relative;z-index:1}
.chapter-scenes article{background:rgba(255,255,255,.045);border:1px solid rgba(222,191,122,.16);padding:24px 22px;border-top:2px solid #c8a25a;transition:.3s}
.chapter-scenes article:hover{transform:translateY(-3px);background:rgba(255,255,255,.07)}
.chapter-scenes article>span{font:700 10px "Noto Sans SC";color:#c8a25a;letter-spacing:.2em}
.chapter-scenes h4{font:700 16px "Noto Serif SC",serif;margin:10px 0 12px;color:#f2e2bb}
.chapter-scenes p{font-size:12px;line-height:1.95;color:#c3cfbd;margin:0}
.chapter-guide{margin-top:26px;padding:22px 26px;border-left:3px solid #a04432;background:rgba(255,255,255,.04)}
.chapter-guide h4{font:700 13px "Noto Serif SC",serif;color:#e8c98a;margin:0 0 9px;letter-spacing:.06em}
.chapter-guide p{font-size:11.5px;line-height:2;color:#aebdab;margin:0}
.fiction-note{font-size:9px;color:#7f9589;margin:26px 0 0;letter-spacing:.06em}

/* ── 长介绍 ─────────────────────────────────────────── */
.deep-story{margin:26px 0 4px;padding:22px 26px;background:#f2ead8;border-left:3px solid #a04432;position:relative}
.deep-story::before{content:"长读 · 慢慢逛";position:absolute;top:-10px;left:26px;background:#a04432;color:#f7e9c9;font-size:8px;letter-spacing:.22em;padding:3px 10px}
.deep-story p{margin:0 0 14px;font:400 13.5px/2.05 "Noto Serif SC",serif;color:#3f5248}
.deep-story p:last-child{margin:0}

/* ── 故事衔接点 ─────────────────────────────────────── */
.story-anchor{margin:34px 8% 0;padding:20px 26px 20px 30px;background:linear-gradient(120deg,#f3e3b8,#ecd29a);border:1px solid #cfa967;border-left:5px solid #a04432;color:#33453a;position:relative;box-shadow:0 8px 26px rgba(90,60,20,.14);animation:anchorIn .6s both}
.story-anchor .anchor-kicker{display:inline-block;font:700 10px "Noto Sans SC";letter-spacing:.24em;color:#8c2f22;margin-bottom:8px;background:#fff6dd;border:1px solid #d8b470;padding:3px 10px;border-radius:2px}
.story-anchor p{margin:0;font:500 13.5px/2 "Noto Serif SC",serif;color:#3b4a3e}
@keyframes anchorIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* ── 路线规划面板 ───────────────────────────────────── */
.route-open body{overflow:hidden}
.route-panel{position:fixed;top:0;right:0;bottom:0;width:min(430px,94vw);z-index:130;background:rgba(5,22,24,.97);border-left:1px solid rgba(219,187,125,.4);color:#efe1c4;display:flex;flex-direction:column;transform:translateX(102%);transition:transform .38s cubic-bezier(.22,.8,.24,1);box-shadow:-18px 0 50px rgba(0,0,0,.45);backdrop-filter:blur(18px)}
.route-panel.active{transform:translateX(0)}
.route-panel-head{display:flex;align-items:center;justify-content:space-between;padding:26px 26px 20px;border-bottom:1px solid rgba(222,191,122,.2)}
.route-panel-head .eyebrow{font-size:8px;letter-spacing:.3em;color:#c9a86a;margin-bottom:8px}
.route-panel-head h3{font:700 26px "Noto Serif SC",serif;margin:0}
.route-panel-close{width:42px;height:42px;border-radius:50%;border:1px solid rgba(222,191,122,.4);background:transparent;color:#e8d3a4;font-size:24px;cursor:pointer;transition:.2s;flex-shrink:0}
.route-panel-close:hover{background:rgba(234,203,140,.14)}
.route-panel-body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:22px 26px 40px;display:flex;flex-direction:column;gap:28px}
.route-sec h4{font:700 13px "Noto Sans SC";color:#e8cf9c;margin:0 0 12px;letter-spacing:.1em;display:flex;align-items:baseline;gap:10px}
.route-sec h4 small{font:400 9px "Noto Sans SC";color:#7f9388;letter-spacing:.04em}
.route-sec.grow{flex:1}

.transport-picker{display:grid;gap:10px}
.transport-card{display:flex;align-items:center;gap:14px;text-align:left;padding:10px 14px 10px 10px;background:rgba(255,255,255,.045);border:1px solid rgba(222,191,122,.18);border-radius:4px;color:#d9e2cf;cursor:pointer;transition:.25s;position:relative}
.transport-card:hover{background:rgba(234,203,140,.09)}
.transport-card.selected{border-color:#e3c47b;background:linear-gradient(120deg,rgba(234,203,140,.16),rgba(234,203,140,.05));box-shadow:0 0 0 1px rgba(227,196,123,.35),0 6px 20px rgba(0,0,0,.3)}
.transport-photo{width:74px;height:50px;border-radius:3px;background-size:cover;background-position:center;flex-shrink:0;border:1px solid rgba(255,255,255,.12)}
.transport-copy{display:flex;flex-direction:column;gap:2px;min-width:0}
.transport-copy b{font:700 14px "Noto Serif SC",serif;color:#f2e2bb}
.transport-copy small{font-size:9px;color:#c9a86a;letter-spacing:.08em}
.transport-copy em{font-style:normal;font-size:9px;color:#7f9388}
.transport-check{position:absolute;right:14px;top:50%;transform:translateY(-50%) scale(0);width:22px;height:22px;border-radius:50%;background:#e3c47b;color:#15291f;display:grid;place-items:center;font-size:12px;transition:.25s}
.transport-card.selected .transport-check{transform:translateY(-50%) scale(1)}

.place-chips{display:flex;flex-wrap:wrap;gap:7px}
.place-chip{display:flex;align-items:center;gap:6px;padding:7px 12px 7px 8px;background:rgba(255,255,255,.05);border:1px solid rgba(222,191,122,.2);border-radius:30px;color:#cdd8c6;font-size:11px;cursor:pointer;transition:.22s}
.place-chip i{font-style:normal;font:700 9px "Noto Sans SC";color:#c8a25a}
.place-chip b{font-weight:500}
.place-chip span{font-size:8px;color:#7f9388}
.place-chip:hover{background:rgba(234,203,140,.1)}
.place-chip.chosen{background:linear-gradient(135deg,#c8a25a,#e3c47b);border-color:transparent;color:#142a1f;box-shadow:0 3px 12px rgba(227,196,123,.3)}
.place-chip.chosen i,.place-chip.chosen span{color:#37503f}

.route-preview{display:flex;flex-wrap:wrap;align-items:center;gap:7px;min-height:46px;margin-top:14px;padding:10px;background:rgba(0,0,0,.22);border:1px dashed rgba(222,191,122,.32);border-radius:4px}
.route-empty{font-size:10px;color:#7f9388;letter-spacing:.05em}
.preview-stop{display:flex;align-items:center;gap:6px;padding:6px 8px 6px 6px;background:#12302b;border:1px solid rgba(234,203,140,.35);border-radius:3px;font-size:11px;color:#f0dcae;animation:stopIn .28s both}
.preview-stop em{font-style:normal;font:700 9px "Noto Sans SC";color:#c8a25a}
.preview-stop i{cursor:pointer;font-style:normal;color:#a75a44;padding:0 2px;font-size:13px;line-height:1}
.preview-stop i:hover{color:#ffd9a0}
.preview-arrive{font-size:10px;color:#e8cf9c;letter-spacing:.12em}
@keyframes stopIn{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:none}}

.route-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:14px}
.mini-btn,.gold-btn{border:1px solid;padding:11px 18px;font-size:11px;letter-spacing:.08em;cursor:pointer;transition:.22s;min-height:40px}
.mini-btn{background:transparent;border-color:rgba(222,191,122,.4);color:#cdd8c6}
.mini-btn:hover{background:rgba(234,203,140,.1)}
.gold-btn{background:linear-gradient(135deg,#c8a25a,#e3c47b);border-color:transparent;color:#142a1f;font-weight:600;box-shadow:0 4px 16px rgba(227,196,123,.28)}
.gold-btn:hover{filter:brightness(1.07);box-shadow:0 6px 22px rgba(227,196,123,.4)}
.gold-btn:disabled{filter:grayscale(.6) brightness(.8);cursor:not-allowed;box-shadow:none}

.routes-list{display:grid;gap:13px}
.route-card{background:rgba(255,255,255,.05);border:1px solid rgba(222,191,122,.2);border-radius:5px;padding:14px;transition:.25s}
.route-card.done{border-color:rgba(125,190,130,.35);background:rgba(125,190,130,.06)}
.route-card-head{display:flex;gap:12px;align-items:center}
.route-ticket{width:66px;height:46px;border-radius:3px;background-size:cover;background-position:center;flex-shrink:0;border:1px solid rgba(255,255,255,.14)}
.route-card-title{flex:1;min-width:0}
.route-card-title small{display:block;font-size:8.5px;color:#c9a86a;letter-spacing:.12em;margin-bottom:4px}
.route-card-title h3{font:700 15px "Noto Serif SC",serif;margin:0;color:#f2e2bb}
.route-delete{background:none;border:0;color:#7f9388;font-size:18px;cursor:pointer;padding:2px 6px;flex-shrink:0}
.route-delete:hover{color:#ffd9a0}
.route-card-stops{display:flex;flex-wrap:wrap;align-items:center;gap:5px;margin:13px 0;font-size:10px}
.route-card-stops span{display:flex;align-items:center;gap:4px;background:rgba(255,255,255,.06);border:1px solid rgba(222,191,122,.18);padding:4px 8px;border-radius:20px;color:#cdd8c6}
.route-card-stops span i{font-style:normal;font:700 8px "Noto Sans SC";color:#c8a25a}
.route-card-stops b{color:#c9a86a;font-weight:400}
.route-card-actions{display:flex;justify-content:flex-end;gap:8px}
.route-card-actions .mini-btn,.route-card-actions .gold-btn{padding:8px 14px;min-height:34px;font-size:10px}

/* ── 车票网格（票根造型） ───────────────────────────── */
.ticket-grid .offer-card{position:relative;border:1px solid #d3c4a4}
.ticket-grid .offer-card::before,.ticket-grid .offer-card::after{content:"";position:absolute;left:50%;width:26px;height:26px;border-radius:50%;background:var(--shop-paper,#f3ecde);transform:translateX(-50%);z-index:2}
.ticket-grid .offer-card::before{top:-13px}
.ticket-grid .offer-card::after{bottom:-13px}
.ticket-grid .offer-card:hover{box-shadow:0 14px 34px rgba(57,45,20,.16)}
.ticket-grid .offer-photo{border-bottom:1px dashed #cfbe98}

/* ── 高级细节 ───────────────────────────────────────── */
.offer-card{border-color:#dcd0b8}
.offer-card:hover{border-color:#b99b5e}
.offer-price strong{background:linear-gradient(120deg,#a04432,#c25a3d);-webkit-background-clip:text;background-clip:text;color:transparent}
.catalog-intro::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 32%,rgba(255,255,255,.09) 48%,transparent 60%);transform:translateX(-100%);animation:introShine 6.5s ease-in-out infinite;pointer-events:none}
@keyframes introShine{22%{transform:translateX(100%)}100%{transform:translateX(100%)}}
.solid-action{background:linear-gradient(135deg,#1a4136,#24513f)}
.solid-action:hover{background:linear-gradient(135deg,#24513f,#2f624c)}
.receipt-paper{position:relative}
.receipt-paper::after{content:"可能行动 · 湘西";position:absolute;right:18px;bottom:14px;font-size:8px;letter-spacing:.24em;color:rgba(160,68,50,.16);transform:rotate(-8deg)}

/* ── 响应式 ─────────────────────────────────────────── */
@media(max-width:1000px){
  .stage-acts{max-width:92vw;overflow-x:auto;justify-content:flex-start;scrollbar-width:none}
  .stage-acts::-webkit-scrollbar{display:none}
  .chapter-scenes{grid-template-columns:1fr}
  .journey-ledger{top:auto;bottom:118px;left:3.2%}
}
@media(max-width:600px){
  .stage-plaque{top:64px}
  .stage-plaque .plaque-title{font-size:12px;letter-spacing:.22em}
  .stage-acts{top:110px}
  .journey-ledger{bottom:96px;left:3%;padding:9px 12px}
  .journey-ledger>span{font-size:9px}
  .journey-ledger>b{font-size:13px}
  .map-pin.has-arrived::after{font-size:7px;bottom:-18px}
  #theatreChapter{padding:34px 5% 30px;margin-bottom:45px}
  .chapter-scenes article{padding:20px 16px}
  .deep-story{padding:20px 16px 18px;margin:20px 0 0}
  .story-anchor{margin:22px 5% 0;padding:16px 16px 16px 20px}
  .route-panel{width:100vw}
  .route-panel-body{padding:18px 20px 30px}
}
@media(prefers-reduced-motion:reduce){
  .stage-plaque,.stage-plaque .plaque-mark,.map-stage::after,.map-pin.has-arrived .pin-pulse,.catalog-intro::after{animation:none!important}
}
