@charset "UTF-8";
/* MANOMIJE 0.6.19 — editorial finishing; engine remains 0.6.18.
   No descendant-wide background/position/color resets. Business logic is unchanged. */
:root{
 --paper:#efe3cb;--paper-2:#f6eddd;--paper-3:#e4ceb0;--white:#fbf1df;
 --ink:#24160f;--ink-2:#382317;--muted:#68513d;--line:#b3966b;--line-soft:#d7c4a7;
 --accent:#783c2d;--stamp:#7e3228;--gold:#c8a36a;--espresso:#170e09;
 --shadow:0 16px 38px rgba(38,23,13,.15);--radius:14px;
 --journal-text:#fff2dd;--journal-muted:#dccaad;
 --dark-button:linear-gradient(180deg,rgba(71,41,26,.95),rgba(27,15,9,.97));
 --paper-button:linear-gradient(180deg,rgba(253,243,223,.86),rgba(230,208,176,.72));
 color:var(--ink);background:var(--paper-2);
}
html{background:#d8c29d;color:var(--ink)}
body{
 color:var(--ink);min-height:100dvh;margin:0;
 background:linear-gradient(rgba(248,239,219,.48),rgba(232,212,177,.46)),url('/shared/assets/manomije-vintage-collage-bg.png') center 8% / cover fixed no-repeat;
}
body::before,body::after{content:none}
*{scrollbar-color:#a48256 rgba(43,27,17,.12)}
::selection{background:#743426;color:#fff4df}
a{color:#733727;text-underline-offset:3px}
h1,h2,h3,.wordmark,.language-gate-brand{font-family:Georgia,'Times New Roman','Yu Mincho','Hiragino Mincho ProN','Noto Serif CJK JP',serif}
button,input,select,textarea{font-family:-apple-system,BlinkMacSystemFont,'Hiragino Kaku Gothic ProN','Noto Sans JP',sans-serif}
/* Controls have their own background and foreground pair. */
button{background:var(--paper-button);color:var(--ink);border-color:rgba(119,79,42,.64);border-radius:8px;box-shadow:inset 0 1px 0 rgba(255,250,234,.36)}
button:disabled{opacity:1;color:#92795d;cursor:not-allowed;box-shadow:none}
button:hover:not(:disabled){border-color:#997241}
button:active:not(:disabled){transform:translateY(1px)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #d1a35d;outline-offset:3px}
input,textarea,select{background:rgba(251,241,220,.92);color:#24160f;border:1px solid #aa895d;border-radius:8px;box-shadow:inset 0 1px 2px rgba(50,31,19,.07)}
input::placeholder,textarea::placeholder{color:#705c45;opacity:1}
select option{background:#f7ecd8;color:#23160e}
.primary,.action-buttons .primary,.move-card .primary,#nextScene.primary,
.account-dialog .account-primary,.paid-plan-actions button:first-child,.edit-interests-link{
 background:var(--dark-button);color:#fff4e2;border:1px solid #694729;border-radius:8px;
 box-shadow:inset 0 1px 0 rgba(244,213,158,.22),0 3px 8px rgba(37,22,12,.12);
}
.primary:hover:not(:disabled),.action-buttons .primary:hover:not(:disabled){background:linear-gradient(#52341f,#27160d);color:#fff7e8}
.primary:disabled{background:#433429;color:#cebea5}
.outline{background:var(--paper-button);color:#2e1d13;border-color:rgba(102,65,35,.65);border-radius:8px}
.quiet{background:transparent;box-shadow:none;color:#66482c}
.eyebrow,.tiny-label,.build-tag,.hero-number{letter-spacing:.14em;color:#725134}
.muted,.small,.description,.field-hint,.save-note{color:var(--muted)}
.masthead{background:linear-gradient(rgba(249,240,222,.94),rgba(225,204,168,.86));border-bottom:3px double #64462d;box-shadow:0 3px 12px rgba(38,22,13,.08)}
.wordmark{color:#1b100a;font-weight:700;letter-spacing:.075em}
.wordmark small{color:#674c33;font-size:9px}
.build-tag{border:1px solid #a28052;background:transparent;color:#6a4b2d;border-radius:3px}
.head-actions button,.header-actions button,.header-actions a{border:1px solid #b08e60;border-radius:6px;background:var(--paper-button);color:#2d1b10}
/* No pale ancestor veil / nested backdrop root over the dark journal. */
main{position:relative;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
.workspace::before,.setup-layout::before{content:none}
.intro{background:linear-gradient(120deg,rgba(252,245,232,.94),rgba(249,240,222,.86));padding:22px 24px 19px;border-radius:12px;border:1px solid rgba(87,54,30,.12);gap:12px}
.intro::after{content:none}
.intro h1{color:#1b100a}
.connection-strip{background:rgba(249,240,222,.86);border:0;border-radius:5px;color:#594630;line-height:1.55}
.remembered-interests{color:#6b3b28}
/* The travel controls are adjacent, compact, and retain their separate functions. */
.journey-toolbar{display:flex;gap:8px;align-items:center;min-width:0;margin:6px 0 12px}
.journey-toolbar .stops{display:flex;flex:1;gap:6px;min-width:0;margin:0;padding:0;overflow:hidden;border:0}
.stops button{flex:1 1 0;width:auto;max-width:none;min-width:0;height:50px;min-height:50px;padding:6px 9px;gap:6px;overflow:hidden;border-radius:7px;background:var(--paper-button);color:#382417;border:1px solid rgba(129,91,51,.65)}
.stops button>span:first-child:not(.stop-copy){display:grid;place-items:center;flex:0 0 20px;width:20px;height:26px;background:transparent;border-radius:0;color:inherit;font-size:10px}
.stops button .stop-copy{display:block;min-width:0;flex:1;width:auto;height:auto;background:transparent;border:0;box-shadow:none;font-size:inherit}
.stops button .stop-label{display:block;font-size:12px;line-height:1.25;font-weight:700;background:transparent;color:inherit}
.stops button .stop-reason{display:block;font-size:10px;line-height:1.3;margin-top:2px;background:transparent;color:#624830}
.stops button[aria-current=step]{background:var(--dark-button);color:#fff2dc;border-color:#8f6438;box-shadow:inset 3px 0 0 #a9573e,inset 0 1px 0 rgba(238,199,132,.22)}
.stops button[aria-current=step] .stop-reason{color:#e6d0a9}
.stops button[aria-current=step]>span{background:transparent;color:#ead1aa}
.journey-tools{display:flex;gap:6px;flex:0 0 auto}
.journey-tools button{height:40px;min-height:40px;padding:6px 9px;font-size:11px;white-space:nowrap}
.world-column{min-width:0;padding:18px;background:linear-gradient(rgba(251,243,228,.95),rgba(244,231,207,.9));border:1px solid rgba(131,94,50,.25);border-radius:12px;box-shadow:0 10px 30px rgba(57,33,16,.1)}
.section-heading{border:0;border-bottom:1px solid rgba(126,91,48,.20);margin-bottom:12px;padding:0 0 12px;gap:14px}
.section-heading::after{content:'FIELD NOTES';font:10px/1.4 Georgia,serif;color:#73532f;letter-spacing:.19em;flex:0 0 auto}
.section-heading h2{color:#23150d}
.view-tabs{border:1px solid rgba(139,101,52,.27);background:rgba(195,167,126,.14);padding:3px;border-radius:8px}
.view-tabs button{background:transparent;box-shadow:none;border-radius:5px;color:#4a311e}
.view-tabs button[aria-pressed=true]{background:var(--dark-button);color:#ffefd3;box-shadow:inset 0 -2px 0 #c89f62}
.media-frame{border:1px solid #a88656;border-radius:9px;background:rgba(211,190,153,.4);box-shadow:0 2px 10px rgba(41,24,12,.13)}
.media-frame>img,.media-frame>iframe{filter:none;opacity:1}
.attribution,.media-note{color:#614a32}
.google-brand{color:#332519}
.place-info{border-bottom:1px solid rgba(150,115,68,.3);padding:14px 0;color:#382719;line-height:1.65}
.place-info strong{font-family:Georgia,'Yu Mincho',serif}
.place-knowledge,.place-knowledge-loading{background:rgba(236,218,187,.32);border:1px solid rgba(146,111,65,.20);border-radius:10px;color:#3b2819}
.place-knowledge p,.place-knowledge strong,.place-rating b{color:#3b2819}
.place-knowledge small,.place-knowledge .place-freshness,.place-knowledge .place-summary-disclosure{color:#674b30}
.place-features span{background:rgba(125,81,37,.07);color:#563821;border:1px solid rgba(144,99,47,.10)}
.media-actions{gap:6px}.media-actions button{border:1px solid #b79a6d;background:rgba(245,228,198,.6);color:#49321f;min-height:34px;padding:5px 9px}
.move-card{border-color:#b59665}.move-card p{color:#644a31}
/* Dark espresso glass. The tint alpha remains 0.30; only the backdrop is dimmed.
   Parent containers have no filter/opacity so the real page remains the backdrop. */
.conversation-column{
 position:relative;background:rgba(22,12,7,.94);color:var(--journal-text);
 border:1px solid rgba(202,158,90,.70);border-radius:22px;
 box-shadow:inset 0 1px 0 rgba(255,221,163,.18),inset 0 0 0 2px rgba(197,149,79,.09),0 18px 38px rgba(36,20,10,.24);
 overflow:hidden;opacity:1;
}
@supports ((backdrop-filter:blur(3px)) or (-webkit-backdrop-filter:blur(3px))){
 .conversation-column{background:linear-gradient(155deg,rgba(36,19,10,.30),rgba(16,8,4,.30));backdrop-filter:blur(3px) brightness(.22) saturate(.7);-webkit-backdrop-filter:blur(3px) brightness(.22) saturate(.7)}
}
.conversation-column::before{content:'MANOMIJE · CONVERSATION JOURNAL';display:block;flex:0 0 auto;margin:0 0 18px;padding:0 0 12px;border-bottom:1px solid rgba(195,152,90,.32);font:10px/1.5 Georgia,serif;letter-spacing:.19em;color:#d6b16f;pointer-events:none}
.conversation-column::after{content:none}
.conversation-column .conversation-topbar,.conversation-column .conversation-control-dock{position:static;margin:0;padding:0;border:0;background:transparent!important;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;flex:0 0 auto}
.conversation-column .companion-head{display:flex;align-items:center;gap:12px;margin:0 0 16px}
.conversation-column .companion-head>div{min-width:0;flex:1}
.conversation-column .companion-head h2{font-size:26px;color:#fff3dd;margin:0}
.conversation-column .companion-head p{font-size:11.5px;line-height:1.6;color:#e2cfab;margin-top:6px}
.conversation-column .state-label{margin-left:auto;color:#d7b477;font-size:10px;white-space:nowrap}
.conversation-column .speaker-name-row{display:flex;align-items:center;gap:12px;min-width:0}
/* A single, baked focal crop. No legacy span, orb, transformed layer or status dot. */
.conversation-column .mije-avatar-button{display:block;position:relative;flex:0 0 58px;width:58px;height:58px;min-width:58px;min-height:58px;padding:0;border:2px solid #ddbc84;border-radius:50%;overflow:hidden;background:transparent;box-shadow:0 0 0 3px rgba(168,125,62,.2);opacity:1;transform:none}
.conversation-column .mije-avatar-photo-img{position:static;display:block;width:100%;height:100%;object-fit:cover;object-position:center;transform:none;border:0;border-radius:50%;background:transparent;box-shadow:none;opacity:1;filter:grayscale(.94) sepia(.18) contrast(1.03)}
.conversation-column .mije-avatar-button.is-speaking{border-color:#f0c97d;box-shadow:0 0 0 3px rgba(222,170,81,.4)}
.conversation-column .mije-avatar-button.is-listening{border-color:#e8caa0;box-shadow:0 0 0 3px rgba(223,190,141,.32)}
.conversation-column .mije-equalizer{display:inline-flex;position:static;flex:0 0 auto;align-items:center;gap:3px;height:24px;width:30px;color:#e5b665;opacity:1;transform:none}
.conversation-column .mije-equalizer i{display:block;position:static;width:3px;min-width:3px;border-radius:2px;background:currentColor;transform-origin:center}
.conversation-column .mije-equalizer.is-active{color:#ffce75;opacity:1}
.conversation-column .language-select{color:#ead4b1;display:flex;justify-content:space-between;align-items:center;font-size:12px;margin:0 0 10px}
.conversation-column .language-select select{background:#eedbb9;color:#24150c;border:1px solid #c79c58;border-radius:7px;width:146px;min-height:38px;padding:7px 9px;font-size:14px;opacity:1}
.conversation-column .subtitle-tabs{background:rgba(16,8,3,.3);border:1px solid rgba(202,158,90,.52);border-radius:9px;padding:3px;gap:4px;margin:0 0 12px;box-shadow:inset 0 1px 1px rgba(0,0,0,.12)}
.conversation-column .subtitle-tabs button{min-height:38px;line-height:1.4;padding:6px 4px;font-size:11px;background:transparent;color:#e4d0ac;border:0;border-radius:6px;box-shadow:none;white-space:normal}
.conversation-column .subtitle-tabs button[aria-pressed=true]{background:linear-gradient(#e3c794,#b88b4d);color:#211308;box-shadow:inset 0 1px 0 #f2ddb6;font-weight:700}
#languageModeNote{display:none}
.conversation-column .dialogue{position:relative;flex:1 1 auto;min-height:0;max-height:none;overflow-y:auto;overscroll-behavior:contain;padding:2px 3px 10px 0;scrollbar-width:thin}
.conversation-column .dialogue .empty-dialogue{padding:28px 12px;color:#e1cba6;font-size:13px;line-height:1.7}
/* Both message kinds retain their rounded corners. */
 .conversation-column .message{position:relative;border:1px solid rgba(190,142,73,.26);border-radius:16px;padding:18px 19px;margin:16px 0;line-height:1.8;font-size:16px;color:#fff1da;opacity:1;box-shadow:inset 0 1px 0 rgba(251,227,188,.04)}
.conversation-column .message.assistant,.conversation-column .message.assistant.message-guide,.conversation-column .message.assistant.message-practice{background:linear-gradient(130deg,rgba(80,50,29,.48),rgba(34,19,10,.55));color:#fff1da;margin-right:0;border-left-width:1px;box-shadow:inset 0 1px 0 rgba(251,227,188,.04)}
.conversation-column .message.user{margin-left:10px;background:linear-gradient(135deg,rgba(106,58,34,.7),rgba(61,34,21,.74));color:#fff3df;border-left:3px solid #9b4a32}
.conversation-column .message>p{color:#fff1da;opacity:1}
.conversation-column .message>small,.conversation-column .message>small.message-meta{color:#d7bd92;opacity:1;font-size:10.5px;line-height:1.6;margin-bottom:9px;letter-spacing:.02em}
.conversation-column .message .message-translation{color:#e7d5b7;font-size:14px;line-height:1.8;border-color:rgba(213,179,126,.24);padding-top:12px;margin-top:12px;opacity:1}
/* Nested light islands: dark text, dark CTA with ivory text. Explicitly scoped. */
.conversation-column .message .learning-bridge,
.conversation-column .message .natural-correction,
.conversation-column .action-card,
.conversation-column .local-language-card,
.conversation-column .reply-hints,
.conversation-column .speech-recovery{
 background:linear-gradient(135deg,rgba(253,242,219,.97),rgba(234,212,174,.96));color:#2b1b0f;border:1px solid #c49c60;border-radius:13px;box-shadow:inset 0 1px 0 rgba(255,251,235,.8);opacity:1;
}
.conversation-column .message .learning-bridge{padding:12px;margin-top:12px}
.conversation-column .message .learning-bridge>p,.conversation-column .message .natural-correction>p{color:#29180d;font-size:14px;line-height:1.6;opacity:1}
.conversation-column .learning-bridge-label,.conversation-column .message .learning-bridge>small,.conversation-column .message .natural-correction>small{color:#69461e!important;font-size:11px;opacity:1}
.conversation-column .action-card>strong,.conversation-column .action-card>p,
.conversation-column .action-card>span,.conversation-column .local-language-card strong,
.conversation-column .local-language-card p{color:#352113;opacity:1}
.conversation-column .action-card>small,.conversation-column .local-language-card small{color:#745025;opacity:1}
.conversation-column .action-card .action-buttons button,.conversation-column .local-language-card .action-buttons button{background:transparent;color:#442b17;border:1px solid #aa814c;border-radius:7px;min-height:38px;padding:7px 11px;box-shadow:none}
.conversation-column .action-card .action-buttons button.primary,.conversation-column .local-language-card .action-buttons button.primary{background:var(--dark-button);color:#fff3dc;border-color:#573717;box-shadow:inset 0 1px 0 rgba(225,178,101,.25)}
.conversation-column .learning-bridge-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.conversation-column .learning-bridge-actions button{min-height:38px;padding:7px 10px;border:1px solid #9f773f;border-radius:7px;background:rgba(255,247,230,.85);color:#322014;font-size:12px;line-height:1.5;white-space:normal;box-shadow:inset 0 1px 0 #fff9ed}
.conversation-column .learning-bridge-actions button.learning-practice-primary,
.conversation-column .learning-bridge-actions button[data-practice-turn]{background:var(--dark-button);color:#fff4df;border-color:#65411f;font-weight:700;opacity:1;box-shadow:inset 0 1px 0 rgba(247,219,171,.25)}
.conversation-column .learning-bridge-actions button.learning-practice-primary:hover{background:linear-gradient(#58371e,#301b0e);color:#fff7e8}
.conversation-column .action-card.done,.conversation-column .action-card.dismissed{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;background:transparent;color:#e6d0ae;border:0;border-top:1px solid rgba(210,172,113,.2);border-radius:0;padding:9px 0 0;margin-top:11px;box-shadow:none;font-size:11px;line-height:1.5}
.conversation-column .action-card.done strong,.conversation-column .action-card.done span,.conversation-column .action-card.dismissed span{color:#e6d0ae;font-size:11px;line-height:1.5}.conversation-column .action-card.done strong{font-weight:600}
.conversation-column #localLanguageCard{background:transparent;color:inherit;padding:0;border:0;box-shadow:none}
.conversation-column #localLanguageCard:empty{display:none}
.conversation-column .local-language-card{max-height:none;overflow:visible;padding:12px}
.conversation-column .turn-score{background:#eddbba;color:#4f321a;border:1px solid #ac8549;border-radius:9px;box-shadow:none}
.conversation-column .turn-score small,.conversation-column .turn-score-label{color:#624526;opacity:1}
.conversation-column .turn-score button{background:#fbefda;color:#352013;border-color:#b18a51}
/* Bottom controls: small, legible, with original event wiring retained. */
.conversation-column #interactionFooter{position:relative;inset:auto;margin:0;padding:10px 0 0;background:transparent!important;border:0;border-top:1px solid rgba(204,161,99,.5);border-radius:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;flex:0 0 auto;z-index:3}
.conversation-column .conversation-actions{margin:0;padding:0;border:0}
.conversation-column .tools-row{display:flex;gap:5px;margin:0 0 8px}
.conversation-column .conversation-action-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;flex:4;gap:5px}
.conversation-column .extra-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));flex:2;gap:5px}
.conversation-column .tool-button{height:38px;min-height:38px;padding:6px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(205,161,92,.25);border-radius:7px;background:rgba(13,7,3,.2);color:#e8b86a;box-shadow:inset 0 1px 0 rgba(253,223,171,.05);transform:none}
.conversation-column .tool-button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7}
.conversation-column .tool-button:disabled{color:#b29873;background:rgba(255,239,209,.025);opacity:1}
.conversation-column .tool-button:hover:not(:disabled){background:rgba(189,143,72,.2);border-color:#d2a568}
.conversation-column .tool-label{display:none}
.conversation-column .composer{position:static;inset:auto;margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.conversation-column .composer-line{display:grid;grid-template-columns:54px minmax(0,1fr) 48px;gap:7px;align-items:center}
.conversation-column .composer textarea{background:rgba(22,11,5,.4);color:#fff0d7;border:1px solid #b18a50;min-height:44px;max-height:100px;padding:10px 12px;line-height:1.4;font-size:14px;border-radius:8px;resize:none}
.conversation-column .composer textarea::placeholder{color:#e0c7a0;opacity:1}
.conversation-column #recordButton{background:linear-gradient(#8b3726,#4c1c14);color:#fff4e1;border:1px solid #b06c44;border-radius:8px;min-height:44px;box-shadow:inset 0 1px 0 rgba(238,171,122,.2)}
.conversation-column #recordButton.recording{background:#a53725;color:white}
.conversation-column #sendButton{background:linear-gradient(#dbb374,#ac793b);color:#201207;border:1px solid #e0bc81;border-radius:8px;min-height:44px;box-shadow:inset 0 1px 0 rgba(255,232,190,.5)}
.conversation-column .start-talk-action{background:var(--dark-button);color:#fff1db;border:1px solid #bf985e;border-radius:8px;min-height:40px;font-size:13px;margin:0 0 8px}
.conversation-column .speech-recovery{padding:10px;gap:8px;flex-wrap:wrap}
.conversation-column .speech-recovery button{background:var(--dark-button);color:#fff2d8;border-color:#97713c}
.conversation-column .speech-recovery small{color:#654321}
.conversation-column .reply-hints{z-index:60}
.conversation-column .reply-suggestions button{color:#342010;background:rgba(254,247,231,.92);border:1px solid #bc975e;border-radius:8px}
.conversation-column .reply-suggestions small{color:#725232}
.conversation-column #conversationError{background:#5a2c20;color:#fff0d3;border-color:#c88a57;max-height:none;overflow:visible}
/* 0.6.22: retry/action labels must not inherit dark paper-panel ink. */
.conversation-column #conversationError #retryTurn{
  display:inline-flex;align-items:center;justify-content:center;margin-top:10px;
  min-height:44px;max-width:100%;padding:9px 16px;border:1px solid #f2cd83;
  border-radius:12px;background:#f6dfaf;color:#25170f;font-weight:700;
  line-height:1.45;white-space:normal;opacity:1;text-shadow:none;-webkit-text-fill-color:#25170f;
}
.conversation-column #conversationError #retryTurn:hover{background:#ffedc8;color:#25170f}
.conversation-column #conversationError #retryTurn:focus-visible{outline:3px solid #fff4d9;outline-offset:3px}
.conversation-column #conversationError #retryTurn:disabled{background:#d5c09b;color:#35271d;opacity:1;cursor:wait}
.conversation-column .speech-recovery small{color:#4b3019}

.more-menu{background:#f4e4c7;color:#311d10;border-color:#ab7e42;border-radius:12px;z-index:950}
.more-menu button{color:#342112}.more-menu button:hover{background:#e2c89e}
.action-tooltip,.toast{background:#25160c;color:#fff3dd;border:1px solid #b98e50}
.footnote{border-top:3px double #9e7b4e;color:#5a4028}
/* Settings, account, learning dialogs. */
dialog,.account-dialog{background:linear-gradient(#f8edd7,#ead5b1);color:#2e1d10;border:1px solid #a57e43;border-radius:15px;box-shadow:0 22px 65px rgba(30,16,8,.42)}
dialog::backdrop{background:rgba(22,13,7,.62);backdrop-filter:blur(3px)}
.dialog-top,.account-heading{border-bottom:1px solid #b79663;padding-bottom:12px}
.dialog-top h2,.account-heading h2{color:#27170c}
.dialog-top button{background:transparent;color:#382114}
.settings-form label,.account-form label{color:#422915}
.voice-first-setting,.account-status,.plan-panel,.account-conflict,.account-recovery,.import-confirm,
.pron-score,.review-card,.phrase-lesson,.scene-action-card,#rememberedList li{background:#ebd8b6;color:#352114;border:1px solid #baa070;border-radius:10px}
.voice-first-setting span,.account-footnote,.plan-message,.phrase-meaning,.phrase-lesson dt,.phrase-situation,.phrase-lesson .phrase-note{color:#664826}
.phrase-spoken{background:#e0c399;color:#3e2614}
.account-tabs [aria-pressed=true]{background:#2c1b0f;color:#fff0d5}
.usage-row progress{accent-color:#884d31}
/* Onboarding retains the same sepia editorial palette and real faces. */
.language-gate{border-radius:14px;background:linear-gradient(#f5e8d1,#e9d2ac);color:#2a180d;border:1px solid #99723e;box-shadow:0 0 0 4px rgba(222,189,138,.4),0 24px 70px rgba(24,13,6,.4)}
.language-gate-brand{color:#24150a;font-family:Georgia,serif}
.language-choice-grid button{background:rgba(252,244,227,.75);border-color:#bb9c6e;color:#2b1b0e;border-radius:7px}
.language-choice-grid button[aria-pressed=true]{background:var(--dark-button);color:#fff1d9;border-color:#b7925a}
.language-choice-grid button[aria-pressed=true] small{color:#e4cb9f}
.setup-content{background:rgba(250,240,221,.93);padding:30px;border:1px solid rgba(139,101,53,.26);border-radius:12px}
.companion-preview{background:#20130b;border:1px solid #aa8149;border-radius:14px;box-shadow:var(--shadow)}
.companion-preview>img,.face-picture img,.face-avatar{filter:grayscale(.94) sepia(.18) contrast(1.04)}
.companion-preview:after{background:linear-gradient(180deg,transparent 32%,rgba(31,16,8,.25) 55%,rgba(22,12,6,.96))}
.hero-number{background:rgba(20,12,7,.5);border:1px solid #c7a773;color:#f1d9b0;border-radius:3px}
.hero-copy{color:#fff3db}.hero-copy .eyebrow{color:#e4c486}.hero-sub,.preview-pair small{color:#ead6b2}.pair-mark{color:#cfaa69}
.face-avatar{border-color:#e6c99b}.face-picture{border-radius:9px;background:#dfc8a1}
.face-choice input:checked+.face-picture{outline:2px solid #926331;outline-offset:3px}.face-picture:after{background:#5a371c;color:#ffefd0}
.face-label{color:#52351e}
.stepper{border-bottom:1px solid #b59a73}.stepper button{background:transparent;box-shadow:none;color:#62472b}.stepper button[aria-current=step]{color:#1e1008;border-color:#84582c}
.gentle-note,.interest-depth{background:#ecd9b7;color:#523820;border-color:#b99d6b;border-radius:9px}
.interest-choice span,.interest-groups,.interest-group,.voice-card,.welcome-card{background:rgba(253,244,227,.65);border-color:#c8aa7a;border-radius:9px;color:#3c2513}
.interest-choice input:checked+span,.depth-choice input:checked+span,.depth-custom button{background:var(--dark-button);color:#fff2d9;border-color:#8f6337}
.interest-depth input,.interest-depth select,.depth-choice span,.depth-selected button{background:#f7ecd5;border-color:#b99a65;color:#432a17}
.icon-preview,.final-pair,.form-navigation,.setup-footer{border-color:#b19569}
.mije-scene-card,.mije-scene-card.is-academic{background:linear-gradient(135deg,#25170e,#50331e);color:#fff1d8}
.mije-scene-portrait img{filter:grayscale(.94) sepia(.16)}
.mije-scene-copy small{color:#e4be7b}.mije-scene-copy span{color:#e6cfaa}.academic-role-mark{background:#28190d;color:#f7e0b8;border-color:#c49c59}
/* Editorial hierarchy. Display-only fields copy visible labels; original engine IDs remain intact. */
.editorial-heading{min-width:0}
.editorial-kicker{font:10px/1.6 Georgia,'Times New Roman',serif;letter-spacing:.20em;color:#71522e;margin:0 0 9px;display:flex;gap:10px;align-items:center}
.editorial-kicker::before{content:'';width:26px;height:1px;background:#9d7946;flex:0 0 auto}
.editorial-place-title{color:#1c1009;font:500 clamp(28px,2.5vw,40px)/1.35 Georgia,'Times New Roman','Yu Mincho','Hiragino Mincho ProN','Noto Serif CJK JP',serif;letter-spacing:.015em;margin:0 0 10px;overflow-wrap:anywhere;word-break:normal;text-wrap:balance}
.editorial-place-title.is-latin{font-size:clamp(30px,2.6vw,43px);letter-spacing:-.015em}
.editorial-location{font-size:12px;line-height:1.65;letter-spacing:.02em;color:#624b30;margin:0;overflow-wrap:anywhere}
.editorial-finish .intro #greeting{font-size:11.5px;line-height:1.65;color:#654d33;margin:9px 0 0}
.editorial-finish .section-heading h2{font-size:19px;line-height:1.4;white-space:normal;overflow:visible;margin:3px 0 0}
.editorial-finish .section-heading .tiny-label{font-size:10px;letter-spacing:.14em;line-height:1.5}
.editorial-finish .view-tabs button{min-height:36px;font-size:12px;padding:7px 9px}
.editorial-finish .attribution{font-size:10.5px;line-height:1.65;margin-top:8px}
.editorial-finish .place-info{font-size:12.5px;margin:10px 0}
.editorial-finish .place-info>strong{font-size:17px;line-height:1.45}
.editorial-finish .place-knowledge{margin-top:16px;padding:15px}
.editorial-finish .place-knowledge p{font-size:12.5px;line-height:1.75}
.editorial-finish .media-note{font-size:10.5px;line-height:1.65}
.editorial-finish .move-card{padding-top:16px;border-color:rgba(142,105,59,.26)}
.editorial-finish .move-card strong{font-size:14px;font-weight:600}
.editorial-finish .move-card p{font-size:11.5px;line-height:1.6}
.editorial-finish .move-card button{min-height:42px;font-size:12px;padding:8px 13px}
.editorial-finish .stops button{height:50px;min-height:50px;box-shadow:inset 0 1px 0 rgba(255,250,235,.22);border-color:rgba(130,94,51,.36)}
.editorial-finish .stops button .stop-label{font-size:12.5px;line-height:1.35;text-align:left}
.editorial-finish .stops button .stop-reason{font-size:10.5px;line-height:1.35;text-align:left}
.editorial-finish .stops button[aria-current=step]{border-color:rgba(195,153,91,.65);box-shadow:inset 3px 0 0 #a9573e}
.editorial-finish .journey-tools button{border-color:rgba(133,94,51,.42);box-shadow:none}
.editorial-finish .head-actions button{font-size:12px;min-height:36px;padding:7px 12px;border-color:rgba(136,94,46,.36);box-shadow:none}
.editorial-finish .build-tag{font-size:9px;letter-spacing:.14em;border-color:rgba(133,94,51,.35);padding:4px 7px}
/* Give the photograph and live conversation room without enlarging controls. */
@media(min-width:881px){
 .editorial-finish .masthead{min-height:72px;padding:14px max(32px,calc((100% - 1540px)/2));gap:20px}
 .editorial-finish .wordmark{font-size:29px;letter-spacing:.07em}.editorial-finish .wordmark small{font-size:9px;letter-spacing:.18em}
 .journey-page main{display:grid;grid-template-columns:minmax(0,1.32fr) minmax(415px,1fr);column-gap:28px;row-gap:0;width:calc(100% - 64px);max-width:1540px;margin:0 auto;padding:24px 0 36px;align-items:start}
 .journey-page .intro{grid-column:1;grid-row:1;display:block;margin:0;min-height:0}
 .journey-page .connection-strip{grid-column:1;grid-row:2;margin:8px 0 10px;font-size:11px;padding:5px 12px;display:block}
 .journey-page .journey-toolbar{grid-column:1;grid-row:3;margin:0 0 14px;gap:8px}
 .journey-page .workspace{display:contents}
 .journey-page .world-column{grid-column:1;grid-row:4}
 .journey-page .conversation-column{grid-column:2;grid-row:1/5;display:flex;flex-direction:column;position:sticky;top:16px;height:var(--conversation-height,calc(100dvh - 114px));min-height:400px;max-height:none;padding:22px;overflow:hidden}
 .journey-page .footnote{grid-column:1/-1;grid-row:5;font-size:11px;line-height:1.7;padding-top:16px;border-top:1px solid rgba(103,73,40,.25);background:rgba(249,240,222,.86)}
 .journey-page .media-frame{height:clamp(285px,calc(100dvh - 435px),635px)}
}
@media(min-width:881px) and (max-width:1199px){
 .journey-page main{grid-template-columns:minmax(0,1.15fr) minmax(370px,1fr);width:calc(100% - 36px);gap:18px;padding:18px 0 30px}
 .editorial-finish .masthead{padding:12px 20px;min-height:64px}
 .journey-toolbar{flex-wrap:wrap}.journey-toolbar .stops{flex-basis:100%}.journey-tools{margin-left:auto}
 .journey-page .conversation-column{padding:17px}.conversation-column .message{font-size:15px;padding:16px;line-height:1.75}
 .editorial-place-title{font-size:29px}.editorial-place-title.is-latin{font-size:32px}
 .journey-page .intro{padding:19px}.editorial-finish .section-heading::after{display:none}
}
@media(max-width:880px){
 .journey-page main{display:block;width:100%;max-width:820px;margin:0 auto;padding:17px 14px 28px}
 .editorial-finish .masthead{padding:15px 16px;gap:10px;min-height:68px}.editorial-finish .head-actions{gap:6px}
 .editorial-finish .wordmark{font-size:24px}.editorial-finish .head-actions button{padding:6px 9px;font-size:12px}
 .journey-page .intro{padding:21px 19px}.editorial-place-title{font-size:28px;line-height:1.45}.editorial-place-title.is-latin{font-size:32px}
 .editorial-location{font-size:11.5px}.editorial-kicker{font-size:9px}.editorial-finish .intro #greeting{font-size:11px;line-height:1.7}
 .journey-page .connection-strip{margin:8px 0;font-size:10.5px;padding:6px 10px}
 .journey-toolbar{flex-wrap:wrap;margin-bottom:13px}.journey-toolbar .stops{flex-basis:100%;overflow-x:auto;padding-bottom:3px}
 .stops button{min-width:135px;flex:1;min-height:50px;height:50px}.journey-tools{margin-left:auto}
 .world-column{padding:12px}.section-heading::after{display:none}
 .journey-page .conversation-column{display:flex;flex-direction:column;position:relative;top:auto;margin-top:22px;height:calc(100dvh - 20px);max-height:none;min-height:565px;padding:16px;border-radius:18px;overflow:hidden;scroll-margin-top:8px}
 .conversation-column .dialogue{min-height:0;overflow-y:auto;max-height:none}
 .conversation-column .companion-head h2{font-size:24px}.conversation-column .companion-head p{font-size:10.5px;white-space:normal;overflow:visible;line-height:1.55}
 .conversation-column .mije-avatar-button{width:50px;height:50px;min-width:50px;min-height:50px;flex-basis:50px}
 .conversation-column .subtitle-tabs button{font-size:10px;min-height:40px}
 .conversation-column .language-select select{font-size:16px;min-height:40px}
 .conversation-column .message{font-size:15px;line-height:1.75;padding:14px;margin:13px 0;border-radius:16px}
 .conversation-column .message .message-translation{font-size:13px;line-height:1.8}
 .conversation-column .message.user{margin-left:6px}
 .conversation-column .learning-bridge-actions button{min-height:40px;font-size:11px;padding:7px}
 .conversation-column .action-buttons{display:flex;flex-wrap:wrap}
 .conversation-column .action-buttons button{width:auto;min-height:40px}
 .conversation-column .composer textarea{font-size:16px;padding:9px}
 .conversation-column .tool-button{height:40px;min-height:40px}
 .conversation-column .local-language-card{max-height:none;overflow:visible}
 .setup-content{padding:20px}.companion-preview:after{background:linear-gradient(90deg,transparent 15%,#28180e 47%)}
 .hero-copy{color:#ffefd4}
}
@media(max-width:370px){.editorial-finish .wordmark{font-size:21px}.editorial-finish .head-actions button{padding:5px 6px}.editorial-place-title{font-size:26px}.journey-page .conversation-column{padding:13px}}
@media(prefers-reduced-motion:reduce){.mije-equalizer.is-active i{animation:none}.primary:hover:not(:disabled){transform:none}}

/* Empty / pending views retain the theme without pretending to be a real photo. */
.destination-welcome{background:linear-gradient(135deg,#402717,#1d1009);color:#fff2db}
.destination-welcome p{color:#ead8b8}.destination-prompts span{background:rgba(224,181,110,.12);color:#f5dfba;border-color:#a98046}
.free-journey-dialog{background:linear-gradient(#f8edd7,#ead5b1);border-color:#a57e43}
.free-journey-finish h2,.free-journey-summary strong,.free-journey-summary span{color:#3d2615}
.free-journey-summary{background:#edd9b5;border-color:#b99a62}
.scene-role-chip{background:#dec196;color:#503116}


/* 0.7.2 — WEB one-screen composition.
   Keep every existing control, but reserve the viewport for the photograph and live dialogue. */
@media(min-width:881px){
  .journey-page main{
    grid-template-columns:minmax(0,1.08fr) minmax(520px,.92fr);
    grid-template-rows:max-content max-content max-content max-content auto;
    column-gap:20px;
    width:calc(100% - 40px);
    max-width:1580px;
    padding:12px 0 18px;
  }
  .journey-page .intro{
    padding:12px 16px 10px;
    min-height:0;
  }
  .journey-page .intro #greeting{
    margin:4px 0 0;
    font-size:10.5px;
    line-height:1.45;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;
  }
  .journey-page .journey-toolbar{margin:5px 0 8px;gap:6px}
  .journey-page .stops button{height:40px;min-height:40px;padding:5px 8px}
  .journey-page .journey-tools button{height:34px;min-height:34px;padding:4px 8px}

  /* The media controls are visually placed immediately under the photograph.
     Place details remain available below without pushing photo navigation off-screen. */
  .journey-page .world-column{
    padding:10px 12px 12px;
    display:grid;
    grid-template-columns:minmax(0,1fr);
    grid-template-areas:
      "heading"
      "tabs"
      "media"
      "actions"
      "attribution"
      "place"
      "notebook"
      "note"
      "move";
    align-content:start;
    min-height:0;
  }
  .journey-page .world-column .section-heading{grid-area:heading;margin:0 0 4px;padding-bottom:5px;min-height:28px}
  .journey-page .world-column .view-tabs{grid-area:tabs;margin:2px 0 5px;padding:2px}
  .journey-page .world-column .view-tabs button{min-height:29px;padding:3px 6px;font-size:9.5px}
  .journey-page .world-column .media-frame{
    grid-area:media;
    height:clamp(250px,calc(100dvh - 500px),400px)!important;
    min-height:250px;
    border-radius:9px;
  }
  .journey-page .world-column .media-actions{
    grid-area:actions;
    display:flex;
    justify-content:flex-end;
    align-items:center;
    gap:5px;
    min-height:30px;
    margin:5px 0 0;
  }
  .journey-page .world-column .media-actions button{
    min-height:28px;
    height:28px;
    padding:3px 8px;
    font-size:9.5px;
    line-height:1.1;
  }
  .journey-page .world-column .attribution{
    grid-area:attribution;
    margin:3px 0 0;
    max-height:28px;
    overflow:auto;
    font-size:8.5px;
    line-height:1.35;
  }
  .journey-page .world-column .place-info{
    grid-area:place;
    margin:4px 0 0;
    padding:5px 0;
    max-height:58px;
    overflow:auto;
    font-size:10px;
    line-height:1.4;
  }
  .journey-page .world-column .place-info strong{font-size:13px}
  .journey-page .world-column #notebookToolbar{grid-area:notebook;margin-top:3px}
  .journey-page .world-column .media-note{grid-area:note;margin:3px 0 0;font-size:8.5px;line-height:1.35}
  .journey-page .world-column .move-card{grid-area:move;margin-top:5px;padding-top:6px;min-height:38px;gap:8px}
  .journey-page .world-column .move-card strong{font-size:11px}
  .journey-page .world-column .move-card p{font-size:9px;line-height:1.35;margin:1px 0}
  .journey-page .world-column .move-card button{min-height:32px;padding:4px 9px;font-size:10px}

  /* Conversation: keep all controls, compress their chrome, give the scrollable journal the space. */
  .journey-page .conversation-column{
    height:calc(100dvh - 94px);
    min-height:500px;
    contain:size;
    top:8px;
    padding:11px 13px 10px;
  }
  .journey-page .conversation-column::before{
    margin:0 0 6px;
    padding:0 0 5px;
    font-size:8px;
    line-height:1.3;
  }
  .journey-page .conversation-topbar{display:grid;grid-template-columns:minmax(0,1fr);gap:5px}
  .journey-page .conversation-column .companion-head{margin:0;gap:8px;min-height:42px}
  .journey-page .conversation-column .mije-avatar-button{
    width:42px;height:42px;min-width:42px;min-height:42px;flex-basis:42px;
  }
  .journey-page .conversation-column .companion-head h2{font-size:21px}
  .journey-page .conversation-column .companion-head p{
    margin-top:1px;font-size:9px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  .journey-page .conversation-column .state-label{font-size:9px}
  .journey-page .conversation-column .conversation-control-dock{
    display:grid;
    grid-template-columns:minmax(165px,190px) minmax(0,1fr);
    align-items:center;
    gap:5px 7px;
  }
  .journey-page .conversation-column .language-select{margin:0;font-size:9px;gap:5px}
  .journey-page .conversation-column .language-select select{
    width:118px;min-height:30px;height:30px;padding:3px 6px;font-size:11px;border-radius:6px;
  }
  .journey-page .conversation-column .subtitle-tabs{margin:0;padding:2px;gap:2px}
  .journey-page .conversation-column .subtitle-tabs button{
    min-height:30px;height:30px;padding:2px 3px;font-size:8.5px;line-height:1.15;
  }
  .journey-page .conversation-column #languageModeNote{display:none}
  .journey-page .conversation-column .dialogue{
    flex:1 1 auto;min-height:0;max-height:none;overflow-y:auto;padding:2px 3px 4px 0;
  }
  .journey-page .conversation-column .message{padding:10px 12px;margin:6px 0;font-size:14px;line-height:1.55}
  .journey-page .conversation-column #interactionFooter{padding-top:5px}
  .journey-page .conversation-column .start-talk-action{
    min-height:31px;height:31px;margin:0 0 4px;padding:3px 8px;font-size:9.5px;
  }
  .journey-page .conversation-column .tools-row{gap:4px;margin:0 0 4px}
  .journey-page .conversation-column .conversation-action-grid,
  .journey-page .conversation-column .extra-tools{gap:4px}
  .journey-page .conversation-column .tool-button{
    height:33px;min-height:33px;min-width:36px;padding:4px;border-radius:6px;
  }
  .journey-page .conversation-column .tool-button svg{width:17px;height:17px}
  .journey-page .conversation-column .composer-line{grid-template-columns:50px minmax(0,1fr) 44px;gap:5px}
  .journey-page .conversation-column .composer textarea{
    min-height:36px;height:36px;max-height:72px;padding:7px 9px;font-size:12px;line-height:1.35;
  }
  .journey-page .conversation-column #recordButton,
  .journey-page .conversation-column #sendButton{
    min-height:36px;height:36px;padding:4px 5px;font-size:10px;
  }
}
@media(min-width:1200px){
  .journey-page main{grid-template-columns:minmax(0,1.04fr) minmax(560px,.96fr)}
}
@media(min-width:881px) and (max-height:760px){
  .journey-page .world-column .media-frame{height:clamp(230px,calc(100dvh - 455px),330px)!important;min-height:230px}
  .journey-page .conversation-column{height:calc(100dvh - 84px);min-height:430px}
}
