/* 미션 브리핑 · 입력 장치 카드 (rpg-briefing.js · rpg-devices.js) */
#rpg-app .rpg-game.rpg-game .rpg-modal.place.briefing{width:min(940px,96vw)!important;max-width:940px!important;padding:0!important;overflow:hidden auto!important;position:relative;
 background:radial-gradient(120% 70% at 0% 0%,rgba(217,181,106,.13),transparent 55%),linear-gradient(180deg,#1d2440,#141a30)!important;border:1px solid rgba(217,181,106,.45)!important;border-radius:20px!important;box-shadow:0 30px 80px rgba(0,0,0,.55)!important;color:#f1ead9}
#rpg-app .briefing #place-body{padding:28px 30px 24px}
#rpg-app .briefing .bf-x{position:absolute;top:16px;right:16px;z-index:2}
#rpg-app .briefing h3{margin:0 0 10px;font:800 11px "Outfit","Noto Sans KR",sans-serif;color:#d9b56a;text-transform:uppercase}
#rpg-app .briefing .bf-hero{display:flex;gap:18px;align-items:center;padding-right:40px;margin-bottom:22px}
#rpg-app .briefing .bf-icon{flex:none;display:grid;place-items:center;width:76px;height:76px;border-radius:20px;font-size:40px;background:linear-gradient(145deg,rgba(255,217,121,.28),rgba(255,143,177,.18));box-shadow:inset 0 0 0 1px rgba(255,234,180,.35),0 10px 24px rgba(0,0,0,.3)}
#rpg-app .briefing .bf-hero small{display:block;font:700 11px "Outfit","Noto Sans KR",sans-serif;letter-spacing:.14em;color:#b9a98a}
#rpg-app .briefing .bf-hero h2{margin:4px 0 6px!important;font:700 28px/1.25 "Noto Serif KR",serif!important;color:#fff!important;letter-spacing:-.02em}
#rpg-app .briefing .bf-line{margin:0;padding:8px 14px;border-left:3px solid #d9b56a;background:rgba(255,255,255,.05);border-radius:0 10px 10px 0;font-size:14px;line-height:1.55;color:#e8dfcc;font-style:italic}
#rpg-app .briefing .bf-grid{display:grid;grid-template-columns:1.65fr 1fr;gap:16px;}
#rpg-app .briefing .bf-how,#rpg-app .briefing .bf-side>*{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:16px 18px}
#rpg-app .briefing .bf-how ol{margin:0;padding:0;list-style:none;counter-reset:s;display:grid;}
#rpg-app .briefing .bf-how li{counter-increment:s;position:relative;padding-left:34px;color:#ece4d2;word-break:keep-all}
#rpg-app .briefing .bf-how li::before{content:counter(s);position:absolute;left:0;top:1px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#d9b56a;color:#1d2440;font:900 12px "Outfit",sans-serif}
#rpg-app .briefing .bf-how b{color:#ffd98a}
#rpg-app .briefing kbd{display:inline-grid;place-items:center;min-width:20px;padding:0 5px;height:20px;border-radius:5px;background:#f1ead9;color:#1d2440;font:800 11px "Outfit",sans-serif;box-shadow:0 2px 0 #8d8270;vertical-align:1px}
#rpg-app .briefing .bf-coop{margin:12px 0 0;font-size:13px;color:#c9bfa8}
#rpg-app .briefing .bf-side{display:grid;gap:10px;align-content:start}
#rpg-app .briefing .bf-record{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:flex-end}
#rpg-app .briefing .bf-record h3{flex-basis:100%}
#rpg-app .briefing .bf-record p{margin:0;display:grid}
#rpg-app .briefing .bf-record b{font:800 26px/1 "Outfit",sans-serif;color:#fff}
#rpg-app .briefing .bf-record small{font-size:11px;color:#a99d86}
#rpg-app .briefing .bf-first{color:#a99d86!important;font-size:13px}
#rpg-app .briefing .bf-reward,#rpg-app .briefing .bf-goal{margin:0;font-size:13px;color:#e8dfcc}
#rpg-app .briefing .bf-reward span{display:block;font-size:11px;color:#a99d86}
#rpg-app .briefing .bf-reward b{color:#ffd98a}
#rpg-app .briefing .bf-row{margin-bottom:16px}
#rpg-app .bf-choice{display:grid;grid-template-columns:1fr 1fr;gap:10px}
#rpg-app .bf-choice button{position:relative;display:grid;gap:3px;justify-items:start;text-align:left;padding:13px 16px!important;border-radius:14px!important;border:1px solid rgba(255,255,255,.14)!important;background:rgba(255,255,255,.04)!important;color:#f1ead9!important;cursor:pointer;transition:transform .12s,border-color .12s,background .12s;box-shadow:none!important}
#rpg-app .bf-choice button:hover{transform:translateY(-1px);border-color:rgba(217,181,106,.6)!important}
#rpg-app .bf-choice button b{font:800 15px "Noto Sans KR",sans-serif}
#rpg-app .bf-choice button small{font-size:12px;color:#b9ad95}
#rpg-app .bf-choice button[aria-checked="true"]{border-color:#d9b56a!important;background:linear-gradient(180deg,rgba(217,181,106,.22),rgba(217,181,106,.08))!important;box-shadow:0 0 0 1px #d9b56a,0 8px 20px rgba(0,0,0,.25)!important}
#rpg-app .bf-choice button[aria-checked="true"]::after{content:"✓";position:absolute;top:10px;right:12px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:#d9b56a;color:#1d2440;font:900 12px sans-serif}
#rpg-app .bf-choice button.hot[aria-checked="true"]{border-color:#ff8f6b!important;background:linear-gradient(180deg,rgba(255,120,90,.22),rgba(255,120,90,.07))!important;box-shadow:0 0 0 1px #ff8f6b,0 8px 20px rgba(0,0,0,.25)!important}
#rpg-app .bf-choice.dev button{grid-template-columns:auto 1fr;column-gap:12px;align-items:center}
#rpg-app .bf-choice.dev button span{grid-row:1/3;font-size:28px}
#rpg-app .bf-stars{margin-top:3px;letter-spacing:2px;font-size:13px}
#rpg-app .bf-stars i{font-style:normal;color:rgba(255,255,255,.2)}#rpg-app .bf-stars i.on{color:#ffd166}#rpg-app .bf-stars.x i.on{color:#ff8f6b}
#rpg-app .briefing .bf-foot{display:flex;gap:10px;justify-content:flex-end;align-items:center;padding-top:16px;border-top:1px solid rgba(255,255,255,.08)}
#rpg-app .briefing .bf-go{min-width:240px;padding:14px 26px!important;font:800 16px "Noto Sans KR",sans-serif!important;border-radius:14px!important;display:inline-flex;align-items:center;justify-content:center;gap:10px}
#rpg-app .briefing .bf-go kbd{background:rgba(29,36,64,.18);color:#2a1c05;box-shadow:none}
/* 여행 장면의 입력 장치 카드 */
#rpg-app .device-pick{display:grid;gap:12px;padding:6px 2px}
#rpg-app .device-pick h3{margin:0;font:800 18px "Noto Sans KR",sans-serif;color:#fff}
#rpg-app .device-pick .bf-choice button{padding:20px 18px!important}
#rpg-app .device-pick .device-note{margin:0;font-size:12px;color:#a99d86}
@media (max-width:720px){
 #rpg-app .briefing #place-body{padding:20px 16px 16px}
 #rpg-app .briefing .bf-grid,#rpg-app .bf-choice{grid-template-columns:1fr}
 #rpg-app .briefing .bf-icon{width:56px;height:56px;font-size:30px}
 #rpg-app .briefing .bf-hero h2{font-size:21px!important}
 #rpg-app .briefing .bf-go{flex:1;min-width:0}
}
/* 정리: 기존 모달 헤더 스타일 무효화 · 높이 줄이기 */
#rpg-app .rpg-game.rpg-game .briefing header.bf-hero{display:flex!important;justify-content:flex-start!important;align-items:center!important;padding:0 44px 18px 0!important;margin:0 0 18px!important;border:0!important;border-bottom:1px solid rgba(255,255,255,.08)!important;background:none!important;text-align:left!important}
#rpg-app .rpg-game.rpg-game .briefing header.bf-hero>div{flex:1;min-width:0}
#rpg-app .briefing h3{letter-spacing:.06em}
#rpg-app .briefing .bf-line{display:inline-block}
#rpg-app .briefing .bf-grid{margin-bottom:16px}
#rpg-app .briefing .bf-how{padding:14px 16px}
#rpg-app .briefing .bf-how ol{gap:6px}
#rpg-app .briefing .bf-how li{font-size:13.5px;line-height:1.55}
#rpg-app .briefing .bf-card{display:grid;gap:12px;align-content:start}
#rpg-app .briefing .bf-card h3{margin:0}
#rpg-app .briefing .bf-goal{font-size:14px!important;color:#fff!important;font-weight:700}
#rpg-app .briefing .bf-record{padding-top:10px;border-top:1px dashed rgba(255,255,255,.12)}
#rpg-app .briefing .bf-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:14px 18px}
#rpg-app .briefing .bf-row{margin:0}
#rpg-app .briefing .bf-choice button{padding:10px 14px!important}
#rpg-app .briefing .bf-choice button b{font-size:14px}
#rpg-app .briefing .bf-choice button small{font-size:11.5px}
#rpg-app .bf-choice:not(.dev) button .bf-stars{position:absolute;right:12px;bottom:9px;margin:0}
#rpg-app .bf-choice button[aria-checked="true"] .bf-stars{right:12px}
#rpg-app .briefing .bf-foot{margin-top:16px}

/* ===== 안내(도움말): 탭 + 카드 ===== */
#rpg-app .help2 .h2-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:2px 0 14px;padding:4px;border-radius:12px;background:rgba(255,255,255,.04)}
#rpg-app .help2 .h2-tabs button{flex:1;min-width:84px;padding:9px 10px!important;border-radius:9px!important;border:0!important;background:transparent!important;color:#b9ad95!important;font:800 13px "Noto Sans KR",sans-serif!important;box-shadow:none!important;cursor:pointer}
#rpg-app .help2 .h2-tabs button[aria-selected="true"]{background:linear-gradient(180deg,#ffd979,#e0a93a)!important;color:#2a1c05!important}
#rpg-app .help2 .h2-panel{display:grid;grid-template-columns:1fr 1fr;gap:10px}
#rpg-app .help2 .h2-panel[hidden]{display:none}
#rpg-app .help2 article{display:flex;gap:12px;align-items:flex-start;padding:13px 14px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)}
#rpg-app .help2 article>span{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:rgba(217,181,106,.14);font-size:20px}
#rpg-app .help2 article b{display:block;font:800 14px "Noto Sans KR",sans-serif;color:#fff;margin-bottom:3px}
#rpg-app .help2 article p{margin:0;font-size:12.5px;line-height:1.55;color:#d6ccb8;word-break:keep-all}
#rpg-app .help2 kbd{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 4px;border-radius:4px;background:#f1ead9;color:#1d2440;font:800 10.5px "Outfit",sans-serif;box-shadow:0 2px 0 #8d8270}
#rpg-app .help2 details{margin-top:14px;font-size:12px;color:#a99d86}
@media (max-width:720px){#rpg-app .help2 .h2-panel{grid-template-columns:1fr}}

/* ===== 가챠 코인 카운터 ===== */
#rpg-app .rpg-game.rpg-game .rpg-modal.gc2{width:min(820px,96vw)!important;max-width:820px!important}
#rpg-app .gc2 .gc-lead{margin:0 0 8px;font:600 15px "Noto Serif KR",serif;color:#f1ead9;font-style:italic}
#rpg-app .gc2 .gc-steps{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 16px;padding:0;list-style:none}
#rpg-app .gc2 .gc-steps li{display:flex;align-items:center;gap:6px;padding:5px 11px 5px 5px;border-radius:999px;background:rgba(255,255,255,.05);font-size:12.5px;color:#e8dfcc}
#rpg-app .gc2 .gc-steps b{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#d9b56a;color:#1d2440;font:900 11px "Outfit",sans-serif}
#rpg-app .gc2 .gc-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:14px}
#rpg-app .gc2 .gc-buy,#rpg-app .gc2 .gc-card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px}
#rpg-app .gc2 .gc-buy{padding:16px;display:grid;gap:12px;align-content:start}
#rpg-app .gc2 .gc-wallet{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
#rpg-app .gc2 .gc-wallet p{margin:0;padding:10px 12px;border-radius:10px;background:rgba(0,0,0,.18)}
#rpg-app .gc2 .gc-wallet small{display:block;font-size:11px;color:#a99d86}
#rpg-app .gc2 .gc-wallet b{font:800 22px "Outfit",sans-serif;color:#fff}
#rpg-app .gc2 .gacha-buy{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0}
#rpg-app .gc2 .gacha-buy button{display:grid;padding:10px!important}
#rpg-app .gc2 .gacha-buy small,#rpg-app .gc2 .gc-ten small{font-size:11px;opacity:.8;font-weight:600}
#rpg-app .gc2 .gc-ten{display:grid!important;gap:2px;padding:14px!important;font-size:16px!important;width:100%}
#rpg-app .gc2 .gc-side{display:grid;gap:10px;align-content:start}
#rpg-app .gc2 .gc-card{display:flex;align-items:center;gap:12px;padding:12px 14px}
#rpg-app .gc2 .gc-card>div{flex:1;min-width:0}
#rpg-app .gc2 .gc-card b{display:block;font:800 14px "Noto Sans KR",sans-serif;color:#fff}
#rpg-app .gc2 .gc-card small{font-size:11.5px;color:#b9ad95}
#rpg-app .gc2 .gc-card .lucky-cap{flex:none;width:40px;height:40px}
#rpg-app .gc2 .gc-ic{font-size:26px}
#rpg-app .gc2 .gc-card.lucky.ready{border-color:rgba(255,207,74,.6);box-shadow:0 0 18px rgba(255,207,74,.18)}
#rpg-app .gc2 .gc-card.pity{display:grid;gap:8px}
#rpg-app .gc2 .gc-card.pity>div{display:flex;justify-content:space-between;align-items:baseline}
#rpg-app .gc2 .gc-bar{display:block;height:8px;border-radius:6px;background:rgba(255,255,255,.1);overflow:hidden}
#rpg-app .gc2 .gc-bar u{display:block;height:100%;background:linear-gradient(90deg,#ffd166,#ff9cc4)}
#rpg-app .gc2 .gc-book{width:100%}
#rpg-app .gc2 .gc-rates{margin:14px 0 6px;font-size:12.5px;color:#b9ad95}
#rpg-app .gc2 .gc-rates summary{cursor:pointer}
@media (max-width:720px){#rpg-app .gc2 .gc-grid{grid-template-columns:1fr}}

/* ===== 가방 ===== */
#rpg-app .rpg-modal .stats.stat-cards{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin:10px 0 4px}
#rpg-app .rpg-modal .stats.stat-cards dt{grid-row:1;font-size:10.5px;color:#a99d86;text-align:center}
#rpg-app .rpg-modal .stats.stat-cards dd{grid-row:2;margin:0;font:800 17px "Outfit",sans-serif;color:#fff;text-align:center;padding-bottom:6px}
#rpg-app .rpg-modal .stats.stat-cards{background:rgba(255,255,255,.04);border-radius:12px;padding:8px 6px 2px}
#rpg-app .rpg-modal .bag-h{margin:14px 0 8px;font:800 13px "Noto Sans KR",sans-serif;color:#d9b56a}
#rpg-app .rpg-modal .bag-collections{display:grid;gap:8px;margin:0 0 12px}
#rpg-app .rpg-modal .bag-collections>p{font-size:12px;line-height:1.7;margin:0;color:#c8bdab}
#rpg-app .rpg-modal .bag-collections details{border:1px solid #d9b56a40;border-radius:8px;padding:8px 10px}
#rpg-app .rpg-modal .bag-collections summary{cursor:pointer;font-weight:700;min-height:28px;line-height:28px}
#rpg-app .rpg-modal .bag-collections details>div{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px;max-height:208px;overflow:auto;padding:6px 0}
#rpg-app .rpg-modal .bag-collections button{display:grid;grid-template-columns:32px 1fr;gap:3px 8px;align-items:center;min-height:60px;padding:8px!important;text-align:left;border:1px solid #cbb59640;border-radius:6px;background:#ffffff08;color:#f4e7d2}
#rpg-app .rpg-modal .bag-collections button>span,#rpg-app .rpg-modal .bag-collections button>img{grid-row:1/3;font-size:25px;width:32px;height:42px;object-fit:contain}
#rpg-app .rpg-modal .bag-collections button>b{font-size:12px;line-height:1.5}
#rpg-app .rpg-modal .bag-collections button>small{font-size:11px;color:#cabb9d}
#rpg-app .rpg-modal .bag-h small{color:#a99d86;font-weight:600;margin-left:4px}
#rpg-app .rpg-modal .grid.bag-grid{display:grid!important;grid-template-columns:repeat(6,1fr)!important;gap:8px!important}
#rpg-app .rpg-modal .grid.bag-grid .cell{position:relative;display:grid;justify-items:center;align-content:center;gap:4px;width:auto!important;height:auto!important;min-height:84px;padding:8px 4px!important}
#rpg-app .rpg-modal .cell .cell-name{display:block;max-width:100%;font-size:10.5px;line-height:1.25;color:#d6ccb8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#rpg-app .rpg-modal .cell.empty-slot{border:1px dashed rgba(255,255,255,.1)!important;background:transparent!important;border-radius:12px;min-height:84px}
@media (max-width:600px){#rpg-app .rpg-modal .grid.bag-grid{grid-template-columns:repeat(4,1fr)!important}#rpg-app .rpg-modal .stats.stat-cards{grid-template-columns:repeat(3,1fr)}#rpg-app .rpg-modal .stats.stat-cards dt,#rpg-app .rpg-modal .stats.stat-cards dd{grid-row:auto}}

/* ===== 설정: 알약형 선택 · 토글 스위치 ===== */
#rpg-app .view-pref{display:flex!important;gap:4px!important;padding:4px;border-radius:12px;background:rgba(255,255,255,.05)}
#rpg-app .view-pref label{flex:1;display:flex!important;justify-content:center;padding:9px 10px!important;border-radius:9px!important;border:0!important;background:transparent!important;color:#b9ad95!important;font:700 13px "Noto Sans KR",sans-serif;cursor:pointer}
#rpg-app .view-pref input{position:absolute;opacity:0;pointer-events:none}
#rpg-app .view-pref label:has(input:checked){background:linear-gradient(180deg,#ffd979,#e0a93a)!important;color:#2a1c05!important}
#rpg-app .set-row input[type=checkbox]{appearance:none;-webkit-appearance:none;width:44px;height:24px;border-radius:999px;background:rgba(255,255,255,.18);position:relative;cursor:pointer;transition:background .15s;flex:none;margin:0}
#rpg-app .set-row input[type=checkbox]::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .15s}
#rpg-app .set-row input[type=checkbox]:checked{background:#e0a93a}
#rpg-app .set-row input[type=checkbox]:checked::after{transform:translateX(20px)}
/* 가방 폭 · 넘침 보정, 설정 선택 강조 우선순위 */
#rpg-app .rpg-game.rpg-game .rpg-modal:has(.bag-grid){width:min(700px,96vw)!important;max-width:700px!important;overflow-x:hidden!important}
#rpg-app .rpg-game.rpg-game .rpg-modal:has(.bag-grid) .gear{display:grid!important;grid-template-columns:1fr 1fr;gap:10px;min-width:0}
#rpg-app .rpg-game.rpg-game .rpg-modal:has(.bag-grid) .gear>*{min-width:0}
#rpg-app .rpg-game.rpg-game .rpg-modal:has(.bag-grid) .stats.stat-cards{grid-column:1/-1}
#rpg-app .rpg-game.rpg-game .rpg-modal .grid.bag-grid{grid-template-columns:repeat(auto-fill,minmax(88px,1fr))!important}
#rpg-app .rpg-game.rpg-game .rpg-modal .grid.bag-grid .cell{min-width:0}
#rpg-app .rpg-game.rpg-game .rpg-modal .view-pref label:has(input:checked){background:linear-gradient(180deg,#ffd979,#e0a93a)!important;color:#2a1c05!important}
#rpg-app .rpg-game.rpg-game .rpg-modal .view-pref label{background:transparent!important;color:#b9ad95!important;border:0!important;box-shadow:none!important}
@media (max-width:720px){
 #rpg-app .rpg-game.rpg-game .rpg-modal.place.briefing{width:calc(100vw - 16px)!important;max-width:calc(100vw - 16px)!important;overflow-x:hidden!important;box-sizing:border-box}
 #rpg-app .briefing #place-body,#rpg-app .briefing .bf-grid,#rpg-app .briefing .bf-grid>*{min-width:0;box-sizing:border-box}
 #rpg-app .briefing .bf-opts{grid-template-columns:1fr}
 #rpg-app .rpg-game.rpg-game .briefing header.bf-hero{padding-right:0!important;padding-top:34px!important;flex-wrap:wrap;gap:12px}
 #rpg-app .briefing .bf-hero small{font-size:10px}
 #rpg-app .briefing .bf-x{top:10px;right:10px}
}

/* ===== 핀볼 HUD ===== */
#rpg-app .pin-hud{position:absolute;left:50%;bottom:96px;transform:translateX(-50%);z-index:8;display:grid;gap:8px;justify-items:center;min-width:360px;padding:12px 18px;border-radius:16px;background:rgba(24,18,46,.88);border:1px solid rgba(255,143,196,.45);box-shadow:0 14px 34px rgba(0,0,0,.4);color:#fff;font-family:"Noto Sans KR",sans-serif;pointer-events:auto}
#rpg-app .pin-hud[hidden]{display:none}
#rpg-app .pin-hud .ph-top{display:flex;gap:14px;align-items:baseline}
#rpg-app .pin-hud .ph-top b{font:900 26px "Outfit",sans-serif;color:#fff3a6;letter-spacing:.02em}
#rpg-app .pin-hud .ph-top span{font-size:13px;color:#ffd0e6}
#rpg-app .pin-hud em{font-style:normal;padding:2px 8px;border-radius:999px;font:800 11px "Noto Sans KR",sans-serif}
#rpg-app .pin-hud em.save{background:#3fb6d6;color:#08202a}#rpg-app .pin-hud em.jp{background:#ffd166;color:#3a2600;animation:gh-mash .2s infinite alternate}
#rpg-app .pin-hud .ph-plunger{position:relative;width:280px;height:14px;border-radius:8px;background:rgba(255,255,255,.12);overflow:hidden}
#rpg-app .pin-hud .ph-plunger i{position:absolute;inset:0 auto 0 0;width:var(--p);background:linear-gradient(90deg,#8fe3b0,#ffd166 70%,#ff6f91)}
#rpg-app .pin-hud .ph-plunger u{position:absolute;top:0;bottom:0;background:rgba(127,224,255,.45);border-left:2px solid #9ff0ff;border-right:2px solid #9ff0ff;z-index:1}
#rpg-app .pin-hud .ph-plunger i{z-index:0;opacity:.95}
#rpg-app .pin-hud .ph-msg{margin:0;font-size:13.5px;font-weight:700}
#rpg-app .pin-hud .ph-keys{margin:0;font-size:11.5px;color:#cbbfe0}
#rpg-app .pin-hud kbd{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;margin:0 2px;border-radius:5px;background:#fff;color:#2a1d4f;font:800 11px "Outfit",sans-serif;box-shadow:0 2px 0 #9b8fb6}
#rpg-app .pin-hud .ph-touch{display:none}
@media (pointer:coarse){#rpg-app .pin-hud .ph-touch{display:grid;grid-template-columns:1fr .8fr 1fr;gap:8px;width:100%}#rpg-app .pin-hud .ph-touch button{padding:16px 8px;border-radius:14px;border:2px solid #fff;background:linear-gradient(180deg,#ff9cc4,#ff6f91);color:#fff;font:900 15px "Jua",sans-serif;touch-action:none}#rpg-app .pin-hud .ph-keys{display:none}}
@media (max-width:640px){#rpg-app .pin-hud{min-width:0;width:calc(100vw - 24px);bottom:70px}#rpg-app .pin-hud .ph-plunger{width:100%}}
/* 핀볼 중: 판을 가리는 HUD 숨기고 정보창은 왼쪽 가운데로 */
#rpg-app .rpg-game.pinball-on :is(.rpg-hotbar,.rpg-chat,.live-hud,.keys-hint,#log,.rpg-log,#tracker){opacity:0!important;pointer-events:none!important;transition:opacity .2s}
#rpg-app .rpg-game .pin-hud{left:18px;top:50%;bottom:auto;transform:translateY(-50%);min-width:0;width:260px;justify-items:stretch}
#rpg-app .rpg-game .pin-hud .ph-top{flex-wrap:wrap;gap:6px 10px}
#rpg-app .rpg-game .pin-hud .ph-top b{flex-basis:100%;font-size:30px}
#rpg-app .rpg-game .pin-hud .ph-plunger{width:100%}
#rpg-app .rpg-game .pin-hud .ph-keys{line-height:2}
@media (max-width:640px),(pointer:coarse){#rpg-app .rpg-game .pin-hud{left:50%;top:auto;bottom:12px;transform:translateX(-50%);width:calc(100vw - 24px)}#rpg-app .rpg-game .pin-hud .ph-top b{flex-basis:auto;font-size:22px}}
/* 지역 제목: 단어 중간·가운뎃점 뒤에서 어색하게 줄바꿈하지 않게 */
#rpg-app .rpg-game.rpg-game .rpg-zone{white-space:nowrap!important;word-break:keep-all!important;max-width:min(560px,60vw);overflow:hidden;text-overflow:ellipsis}
#rpg-app .rpg-game.pinball-on .rpg-minimap{opacity:0!important;pointer-events:none!important}

/* ===== 말랑 야시장 ===== */
#rpg-app .rpg-game.rpg-game .rpg-modal.market{width:min(780px,96vw)!important;max-width:780px!important}
#rpg-app .market .mk-lead{margin:0 0 14px;font-size:14px;color:#e8dfcc}#rpg-app .market .mk-lead b{color:#ffd98a}
#rpg-app .market .mk-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
#rpg-app .market article{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1)}
#rpg-app .market article.play{border-color:rgba(255,143,177,.45);background:linear-gradient(135deg,rgba(255,143,177,.12),rgba(255,255,255,.03))}
#rpg-app .market article.closed{opacity:.6}
#rpg-app .market .mk-ic{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:12px;background:rgba(255,217,138,.14);font-size:26px}
#rpg-app .market article>div{flex:1;min-width:0}#rpg-app .market article b{display:block;font:800 15px "Noto Sans KR",sans-serif;color:#fff}
#rpg-app .market article small{display:block;font-size:12px;color:#c9bfa8}#rpg-app .market article em{display:block;margin-top:3px;font-style:normal;font-size:11.5px;color:#ffd98a}
#rpg-app .market .mk-status{min-height:1em;margin:12px 0 0;font-size:13px;color:#8fe3b0}
#rpg-app .market .mk-how{margin:0 0 10px;font-size:13.5px;color:#e8dfcc}#rpg-app .market .mk-how b{color:#ffd98a}
#rpg-app .market .mk-how kbd{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:5px;background:#f1ead9;color:#1d2440;font:800 11px "Outfit",sans-serif}
#rpg-app .market .mk-stage{position:relative}#rpg-app .market canvas{display:block;width:100%;height:auto;border-radius:14px;touch-action:none;cursor:crosshair}
#rpg-app .market .mk-result{position:absolute;inset:auto 16px 16px 16px;display:grid;gap:6px;justify-items:center;padding:16px;border-radius:14px;background:rgba(20,16,38,.92);border:1px solid rgba(255,217,138,.5);text-align:center}
#rpg-app .market .mk-result[hidden]{display:none}#rpg-app .market .mk-result b{font:800 18px "Noto Sans KR",sans-serif;color:#fff}#rpg-app .market .mk-result small{color:#ffd98a}
#rpg-app .market .mk-result div{display:flex;gap:8px}
@media (max-width:640px){#rpg-app .market .mk-grid{grid-template-columns:1fr}}
#rpg-app .village-map .map-places .warp{margin-left:6px;padding:3px 9px;border-radius:999px;background:linear-gradient(180deg,#ffd979,#e0a93a);color:#2a1c05;font:800 11px "Noto Sans KR",sans-serif;cursor:pointer;white-space:nowrap}
#rpg-app .warp-veil{position:absolute;inset:0;z-index:40;background:#fff;pointer-events:none;animation:warp-veil .9s ease forwards}
@keyframes warp-veil{0%{opacity:0}30%{opacity:1}100%{opacity:0}}
/* 짚라인 HUD: 진행 막대 위 착지 구간(노랑 = 좋음, 초록 = 완벽) */
#rpg-app .zip-hud .zip-bar{position:relative;height:14px;border-radius:8px;background:rgba(255,255,255,.12);overflow:hidden}
#rpg-app .zip-hud .zip-bar i{position:absolute;top:0;bottom:0}#rpg-app .zip-hud .zip-bar i.good{background:rgba(255,209,102,.55)}#rpg-app .zip-hud .zip-bar i.perfect{background:#8fe3b0}
#rpg-app .zip-hud .zip-bar u{position:absolute;top:-2px;bottom:-2px;width:4px;margin-left:-2px;background:#fff;box-shadow:0 0 8px #fff}
#rpg-app .rpg-game:has(#zip-hud:not([hidden])) :is(.rpg-hotbar,.keys-hint){opacity:0!important;pointer-events:none!important}
/* 머리 그림(sheet-v4 brief-*): 오른쪽 위에 깔고 왼쪽 · 아래로 남색 창에 녹인다. 그림이 있으면 이모지 아이콘은 숨긴다. */
#rpg-app .briefing .bf-art{position:absolute;top:0;right:0;width:68%;height:236px;pointer-events:none;background:var(--art) center 42%/cover no-repeat;
 -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 46%),linear-gradient(180deg,#000 52%,transparent);-webkit-mask-composite:source-in;
 mask-image:linear-gradient(90deg,transparent 0,#000 46%),linear-gradient(180deg,#000 52%,transparent);mask-composite:intersect;opacity:.92}
#rpg-app .briefing.with-art #place-body{position:relative}
#rpg-app .rpg-game.rpg-game .briefing.with-art header.bf-hero{min-height:150px;align-items:flex-end!important}
#rpg-app .briefing.with-art .bf-icon{display:none}
#rpg-app .briefing.with-art .bf-hero h2,#rpg-app .briefing.with-art .bf-hero small{text-shadow:0 2px 14px rgba(10,14,30,.85)}
#rpg-app .briefing.with-art .bf-line{background:rgba(16,20,38,.62);backdrop-filter:blur(4px)}
@media (max-width:640px){#rpg-app .briefing .bf-art{width:100%;height:190px;opacity:.55}#rpg-app .rpg-game.rpg-game .briefing.with-art header.bf-hero{min-height:120px}}
