/* Phase 8.9 second follow-up. Every rule is restricted to the TOP. */
body.home89-royal{background:linear-gradient(180deg,#071421b8,#071421ed 900px,#071421f5),url('assets/explore89/random.webp') center top/cover fixed;color:#f6f7fc}
.home89-royal>.site-header{background:#071421d9;border-bottom:1px solid #cedce56b;color:#fff;padding:6px max(16px,env(safe-area-inset-left));min-height:48px;gap:10px}
.home89-royal>.site-header .brand{font-size:16px;color:#eaf2fa;letter-spacing:.02em;width:auto;flex:1;text-align:left;justify-content:flex-start}
.home89-royal .header-actions{width:auto;gap:10px}.home89-royal .header-actions .btn{min-height:36px;padding:4px 10px;background:#0b2032;color:#fff;border:1px solid #e7edf4;border-radius:4px;font-size:13px;box-shadow:none}.home89-royal .volume{color:#e9eff6;font-size:12px}.home89-royal #volume{accent-color:#e7c16a}
.home89-royal main#app{max-width:1160px;margin:0 auto;padding:0 20px;min-height:65vh}.home89-royal>footer{color:#cad5df;background:#071421a6;border-top:1px solid #cedce535;font-size:13px;margin-top:32px;padding:16px}
.royal89.home89{max-width:1060px;margin:auto;color:#f5f7fc}.royal89 .home89-start{padding:4px 20px 26px;margin:0;background:none;border:0;border-radius:0;box-shadow:none;text-align:center}.royal89-hero h1{margin:0;line-height:1}.royal89-logo{display:block;width:min(100%,490px);height:auto;object-fit:contain;margin:0 auto}.royal89-logo[hidden]{display:none}.royal89-logo-fallback{color:#ffe298;text-shadow:0 3px 0 #061326;line-height:1.25;padding:25px 0}.royal89-logo-fallback[hidden]{display:none}.royal89-logo-fallback small{display:block;font-size:24px;letter-spacing:.1em}.royal89-logo-fallback b{display:block;font-size:68px}.royal89-rule{max-width:840px;margin:0 auto 20px;font-size:20px;line-height:1.65;color:#f4f5fc;text-shadow:0 2px 8px #000}
.royal89 .home89-start-buttons{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:760px;margin:auto}.royal89 .home89-start-buttons .btn{display:flex;align-items:center;justify-content:center;min-height:68px;padding:15px 12px;color:#fff;background:linear-gradient(#182d3ff0,#081523f5);border:2px solid #f1f5fa;border-radius:5px;box-shadow:inset 0 0 0 3px #081421,0 4px 14px #0005;font-size:23px;letter-spacing:.04em;white-space:normal;transition:background .12s,border-color .12s,transform .12s}.royal89 .home89-start-buttons .btn:hover{filter:none;border-color:#f6d98c;background:#213b50}.royal89 .home89-start-buttons .btn:active{transform:translateY(2px)}.royal89 button:focus-visible,.royal89 summary:focus-visible{outline:3px solid #ffe194;outline-offset:4px}
.royal89 .map89-section{padding:20px 20px 18px;border:1px solid #e6eef2c7;border-radius:8px;background:#071421b3;box-shadow:0 12px 38px #0004;scroll-margin-top:12px}.royal89-map-heading{text-align:center;margin-bottom:18px}.royal89-kicker{margin:0 0 4px;font-size:13px;letter-spacing:.28em;color:#f2d58b}.royal89 .map89-section h2{font-size:28px;color:#fff;margin:0 0 8px;line-height:1.4}.royal89 .map89-hint{font-size:17px;color:#f4f3e7;margin:0 0 6px}.royal89-map-help{color:#d7e2eb;font-size:14px;margin:0}
.royal89 .map89-board{width:min(100%,800px);aspect-ratio:1173/1341;margin:0 auto;background:#25483e;border-radius:6px;box-shadow:0 0 0 1px #d8e6ef99,0 4px 20px #0005;overflow:visible}.royal89 .map89-board>img{display:block;width:100%;height:100%;object-fit:contain;border-radius:6px}.royal89 .map89-board>img[hidden]{display:none}.royal89 .map89-hit{border-radius:6px}.royal89 .map89-hit path{fill:transparent;stroke:none}.royal89 .map89-hit path:hover{fill:#ffdc5725;stroke:#ffe194;stroke-width:.3}
.royal89 .map89-region{width:164px;min-width:0;min-height:0;padding:8px;gap:2px;border:2px solid #eef3fb;border-radius:6px;background:#07172ae8;color:#fff;box-shadow:0 4px 12px #0007;line-height:1.3}.royal89 .map89-face{width:62px;height:62px;border-radius:50%;margin:0 auto 4px;border:2px solid #e9f1f9;background:#1c3446;box-shadow:0 0 0 1px #e5bd66}.royal89 .map89-region strong{font-size:21px;line-height:1.25;color:#fff}.royal89 .map89-master-name{font-size:16px;line-height:1.35;color:#f5e9c0}.royal89 .map89-region small{font-size:12px;color:#e0ebf4;margin:0}.royal89 .map89-region:hover{background:#173348;border-color:#f7d67d}.royal89 .map89-region.is-complete{background:#2c2b20ed;border-color:#f6d475;color:#fff}.royal89 .map89-crown{filter:drop-shadow(0 2px 2px #0008)}
.royal89-castle{position:absolute;left:59%;top:18%;transform:translate(-50%,-50%);z-index:2;width:190px;min-height:58px;padding:8px 12px;border:1px solid #f5d787;border-radius:5px;background:#0a1729eb;color:#fff2bd;box-shadow:0 3px 12px #0006;font:inherit;text-align:center;cursor:pointer}.royal89-castle strong{display:block;font-size:19px;line-height:1.35}.royal89-castle small{display:block;font-size:12px;color:#fff;line-height:1.5}.royal89-castle:hover{background:#29382c}
.royal89 .map89-legend{color:#f2dc9b;font-size:14px;margin:14px 0}.royal89 .map89-common{max-width:800px;margin:0 auto;padding:14px 18px;display:flex;flex-direction:row;gap:16px;align-items:center;background:#101f32;border:1px solid #e5d499;border-radius:6px;color:#fff}.royal89-common>div>strong{font-size:18px;color:#f5e1a7}.royal89-common p{margin:3px 0;font-size:14px;color:#e6eef4}.royal89-common small{font-size:13px;color:#e6eef4}.royal89 .map89-common .map89-region{width:280px;max-width:100%;grid-template-columns:64px minmax(0,1fr);padding:10px;text-align:left}.royal89 .map89-common .map89-face{width:58px;height:58px;margin:0}.royal89 .map89-common .map89-master-name{font-size:16px}.royal89 .map-source{color:#d0dce6;font-size:13px}.royal89 .map-source summary{cursor:pointer;min-height:44px;padding:10px 0;text-align:center}.royal89 .map-source p{max-width:800px;margin:0 auto 6px;color:#d0dce6}
.royal89-random{text-align:center;padding:16px 0 4px}.royal89-random .btn{background:#0c2030;color:#e7eef5;border:1px solid #a7bdcc;border-radius:5px;min-height:46px;box-shadow:none;font-size:16px;padding:9px 22px}.royal89-random .btn span{margin-left:10px;color:#edce7c}
.royal89 .home89-tools{margin:20px 0;gap:12px;grid-template-columns:1.4fr 1fr 1fr}.royal89 .home89-tools .btn,.royal89 .home86-secondary,.royal89 .home86-learning .btn{background:#0d2031;color:#f4f7fc;border:1px solid #c4d3df;border-radius:5px;box-shadow:none;font-size:17px;min-height:48px}.royal89 .home88-more-learning,.royal89 .home86-learning{background:#081727d9;border:1px solid #a8becd;border-radius:6px;color:#f4f7fc;padding:18px 20px}.royal89 .home88-more-learning{margin-bottom:18px}.royal89 .home88-more-learning summary{font-size:17px;color:#f5e1a7;min-height:44px;cursor:pointer}.royal89 .home86-secondary small,.royal89 .small,.royal89 .home86-learning p{color:#e5edf4}.royal89 .home86-learning h2{color:#fff}.royal89 .notice{color:#fdf4cf;background:#283329;border-color:#dbbf6b}
.royal89-map-missing{background:radial-gradient(ellipse at center,#416a51,#102f3f)!important}.royal89-map-missing::after{content:'地図画像を表示できません。地区ボタンから修行できます。';position:absolute;bottom:3%;left:4%;right:4%;color:#fff;text-align:center;background:#071421e8;padding:8px;font-size:14px;pointer-events:none}
@media(max-width:800px){.royal89-logo{width:min(100%,450px)}.royal89-rule{font-size:18px;max-width:690px}.royal89 .home89-start-buttons .btn{font-size:21px;min-height:64px}.royal89 .map89-section{padding:16px 12px}.royal89 .map89-region{width:146px;padding:6px}.royal89 .map89-face{width:54px;height:54px}.royal89 .map89-region strong{font-size:19px}.royal89 .map89-master-name{font-size:15px}.royal89-castle{width:174px}.royal89 .map89-common{padding:12px}.royal89 .map89-common .map89-region{width:260px}}
@media(max-width:600px){.home89-royal>.site-header{flex-wrap:wrap;padding:6px 10px;min-height:44px}.home89-royal>.site-header .brand{font-size:13px;flex:1;white-space:nowrap}.home89-royal .header-actions{width:auto;gap:6px}.home89-royal .header-actions .btn{flex:none;min-height:34px;max-width:none;font-size:12px;padding:4px 7px}.home89-royal .volume{font-size:11px;gap:4px}.home89-royal #volume{width:70px}.home89-royal main#app{padding:0 10px}.royal89 .home89-start{padding:0 0 20px}.royal89-logo{width:100%;max-width:360px}.royal89-rule{font-size:16px;padding:0 10px;margin:0 auto 15px;line-height:1.7}.royal89 .home89-start-buttons{gap:10px}.royal89 .home89-start-buttons .btn{font-size:17px;letter-spacing:0;min-height:60px;padding:10px 5px}.royal89 .map89-section{padding:14px 8px}.royal89-map-heading{margin-bottom:12px}.royal89 .map89-section h2{font-size:24px}.royal89 .map89-hint{font-size:15px;line-height:1.6}.royal89-map-help{font-size:12px}.royal89 .map89-board .map89-region{width:100px;min-height:0;padding:4px 2px;gap:0;border-radius:5px}.royal89 .map89-board .map89-face{width:36px;height:36px;border-width:1px;margin:0 auto 2px}.royal89 .map89-board .map89-region strong{font-size:16px;line-height:1.25}.royal89 .map89-board .map89-master-name{font-size:12px;line-height:1.3}.royal89 .map89-board .map89-region small{display:none}.royal89-castle{width:136px;min-height:46px;padding:4px;left:60%;top:17%}.royal89-castle strong{font-size:15px}.royal89-castle small{font-size:10px}.royal89 .map89-legend{font-size:12px}.royal89 .map89-common{display:flex;flex-direction:column;gap:10px;padding:12px;text-align:center}.royal89 .map89-common .map89-region{width:100%;max-width:300px}.royal89 .map89-common .map89-master-name{font-size:16px}.royal89 .home89-tools{gap:8px}.royal89 .home89-tools .btn{font-size:14px;padding:8px 4px}.royal89 .home88-more-learning,.royal89 .home86-learning{padding:14px}.royal89 .map89-region .training89-guide{font-size:15px;padding:6px 10px}}
@media(prefers-reduced-motion:reduce){.royal89 .home89-start-buttons .btn{transition:none}}
.royal89 [data-study-card].home86-text-button{display:inline-flex;align-items:center;min-height:44px;color:#ffe194;font-size:16px;text-decoration-color:#d7bc76}
@media(max-width:600px){.royal89-castle{left:68%;width:124px}}
.home89-royal .header-actions .btn{min-height:44px}.home89-royal #volume{min-height:32px}

.royal89-logo-picture{display:block}

/* Phase 8.9 title-first entrance. Keep every original image and map rule. */
.royal89 .home89-start{
 display:flex;flex-direction:column;align-items:center;justify-content:center;
 gap:18px;min-height:calc(100vh - 56px);padding:24px 20px 32px;
}
.royal89 .royal89-hero h1{width:100%;flex:0 0 auto}
.royal89 .royal89-logo{
 width:min(100%,1020px,max(240px,calc(200vh - 500px)));
 max-width:100%;height:auto;object-fit:contain;
}
.royal89 .royal89-rule{flex:0 0 auto;margin:0;max-width:900px;text-align:center}
.royal89 .home89-start-buttons{flex:0 0 auto;width:100%;margin:0 auto}
@supports(height:100dvh){
 .royal89 .home89-start{min-height:calc(100dvh - 56px)}
 .royal89 .royal89-logo{width:min(100%,1020px,max(240px,calc(200dvh - 500px)))}
}
@media(max-width:600px){
 .royal89 .home89-start{padding:20px 0 28px;gap:16px}
 .royal89 .royal89-rule{padding:0 8px}
}
