/* A small floating wayfinding strip; the painting remains the dominant surface. */
@font-face{font-family:MachiJP;src:url('assets/fonts/MachiJapanese.otf') format('opentype');font-display:swap}
:root{--chrome-ink:#f9f9ed;--chrome-shade:#203a3b4d;--chrome-hover:#203a3b85;--chrome-rule:#e4eee43d;--chrome-body:'Avenir Next','Helvetica Neue',MachiJP,sans-serif;--chrome-display:'Hiragino Mincho ProN','Yu Mincho',Georgia,MachiJP,serif}
body[data-ui-language=ja]{--chrome-body:'Hiragino Sans',MachiJP,sans-serif}
#controls #scene-control{left:var(--safe-left);right:auto;top:var(--safe-top);display:block;padding:0;background:none;border:0;border-radius:0;min-height:0;color:var(--chrome-ink)}
#location-caption{display:block;margin:0 0 5px 8px;font:11px/1.4 var(--chrome-body);letter-spacing:.1em;text-shadow:0 1px 6px #183332b0}
#controls #scene-select{max-width:235px;min-height:38px;background:var(--chrome-shade);backdrop-filter:blur(10px);border:1px solid var(--chrome-rule);border-radius:5px;color:var(--chrome-ink);font:16px/1.5 var(--chrome-display);letter-spacing:.035em;padding:5px 30px 5px 10px;box-shadow:none}
#scene-select option{color:#304b50;background:#f3f5ee}
#controls #notebook-open,#controls #menu-open{position:absolute;top:var(--safe-top);height:40px;min-height:40px;width:auto;left:auto;background:var(--chrome-shade);backdrop-filter:blur(10px);color:var(--chrome-ink);border:1px solid var(--chrome-rule);border-radius:5px;box-shadow:none;padding:0 12px;display:flex;align-items:center;gap:8px;font:14px var(--chrome-display);letter-spacing:.025em}
#controls #menu-open{right:var(--safe-right)}
#controls #notebook-open{right:calc(var(--safe-right) + 93px)}
#controls #notebook-open svg,#controls #menu-open svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.3}
#controls #notebook-count{font:10px var(--chrome-body);opacity:.75}
#controls #guidance{top:calc(var(--safe-top) + 70px);left:var(--safe-left);max-width:min(350px,60vw)}
#controls #guide-toggle{display:flex;gap:16px;padding:7px 9px;min-height:32px;background:#203a3b38;color:var(--chrome-ink);border:0;border-left:1px solid #dbe5c69c;border-radius:0;font:12px/1.5 var(--chrome-body);text-align:left;box-shadow:none;text-shadow:0 1px 5px #203a3b}
#controls #guide-detail{padding:12px 14px;color:var(--chrome-ink);background:#203a3bd9;backdrop-filter:blur(12px);font:13px/1.8 var(--chrome-body);border:1px solid var(--chrome-rule);border-radius:5px}
#controls #talk{height:44px;min-height:44px;max-width:55vw;padding:0 16px;background:#203a3b99;color:var(--chrome-ink);border:1px solid #edf5e77a;border-radius:6px;backdrop-filter:blur(12px);font:14px/1.5 var(--chrome-display);box-shadow:0 3px 18px #172d2b24}
#controls #talk svg{width:19px;height:19px}#controls #talk span{white-space:normal}
#controls button:hover,#controls #scene-select:hover{background-color:var(--chrome-hover)}
#controls button:focus-visible,#controls select:focus-visible{outline:2px solid #f0f2d9;outline-offset:3px}
#menu{background:#162e3247;backdrop-filter:blur(12px)}
#menu .menu-card{background:#f4f6eee8;border:1px solid #fff9;border-radius:14px;padding:28px 32px;width:min(420px,90vw);box-shadow:0 15px 60px #172e3333;color:#304b50;font-family:var(--chrome-body)}
#menu .eyebrow{font:10px var(--chrome-body);letter-spacing:.16em;color:#687b78;margin:0 0 12px}
#menu h2{font:normal 30px/1.5 var(--chrome-display);letter-spacing:.04em;margin:0 0 22px}
#menu .menu-row{padding:10px 0;border:0;border-bottom:1px solid #7f938027;background:none;color:#304b50;font:13px/1.6 var(--chrome-body);min-height:44px;border-radius:0}
#menu #resume{background:#dbe5d88c;border:1px solid #81997e44;border-radius:5px;color:#304b50;font:15px var(--chrome-display);min-height:44px;margin:14px 0}
#menu #ui-language{background:transparent;border:1px solid #85978c66;border-radius:4px;padding:7px 10px;color:#304b50;font:13px var(--chrome-display)}
#menu .help,#menu .install-help,#menu #diagnostics{font:11px/1.7 var(--chrome-body);color:#647774;background:none}
#menu #diagnostics{margin-top:8px;padding:6px 0;min-height:32px;text-decoration:underline;text-underline-offset:4px}
#dialogue.cat-dialogue{left:auto;right:4vw;bottom:5vh;width:50vw;min-height:155px;padding:18px 24px;border-radius:14px;background:#fafbf1ed;overflow:visible}
#dialogue.cat-dialogue .dialogue-copy{padding-left:0}#dialogue.cat-dialogue #portrait{left:auto;right:calc(100% + 2vw);bottom:-5vh;width:40vw;height:85vh;object-fit:contain;object-position:bottom}
#dialogue.cat-dialogue #page-count{display:none}
.cv-cafe-menu .cv-drink-choice{display:flex;flex-direction:column;align-items:center;gap:4px;min-height:0;padding:8px 14px;margin:0;border:1px solid transparent;border-radius:8px;background:transparent;color:#49625b;font:13px var(--chrome-body)}
.cv-cafe-menu .cv-drink-choice[aria-pressed=true]{background:#d8e5da66;border-color:#7d998866}.cv-drink-choice:not(:disabled):hover{background:#dde8de99}.cv-drink-choice:disabled{opacity:1;cursor:default}
.cv-response-voice{justify-content:center}.cv-wave{display:none}
@media(max-height:500px){#menu .menu-card{padding:18px 25px}#menu h2{font-size:25px;margin-bottom:12px}#controls #guidance{top:calc(var(--safe-top) + 66px)}#controls #scene-select{font-size:15px;max-width:205px}#controls #talk{font-size:13px}.cat-dialogue #meaning{font-size:13px}#dialogue.cat-dialogue{padding:14px 18px;bottom:4vh}}
@media(prefers-reduced-motion:reduce){#controls *{transition:none!important}}

/* Intrinsic widths keep translated labels and the notebook count apart. */
#controls #scene-nav{position:absolute;right:var(--safe-right);top:var(--safe-top);display:flex;gap:8px;align-items:center;pointer-events:auto}
#controls #scene-nav button{position:static;inset:auto;flex:0 0 auto;width:auto;min-width:60px;min-height:40px;height:40px;margin:0;padding:0 12px;display:flex;align-items:center;gap:8px;background:var(--chrome-shade);backdrop-filter:blur(10px);color:var(--chrome-ink);border:1px solid var(--chrome-rule);border-radius:5px;box-shadow:none;font:14px var(--chrome-display);white-space:nowrap}
@media(max-width:700px){#controls #scene-nav{gap:6px}#controls #scene-nav button{padding:0 9px;font-size:13px;gap:5px}}
#controls{transition:opacity .24s ease}
#controls.inspection-chrome-hidden{opacity:0;pointer-events:none}
#controls.inspection-chrome-hidden *{pointer-events:none!important}
@media(prefers-reduced-motion:reduce){#controls{transition:none}}

/* Compact accessible launchers; scene selection belongs to the menu. */
#controls #scene-nav button{width:44px;min-width:44px;height:44px;min-height:44px;padding:0;gap:0;justify-content:center;border-radius:6px}
#controls #scene-nav button img,#controls #scene-nav button svg{display:block;width:20px;height:20px;object-fit:contain;flex:none}
#phone-label,#notebook-label,#menu-label,#notebook-count{display:none}
#menu #scene-control{position:static;display:flex;justify-content:space-between;gap:16px;width:100%;padding:10px 0;background:none;box-shadow:none;border:0;border-bottom:1px solid #7f938027;color:#304b50;min-height:44px}
#menu #location-caption{position:static;color:inherit;font:13px var(--chrome-body);letter-spacing:0}
#menu #scene-select{max-width:230px;min-height:44px;font:13px var(--chrome-body);color:#304b50;background:transparent;border:1px solid #85978c66;border-radius:4px;padding:7px 10px}
#controls #guidance{top:var(--safe-top)}