/* Title and the connected game world. No catalogue of game cards. */
#app .g-title-screen{height:100dvh;display:flex;flex-direction:column}
.g-title-copy{position:relative;z-index:2;text-align:center;margin:24px 20px 0;pointer-events:none}
.g-title-copy h1{margin-top:15px;font-size:25px;line-height:1.6;font-weight:900;word-break:keep-all;overflow-wrap:normal;text-shadow:0 3px var(--g-deep)}
.g-title-copy p{font-size:12px;line-height:1.8;color:var(--g-muted);margin-top:10px;word-break:keep-all}
.g-title-screen .g-character-scene{min-height:100px}
.g-title-screen .g-character{padding:0 10% 0}
.g-title-screen .g-character img{max-height:360px}
.g-title-actions{position:relative;z-index:3;padding:12px 24px calc(16px + env(safe-area-inset-bottom,0px));display:grid;gap:14px;background:linear-gradient(transparent,var(--g-night))}
#app .g-title-actions .g-home-play{min-height:68px}
#app .g-title-actions .g-record-button{display:flex;justify-content:center;align-items:center;gap:7px;min-height:44px;font-size:12px;color:var(--g-muted)}
.g-title-actions .g-record-button svg{width:18px;height:18px}
#app .g-world{position:relative;height:100dvh;width:100%;overflow:hidden;background:var(--g-night);isolation:isolate;color:var(--g-text)}
.g-world-map,.g-world-shade{position:absolute;inset:0}
.g-world-map{z-index:-2}
.g-world-map canvas{width:100%;height:100%}
.g-world-shade{z-index:-1;pointer-events:none;background:linear-gradient(var(--g-night),transparent 30%,transparent 60%,var(--g-night) 88%)}
.g-world-header{position:absolute;top:0;left:0;right:0;padding:calc(12px + env(safe-area-inset-top,0px)) 16px 10px;display:flex;align-items:center;justify-content:space-between;gap:10px;height:var(--g-top);z-index:12}
.g-world-header .g-brand{font-size:23px}
.g-journey{position:absolute;top:calc(var(--g-top) + 6px);left:16px;right:16px;display:flex;justify-content:space-between;gap:8px;z-index:3}
.g-journey>span{display:flex;align-items:center;gap:6px;background:var(--g-glass);border:1px solid var(--g-edge);padding:5px 10px;border-radius:20px;color:var(--g-muted);font-size:10px;white-space:nowrap}
.g-journey b{font-size:14px;color:var(--g-gold);font-weight:900}
.g-world-heading{position:absolute;top:calc(var(--g-top) + 49px);left:16px;right:16px;z-index:4}
.g-world-heading h1{font-size:21px;font-weight:900;line-height:1.4;word-break:keep-all;text-shadow:0 2px var(--g-deep)}
.g-world-heading button{min-height:44px;position:absolute;right:0;top:-7px;border:0;background:var(--g-glass);color:var(--g-muted);border-radius:12px;padding:6px 9px;font-size:11px}
.g-world-board{position:absolute;inset:calc(var(--g-top) + 105px) 16px calc(245px + env(safe-area-inset-bottom,0px));z-index:2;pointer-events:none}
.g-world-trails{position:absolute;width:100%;height:100%;overflow:visible;fill:none;stroke:var(--g-gold);stroke-opacity:.65;stroke-width:1.1;stroke-linecap:round;stroke-dasharray:1 2;filter:drop-shadow(0 2px var(--g-ink))}
.g-world-portals{position:absolute;inset:0}
#app .g-world-portal{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:7px;width:134px;min-height:108px;padding:0;border:0;background:transparent;color:var(--g-text);pointer-events:auto;cursor:pointer;font-weight:900;touch-action:manipulation}
.g-portal-art{width:76px;height:76px;display:block;overflow:hidden;border-radius:50%;border:3px solid var(--g-gold);background:var(--g-purple);box-shadow:0 6px var(--g-orange-low),0 8px 20px var(--g-shadow);transition:scale .2s}
.g-portal-art img{width:100%;height:100%;object-fit:cover;display:block}
#app .g-world-portal strong{display:block;width:fit-content;max-width:150px;padding:4px 9px;border-radius:9px;background:var(--g-glass);font-size:12px;line-height:1.5;text-shadow:0 2px var(--g-deep);word-break:keep-all;white-space:normal;overflow-wrap:normal}
#app .g-world-portal[aria-pressed="true"] .g-portal-art{outline:3px solid var(--g-mint);outline-offset:5px;scale:1.08}
#app .g-world-portal i{position:absolute;top:0;right:24px;border:2px solid var(--g-ink);border-radius:50%;display:grid;place-items:center;width:24px;height:24px;background:var(--g-lime);color:var(--g-ink);font-size:13px;font-style:normal}
.g-world-traveler{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);width:54px;height:70px;filter:drop-shadow(0 5px 4px var(--g-deep))}
.g-world-traveler img{width:100%;height:100%;object-fit:contain}
.g-world-choice{position:absolute;bottom:calc(62px + env(safe-area-inset-bottom,0px));left:16px;right:16px;z-index:7;background:linear-gradient(transparent,var(--g-night) 30%);padding-top:8px}
.g-world-chosen{margin-bottom:12px}
.g-world-chosen>[data-world-route]{font-size:11px;color:var(--g-mint);font-weight:800}
.g-world-chosen h2{font-size:23px;font-weight:900;margin:3px 0;color:var(--g-text);line-height:1.4;word-break:keep-all}
.g-world-chosen p{font-size:11px;line-height:1.5;color:var(--g-muted);word-break:keep-all;overflow-wrap:normal}
.g-world-chosen .g-world-record{margin-top:5px;color:var(--g-gold);font-size:11px}
#app.g-app .g-world-choice>.primary{width:100%;font-size:22px}
.g-world-footer{position:absolute;bottom:calc(7px + env(safe-area-inset-bottom,0px));left:16px;right:16px;z-index:8;display:flex;align-items:center;gap:18px;font-size:11px;color:var(--g-muted)}
.g-world-footer>span{margin-right:auto;font-size:10px}
.g-world-footer a{min-height:44px;display:flex;align-items:center;color:var(--g-muted)}
#app.g-app .g-result-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;align-items:center}
#app.g-app .g-result-links .g-record-button{min-height:44px;font-size:11px;position:static;width:auto;margin:0}
#app.g-app .g-world-return svg{width:18px;height:18px}
#app.g-app .dotchi-feedback>.g-result-links{margin-top:8px}
@media(max-height:740px) and (max-width:899px){.g-title-copy{margin-top:10px}.g-title-copy h1{font-size:22px;margin-top:8px}.g-title-copy p{display:none}.g-title-screen .g-character img{max-height:280px}.g-world-board{top:calc(var(--g-top) + 89px);bottom:225px}.g-portal-art{width:64px;height:64px}#app .g-world-portal{min-height:92px}.g-world-heading h1{font-size:18px}.g-world-choice{bottom:56px}.g-world-chosen p:not(.g-world-record){display:none}.g-world-chosen h2{font-size:21px}}
@media(hover:hover){#app :where(button,a.button,a.g-tool):not(:disabled):hover{filter:brightness(1.1);translate:0 -2px}#app .g-world-portal:hover .g-portal-art{scale:1.1}}
#app :where(button,a,input):focus-visible{outline:3px solid var(--g-gold);outline-offset:4px}
#app button{cursor:pointer}#app button:disabled{cursor:default}
#app.g-app .oku-result.is-cleared .g-reward{display:flex;flex-direction:column;align-items:center}
#app.g-app .oku-result.is-cleared .g-result-ribbon{order:0}
#app.g-app .oku-result.is-cleared .result-rank{order:1;font-size:28px;margin:0 0 8px}
#app.g-app .oku-result.is-cleared .result-kicker{order:2;color:var(--g-gold);font-size:15px;font-weight:900}
#app.g-app .oku-result.is-cleared .oku-cleared-origin{order:3;font-size:12px;color:var(--g-text);margin-top:6px;word-break:keep-all;overflow-wrap:normal}
#app.g-app .oku-result.is-cleared .oku-cleared-reason{order:4;max-width:320px;color:var(--g-muted);font-size:12px;line-height:1.8;margin:8px 0;word-break:keep-all;overflow-wrap:normal;text-wrap:balance}
#app.g-app .oku-result.is-cleared .result-score{order:5;font-size:26px;color:var(--g-text);-webkit-text-stroke:0;text-shadow:none;margin:0;line-height:1.5}
#app.g-app .oku-result.is-cleared .result-score::before{content:'噛まれた人 ';font-size:11px;color:var(--g-muted);font-weight:700;margin-right:6px}
#app.g-app .oku-result.is-cleared .result-score small{font-size:12px}
#app.g-app .oku-result.is-cleared .result-place{order:6;margin:6px 0 0;display:flex;justify-content:center;gap:12px}
#app.g-app .oku-result.is-cleared .result-place button{font-size:11px;color:var(--g-mint);text-decoration:underline;text-underline-offset:4px}
#app.g-app .oku-result.is-cleared [data-best]{order:7}
@media(min-width:900px){#app.g-app .oku-result.is-cleared .g-reward{align-items:flex-start}#app.g-app .oku-result.is-cleared .oku-cleared-reason{max-width:304px;text-align:left}#app.g-app .oku-result.is-cleared .result-place{justify-content:flex-start}}
.g-world{--g-route:var(--g-gold)}
.g-world[data-path="defend"]{--g-route:var(--g-mint)}
.g-world[data-path="attack"]{--g-route:var(--g-orange)}
.g-world[data-path="guess"]{--g-route:var(--g-lime)}
.g-world[data-path="lookup"]{--g-route:var(--g-edge)}
.g-world-trails{stroke:var(--g-route)}
.g-portal-art{position:relative;border-color:var(--g-route)}
.g-portal-emblem{position:absolute;inset:auto 0 0;display:flex;justify-content:center;align-items:center;height:30px;background:var(--g-glass);color:var(--g-gold)}
.g-portal-emblem svg{width:22px;height:22px}
.g-world-traveler{z-index:3;transition:left 420ms cubic-bezier(.2,.8,.2,1),top 420ms cubic-bezier(.2,.8,.2,1);pointer-events:none}
#app .g-world-portal[aria-pressed="true"] strong{color:var(--g-route);border:1px solid var(--g-route)}

.g-title-copy p{width:fit-content;margin-inline:auto;padding:5px 12px;border-radius:18px;background:var(--g-glass);text-shadow:0 1px var(--g-deep)}
@media(min-width:900px){.g-title-screen .g-title-copy p{margin-left:0}}