/* Layout follows the selected A+C composition; bottom dock includes iOS safe area. */
.stay-card{position:relative;overflow:hidden}.day-art{height:80px;aspect-ratio:auto!important}
header{position:relative}.brand-copy{display:flex;flex-direction:column;gap:5px}.brand-copy strong{font-size:19px;letter-spacing:-.5px}.brand-date{font-size:10px;letter-spacing:1.3px;font-weight:500}.brand-destination{font-size:17px;font-weight:500;letter-spacing:-.3px}
body[data-view=home] header{padding-bottom:15px;min-height:120px;align-items:center}.header-kyoto{width:122px;right:20px;bottom:8px;z-index:-1}body[data-view=home] .brand{gap:14px;align-items:center}.bam-avatar{width:74px;height:74px}.bam-avatar .bam-art{width:74px;height:74px}
.countdown-card{min-height:155px;border-radius:19px;display:block;padding:20px 22px;margin-bottom:15px;background:linear-gradient(110deg,#cce7fc,#e4e9ff 70%,#f3e6f8);box-shadow:none}.countdown-card>div:first-child{max-width:66%}.countdown{gap:8px;margin:5px 0 6px;align-items:baseline}.countdown strong{font-size:57px;letter-spacing:-2.5px}.countdown span{font-size:24px;line-height:1;color:#242b57}.countdown-flight{font-size:12px;line-height:1.4;margin:8px 0 0;color:#414c78}.countdown-bam{width:169px;right:0;bottom:-14px}.countdown-card .eyebrow{font-size:11px;letter-spacing:1.8px}
.itinerary-heading{margin-bottom:10px}.section-top h2,.stay-section>h2{font-size:23px;letter-spacing:-.7px;font-weight:700;color:#242b57}.day-list{gap:7px}.day-card{min-height:58px;height:58px;border-radius:15px;border:0;box-shadow:none;padding:7px 13px;gap:11px}.day-card .date-box{min-width:37px;width:37px;padding:2px 0;background:none;border-radius:0;display:flex;flex-direction:column;gap:0;align-items:center}.date-box strong{font-size:23px;line-height:1.05;font-weight:500;color:#242b57}.date-box small{font-size:9px;letter-spacing:.8px;line-height:1.3;font-weight:500;color:#424969}.day-card .day-copy{padding-right:99px}.day-card .day-copy strong{font-size:16px;color:#242b57;font-weight:600;line-height:1.15}.day-art{width:118px;right:27px;bottom:-25px;opacity:1}.day-card>.icon{width:13px;height:18px;color:#333d65}.day-card[data-tone="0"]{--tint:#e1e7ff;--soft:#d8eaff}.day-card[data-tone="1"]{--tint:#e6dcff;--soft:#e0eaff}.day-card[data-tone="2"]{--tint:#d3f0e6;--soft:#e7f6e9}.day-card[data-tone="3"]{--tint:#ffecba;--soft:#fff6d8}
.home-grid{gap:17px}.home-grid aside{display:grid;gap:16px;align-content:start}.stay-section>h2{margin:0 0 9px}.home-grid aside .stay-card{padding:15px 17px;min-height:124px;margin:0;border-radius:17px;box-shadow:none;border-color:#eae2df;background:linear-gradient(110deg,#fff9f5,#fffdfd)}.stay-card .stay-name{font-size:15px;font-weight:700;margin:2px 0 3px;line-height:1.3;padding-right:123px;letter-spacing:.1px}.stay-card>.subtle{font-size:12px;display:block}.stay-card .text-button{margin-top:10px;padding:6px 11px;border-radius:17px;font-size:12px;display:flex;align-items:center;gap:5px;width:max-content;min-height:30px}.stay-card .text-button .icon{width:12px;height:12px}.stay-card .stay-bam{width:153px;right:-5px;bottom:-4px}.kyoto-stay .stay-bam{width:133px;bottom:-13px;opacity:.8}
nav{position:fixed;left:0;right:0;bottom:0;transform:none;width:100%;max-width:none;border-radius:0;border:0;border-top:1px solid #e8e5ef;box-shadow:none;background:#fffdfdf5;padding:5px max(10px,env(safe-area-inset-right)) calc(5px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));gap:0;justify-content:space-around;z-index:1000}nav button{flex:1;min-width:0;max-width:125px;min-height:57px;border-radius:0;gap:5px;padding:7px 2px 8px;background:none!important}nav button.active{box-shadow:none}nav button .icon{width:24px;height:24px;stroke-width:1.6}nav button span{font-size:11px;font-weight:500}nav button.active:after{bottom:0;height:3px;width:24px}
main{padding-bottom:calc(90px + env(safe-area-inset-bottom))}#maybe-toast{bottom:calc(85px + env(safe-area-inset-bottom))}
body[data-view=route] header{display:none}body[data-view=route] main{padding-top:calc(12px + env(safe-area-inset-top))}.road-heading{min-height:173px;margin-bottom:11px;border-radius:20px}.road-heading .page-heading{padding:21px 20px;max-width:64%}.road-heading h1{font-size:29px;letter-spacing:-.9px}.road-heading .eyebrow{font-size:10px;letter-spacing:1.6px}.road-bam{width:220px;right:-5px;bottom:-24px}.route-grid{gap:13px}.map-card{border-radius:18px;overflow:hidden}#map{height:263px}.map-footer{padding:9px 12px;background:#ffffffc9}.map-footer>span{font-size:11px}.map-footer .button{font-size:11px;min-height:32px;padding:8px 11px}.route-list{padding:0!important;background:none!important;border:0;box-shadow:none}.stops-heading{font-size:23px;margin:0 0 8px}.route-stop{margin:7px 0;border-radius:14px}.route-stop summary{min-height:49px;padding:10px 11px}.route-stop strong{font-size:13px;color:#242b57}.route-stop small{font-size:10px}.route-stop .num{width:30px;min-width:30px;height:30px}.route-list>.text-button{font-size:12px;margin-top:6px}
@media(min-width:681px){nav{padding-left:calc((100% - 650px)/2);padding-right:calc((100% - 650px)/2)}body[data-view=home] header{padding-top:30px;padding-bottom:20px}.header-kyoto{right:30px;width:150px}.home-grid{grid-template-columns:1.2fr 1fr;gap:25px}.home-grid .countdown-card{min-height:178px}.countdown-bam{width:210px}.day-card{height:68px}.day-art{width:137px;bottom:-31px}.stay-section .stay-card{min-height:150px}.stay-card .stay-bam{width:170px}.road-heading{min-height:210px}.road-bam{width:270px;right:60px}#map{height:365px}}
@media(max-width:680px){header{padding-left:20px;padding-right:20px;padding-top:calc(16px + env(safe-area-inset-top));padding-bottom:8px}body[data-view=home] header{min-height:calc(112px + env(safe-area-inset-top));padding-bottom:12px}.brand-copy strong{font-size:21px}.brand-copy{gap:4px}.brand-date{font-size:9px;letter-spacing:1.1px}.brand-destination{font-size:16px}.header-kyoto{width:109px;right:10px;bottom:-3px;opacity:.85}.bam-avatar,.bam-avatar .bam-art{width:74px;height:74px}.brand{gap:13px}main{padding-left:19px;padding-right:19px;padding-top:0;padding-bottom:calc(85px + env(safe-area-inset-bottom))}.countdown-card{min-height:150px;padding:19px 18px;margin-bottom:14px}.countdown-card>div:first-child{max-width:65%}.countdown strong{font-size:55px}.countdown span{font-size:23px}.countdown-bam{width:166px;right:-2px;bottom:-13px}.countdown-flight{font-size:11px}.home-grid{gap:15px}.day-art{width:116px;right:24px;bottom:-25px}.day-card .day-copy{padding-right:96px}.day-card .day-copy strong{font-size:15px}.day-card .date-box{min-width:34px}.date-box strong{font-size:23px}.date-box small{font-size:9px}.stay-section>h2{font-size:23px}.stay-card .stay-name{font-size:15px}.stay-card .stay-bam{width:153px}.stay-card .text-button{margin-top:10px;font-size:12px}.road-heading{min-height:164px}.road-bam{width:206px}.road-heading .page-heading{padding:20px 18px}.road-heading h1{font-size:29px}nav{width:100%;max-width:none;bottom:0;border-radius:0;padding-top:5px}nav button{min-height:57px}nav button span{font-size:11px}.route-grid{gap:12px}}
@media(max-width:380px){.brand-copy strong{font-size:18px}.bam-avatar,.bam-avatar .bam-art{width:63px;height:63px}.header-kyoto{width:90px;opacity:.7}.countdown strong{font-size:50px}.countdown-bam{width:149px}.day-card .day-copy{padding-right:76px}.day-art{width:101px}.day-card .day-copy strong{font-size:14px}.stay-card .stay-name{padding-right:105px;font-size:14px}.stay-card .stay-bam{width:139px}nav button span{font-size:10px}}
.day-art{height:70px;bottom:-7px!important}
.route-stop:nth-of-type(4n+1){--stop:#3c907c;--soft:#e1f3e6}.route-stop:nth-of-type(4n+2){--stop:#397ddd;--soft:#e4efff}.route-stop:nth-of-type(4n+3){--stop:#8859d7;--soft:#efe7ff}.route-stop:nth-of-type(4n){--stop:#c89436;--soft:#fff0d5}
@media(max-width:680px){body[data-view=home] header{min-height:calc(104px + env(safe-area-inset-top))}.countdown-card{min-height:142px}.day-card{height:56px;min-height:56px}.home-grid{gap:12px}.home-grid aside .stay-card{min-height:116px}}
/* Wide source cells preserve artwork proportions without stretching. */
.day-art{background-image:url('day-art-wide.png');background-size:200% 200%;width:120px;height:60px;aspect-ratio:2!important;bottom:-1px!important;right:23px;clip-path:none;opacity:1}.day-art.art-osaka{background-position:0% 0%}.day-art.art-usj{background-position:100% 0%}.day-art.art-drive{background-position:0% 100%}.day-art.art-kyoto{background-position:100% 100%}
.itinerary-heading{position:relative;min-height:32px;margin-bottom:9px}.itinerary-heading h2{position:relative;z-index:1}.sakura-branch{position:absolute;width:140px;height:auto;right:-7px;bottom:0;pointer-events:none;opacity:.88}
.road-banner{min-height:0;border-radius:0 0 20px 20px;overflow:hidden;background:#a9d5f8;margin:-12px -19px 13px}.road-banner .page-heading{max-width:none;padding:15px 19px 8px;margin:0;text-align:center;background:linear-gradient(#dceefe,#a9d5f8)}.road-banner h1{font-size:30px;margin:0 0 6px}.road-banner .eyebrow{font-size:11px;color:#424f7c;letter-spacing:2px}.road-banner-image{display:block;width:100%;height:auto;object-fit:contain;pointer-events:none}
@media(min-width:681px){.day-art{width:132px;height:66px}.road-banner{margin-left:0;margin-right:0;border-radius:22px}.road-banner .page-heading{padding:18px}.road-banner-image{max-height:310px;object-fit:cover;object-position:right center}}
@media(max-width:380px){.day-art{width:106px;height:53px}.sakura-branch{width:116px}.itinerary-heading h2{font-size:21px}}
.usj-times{margin:18px 0}.usj-times>div{display:grid;grid-template-columns:118px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid #ded5ee}.usj-times>div:last-child{border:0}.usj-times dt{font-weight:700;color:#7252b8;font-size:14px}.usj-times dd{margin:0;font-size:14px;line-height:1.5}.usj-booking{background:linear-gradient(120deg,#f1eaff,#fefcff)!important}.usj-booking h3{color:#7252b8}.usj-booking .text-button{font-size:14px}@media(max-width:380px){.usj-times>div{grid-template-columns:108px 1fr;gap:8px}.usj-times dt,.usj-times dd{font-size:13px}}

/* Full-bleed road-trip artwork sits behind the title, including the iOS safe area. */
body[data-view=route] main{padding-top:0}
.road-banner{position:relative;isolation:isolate;width:auto;height:clamp(280px,31vw,380px);min-height:0;margin:0 0 16px;border-radius:0;background:#a9d5f8}
.road-banner-image{position:absolute;inset:0;z-index:0;width:100%;height:100%;max-height:none;object-fit:cover;object-position:right center}
.road-banner:after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,#e7f3ffbb 0%,#e7f3ff55 28%,transparent 52%)}
.road-banner .page-heading{position:relative;z-index:2;max-width:none;padding:24px 20px 0;margin:0;text-align:center;background:none}
.road-banner h1{color:#242b57;font-size:32px;margin:0 0 6px;text-shadow:0 1px 10px #ffffffa6}
.road-banner .eyebrow{color:#303e68;font-size:11px;letter-spacing:2px;text-shadow:0 1px 8px #ffffffb3}
@media(max-width:680px){.road-banner{margin-left:-19px;margin-right:-19px;height:calc(280px + env(safe-area-inset-top))}.road-banner .page-heading{padding-top:calc(24px + env(safe-area-inset-top))}}

/* Keep the complete landscape composition on the phones used for this trip. */
@media(max-width:680px){
.road-banner{height:auto;min-height:0;aspect-ratio:1942/809;box-sizing:content-box;padding-top:env(safe-area-inset-top);background:#99d3ff}
.road-banner-image{top:auto;bottom:0;height:calc(100% - env(safe-area-inset-top));object-fit:contain;object-position:center bottom}
.road-banner .page-heading{position:absolute;top:0;left:0;right:0;padding:calc(12px + env(safe-area-inset-top)) 20px 0}
.road-banner h1{font-size:29px;margin-bottom:4px}
.road-banner .eyebrow{font-size:10px}
.road-banner:after{background:linear-gradient(180deg,#e7f3ff88,transparent 58%)}
}

/* Balance a taller edge-to-edge phone header with scenery and Bam both visible. */
@media(max-width:680px){
.road-banner{aspect-ratio:auto;box-sizing:border-box;padding-top:0;height:calc(220px + env(safe-area-inset-top))}
.road-banner-image{top:0;bottom:0;height:100%;object-fit:cover;object-position:85% center}
.road-banner .page-heading{padding-top:calc(18px + env(safe-area-inset-top))}
.road-banner:after{background:linear-gradient(180deg,#e7f3ff99 0%,#e7f3ff22 35%,transparent 60%)}
}

/* Compact itinerary cards keep more stops visible on iPhones. */
.event{grid-template-columns:19px minmax(0,1fr);gap:6px;padding-bottom:7px}
.event-order{padding-top:16px;font-size:11px}
.event:not(:last-child):before{left:9px;top:29px;bottom:0}
.event-card{border-radius:16px}.event-card summary{padding:13px 14px}
.event-top:not(:empty){margin-bottom:6px}.event-top{gap:7px}
.event-title h3{font-size:16px;line-height:1.3}.event-title small{font-size:12px;margin-top:3px;line-height:1.4}
.event-content{padding:0 14px 14px}.event-content p{font-size:14px;margin-bottom:12px}
.event-content .usj-times{margin:8px 0 15px}.event-content .usj-times>div{grid-template-columns:100px minmax(0,1fr);gap:8px;padding:10px 0}.event-content .usj-times dt,.event-content .usj-times dd{font-size:12px}

/* Quiet blossoms decorate unused space without blocking touch targets. */
body[data-view=days] .page-heading,body[data-view=details] .page-heading,body[data-view=saved] .page-heading{position:relative;isolation:isolate}
body[data-view=days] .page-heading:after,body[data-view=details] .page-heading:after,body[data-view=saved] .page-heading:after{content:'';position:absolute;pointer-events:none;z-index:-1;background:url('sakura-branch.png') center/contain no-repeat;width:150px;height:60px;opacity:.55}
body[data-view=days] .page-heading:after{right:-12px;bottom:-8px;transform:rotate(-12deg)}
body[data-view=details] .page-heading:after{right:0;top:8px;width:130px;transform:rotate(10deg);opacity:.45}
body[data-view=saved] .page-heading:after{left:-30px;bottom:-27px;width:120px;transform:scaleX(-1) rotate(-8deg);opacity:.3}
body[data-view=days] .timeline:after{content:'';display:block;width:175px;height:62px;margin:18px 0 0 auto;background:url('sakura-branch.png') center/contain no-repeat;opacity:.27;pointer-events:none;transform:rotate(8deg)}
body[data-view=saved] #maybe-list:after{content:'';display:block;width:150px;height:55px;margin:18px 0 0 auto;background:url('sakura-branch.png') center/contain no-repeat;opacity:.3;pointer-events:none;transform:rotate(-10deg)}
body[data-view=details] .sources{position:relative}.sources:after{content:'';position:absolute;width:100px;height:38px;right:10px;bottom:-30px;background:url('sakura-branch.png') center/contain no-repeat;opacity:.25;pointer-events:none}
.stay-section:nth-child(2)>h2{position:relative}.stay-section:nth-child(2)>h2:after{content:'';position:absolute;right:8px;top:-8px;width:92px;height:32px;background:url('sakura-branch.png') center/contain no-repeat;opacity:.4;pointer-events:none;transform:scaleX(-1)}

.install-steps{padding-left:22px;margin:18px 0 12px}.install-steps li{font-size:14px;line-height:1.65;margin-bottom:12px;padding-left:4px}.install-steps li:last-child{margin-bottom:0}.sources .install-steps+p{font-size:13px;line-height:1.6}
