/* 장소별 선택 메뉴: 각 미니게임 콘셉트에 맞춘 테마(편의점 진열대, 유튜브 댓글창, 버스 승차권, 프리쿠라 스티커, 댄스 교실).
   rpg-dialog.css 다음에 불러 공통 창 위에 덮어쓴다. */
.rpg-game .rpg-modal.shop, .rpg-game .rpg-modal.sell, .rpg-game .rpg-modal.quest, .rpg-game .rpg-modal.gate, .rpg-game .rpg-modal.smith, .rpg-game .rpg-modal.emotes { width: min(640px, 94vw); padding: 0; overflow: hidden; gap: 0; border: 0; }
.rpg-game .rpg-modal.shop > *:not(header), .rpg-game .rpg-modal.quest > *:not(header), .rpg-game .rpg-modal.gate > *:not(header), .rpg-game .rpg-modal.smith > *:not(header), .rpg-game .rpg-modal.emotes > *:not(header), .rpg-game .rpg-modal.sell > *:not(header) { margin-left: 22px; margin-right: 22px; }
.rpg-game .rpg-modal.shop > :last-child, .rpg-game .rpg-modal.quest > :last-child, .rpg-game .rpg-modal.gate > :last-child, .rpg-game .rpg-modal.smith > :last-child, .rpg-game .rpg-modal.emotes > :last-child { margin-bottom: 20px; }
.rpg-game .rpg-modal.shop header, .rpg-game .rpg-modal.quest header, .rpg-game .rpg-modal.gate header, .rpg-game .rpg-modal.smith header, .rpg-game .rpg-modal.emotes header, .rpg-game .rpg-modal.sell header { padding: 18px 22px 16px; margin: 0 0 14px; border: 0; align-items: center; }
.rpg-game .rpg-modal .npc-line { margin-top: 0; margin-bottom: 12px; }

