/* Scoped to the title; existing story/map/battle/reward CSS stays in charge elsewhere. */
body.title-home-active{background:#101012;overflow:hidden}body.title-home-active .topbar{width:min(100%,430px);height:48px;margin:auto;background:#101012;border-bottom:1px solid #ffffff12;padding:0 20px;gap:12px}body.title-home-active .topbar .edition{display:none}body.title-home-active .topbar .logo{margin-right:auto;white-space:nowrap;min-width:0;font-size:18px}body.title-home-active .topbar #help{font-size:11px;padding:5px 7px;white-space:nowrap;flex-shrink:0}body.title-home-active #app{padding:0;margin:0}
.title-home{--home-pink:#f347a0;position:relative;isolation:isolate;container-type:inline-size;display:flex;flex-direction:column;overflow:hidden;width:min(100%,430px);height:calc(100svh - 48px);min-height:0;margin:auto;color:#f5f5f0;background:#101012;font-family:'Yu Gothic UI','Meiryo',sans-serif}
.home-background{position:absolute;inset:0;z-index:-2;background:var(--home-scene) 38% center/cover}.home-background::after{content:"";position:absolute;inset:0;background:#000b}.home-heading{position:relative;padding:28px 6cqw 0;flex:none}.home-heading>span{font:600 10px/1.2 SistersCardName,Arial,sans-serif;letter-spacing:2px;color:#f6a9cf}.home-heading h1{font-size:clamp(23px,7.5cqw,32px);font-weight:800;line-height:1.3;letter-spacing:-.3px;margin:10px 0 0}.home-edition{position:absolute;right:6cqw;top:29px;text-align:right;font:600 9px/1.2 SistersCardName,Arial,sans-serif;letter-spacing:1px}.home-edition strong{font:600 32px/1.2 SistersCardName,Arial,sans-serif;display:block;color:#f347a0;letter-spacing:0}.home-edition small{font-size:8px;letter-spacing:0}
.home-gallery{position:relative;flex:1;min-height:0;margin:12px 0 0}.home-gallery-word{position:absolute;left:-1cqw;top:7px;font:600 24cqw/1 SistersCardName,Arial,sans-serif;letter-spacing:-1cqw;color:#ffffff12}.home-sample{container-type:inline-size;position:absolute;top:8px;height:min(calc(100% - 40px),68cqw);aspect-ratio:5/7;background:#e7e7e3;color:#18191b;overflow:hidden;margin:0;box-shadow:0 6px 16px #0005}.home-sample-left{height:min(calc(100% - 55px),61cqw);left:0;top:24px;transform:rotate(-13deg);transform-origin:center}.home-sample-right{height:min(calc(100% - 55px),61cqw);right:0;top:24px;transform:rotate(13deg)}.home-sample-front{left:50%;transform:translateX(-50%) rotate(-2deg)}.home-sample img{position:absolute;left:-5%;top:0;width:110%;height:110%;object-fit:cover;object-position:50% 0%}.home-sample-word{position:absolute;top:5%;left:96%;width:max-content;font:400 40cqw/1 Impact,'Arial Narrow',sans-serif;opacity:.1;transform:rotate(90deg);transform-origin:top left}.home-sample-lines{position:absolute;inset:0;width:100%;height:100%;color:var(--sample-line)}.home-sample figcaption{position:absolute;left:7%;bottom:4.6%;padding:1.3cqw 1.8cqw .7cqw;background:#e7e7e3;box-shadow:-.6cqw .6cqw 0 var(--sample-line);font:600 7.6cqw/1.1 SistersCardName,Arial,sans-serif;letter-spacing:.35cqw}.home-sample>small{position:absolute;left:8%;bottom:2%;font:600 1.9cqw SistersCardName,Arial,sans-serif}.home-gallery-caption{position:absolute;left:5cqw;right:5cqw;bottom:4px;display:flex;align-items:center;justify-content:space-between;gap:10px}.home-gallery-caption>span{font:600 9px/1.2 SistersCardName,Arial,sans-serif;color:#d4d4da}.home-gallery-caption>p{font-size:10px;line-height:1.5;text-align:right;margin:0;color:#d4d4da}
.home-controls{flex:none;padding:10px 5cqw max(5px,env(safe-area-inset-bottom));background:#101012;position:relative;z-index:3}
#app .title-home button{border-radius:0;box-shadow:none;font-family:inherit;touch-action:manipulation;transition:filter .14s,translate .1s}#app .title-home button:hover{filter:brightness(1.1)}#app .title-home button:focus-visible{outline:2px solid #fff;outline-offset:-5px}
#app .home-space{display:block;width:100%;padding:10px 12px;border:0;border-left:3px solid #f347a0;background:#252528;color:#f5f5f0;text-align:left;clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,0 100%)}.home-space-caption{display:flex;justify-content:space-between;align-items:center;font:600 9px/1.2 SistersCardName,Arial,sans-serif;letter-spacing:1.5px;color:#f99fc9}.home-space-caption>b{font-size:17px;font-weight:400}.home-space>strong{font-size:clamp(17px,4.8cqw,21px);display:block;letter-spacing:-.3px;line-height:1.4;margin:2px 0 4px}.home-space-description{display:flex;align-items:center;gap:5px;flex-wrap:wrap;font-size:10px;line-height:1.4}.home-space-description>b{font-weight:600}.home-space-description>span{margin-left:auto;color:#ff98c8;border-bottom:1px solid #f347a0;font-size:10px}
.home-draw-status{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:28px;padding:6px 0;font-size:10px;line-height:1.4}.home-draw-status>span{color:#c4c4c9}.home-draw-status>b{font-size:13px;white-space:nowrap;color:#ff98c8}
#app .home-draw{width:100%;height:56px;border:0;display:flex;align-items:center;justify-content:space-between;padding:0 18px;background:#f347a0;color:#101012;clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);font-size:17px;font-weight:800;letter-spacing:.3px}.home-draw>b{font:400 29px/1 Arial,sans-serif}
.home-actions{display:flex;gap:8px;margin-top:10px}#app .home-actions button{--corner:9px;position:relative;isolation:isolate;flex:1;min-width:0;border:0;padding:9px 10px;background:#f347a0;color:#f5f5f0;text-align:left;clip-path:polygon(var(--corner) 0,100% 0,100% calc(100% - var(--corner)),calc(100% - var(--corner)) 100%,0 100%,0 var(--corner));font-size:12px;line-height:1.3}#app .home-actions button::before{content:"";position:absolute;inset:1px;z-index:-1;background:#101012;clip-path:polygon(calc(var(--corner) - .586px) 0,100% 0,100% calc(100% - var(--corner) + .586px),calc(100% - var(--corner) + .586px) 100%,0 100%,0 calc(var(--corner) - .586px));pointer-events:none}.home-actions button>b{font-weight:700}.home-actions button>span{display:block;font-size:10px;color:#b9b9bf;margin-top:4px;line-height:1.4}.home-adventure-label{display:flex;gap:5px;align-items:baseline;white-space:nowrap}.home-adventure-label small{font-size:9px;font-weight:400;color:#b9b9bf}.home-footnote{margin:6px 0 0;text-align:center;font-size:9px;line-height:1.5;color:#96969d}
.title-home .home-account{position:relative;left:auto;right:auto;top:auto;bottom:auto;padding:0 6cqw;z-index:8;background:none;border:0;flex:none}.title-home .title-auth{margin:0}.title-home .title-auth-status{font-size:10px;line-height:1.3;color:#d4d4da;min-height:21px}.title-home .title-auth:not(:empty){padding-top:3px}.title-home .title-auth>.title-auth-link{display:block;margin-left:auto!important}.title-home .title-auth-panel{position:absolute;left:5cqw;right:5cqw;top:6px;padding:16px;background:#101012f5;box-shadow:0 12px 30px #000a;max-height:calc(100svh - 90px);overflow:auto}.title-home .title-auth-note{font-size:11px}.title-home .home-account.title-auth-expanded~.home-heading{visibility:visible}.title-home .title-auth-panel h2{font-size:16px!important}.title-home .title-auth .title-auth-link{color:#ffb2d7!important}
body.title-home-active #utility .title-start-form{display:grid;gap:10px;margin:15px 0}body.title-home-active #utility .title-start-form input{font-size:16px;min-height:44px;width:100%;color:#fff;background:#101012;border:1px solid #8d8d94;padding:10px}body.title-home-active #utility .title-start-form button{min-height:44px}body.title-home-active #utility .title-start-form label{font-size:13px}body.title-home-active #utility .title-start-form small{font-size:11px;color:#c4c4c9}.home-space-example{display:flex;gap:8px}.home-space-example span{flex:1;padding:12px 8px;background:#252528;font-size:12px}.home-space-example strong{display:block;font-size:23px;color:#ff98c8}#utility .home-space-link{display:inline-block;padding:11px 16px;margin:12px 0;color:#101012;background:#f347a0;text-decoration:none;font-weight:700}
@media(max-height:700px){.home-heading{padding-top:13px}.home-heading h1{font-size:24px;margin-top:7px}.home-edition{top:14px}.home-gallery{margin-top:7px}.home-controls{padding-top:7px}.home-space{padding-top:7px!important;padding-bottom:7px!important}.home-space>strong{font-size:17px;margin:0 0 3px}.home-draw-status{min-height:25px;padding:4px 0}#app .home-draw{height:48px}.home-actions{margin-top:8px}#app .home-actions button{padding:8px 9px}.home-gallery-caption>span{font-size:8px}.home-gallery-caption>p{font-size:9px}.home-gallery-caption{bottom:1px}}
@media(max-width:340px){.home-heading>span{font-size:9px;letter-spacing:1px}.home-heading h1{font-size:22px}.home-actions button>b{font-size:11px}.home-adventure-label{gap:3px}.home-adventure-label small{font-size:8px}.home-actions button>span{font-size:9px}.home-space-description{font-size:9px}.home-space-description>span{font-size:9px}.home-draw-status{font-size:9px}.home-draw-status>b{font-size:12px}}

@media(max-width:340px){body.title-home-active .topbar{padding:0 14px;gap:8px}body.title-home-active .topbar .logo{font-size:16px}}

/* SPACE information fits one screen; this override does not affect other utilities. */
#utility.space-info-dialog #utility-body{top:auto;bottom:var(--space-area-bottom,calc(var(--control-zone) + 12px));max-height:calc(100svh - var(--space-area-top,56px) - var(--space-area-bottom,calc(var(--control-zone) + 12px)));height:auto;overflow:hidden;padding:16px 14px;background:#101012eb}
#utility .home-space-info h2{font-size:20px;line-height:1.4;margin:0 0 12px}
#utility .home-space-info .home-space-link{display:flex;justify-content:center;align-items:center;min-height:46px;margin:0 0 12px;padding:10px 12px;font-size:14px;line-height:1.4;background:#f347a0;color:#101012;clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px)}
#utility .home-space-info p{font-size:11px;line-height:1.55;margin:9px 0}
#utility .home-space-info p:last-child{margin-bottom:0}
#utility .home-space-info .home-space-example{gap:6px;margin:10px 0}
#utility .home-space-info .home-space-example span{padding:5px 6px;font-size:11px;line-height:1.4}
#utility .home-space-info .home-space-example strong{font-size:21px;line-height:1.3}
#utility.space-info-dialog #close-utility{position:absolute;top:7px;right:7px;display:grid;place-items:center;width:32px;height:32px;min-height:32px;padding:0;border:0;box-shadow:none;background:transparent;color:#eee;font:400 25px/1 Arial,sans-serif;cursor:pointer}
#utility.space-info-dialog #close-utility:hover{background:#ffffff12}
#utility.space-info-dialog #close-utility:focus-visible{outline:2px solid #f347a0;outline-offset:-2px}
#utility .home-space-info h2{padding-right:25px}
@media(max-height:600px){#utility.space-info-dialog #utility-body{padding:13px 12px}#utility .home-space-info h2{font-size:19px;margin-bottom:9px}#utility .home-space-info .home-space-link{margin-bottom:9px}#utility .home-space-info p{font-size:11px;line-height:1.55;margin:8px 0}#utility .home-space-info .home-space-example{margin:8px 0}}

/* Adventure is a normal screen, with its form above the fixed action area. */
.adventure-entry-scene{position:relative;isolation:isolate;flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden;padding:16px}
.adventure-entry-scene header{z-index:1;flex:none}
#app .adventure-entry-scene header button{padding:3px 0;min-height:28px;font-size:11px;background:transparent;border:0;color:#ddd}
.adventure-entry-scene h1{font-size:25px;line-height:1.3;margin:8px 0}
.adventure-entry-scene header p{font-size:11px;line-height:1.6;margin:0}
.adventure-entry-art{position:relative;flex:1;min-height:0;overflow:hidden;margin:12px -16px 0}
.adventure-entry-art img{position:absolute;bottom:0;height:100%;width:60%;object-fit:cover;object-position:50% 0}
.adventure-entry-art img:first-child{left:0}.adventure-entry-art img:last-child{right:0}
.adventure-entry-form{z-index:1;display:grid;gap:7px;padding:12px;background:#101012dc;border-top:1px solid #f347a0;margin:0}
.adventure-entry-form label{font-size:12px}.adventure-entry-form input{width:100%;height:44px;min-height:44px;padding:9px 10px;background:#101012;color:#fff;border:1px solid #777;font-size:16px;border-radius:0}
.adventure-entry-form small{font-size:10px;line-height:1.5;color:#bbb}
.adventure-entry-actions{flex:none;display:grid;gap:8px;padding:12px 16px max(12px,env(safe-area-inset-bottom));background:#101012}
#app .adventure-entry-actions button{min-height:48px;padding:8px 10px;font-size:13px;line-height:1.4;border:1px solid #f347a0;background:#101012;color:#eee}
#app .adventure-entry-actions button.primary{background:#f347a0;color:#101012}
#app .adventure-entry-actions [data-replay]{min-height:27px;padding:3px;font-size:10px;border-color:#ffffff35}
@media(max-height:600px){.adventure-entry-scene{padding:10px 16px}.adventure-entry-scene h1{font-size:21px;margin:4px 0}.adventure-entry-art{margin-top:6px}.adventure-entry-actions{padding-top:8px;gap:6px}.adventure-entry-form{padding:9px}.adventure-entry-actions button{min-height:44px}}

.adventure-entry-nav{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#app .adventure-entry-nav button{min-height:36px;height:36px;padding:5px 8px;font-size:12px;background:transparent;border-color:#f347a0;color:#eee}
