/* 10-02 老闆「煞車王子守護新人，要有一個螢幕特效」：LV10 前保護期，畫面四周金色護盾光＋頂部徽章；結算時護盾展開一次 */
body[data-prince-guard="on"]::after {
  content: ""; position: fixed; inset: 0; z-index: 2147483000; pointer-events: none;
  box-shadow: inset 0 0 18px 4px rgba(255, 200, 60, .55), inset 0 0 50px 10px rgba(255, 170, 30, .18);
  border-radius: 0; animation: prince-guard-pulse 3.2s ease-in-out infinite;
}
@keyframes prince-guard-pulse { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }
.hud-debt { color: #ff9a8a; font-size: 10px; font-weight: 700; }
body[data-prince-guard="on"] .hud-debt { color: #ffd76a; text-shadow: 0 0 6px rgba(255, 190, 40, .9); }
.prince-guard-burst {
  position: fixed; inset: 0; z-index: 2147483001; display: grid; place-items: center; pointer-events: none;
  background: radial-gradient(circle at 50% 50%, rgba(255, 215, 90, .45), rgba(255, 170, 30, 0) 60%);
  animation: prince-guard-fade 2.4s ease-out forwards;
}
.prince-guard-burst div { display: grid; justify-items: center; gap: 6px; animation: prince-guard-pop 2.4s ease-out forwards; }
.prince-guard-burst i { font-style: normal; font-size: 84px; filter: drop-shadow(0 0 22px #ffcc33); }
.prince-guard-burst b { padding: 6px 14px; border-radius: 12px; background: rgba(40, 24, 0, .82); color: #ffe48a; font-size: 16px; text-align: center; max-width: 86vw; }
@keyframes prince-guard-fade { 0% { opacity: 0; } 12% { opacity: 1; } 75% { opacity: 1; } 100% { opacity: 0; } }
@keyframes prince-guard-pop { 0% { transform: scale(.3); } 18% { transform: scale(1.12); } 30% { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) {
  body[data-prince-guard="on"]::after, .prince-guard-burst, .prince-guard-burst div { animation: none; }
  .prince-guard-burst { animation: prince-guard-fade 2.4s step-end forwards; }
}
/* 煞車王子開場故事 */
.prince-story{position:fixed;inset:0;z-index:131;display:grid;grid-template-rows:1fr auto;justify-items:center;padding:max(56px,env(safe-area-inset-top)) 16px max(20px,env(safe-area-inset-bottom));background:radial-gradient(circle at 50% 38%,#ffcf5a55,#0000 55%),linear-gradient(#2a2d33,#0b0f16);color:#fff;transition:opacity .35s;cursor:pointer}
.prince-story.is-leaving{opacity:0}
.prince-story-hero{align-self:end;max-height:min(58vh,520px);width:auto;filter:drop-shadow(0 0 24px #ffcc4488);animation:prince-story-in .6s ease-out}
.prince-story-skip{position:absolute;top:max(12px,env(safe-area-inset-top));right:16px;min-height:40px;padding:0 16px;border:1px solid #ffffff66;border-radius:999px;background:#000a;color:#fff;font-weight:800}
.prince-story-box{width:min(100%,520px);margin-top:10px;padding:12px 14px 10px;border:2px solid #d9ab3f;border-radius:14px;background:#0d1520ee;box-shadow:0 8px 30px #000a}
.prince-story-box b{display:flex;gap:8px;align-items:baseline;color:#ffd76a;font-size:16px}
.prince-story-box b small{color:#e9c97a;font-size:12px;font-weight:600}
.prince-story-box p{min-height:4.8em;margin:6px 0;font-size:15px;line-height:1.6}
.prince-story{grid-template-rows:minmax(0,1fr) auto;overflow:auto;cursor:default}
.prince-story-hero{max-width:100%;max-height:100%;min-height:0;object-fit:contain}
.prince-story-box{max-height:55dvh;display:flex;flex-direction:column;min-height:0}
.prince-story-box p{min-height:0;overflow:auto;overscroll-behavior:contain}
.prince-story-box b{flex-wrap:wrap;flex-shrink:0}
.prince-story-controls{display:flex;justify-content:space-between;gap:12px;flex-shrink:0}
.prince-story-controls button{min-height:44px;padding:8px 14px;border:1px solid #d9ab3f;border-radius:10px;background:#272a30;color:#ffd76a;font:inherit;cursor:pointer}
.prince-story-controls button:disabled{opacity:.45;cursor:default}
.prince-story-next{margin-left:auto;font-weight:800!important}
.prince-story-music{position:absolute;top:max(10px,env(safe-area-inset-top));left:16px;min-width:44px;min-height:44px;border:1px solid #d9ab3f;border-radius:50%;background:#0d1520;color:#ffd76a;font-size:24px;cursor:pointer}
.prince-story.has-story-scene .prince-story-hero{height:100%;width:100%;align-self:center;object-fit:contain;filter:none;border-radius:12px;animation:none}
/* 10-16 v619 老闆：Mac／電腦開場故事要照螢幕比例自動調整——
   插圖吃掉文字卡以外的全部高度（object-fit:contain 照 16:9 自縮，寬螢幕以高度為準、窄螢幕以寬度為準，
   超寬螢幕用 170dvh 擋住不過度放大）；文字卡寬度與字級用 clamp 隨視窗連續縮放，不用固定斷點值。 */
@media(min-width:900px){
.prince-story{padding-top:max(24px,env(safe-area-inset-top));gap:clamp(8px,1.5vh,16px)}
.prince-story.has-story-scene .prince-story-hero{max-height:none;max-width:min(100%,170dvh)}
.prince-story-hero{max-height:min(72vh,78dvh)}
.prince-story-box{width:min(100%,clamp(560px,62vw,940px));padding:clamp(12px,1.8vh,18px) clamp(14px,1.8vw,24px) clamp(10px,1.4vh,16px)}
.prince-story-box p{font-size:clamp(15px,1.25vw,18px)}
.prince-story-box b{font-size:clamp(16px,1.35vw,19px)}
}
@media(max-height:550px){.prince-story{padding-top:56px;gap:4px}.prince-story-box{max-height:65dvh;margin-top:0}.prince-story-box p{font-size:14px}}
@keyframes prince-story-in{from{opacity:0;transform:translateY(20px)}}
@media (prefers-reduced-motion: reduce){.prince-story-hero{animation:none}}
/* 10-02 老闆：頂端品牌改成上 T.SGD、下「車界玩家」兩行 */
.brand.brand-stack{display:flex;flex-direction:column;align-items:flex-start;gap:0;line-height:1}
.brand-stack b{font:italic 900 13px/1 "Saira Condensed",sans-serif;letter-spacing:.06em;color:#e8e2d2}
.brand-stack span{font:900 22px/1.05 "Noto Serif TC","Noto Sans TC",serif;letter-spacing:.08em;color:#f3eee2;text-shadow:0 2px 3px #000a}
