/* 앱으로 쓰기: 첫 화면 도구 줄 · 홈 화면 추가 안내 · 기기 옮기기(코드 · QR · 저장 파일). 첫 화면과 같은 남색 유리 · 샴페인 금 */
#rpg-app .rpg-title2 .title-tools{position:absolute;top:max(16px,env(safe-area-inset-top));right:max(16px,env(safe-area-inset-right));z-index:4;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;max-width:calc(100% - 32px)}
#rpg-app .rpg-title2 .title-tool{flex:0 0 auto;padding:9px 15px;border-radius:999px;border:1px solid rgba(243,214,150,.36);background:rgba(20,26,40,.62);color:#fbf5e6;font:700 13px/1.2 "Noto Sans KR",sans-serif;letter-spacing:.01em;cursor:pointer;backdrop-filter:blur(10px);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 6px 16px rgba(8,12,24,.3);transition:background .15s,border-color .15s,transform .15s}
#rpg-app .rpg-title2 .title-tool:is(:hover,:focus-visible){background:rgba(34,42,60,.86);border-color:rgba(243,214,150,.7);transform:translateY(-1px)}

.app-wrap{z-index:40;background:rgba(10,14,24,.5);backdrop-filter:blur(3px)}
.app-sheet{width:min(460px,100%);background:linear-gradient(180deg,#1f2536,#161b28);color:#f3ead8;border:1px solid rgba(232,194,106,.4);border-radius:16px;box-shadow:0 22px 60px rgba(0,0,0,.5)}
.app-sheet header{padding-bottom:10px;border-bottom:1px solid rgba(232,194,106,.24)}
.app-sheet header small{display:block;color:#d9b97a;font:700 10px/1 Outfit,sans-serif;letter-spacing:.18em}
.app-sheet header h2{margin:4px 0 0;color:#fff3d6;font:400 22px/1.2 "Jua","Noto Sans KR",sans-serif}
.app-sheet .x{color:#e9dcc0}
/* 첫 화면에는 게임 안 테마가 없어 기본 종이 창 규칙(테이프 · 초록 제목 · 초록 버튼)이 먼저 걸린다 → 이 창만 덮는다 */
#rpg-app .app-wrap .app-sheet::before{display:none}
#rpg-app .app-wrap .app-sheet h2{margin:4px 0 0;font:400 22px/1.2 "Jua","Noto Sans KR",sans-serif!important;color:#fff3d6!important;letter-spacing:0!important}
#rpg-app .app-wrap .app-sheet h3{color:#fff3d6!important;font:700 14px/1.3 "Noto Sans KR",sans-serif!important}
#rpg-app .app-wrap .app-sheet .rpg-btn{padding:11px 14px!important;border-radius:11px!important;border:1px solid rgba(243,214,150,.36)!important;background:rgba(255,255,255,.06)!important;color:#fbf5e6!important;font:700 13px/1.4 "Noto Sans KR",sans-serif!important;box-shadow:none!important}
#rpg-app .app-wrap .app-sheet .rpg-btn:is(:hover,:focus-visible){background:rgba(243,214,150,.14)!important}
#rpg-app .app-wrap .app-sheet .rpg-btn.gold{background:linear-gradient(180deg,#fbe09a,#e0ab4a)!important;color:#3a2a10!important;border-color:#fff3cf!important}
.app-sheet section{margin-top:14px;padding:13px 14px;border-radius:12px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.07)}
.app-sheet h3{margin:0 0 6px;font:700 14px/1.3 "Noto Sans KR",sans-serif;color:#fff3d6}
.app-sheet p{margin:0 0 10px;font-size:12.5px;line-height:1.6;color:#cfc4ae}.app-sheet p b{color:#e8c26a}
.app-sheet .rpg-btn{font-size:14px;padding:10px 14px}
.app-code{display:flex;gap:8px}
.app-code input{flex:1;min-width:0;padding:10px 12px;border-radius:10px;border:1px solid rgba(232,194,106,.5);background:#0f131d;color:#fff3d6;font:800 20px/1 Outfit,"Noto Sans KR",monospace;letter-spacing:.16em;text-align:center;text-transform:uppercase}
.app-code input::placeholder{color:#5d6478;letter-spacing:.16em}
.app-code input:focus{outline:2px solid #e8c26a;outline-offset:1px}
.app-row{display:flex;flex-wrap:wrap;gap:8px}.app-row>*{flex:1 1 150px;text-align:center;cursor:pointer}
.app-status{min-height:1.2em;margin:9px 0 0!important;color:#fff3d6!important;font-size:12.5px;white-space:normal}
.app-status:empty{display:none}
.app-ask{display:flex;gap:8px;margin-top:8px}.app-ask button{flex:1;padding:8px 10px;border-radius:9px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:#f3ead8;font:700 12.5px "Noto Sans KR",sans-serif;cursor:pointer}
.app-ask button.on{background:#e8c26a;border-color:#e8c26a;color:#1d1c2e}
.app-note{margin:12px 2px 0!important;font-size:11.5px!important;color:#a99f8b!important}
.app-steps{list-style:none;counter-reset:s;margin:14px 0 0;padding:0;display:grid;gap:8px}
.app-steps li{counter-increment:s;display:grid;grid-template-columns:30px 1fr;column-gap:10px;padding:11px 12px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07)}
.app-steps li::before{content:counter(s);grid-row:span 2;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:#e8c26a;color:#1d1c2e;font:900 12px Outfit,sans-serif}
.app-steps b{color:#fff3d6;font-size:13px}.app-steps span{color:#cfc4ae;font-size:12px;line-height:1.55}
.app-share{display:inline-block;width:13px;height:15px;vertical-align:-2px;border:2px solid #e8c26a;border-top:0;border-radius:2px;position:relative;margin:0 2px}
.app-share::before{content:"";position:absolute;left:50%;top:-6px;width:2px;height:11px;background:#e8c26a;transform:translateX(-50%)}
.app-share::after{content:"";position:absolute;left:50%;top:-7px;width:6px;height:6px;border-left:2px solid #e8c26a;border-top:2px solid #e8c26a;transform:translateX(-50%) rotate(45deg)}

/* 게임 안 설정 · 기기 옮기기 */
.settings-sheet .app-move{margin-top:10px}
.settings-sheet .app-move .app-status{color:inherit!important}
.xfer-out{margin-top:10px;padding:12px;border-radius:12px;background:#1d2433;color:#f3ead8}
.xfer-out .rpg-fine{color:#bfb39b}.xfer-out .app-status{color:#fff3d6!important}
.xfer-code{display:flex;align-items:center;justify-content:space-between;gap:10px}
.xfer-code b{font:900 30px/1 Outfit,monospace;letter-spacing:.14em;color:#fff3d6}
.xfer-code button{padding:7px 12px;border-radius:9px;border:1px solid #e8c26a88;background:#e8c26a22;color:#fff3d6;font:700 12px "Noto Sans KR",sans-serif;cursor:pointer}
.xfer-left{margin:6px 0 10px;font-size:12px;color:#e8c26a}
.xfer-qr{width:168px;margin:0 auto 8px;padding:6px;border-radius:12px;background:#fffaf0}.xfer-qr svg{display:block;width:100%;height:auto}
.xfer-warn{margin:8px 0 0;padding:9px 11px;border-radius:10px;background:#3a1f24;border:1px solid #e0707066;color:#ffd9d4;font-size:12px;line-height:1.55}
/* 다른 플레이어 이름표: 18m 밖이면 스르륵 숨긴다(rpg.js · far) */
#rpg-app .rpg-game .rpg-label.player{transition:opacity .35s ease}
#rpg-app .rpg-game .rpg-label.player.far{opacity:0 !important;pointer-events:none}