/* ---- 밤 편의점: 민트 간판 + 진열대 + 계산대 LED ---- */
.rpg-game .rpg-modal.shop header, .rpg-game .rpg-modal.sell header { background: rgba(47, 159, 145, 0.7); backdrop-filter: blur(12px); color: #fff; border-bottom: 4px solid #ffd166; border-radius: 20px; padding: 18px 22px; }
.rpg-game .rpg-modal.shop .store-sign small { color: #d9fff8; letter-spacing: .2em; font-size: 10px; } .rpg-game .rpg-modal.shop .store-sign h2, .rpg-game .rpg-modal.sell h2 { color: #fff; font: 900 28px/1.1 "Jua", "Black Han Sans", sans-serif; letter-spacing: 1px; text-shadow: 2px 2px 0 rgba(0,0,0,0.2); }
.rpg-game .rpg-modal.shop .x, .rpg-game .rpg-modal.sell .x { background: #ffffff33; color: #fff; }
.rpg-game .rpg-modal.shop .mini-banner { margin-bottom: 14px; }
.shelf { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px; padding: 16px; border-radius: 24px; background: rgba(255, 255, 255, 0.35); border: 2px solid rgba(255, 255, 255, 0.6); box-shadow: inset 0 4px 10px rgba(0,0,0,0.05); max-height: 46vh; overflow: auto; }
.shelf .product { position: relative; display: grid; justify-items: center; gap: 4px; padding: 16px 12px 12px; border-radius: 20px; background: rgba(255, 255, 255, 0.95); border: 3px solid #e0e7e6; box-shadow: 0 6px 0 #e0e7e6, 0 8px 18px rgba(0,0,0,0.05); text-align: center; transition: all 0.1s; }
.shelf .product:hover { transform: translateY(-4px); box-shadow: 0 10px 0 #e0e7e6, 0 12px 24px rgba(0,0,0,0.1); }
.shelf .p-icon { font-size: 38px; line-height: 1.1; filter: drop-shadow(0 4px 4px #0001); } .shelf .p-have { position: absolute; top: 8px; right: 10px; font: 700 11px var(--font, sans-serif); color: #2f9f91; font-style: normal; }
.shelf b { font-size: 14px; color: #263d43; } .shelf small { font-size: 11px; color: #6a7c81; min-height: 2.4em; line-height: 1.3; }
.shelf .p-tag { display: inline-flex; align-items: baseline; gap: 3px; padding: 3px 12px; border-radius: 6px 14px 14px 6px; background: #ffd166; color: #5a3b00; clip-path: polygon(8px 0, 100% 0, 100% 100%, 8px 100%, 0 50%); padding-left: 16px; }
.shelf .p-tag strong { font: 900 15px var(--font, sans-serif); } .shelf .p-tag span { font-size: 10px; }
.shelf .p-pos { display: flex; gap: 6px; margin-top: 4px; } .shelf .p-pos button { padding: 8px 16px; border: 3px solid #263d43; border-radius: 12px; background: #FFD166; color: #263d43; font: 800 14px "Jua", sans-serif; cursor: pointer; box-shadow: 0 4px 0 #263d43; transition: all 0.1s; }
.shelf .p-pos button:active { transform: translateY(4px); box-shadow: 0 0 0 #263d43; } .shelf .p-pos button:disabled { background: #b9c6c8; box-shadow: none; cursor: default; }
.rpg-game .rpg-modal .pos-bar { display: flex; justify-content: space-between; align-items: center; margin-top: 14px; padding: 10px 12px; }
.pos-led { font: 700 20px "Courier New", monospace; color: #7dffb0; text-shadow: 0 0 8px #3dff8a88; letter-spacing: .05em; }

/* ---- 댓글 게시판: 영상 댓글창 ---- */
.rpg-game .rpg-modal.quest header { background: rgba(255, 255, 255, 0.5); border-bottom: 2px solid rgba(0,0,0,0.05); border-radius: 20px; padding: 16px; }
.feed-head { display: flex; gap: 12px; align-items: center; } .feed-head .yt-dot { display: grid; place-items: center; width: 42px; height: 30px; border-radius: 9px; background: #ff3b3b; color: #fff; font-size: 14px; }
.feed-head small { color: #8a8a8a; font-size: 11px; } .rpg-game .rpg-modal.quest h2 { font-size: 22px; font-family: "Jua", sans-serif; }
.comment-feed { list-style: none; padding: 0; margin: 0; display: grid; gap: 4px; max-height: 50vh; overflow: auto; }
.comment-feed li { display: grid; grid-template-columns: 44px 1fr; gap: 12px; padding: 14px; border-radius: 20px; background: rgba(255, 255, 255, 0.85); border: 2px solid rgba(255,255,255,0.9); box-shadow: 0 4px 12px rgba(0,0,0,0.04); margin-bottom: 4px; }
.comment-feed li.current { background: #fff7e0; box-shadow: inset 0 0 0 2px #ffd166; } .comment-feed li.later { opacity: .5; } .comment-feed li.done { opacity: .78; }
.comment-feed .avatar { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--a); color: #fff; font: 900 16px var(--font, sans-serif); text-shadow: 0 1px 2px #0003; }
.comment-feed small { font-size: 11px; color: #8a8a8a; } .comment-feed .pin { font-style: normal; color: #b07c00; font-weight: 700; margin-left: 4px; }
.comment-feed b { display: block; font-size: 14px; color: #222; margin: 1px 0; } .comment-feed .c-body p { margin: 0; font-size: 12px; color: #555; line-height: 1.5; }
.comment-feed .c-reward { margin-top: 6px !important; padding: 6px 10px; border-radius: 10px; background: #fff; color: #7a5400 !important; font-weight: 700; }
.comment-feed .c-meta { display: block; margin-top: 4px; font-size: 11px; color: #999; } .comment-feed .c-meta i { color: #2f9f91; font-style: normal; }
.rpg-game .rpg-modal.quest footer { margin-top: 12px; display: flex; justify-content: flex-end; }

/* ---- 마을버스 정류장: 승차권 ---- */
.rpg-game .rpg-modal.gate header { background: rgba(79, 127, 176, 0.7); backdrop-filter: blur(12px); color: #fff; border-bottom: 4px solid #ffd166; border-radius: 20px; } .rpg-game .rpg-modal.gate h2 { color: #fff; } .rpg-game .rpg-modal.gate .x { background: #ffffff33; color: #fff; }
.rpg-game .rpg-modal.gate .bus-arrival { margin: 0 22px 10px; padding: 8px 12px; border-radius: 10px; background: #1b2a3a; color: #ffcf4a; font: 700 13px "Courier New", monospace; }
.tickets { display: grid; gap: 10px; max-height: 50vh; overflow: auto; padding: 2px; }
.bus-ticket { display: grid; grid-template-columns: 64px 1fr 92px; border-radius: 20px; background: rgba(255, 253, 246, 0.95); border: 3px solid #e7dcc6; box-shadow: 0 6px 0 #e7dcc6, 0 8px 18px rgba(79, 127, 176, 0.1); overflow: hidden; margin-bottom: 6px; }
.bus-ticket .t-stub { display: grid; place-items: center; align-content: center; gap: 2px; background: var(--line); color: #fff; border-right: 2px dashed #fffdf6; } .bus-ticket .t-stub small { font-size: 10px; opacity: .85; } .bus-ticket .t-stub b { font-size: 24px; }
.bus-ticket .t-main { padding: 10px 12px; } .bus-ticket .t-main small { font-size: 10px; color: #8a8a8a; } .bus-ticket .t-main b { display: block; font-size: 15px; color: #1f3b57; } .bus-ticket .t-main p { margin: 2px 0 0; font-size: 11px; color: #6a7c81; line-height: 1.4; }
.bus-ticket .t-fare { display: grid; justify-items: center; align-content: center; gap: 2px; padding: 8px; border-left: 2px dashed #e7dcc6; } .bus-ticket .t-fare strong { font: 900 17px var(--font, sans-serif); color: #1f3b57; } .bus-ticket .t-fare small { font-size: 10px; color: #8a8a8a; }
.bus-ticket .t-fare button { padding: 5px 12px; border: 0; border-radius: 9px; background: var(--line); color: #fff; font: 700 12px var(--font, sans-serif); cursor: pointer; } .bus-ticket.locked { filter: grayscale(.8); opacity: .65; } .bus-ticket .t-fare button:disabled { cursor: default; }

/* ---- 프리쿠라 부스: 스티커 시트 ---- */
.rpg-game .rpg-modal.smith { background: radial-gradient(circle at 10% 10%, #ffe1ee 0 8%, transparent 9%), radial-gradient(circle at 90% 30%, #e1f3ff 0 7%, transparent 8%), #fff8fb; }
.rpg-game .rpg-modal.smith header { background: linear-gradient(90deg, rgba(255,143,177,0.75), rgba(200,182,255,0.75)); backdrop-filter: blur(12px); border-radius: 20px; } .rpg-game .rpg-modal.smith h2 { color: #fff; font-family: "Jua", sans-serif; font-size: 24px; } .rpg-game .rpg-modal.smith .x { background: #ffffff44; color: #fff; }
.rpg-game .rpg-modal.smith .smith-row { margin-bottom: 12px; padding: 16px; border-radius: 24px; background: rgba(255, 255, 255, 0.65); border: 3px dashed #ffb3c6; box-shadow: inset 0 4px 10px rgba(255,179,198,0.1); }
.rpg-game .rpg-modal.smith .grid > * { border-radius: 50% !important; }

/* ---- 동작 상점: 댄스 교실 ---- */
.rpg-game .rpg-modal.emotes header { background: linear-gradient(120deg, rgba(61,43,74,0.75), rgba(107,79,168,0.75)); backdrop-filter: blur(12px); color: #fff; border-radius: 20px; } .rpg-game .rpg-modal.emotes h2 { color: #fff; } .rpg-game .rpg-modal.emotes header small { color: #ffd166; } .rpg-game .rpg-modal.emotes .x { background: #ffffff33; color: #fff; }
.emote-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 10px; max-height: 48vh; overflow: auto; }
.emote-grid article { display: grid; justify-items: center; gap: 4px; padding: 16px 8px 12px; border-radius: 20px; background: rgba(246, 242, 255, 0.85); border: 2px solid rgba(255,255,255,0.9); text-align: center; } .emote-grid article.owned { background: rgba(255,255,255,0.95); border: 3px solid #c8b6ff; box-shadow: 0 4px 0 #c8b6ff; }
.emote-grid .em-icon { font-size: 34px; } .emote-grid b { font-size: 13px; } .emote-grid small { font-size: 11px; color: #7a6a8a; } .emote-grid .rpg-btn { padding: 5px 12px; font-size: 12px; }
.emote-wallet { display: flex; gap: 10px; align-items: center; font-weight: 700; color: #3d2b4a; } .emote-wallet span { font-weight: 400; color: #d0456b; font-size: 12px; }

/* ---- 동작 바(X) ---- */
.emote-bar { position: absolute; left: 50%; bottom: 112px; transform: translateX(-50%); z-index: 8; width: min(560px, 94vw); padding: 14px 16px; border-radius: 28px; background: rgba(255, 253, 249, 0.65); border: 2px solid rgba(255,255,255,0.8); box-shadow: 0 12px 40px rgba(29, 26, 34, 0.15); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.emote-bar[hidden] { display: none; } .emote-bar header { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 6px; } .emote-bar header b { font-size: 13px; color: #3d2b4a; } .emote-bar header small { font-size: 11px; color: #8a7c88; }
.emote-bar > div { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 6px; }
.emote-bar [data-em] { display: grid; justify-items: center; gap: 1px; padding: 6px 2px; border: 0; border-radius: 12px; background: #f4eefc; cursor: pointer; } .emote-bar [data-em] span { font-size: 22px; } .emote-bar [data-em] small { font-size: 10px; color: #5a4a66; }
.emote-bar [data-em]:hover { background: #e8ddff; } .emote-bar [data-em].locked { opacity: .5; } .emote-shop-link { margin-top: 8px; border: 0; background: none; color: #6b4fa8; font: 700 12px var(--font, sans-serif); cursor: pointer; }

/* ---- 지금 할 일: 작고 차분한 알약 모양(눌렀을 때만 자세히) ---- */
.rpg-game .rpg-tracker.now-tracker { display: flex; align-items: center; gap: 8px; width: auto; max-width: min(260px, 42vw); padding: 8px 16px 8px 10px; border-radius: 999px; background: rgba(255, 253, 249, 0.6); border: 2px solid rgba(255,255,255,0.8); box-shadow: 0 6px 20px rgba(29, 26, 34, 0.1); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); margin-left: auto; }
.rpg-game .rpg-tracker.now-tracker::before { content: "📍"; display: grid; place-items: center; width: 24px; height: 24px; flex: none; border-radius: 50%; font-size: 12px; }
.rpg-game .rpg-tracker.now-tracker small { display: none; } .rpg-game .rpg-tracker.now-tracker b { font-size: 12px; font-weight: 700; color: #3b3640; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rpg-game .rpg-tracker.now-tracker p { display: none; } .rpg-game .rpg-tracker.now-tracker:hover p, .rpg-game .rpg-tracker.now-tracker:focus-visible p { display: block; position: absolute; top: 100%; right: 0; margin-top: 6px; padding: 8px 10px; width: 220px; border-radius: 12px; background: #fffdf9; box-shadow: 0 8px 20px #1d1a2222; font-size: 11px; white-space: normal; }
.rpg-game .rpg-tracker.now-tracker { position: relative; } .rpg-game .rpg-tracker.now-tracker.pulse { animation: tracker-pop .5s ease-out; } @keyframes tracker-pop { 40% { transform: scale(1.06); } }

/* ---- 마을 대화(혼자 모드) · 채팅: 작고 투명하게 ---- */
.rpg-game .rpg-chat.local { width: min(320px, 58vw); padding: 12px; border-radius: 24px; background: rgba(255, 253, 249, 0.55); border: 2px solid rgba(255,255,255,0.7); box-shadow: 0 8px 24px rgba(29, 26, 34, 0.1); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.rpg-game .rpg-chat.local header { display: flex; justify-content: space-between; align-items: center; } .rpg-game .rpg-chat.local header b { font-size: 12px; color: #3b3640; } .rpg-game .rpg-chat.local header small { font-weight: 400; color: #8a8090; font-size: 10px; margin-left: 4px; }
.rpg-game .rpg-chat.local #chat-hide { border: 0; background: none; color: #8a8090; font-size: 16px; cursor: pointer; }
.rpg-game .rpg-chat.local .chat-lines { max-height: 92px; font-size: 12px; } .rpg-game .rpg-chat.local .chat-lines:empty { display: none; }
.rpg-game .rpg-chat.local input { border-radius: 999px; border: 1px solid #e7e0e8; background: #fff; font-size: 12px; } .rpg-game .rpg-chat.local button[type="submit"] { border: 0; border-radius: 999px; padding: 6px 12px; background: #3b3640; color: #fff; font: 700 12px var(--font, sans-serif); cursor: pointer; }
.rpg-game .chat-open { position: absolute; left: 12px; bottom: 100px; z-index: 4; width: 40px; height: 40px; border: 0; border-radius: 50%; background: rgba(255, 253, 249, .85); box-shadow: 0 4px 14px #1d1a2222; font-size: 18px; cursor: pointer; }
.rpg-game .chat-open[hidden] { display: none; }
@media (max-width: 640px) { .rpg-game .rpg-chat.local { width: calc(100% - 24px); } .bus-ticket { grid-template-columns: 52px 1fr 80px; } .shelf { grid-template-columns: repeat(2, 1fr); } }
.tickets { grid-auto-rows: max-content; flex: 1 1 auto; min-height: 0; } .bus-ticket { min-height: 78px; flex: none; }
.comment-feed, .shelf, .emote-grid { flex: 1 1 auto; min-height: 0; } .shelf { grid-auto-rows: max-content; }
.rpg-game .rpg-modal.shop .mini-banner { width: auto; box-sizing: border-box; }
.rpg-game .rpg-modal.smith .mini-banner, .rpg-game .rpg-modal.shop .mini-banner { width: auto !important; max-width: calc(100% - 44px); box-sizing: border-box; margin-bottom: 12px; }
.helper-tabs .st-busy { opacity: .55; } .helper-tabs .st-offer em { font-style: normal; } .errand-studio.one .errand-dispatch { gap: 8px; }
/* 특별 말랑이 레이스 */
.rpg-game .rpg-modal.encounter { width: min(980px, 96vw); }
.race-game { display: grid; gap: 8px; } .race-game canvas { width: 100%; aspect-ratio: 16 / 9; border-radius: 14px; background: #8ecbf3; box-shadow: 0 0 0 4px #1d1a22; touch-action: none; }
.race-pads { display: flex; gap: 6px; justify-content: center; } .race-pads button { min-width: 56px; padding: 8px 12px; border: 3px solid #1d1a22; border-radius: 12px; background: var(--c, #fff); color: #1d1a22; font: 900 16px var(--font, sans-serif); box-shadow: 0 4px 0 #1d1a22; cursor: pointer; }
.race-pads button.down, .race-pads button:active { transform: translateY(3px); box-shadow: 0 1px 0 #1d1a22; }
.race-tip { margin: 0; font-size: 12px; color: #6a7c81; }
.race-result { display: grid; place-items: center; width: 96px; height: 96px; margin: 8px auto; border-radius: 50%; background: #ddd; box-shadow: inset 0 -6px 0 #0002; } .race-result b { font: 900 34px var(--font, sans-serif); color: #1d1a22; }
.race-result.r1 { background: linear-gradient(#ffe08a, #f2b705); } .race-result.r2 { background: linear-gradient(#f1f3f5, #b8c0c8); } .race-result.r3 { background: linear-gradient(#f7c9a0, #c98a4b); }
.errand-mode { display: inline-flex; gap: 4px; padding: 4px; margin: 0 0 6px; border-radius: 999px; background: #eef3f1; }
.errand-mode button { border: 0; border-radius: 999px; padding: 7px 14px; background: transparent; font: 700 13px var(--font, sans-serif); color: #4d6266; cursor: pointer; }
.errand-mode button[aria-selected="true"] { background: #fff; color: #263d43; box-shadow: 0 2px 8px #263d4322; } .errand-mode small { font-size: 10px; color: #a27648; margin-left: 2px; }
.live-reserve { position: absolute; right: 14px; top: 150px; z-index: 9; width: min(300px, 80vw); padding: 12px 14px; border-radius: 16px; background: linear-gradient(160deg, #2a1747, #6b2d63); color: #fff; box-shadow: 0 10px 28px #0005; animation: tracker-pop .5s; }
.live-reserve[hidden] { display: none; } .live-reserve b { color: #ffd166; font-size: 13px; } .live-reserve p { margin: 4px 0 8px; font-size: 12px; } .live-reserve div { display: flex; gap: 6px; } .live-reserve .rpg-btn { padding: 6px 10px; font-size: 12px; }
.live-reserve-pick { display: flex; flex-wrap: wrap; gap: 10px; margin: 8px 0; padding: 10px 12px; border: 1px solid #e3d9f0; border-radius: 12px; } .live-reserve-pick legend { font-size: 12px; font-weight: 700; color: #6b4fa8; padding: 0 4px; } .live-reserve-pick label { font-size: 13px; }

/* 캐릭터 모습(인형 공방) */
.rpg-modal.looks{width:min(720px,94vw)}
.looks-tabs{display:flex;gap:8px;margin:4px 0 12px}
.looks-tabs button{flex:1;border:0;border-radius:999px;padding:9px 12px;font:800 13px inherit;font-family:inherit;cursor:pointer;background:rgba(255,255,255,.55);color:inherit}
.looks-tabs button[aria-selected=true]{background:linear-gradient(180deg,#ff9cc4,#ff6fa6);color:#fff}
.looks-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.look-card{display:grid;justify-items:center;gap:2px;padding:10px 8px 12px;border:2px solid transparent;border-radius:20px;background:rgba(255,255,255,.6);cursor:pointer;font-family:inherit;color:inherit}
.look-card img{width:110px;height:120px;object-fit:contain}
.look-card b{font-size:14px}.look-card small{font-size:11px;opacity:.75;text-align:center;line-height:1.35}
.look-card.on{border-color:#ff7fb0;box-shadow:0 0 0 4px rgba(255,127,176,.18)}
.look-card:hover{transform:translateY(-2px)}
.creation-styles{padding:12px;border:1px solid var(--paper-edge);border-radius:18px;background:rgba(255,255,255,.35)}
.creation-styles h3{margin:0 0 10px;font-size:16px}
.creation-styles .looks-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.creation-styles .look-card{padding:7px 3px;min-width:0;border-radius:12px}
.creation-styles .look-card img{width:72px;max-width:100%;height:80px}
.creation-styles .look-card b{font-size:12px}.creation-styles .look-card small{font-size:10px}
.partner-styles summary{cursor:pointer;padding:10px 0;font-weight:700}

/* Character creation: stable studio, separate settings, always visible action. */
.char-select{grid-template-columns:minmax(0,1fr) min(410px,40vw);grid-template-rows:auto minmax(0,1fr);overflow:hidden;gap:18px 24px;background:radial-gradient(ellipse at 80% 10%,#f8f2e4,transparent 55%),linear-gradient(145deg,#e9f1ed,#f4efe2);color:#263c37}
.char-select>header{gap:4px}
.char-select h1{font-size:30px;color:#25493d;line-height:1.2}
.creation-eyebrow{font-size:10px;letter-spacing:.14em;color:#60756b;font-weight:800}
.char-select .rpg-back{width:fit-content;padding:0;font-size:12px;margin-bottom:4px}
.char-select .char-grid{min-height:0;overflow-y:auto;align-content:start;padding:5px 6px 14px 4px;scrollbar-width:thin;gap:12px}
.char-select .char-card{rotate:0deg;border-radius:14px;box-shadow:0 3px 12px #304c3510;border:1px solid #dbe2d9;padding:8px;transition:transform .16s,border-color .16s}
.char-select .char-card[aria-selected=true]{transform:none;border-color:var(--c);box-shadow:0 0 0 2px var(--c),0 5px 20px #304c3517}
.char-select .char-card .rpg-doll{border-radius:9px;background:radial-gradient(ellipse at 50% 30%,#faf7ee,#e8dfc9);object-fit:contain}
.char-select .char-card b{margin-top:6px}
.char-select .char-detail{position:static;align-self:stretch;min-height:0;max-height:none;overflow:hidden;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;gap:0;padding:0;border:1px solid #d1dbd2;border-radius:22px;background:#fcfbf6;box-shadow:0 12px 32px #2b44371a}
.creation-profile{display:grid;grid-template-columns:142px minmax(0,1fr);gap:16px;padding:16px 18px;align-items:center;background:radial-gradient(ellipse at 25% 20%,#fffdf4,#ebf1e9)}
.creation-profile .char-preview{height:142px;background:transparent;border-radius:14px}
.creation-identity{min-width:0}
.creation-identity h2{font-size:30px;line-height:1.1;margin:8px 0 4px}
.creation-identity p{margin:0;color:#617268;font-size:13px}
.creation-role{font-size:10px;font-weight:800;color:var(--character-accent,#2f5948);background:#ffffffbd;border:1px solid #d7dfd5;border-radius:6px;padding:4px 7px}
.creation-level{display:block;font-size:11px;color:#718278;margin-top:10px;letter-spacing:.03em}
.creation-tabs{display:grid;grid-template-columns:repeat(3,1fr);padding:0 16px;border-top:1px solid #dce3d9;border-bottom:1px solid #dce3d9;background:#f4f6f0}
.creation-tabs button{font:inherit;font-size:13px;font-weight:800;color:#78857b;background:none;border:0;border-bottom:3px solid transparent;padding:13px 4px;cursor:pointer}
.creation-tabs button[aria-selected=true]{color:#2e5845;border-bottom-color:#2e5845;background:#ffffff8a}
.creation-tabs button:focus-visible,.char-detail button:focus-visible{outline:2px solid #30634d;outline-offset:-3px}
.creation-content{min-height:0;overflow-y:auto;padding:18px;scrollbar-width:thin;scrollbar-color:#c1cfc3 transparent;overscroll-behavior:contain}
.creation-pane[hidden]{display:none!important}
.creation-pane{display:grid;gap:14px}
.char-detail .creation-styles{border:0;background:none;padding:0;border-radius:0}
.char-detail .creation-styles h3{display:flex;justify-content:space-between;align-items:center;font-size:14px;margin:0 0 12px}
.char-detail .creation-styles h3 small{font-size:10px;color:#7c8b80;font-weight:500}
.char-detail .creation-styles .looks-grid{gap:8px}
.char-detail .creation-styles .look-card{position:relative;gap:5px;padding:8px 4px;border:1px solid #e0e6dc;border-radius:12px;background:#f3f5ef;box-shadow:none}
.char-detail .creation-styles .look-card.on{border:2px solid #3b6a50;padding:7px 3px;background:#eaf1e7;box-shadow:none}
.char-detail .creation-styles .look-card img{width:78px;height:78px;object-fit:contain}
.char-detail .creation-styles .look-card b{font-size:11px;line-height:1.3;min-height:28px;display:grid;place-items:center;text-align:center}
.style-check{display:none;position:absolute;top:5px;right:5px;background:#3b6a50;color:white;width:17px;height:17px;border-radius:50%;font-size:10px;line-height:17px}
.look-card.on .style-check{display:block}
.creation-caption{font-size:12px;color:#3d5949;margin:12px 0 5px;line-height:1.5}
.char-detail .creation-styles .rpg-fine{font-size:11px;line-height:1.65;color:#7c887e;margin:0}
.creation-section-label{margin:0;font-size:12px;font-weight:800;color:#425d4c}
.creation-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.creation-stat{display:grid;gap:4px;padding:11px 12px;background:#f1f4ed;border:1px solid #e0e6da;border-radius:10px}
.creation-stat>span{font-size:10px;color:#758172}
.creation-stat strong{font-family:var(--font);font-size:21px;color:#34503e}
.creation-stat strong small{font-size:10px}
.char-detail .skills{gap:8px}
.char-detail .skills li{grid-template-columns:42px minmax(0,1fr) auto;gap:9px;align-items:start;padding:12px;border:1px solid #e0e6dc;border-radius:12px;background:#fff}
.skill-level{font-size:10px;padding:5px 3px;text-align:center;border-radius:6px;background:#eaf0e5;color:#496044;font-weight:800}
.char-detail .skills b{display:block;font-family:var(--font);font-size:13px;line-height:1.4}
.char-detail .skills small{display:block;font-size:11px;line-height:1.65;margin-top:4px;color:#7b867d}
.char-detail .skills em{font-size:9px;padding-top:4px;color:#547262;white-space:nowrap}
.char-detail .tagline{font-size:12px;color:#647668}
.char-detail .catch{font-size:11px;line-height:1.7;border:0;border-radius:10px;background:#f3f2e9}
.char-detail .catch b{color:#596b4e}
.char-detail .companion-choice{margin:0;padding:12px;border:1px solid #dbe3d7;border-radius:12px;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.char-detail .companion-choice legend{font-size:11px;color:#738270;padding:0 5px}
.char-detail .companion-choice label{display:flex;padding:12px 8px;gap:6px;background:#f0f3ec;border:1px solid transparent;border-radius:9px;font-size:12px;cursor:pointer}
.char-detail .companion-choice label:has(input:checked){background:#e5eddf;border-color:#97b291;color:#365238}
.char-detail .companion-choice input{flex:0 0 auto;width:14px;margin:0;padding:0;accent-color:#3b6a50}
.char-detail .partner,.char-detail .nick{display:grid;gap:7px;font-size:12px;color:#5b705e}
.creation-nick-help{margin:-6px 0 0;font-size:10px;line-height:1.5;color:#84907f}
.char-detail select,.char-detail input{width:100%;padding:11px 12px;border:1px solid #d4dfd0;border-radius:10px;background:#fff;font-size:13px;box-sizing:border-box}
.char-detail .partner-styles{padding:0 12px 12px;background:#f4f6ef;border:1px solid #e0e6d9;border-radius:12px}
.char-detail .partner-styles summary{font-size:12px;color:#546c55;padding:12px 0}
.char-detail .partner[hidden],.char-detail .partner-styles[hidden]{display:none}
.creation-footer{padding:12px 18px 16px;border-top:1px solid #dce3d9;background:#fcfbf6;display:grid;gap:10px}
.creation-ready{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:10px;color:#8b9489}
.creation-ready b{font-size:11px;color:#526a55;font-weight:700}
.char-detail .creation-footer .rpg-btn{margin:0;border:0;border-radius:12px;padding:13px 16px;background:#335c45;color:#fff;box-shadow:0 3px 0 #203e2d;font-size:15px}
.char-detail .creation-footer .rpg-btn:hover{background:#426e52}
.creation-footer .online-error{margin:0;font-size:12px;color:#b14646}
.creation-footer .online-error:empty{display:none}
@media(max-width:760px){.char-select{overflow:auto;grid-template-columns:1fr;grid-template-rows:auto auto auto;padding:16px;gap:16px}.char-select .char-grid{overflow:visible;grid-template-columns:repeat(auto-fill,minmax(90px,1fr))}.char-select .char-detail{grid-column:1;grid-row:3;min-height:500px;max-height:none;overflow:visible;grid-template-rows:auto auto auto auto}.creation-content{overflow:visible}.creation-profile{grid-template-columns:130px 1fr}.creation-footer{position:sticky;bottom:0;z-index:2;box-shadow:0 -6px 18px #354c3710}}
@media(max-height:680px) and (min-width:761px){.creation-profile{grid-template-columns:112px 1fr;padding:10px 16px}.creation-profile .char-preview{height:108px}.creation-identity h2{font-size:26px}.char-select{gap:12px;padding-top:12px;padding-bottom:12px}.creation-footer{padding:10px 16px}.creation-tabs button{padding:10px 4px}}

/* 리센느 응원 나무 */
.rpg-modal.tree-modal,.rpg-modal.tree-book{width:min(560px,94vw)}
.tree-bars{display:grid;gap:10px;margin:6px 0 12px}
.tree-bars label{display:grid;gap:5px;font-weight:800;font-size:13px}.tree-bars small{font-weight:600;opacity:.7}
.tree-bars .bar{display:block;height:12px;border-radius:999px;background:rgba(90,120,70,.18);overflow:hidden;box-shadow:inset 0 1px 2px rgba(0,0,0,.15)}
.tree-bars .bar u{display:block;height:100%;border-radius:999px;background:linear-gradient(180deg,#c8f0a8,#7fc95a 60%,#5fae4a);box-shadow:inset 0 2px 0 rgba(255,255,255,.55)}
.tree-bars .bar.today u{background:linear-gradient(180deg,#bfe8ff,#6fc0e8 60%,#4fa8d8)}
.tree-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:8px;margin-bottom:10px}
.tree-stats span{display:grid;justify-items:center;gap:2px;padding:8px 4px;border-radius:16px;background:rgba(255,255,255,.6);font-size:11px;text-align:center}
.tree-stats b{font:900 20px "Outfit","Noto Sans KR",sans-serif;color:#4f8a3a}
.tree-how{font-size:12.5px;line-height:1.6;margin:0 0 10px}
.tree-log{list-style:none;margin:0 0 10px;padding:0;display:grid;gap:5px;max-height:180px;overflow:auto}
.tree-log li{display:flex;gap:6px;align-items:baseline;padding:6px 10px;border-radius:12px;background:rgba(255,255,255,.55);font-size:12.5px}
.tree-log li small{margin-left:auto;opacity:.6;font-size:11px}.tree-log em{font-style:normal;color:#d0588a;font-weight:800}
.tree-page{font:500 16px/1.9 "Gowun Dodum","Noto Sans KR",serif;margin:8px 4px 10px;padding:16px 18px;border-radius:18px;background:linear-gradient(180deg,#fffaf0,#f7eedd);box-shadow:inset 0 0 0 1px rgba(160,120,80,.18)}
.tree-pageno{align-self:center;font-weight:800;opacity:.7}
.tree-how.plaque{font:600 15px/1.8 "Gowun Dodum","Noto Sans KR",serif;padding:14px 16px;border-radius:16px;background:linear-gradient(180deg,#e9d2a8,#d9b98a);color:#4a3320;box-shadow:inset 0 0 0 2px rgba(120,80,40,.25),inset 0 -3px 0 rgba(120,80,40,.2)}
.tree-how.plaque small{display:block;margin-top:6px;font:600 11.5px "Noto Sans KR",sans-serif;opacity:.75}

/* 야외 스크린: 스크린 천 위에 원근을 맞춰 얹는 영상(transform은 매 프레임 계산) */
.screen-video{position:absolute;left:0;top:0;width:640px;height:360px;transform-origin:0 0;z-index:1;overflow:hidden;background:#000;box-shadow:0 0 30px rgba(255,236,170,.35);pointer-events:none}
.screen-video[hidden]{display:none}
.screen-video iframe{width:100%;height:100%;border:0;display:block}
.screen-mute{position:absolute;right:max(16px,calc(150px * var(--ui,1)));bottom:calc(150px * var(--ui,1));z-index:6;border:0;border-radius:999px;padding:8px 14px;font:800 12.5px "Noto Sans KR",sans-serif;color:#4a3a66;cursor:pointer;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(250,242,255,.88));box-shadow:0 0 0 1.5px #fff,0 0 0 3px rgba(190,160,230,.55),0 4px 10px rgba(70,40,90,.22)}
.screen-mute.off{color:#8a7a9a;box-shadow:0 0 0 1.5px #fff,0 0 0 3px rgba(200,200,210,.6),0 4px 10px rgba(70,40,90,.18)}
.screen-mute[hidden]{display:none}
/* 나무 책: 화면을 가리지 않고 왼쪽 아래에 펼쳐 둔다(앉아서 읽는 내 모습이 보이게) */
.rpg-game .rpg-modal-wrap:has(.tree-book):not(.cinema-viewer),.rpg-modal-wrap:has(.tree-book){background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;place-items:end start;padding:0 0 calc(130px * var(--ui,1)) calc(24px * var(--ui,1));pointer-events:none}
.rpg-modal-wrap:has(.tree-book)>.rpg-modal.tree-book{pointer-events:auto;width:min(420px,88vw)}
.rpg-modal.tree-book .tree-page{font-size:14.5px;padding:12px 14px}

/* 가챠 · 오늘의 행운 캡슐 · 도감 세트 */
.lucky-card{display:flex;align-items:center;gap:12px;margin:6px 0 12px;padding:10px 12px;border-radius:20px;background:linear-gradient(120deg,#fff6d6,#ffe3f0);box-shadow:inset 0 0 0 1.5px rgba(255,207,74,.6)}
.lucky-card.used{opacity:.6;filter:saturate(.6)}
.lucky-card b{display:block;font-weight:900}.lucky-card small{font-size:11.5px;opacity:.8}
.lucky-card div{flex:1}
.lucky-cap{flex:none;width:40px;height:40px;border-radius:50%;background:linear-gradient(180deg,#ffd76a 0 50%,#fffaf0 50%);box-shadow:0 0 0 2px #fff,0 0 16px rgba(255,207,74,.8);animation:lucky-spin 2.4s ease-in-out infinite}
.lucky-card.used .lucky-cap{animation:none;box-shadow:0 0 0 2px #fff}
@keyframes lucky-spin{50%{transform:rotate(18deg) scale(1.08)}}
.gacha-sets{display:grid;gap:8px;margin:4px 0 12px}
.gacha-sets article{display:flex;gap:10px;align-items:center;padding:8px 12px;border-radius:16px;background:rgba(255,255,255,.55)}
.gacha-sets article>span{font-size:24px}.gacha-sets article div{flex:1;display:grid;gap:3px}
.gacha-sets b{font-size:13px}.gacha-sets small{font-size:11px;opacity:.8}
.gacha-sets .set-bar{display:block;height:8px;border-radius:999px;background:rgba(120,90,160,.18);overflow:hidden}
.gacha-sets .set-bar u{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#ff9cd2,#ffd166)}
.gacha-sets article.done{background:linear-gradient(120deg,#fff6d6,#ffe3f0);box-shadow:inset 0 0 0 1.5px rgba(255,207,74,.6)}
.gacha-reveal.lucky{box-shadow:0 0 0 3px #ffd166,0 0 40px rgba(255,207,74,.55)!important}
.gacha-reveal .set-done{margin:6px 0 0;padding:8px 12px;border-radius:14px;background:linear-gradient(120deg,#fff6d6,#ffe3f0);font-size:13px}

/* 핀볼마을 첫 선택: 군단과 함께 / 혼자 구경 */
.summon-choice{width:min(600px,94vw)}
.choice-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:6px}
.choice-card{display:grid;justify-items:center;gap:6px;padding:18px 14px;border:0;border-radius:24px;cursor:pointer;font-family:inherit;color:inherit;text-align:center;background:rgba(255,255,255,.6);box-shadow:0 0 0 2px rgba(255,255,255,.8),0 6px 16px rgba(80,40,110,.12);transition:transform .15s}
.choice-card:hover{transform:translateY(-3px)}
.choice-card.crew{background:linear-gradient(180deg,#fff,#ffeaf4)}
.choice-card.solo{background:linear-gradient(180deg,#fff,#eaf4ff)}
.choice-art{font-size:26px;line-height:1.05;color:#ff7fb0;font-weight:900}
.choice-card b{font-size:16px}.choice-card small{font-size:12px;line-height:1.5;opacity:.8}
@media (max-width:560px){.choice-cards{grid-template-columns:1fr}}
.view-remember{display:flex;align-items:center;gap:8px;margin:10px 4px 0;font-weight:800;font-size:13px;cursor:pointer}
.view-remember small{font-weight:600;opacity:.65}
.view-pref{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 10px}
.view-pref label{display:flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:rgba(255,255,255,.6);font-weight:700;font-size:13px;cursor:pointer}

/* 조작 안내 카드 */
.rpg-modal.keys-sheet{width:min(720px,94vw)}
.keys-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:10px;margin:4px 0 10px}
.keys-grid section{padding:10px 12px;border-radius:18px;background:rgba(255,255,255,.55)}
.keys-grid h3{margin:0 0 6px;font-size:12px;letter-spacing:.08em;color:#d0588a}
.keys-grid p{display:flex;gap:10px;align-items:center;margin:5px 0;font-size:12.5px}
.keys-grid p span{flex:none;min-width:128px;font-weight:700}
.keys-grid p em{font-style:normal;opacity:.85}
.keys-grid kbd,.keys-hint kbd{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;margin-right:2px;border-radius:7px;font:800 11px "Outfit","Noto Sans KR",sans-serif;color:#3a2d48;background:linear-gradient(180deg,#fff,#efe6f7);box-shadow:inset 0 -2px 0 rgba(150,120,190,.35),0 0 0 1px rgba(150,120,190,.25)}
.keys-hint{position:absolute;left:50%;bottom:calc(112px * var(--ui,1));transform:translateX(-50%);z-index:15;border:0;border-radius:999px;padding:9px 16px;font:800 13px "Noto Sans KR",sans-serif;color:#4a3a66;cursor:pointer;
  background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(250,242,255,.9));box-shadow:0 0 0 1.5px #fff,0 0 0 3px rgba(255,156,196,.55),0 8px 20px rgba(80,40,110,.25);animation:dev-in .5s cubic-bezier(.2,1.3,.4,1) both;zoom:var(--ui,1)}
.ticket-strip{margin:0 0 12px;padding:10px 12px;border-radius:18px;background:repeating-linear-gradient(135deg,#fff7e0 0 10px,#fff0d0 10px 20px);box-shadow:inset 0 0 0 1.5px rgba(230,170,80,.45)}
.ticket-strip b{display:block;font-size:13.5px}.ticket-strip small{display:block;font-size:11px;opacity:.75;margin:2px 0 8px}
.ticket-strip div{display:flex;flex-wrap:wrap;gap:6px}
.ticket{position:relative;padding:5px 12px 5px 10px;border-radius:8px;background:#fff;font:800 12px "Outfit",monospace;color:#7a4b10;box-shadow:0 0 0 1.5px #e9b85c;letter-spacing:.04em}
.ticket i{font-style:normal;opacity:.6;margin-right:3px}
.ticket::before,.ticket::after{content:'';position:absolute;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:#fff3d6}
.ticket::before{left:-4px}.ticket::after{right:-4px}
.ticket.empty{color:#a58a60;font-family:"Noto Sans KR",sans-serif;font-weight:700}

/* 밤 편의점 2D 실내 */
.rpg-modal.store-room-wrap{width:min(1180px,96vw);padding:0!important;overflow:hidden}
.rpg-modal.store-room-wrap::after{display:none}
.store-room{position:relative;aspect-ratio:16/9;width:100%}
.store-room canvas{display:block;width:100%;height:100%;image-rendering:auto;cursor:pointer}
.sr-exit{position:absolute!important;right:14px;top:14px;z-index:3}
.sr-hint{position:absolute;left:50%;bottom:22px;transform:translateX(-50%) translateY(8px);opacity:0;padding:8px 16px;border-radius:999px;background:rgba(40,30,70,.82);color:#fff;font:800 14px "Noto Sans KR",sans-serif;transition:.2s;pointer-events:none}
.sr-hint.on{opacity:1;transform:translateX(-50%)}
.sr-keys{position:absolute;left:18px;bottom:16px;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.75);font:700 12px "Noto Sans KR",sans-serif;color:#4a3a66}
.sr-keys kbd{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:6px;background:#fff;box-shadow:inset 0 -2px 0 rgba(150,120,190,.35);font:800 11px Outfit}
.sr-bubble{position:absolute;right:6%;top:14%;width:min(340px,40%);padding:14px 16px;border-radius:22px;background:rgba(255,255,255,.96);box-shadow:0 0 0 2px #fff,0 0 0 4px rgba(47,159,145,.4),0 12px 30px rgba(40,20,70,.25);color:#3a2d48;animation:modal-pop .3s cubic-bezier(.2,1.5,.4,1) both}
.sr-bubble b{font-size:13px;color:#2f9f91}.sr-bubble p{margin:4px 0 10px;font-size:14px}
.sr-bubble div{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.sr-bubble button{border:0;border-radius:14px;padding:9px 8px;font:800 13px "Noto Sans KR",sans-serif;cursor:pointer;background:linear-gradient(180deg,#f2fbf9,#d9f1ec);color:#245a52}
.sr-bubble button[data-c="x"]{background:#f1edf6;color:#6a5a7a}

/* 프리쿠라 부스: 움직이는 캐릭터 + 촬영 뒤 꾸미기 */
.pc-view .pc-poser{position:absolute;inset:0;width:100%!important;height:100%!important;display:block}
.pc-view{box-shadow:0 0 0 6px #fff,0 0 0 9px #ffc1d9,0 10px 30px rgba(255,120,170,.3)!important}
.pc-view::after{content:'';position:absolute;inset:-40% -10% auto;height:70%;pointer-events:none;background:radial-gradient(ellipse at 50% 100%,rgba(255,255,255,.35),transparent 60%)}
.pc-deco{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:16px;align-items:start}
.pc-deco-strip{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:16px;border-radius:22px;background:var(--frame);box-shadow:0 0 0 2px rgba(255,255,255,.8),0 10px 24px rgba(80,40,110,.18);transition:background .25s}
.pc-deco-title{grid-column:1/-1;text-align:center;font:900 16px "Outfit","Noto Sans KR",sans-serif;color:#ff7fb0;letter-spacing:.06em}
.pc-deco-strip canvas{width:100%;aspect-ratio:4/3;border-radius:10px;cursor:crosshair;box-shadow:0 2px 8px rgba(0,0,0,.12)}
.pc-deco aside h3{margin:0 0 4px}.pc-deco aside p{margin:0 0 10px;font-size:12.5px;opacity:.8}.pc-deco aside h4{margin:12px 0 6px;font-size:12px;letter-spacing:.06em;opacity:.7}
.pc-stickers{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.pc-stickers button{font-size:24px;padding:6px 0;border:0;border-radius:14px;background:rgba(255,255,255,.65);cursor:pointer}
.pc-stickers button[aria-pressed=true]{background:#fff;box-shadow:0 0 0 2px #ff9cc4}
.pc-frames{display:flex;flex-wrap:wrap;gap:6px}
.pc-frames button{display:grid;justify-items:center;gap:2px;border:0;background:transparent;cursor:pointer;font:700 10.5px "Noto Sans KR",sans-serif;color:inherit}
.pc-frames i{width:30px;height:30px;border-radius:50%;background:var(--c);box-shadow:0 0 0 2px #fff,0 0 0 3px rgba(150,120,190,.4)}
.pc-frames button[aria-pressed=true] i{box-shadow:0 0 0 2px #fff,0 0 0 4px #ff7fb0}
.pc-deco-actions{display:flex;gap:8px;margin-top:14px}.pc-deco-actions .rpg-btn{flex:1}
@media (max-width:720px){.pc-deco{grid-template-columns:1fr}}

/* 필담 배틀 */
.duel{display:grid;gap:10px}
.duel canvas{width:100%;border-radius:18px;box-shadow:0 0 0 3px #7a4f30,0 10px 28px rgba(60,30,10,.35);touch-action:none;cursor:crosshair}
.duel-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.duel-cards button{display:flex;align-items:center;gap:10px;justify-content:center;padding:12px 10px;border:0;border-radius:16px;cursor:pointer;background:linear-gradient(180deg,#fffaf0,#f1e4c8);box-shadow:0 0 0 2px rgba(122,79,48,.4),0 4px 10px rgba(60,30,10,.18);animation:modal-pop .3s cubic-bezier(.2,1.5,.4,1) both}
.rpg-game .duel-cards button b{font:30px "Nanum Brush Script","Gowun Batang",serif!important;color:#1d1814!important;text-shadow:none!important}
.duel-cards button kbd{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:7px;background:#a82c2c;color:#fff;font:800 12px Outfit}
.duel-cards button.on{box-shadow:0 0 0 3px #a82c2c,0 4px 10px rgba(60,30,10,.2)}
.duel-cards[hidden]{display:none}
.duel-tip{margin:0;font-size:12.5px;opacity:.85}
.rpg-modal.place.brush{width:min(1000px,96vw)}
@media (max-width:640px){.duel-cards{grid-template-columns:1fr}.rpg-game .duel-cards button b{font-size:24px!important}.duel-tip{font-size:11.5px}}

/* 무대 지휘 쇼 */
.rpg-modal.place.karaoke{width:min(1060px,96vw)}
.stageshow{display:grid;gap:10px}
.stageshow canvas{width:100%;border-radius:20px;box-shadow:0 0 0 3px #ff8fb1,0 12px 30px rgba(60,10,50,.4)}
.ss-pads{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.ss-pads button{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 6px;border:0;border-radius:18px;cursor:pointer;background:linear-gradient(180deg,#2b1a3e,#1a1030);box-shadow:inset 0 0 0 2px var(--c),0 4px 12px rgba(0,0,0,.25);color:#fff!important;font:800 14px "Noto Sans KR",sans-serif}
.ss-pads button span{font-size:22px}.ss-pads button kbd{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:7px;background:var(--c);color:#1a1030;font:900 12px Outfit}
.ss-pads button.tap{animation:ss-tap .25s ease}
@keyframes ss-tap{40%{transform:scale(.94);box-shadow:inset 0 0 0 2px var(--c),0 0 24px var(--c)}}
.ss-tip{margin:0;font-size:12.5px;opacity:.85}
@media (max-width:640px){.ss-pads button b{display:none}}

/* 내 방 */
.my-room .sr-bubble{width:min(420px,46%)}
.my-room .mr-body p{margin:4px 0 8px;font-size:13.5px}.my-room .mr-body ul{margin:4px 0 10px;padding-left:18px;font-size:13.5px}
.my-room .mr-hint{opacity:.7;font-size:12px!important}
.my-room .mr-photos{display:flex;gap:6px;flex-wrap:wrap;max-height:220px;overflow:auto;margin-bottom:8px}.my-room .mr-photos img{height:200px;border-radius:6px;box-shadow:0 2px 8px rgba(0,0,0,.2)}
.my-room .mr-fig{display:inline-block;margin:2px 4px 2px 0;padding:4px 10px;border-radius:999px;font-size:12.5px}
.my-room .sr-bubble div:last-child{grid-template-columns:1fr}
.my-room .sr-bubble .mr-body{display:block;max-height:46vh;overflow:auto}.my-room .mr-fig{background:#eef5ec!important;color:#304942}

/* 거제 해변: 원이의 조개 캐기 · 노을 액자 사진 */
.rpg-modal.beach-dig-wrap{width:min(1000px,96vw)}
.beach-dig{position:relative}.beach-dig canvas{display:block;width:100%;height:auto;border-radius:16px}
.beach-dig .bd-end{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:10px;background:#fffcf3e8;border-radius:16px;text-align:center;color:#304942}
.beach-dig .bd-end[hidden]{display:none}.beach-dig .bd-end b{font-size:18px}.beach-dig .bd-end strong{font-size:26px;color:#2f8f7a}
.rpg-modal.beach-photo{width:min(340px,92vw);text-align:center}.rpg-modal.beach-photo{max-height:92vh;overflow:auto}.rpg-modal.beach-photo img{width:auto;max-width:180px;max-height:58vh;border-radius:10px;box-shadow:0 10px 26px #27483c33;margin:6px auto 4px;display:block}

/* 시네마 · 정기 상영회 알약과 시간표 */
.rpg-game .showtime-chip{position:absolute;left:50%;top:calc(64px * var(--ui,1));transform:translateX(-50%);z-index:4;border:1px solid #d8e4db;border-radius:999px;padding:7px 16px;background:#fffcf3f0;color:#304942;font:800 12.5px "Noto Sans KR",sans-serif;box-shadow:0 4px 14px #27483c1a;cursor:pointer;zoom:var(--ui,1);white-space:nowrap}
.rpg-game .showtime-chip.live{background:#2f4a5c;color:#fff6dc;border-color:#2f4a5c;box-shadow:0 0 0 3px #ffd16655,0 6px 18px #0d1a2a40}
.rpg-game .showtime-chip[hidden]{display:none}
.showtime-board{margin:0 0 14px;padding:14px 16px;border-radius:16px;background:#2f4a5c;color:#fff6dc}
#rpg-app .rpg-modal .showtime-board h3{color:#ffe7a8!important;margin:0 0 2px}.rpg-game .rpg-modal .showtime-board .rpg-fine{color:#d9e4ea!important;margin:0 0 8px}
.showtime-board ol{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.showtime-board li{display:grid;grid-template-columns:56px 1fr auto;align-items:center;gap:10px;padding:8px 12px;border-radius:12px;background:#ffffff14}
.showtime-board li.on{background:#ffd16633;box-shadow:inset 0 0 0 1.5px #ffd166}
.rpg-game .rpg-modal .showtime-board li b{font:900 15px Outfit,"Noto Sans KR",sans-serif;color:#ffd166}.rpg-game .rpg-modal .showtime-board li small{color:#d9e4ea!important;font-size:11.5px}

/* 시네마 · 버스킹 함께하기 박자 띠 */
.rpg-game .busk-host{position:absolute;left:50%;bottom:calc(150px * var(--ui,1));transform:translateX(-50%);z-index:6;width:min(760px,94vw);zoom:var(--ui,1)}
.busk-jam{position:relative;display:flex;align-items:center;gap:10px}
.busk-jam canvas{flex:1;min-width:0;height:auto;filter:drop-shadow(0 6px 16px #27483c30)}
.busk-jam .bj-tap{flex:none;width:64px;height:64px;border-radius:50%;border:0;background:#396958;color:#fffdf4;font:900 22px Outfit,sans-serif;box-shadow:0 6px 16px #27483c40;cursor:pointer;touch-action:manipulation}
.busk-jam .bj-tap:active{transform:scale(.94)}.busk-jam .bj-tap[hidden]{display:none}
.busk-jam .bj-end{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;padding:8px 18px;border-radius:40px;background:#fffcf3f5;color:#304942;font-size:13px}
.busk-jam .bj-end[hidden]{display:none}.busk-jam .bj-end b{font-size:14px}

/* 핀볼 마을 · 맡은 부탁 알약 */
.rpg-game .favor-chip{position:absolute;left:50%;top:calc(64px * var(--ui,1));transform:translateX(-50%);z-index:4;border:1px solid #f2d3dc;border-radius:999px;padding:7px 16px;background:#fff6f8f0;color:#7a3d52;font:800 12.5px "Noto Sans KR",sans-serif;box-shadow:0 4px 14px #7a3d5222;zoom:var(--ui,1);white-space:nowrap;pointer-events:none}
.rpg-game .favor-chip[hidden]{display:none}

/* 일일 추첨실: 응모와 결과를 분리한 두 장의 보상 카드. */
.raffle-modal{max-width:780px!important}.raffle-intro{line-height:1.65;color:#52665d}.raffle-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:20px 0}.raffle-card{padding:20px;border:1px solid #d3ddcd;border-radius:18px;background:#fafbf4;display:flex;flex-direction:column;gap:12px}.raffle-card.motion{background:#faf5fa;border-color:#e3d4e1}.raffle-heading{display:flex;align-items:center;gap:10px}.raffle-heading>span{font-size:26px}.raffle-heading h3{margin:0;font-size:18px}.raffle-heading strong{margin-left:auto;font-size:26px;color:#315b4a}.raffle-heading strong small{display:block;font-size:11px;font-weight:normal}.raffle-card p,.raffle-card>small{margin:0;font-size:13px;line-height:1.5;color:#657165}.raffle-rules{padding:12px;border-radius:12px;background:#e9efe2}.motion .raffle-rules{background:#f0e7f0}.raffle-rules b,.raffle-rules span{display:block}.raffle-rules span{margin-top:5px;font-size:12px}.raffle-card label{display:flex;flex-direction:column;gap:7px;font-size:13px}.raffle-card select{width:100%;min-height:44px;background:#fff;border:1px solid #c8d4c6;border-radius:10px;padding:8px;color:#304d41}.raffle-source{padding:14px;background:#f0ecdF;border-radius:12px;font-size:13px;line-height:1.6}.raffle-result-heading{display:flex;align-items:center;justify-content:space-between}.raffle-history{list-style:none;padding:0;max-height:240px;overflow:auto}.raffle-history li{display:grid;grid-template-columns:100px 1fr;gap:5px 12px;padding:12px;border-bottom:1px solid #e2e4d8}.raffle-history li>span{color:#7d817a;font-size:13px}.raffle-history li>small{grid-column:2;color:#7c827a}.raffle-history .won>span{color:#347453;font-weight:bold}.look-card:disabled{opacity:.62;cursor:default}.look-card:disabled .style-check{display:none}@media(max-width:600px){.raffle-cards{grid-template-columns:1fr}.raffle-card{padding:16px}.raffle-history li{grid-template-columns:85px 1fr}}

.model-quest-list { margin: 16px 0; padding: 18px; border: 1px solid #dbcdb4; border-radius: 18px; background: #fffcf3; }
.model-quest-list article { padding: 12px 0; border-bottom: 1px solid #e9dfce; }
.model-quest-list article:last-child { border: 0; }
.model-quest-list p { margin: 6px 0; }
.model-quest-list small { color: #617169; }
/* 비트 레이스의 키 안내는 길 위 노트가 맡는다. 화면 버튼은 터치용 선택 조작. */
.race-touch {font-size:13px;color:#dbe4ed}
.race-touch summary {cursor:pointer;min-height:32px;padding:6px 0;color:#e4ce9e}
.race-touch .race-pads {padding:8px 0 2px}
.race-touch button {touch-action:manipulation;user-select:none}
@media(max-width:600px){.race-touch .race-pads {gap:5px}.race-touch .race-pads button{min-width:44px;min-height:44px;padding:7px 9px}}