/* Passenger interface: warm paper, quiet chrome, generous touch targets. */
:root{--ui-paper:#f4f0e5f5;--ui-ink:#283d39;--ui-muted:#778078;--ui-line:#a6ad9e66;--ui-accent:#365c50;--panel:var(--ui-paper);--line:var(--ui-line);font-family:"Malgun Gothic","Segoe UI",sans-serif;}
button,select,input{font-family:inherit;}
button,select{border-color:var(--ui-line);background:var(--ui-paper);color:var(--ui-ink);border-radius:12px;transition:background .16s,border-color .16s,box-shadow .16s;}
button:hover{background:#fffdf6;border-color:#778f7f;}
button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #648979;outline-offset:3px;}
button[aria-pressed="true"]{background:#dce5d8;border-color:#8aab95;color:#254a3d;}
button:disabled{opacity:.38;}
header{inset:16px 20px auto;grid-template-columns:auto minmax(0,1fr) auto;gap:20px;align-items:start;}
.train-brand{pointer-events:auto;display:flex;flex-direction:column;gap:4px;padding:10px 13px;background:var(--ui-paper);border:1px solid var(--ui-line);border-radius:14px;box-shadow:0 4px 20px #0b21191c;}
header .train-brand .train-service{padding:0;border:0;border-radius:0;box-shadow:none;background:none;color:var(--ui-ink);font-size:15px;line-height:1.2;letter-spacing:-.6px;}
.train-service small{color:#63776a;font-size:10px;letter-spacing:0;margin-top:4px;}
.train-service small b{font-size:10px;color:#4f6655;margin-right:5px;}
#edition{position:static;display:flex;align-items:center;justify-content:flex-start;flex-direction:row;gap:7px;min-height:0;width:auto;padding:5px 0 0;margin:0;border:0;border-top:1px solid #a9b2a34d;border-radius:0;background:none;color:#788579;}
#edition b{font-size:10px;font-weight:600;color:#3b5d4a;}#edition span{font-size:9px;color:#7c877e;}
#segment{align-self:start;max-width:280px;min-height:52px;gap:7px;padding:11px 14px;border-radius:14px;background:var(--ui-paper);border-color:var(--ui-line);box-shadow:0 4px 20px #0b21191c;}
.train-board-top{display:none;}.train-board-main{gap:18px;}#next-station{font-size:14px;color:#314b3e;font-weight:650;letter-spacing:-.4px;}#service-phase{font-size:10px;color:#78887b;}
.board-progress{height:2px;background:#66866a22;}.board-progress span{background:#7f9c7a;}
.toolbar{gap:6px;}.toolbar button{width:40px;min-height:40px;height:40px;padding:9px;border-radius:50%;font-size:11px;box-shadow:0 3px 15px #10231e14;}
.toolbar button svg{width:20px;height:20px;flex-basis:20px;}
.toolbar #invite,.toolbar #leave{width:auto;padding:0 12px;border-radius:12px;font-size:11px;}
.toolbar #leave{color:#7d6252;}
#dock{bottom:calc(16px + env(safe-area-inset-bottom));display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"actions actions" "status views";column-gap:10px;row-gap:9px;align-items:center;justify-items:stretch;max-width:calc(100% - 32px);width:max-content;}
#actions{grid-area:actions;display:flex;flex-wrap:nowrap;gap:3px;justify-content:center;padding:5px;border:1px solid var(--ui-line);border-radius:19px;background:var(--ui-paper);box-shadow:0 8px 32px #081c2730;}
#actions button{min-width:82px;min-height:46px;padding:8px 12px;gap:7px;border:0;border-radius:14px;background:transparent;color:#425749;font-size:12px;}
#actions button svg{width:20px;height:20px;flex-basis:20px;}#actions button:hover{background:#e5e9dc;}#actions button[aria-pressed="true"]{background:#dce4d3;box-shadow:none;color:#355744;}
#travel-status-row{grid-area:status;justify-content:flex-start;gap:6px;}
#travel-status-row #status{flex:1;margin:0;min-height:0;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:#10251b9c;border:1px solid #dce7cb27;color:#e4eadc;font-size:10px;line-height:1.5;padding:7px 11px;border-radius:20px;text-align:left;}
#chat-open,#bread-open{width:36px;min-width:36px;min-height:36px;height:36px;padding:8px;font-size:12px;border-radius:50%;box-shadow:0 3px 15px #10231e14;}
#chat-open svg{width:18px;height:18px;}#bread-open{width:auto;max-width:70px;white-space:nowrap;}#bread-open[data-owned="true"]{background:#e9e2ca;border-color:#bdad7d;}
#views{grid-area:views;position:static;display:flex;gap:6px;align-items:center;justify-content:flex-end;}
#views button{display:inline-flex;gap:6px;min-height:36px;padding:7px 11px;border-radius:20px;background:var(--ui-paper);color:#4b6252;font-size:10px;border-color:var(--ui-line);}
#views button svg{width:16px;height:16px;flex-basis:16px;}#views #carriage-view{display:none;}
#notice{color:#34483c;background:var(--ui-paper);border:1px solid var(--ui-line);box-shadow:0 8px 30px #102e2529;border-radius:12px;font-size:12px;}
#touch-guide{color:#eceddf;background:#10251bc9;border:1px solid #c3d5ba33;border-radius:20px;font-size:11px;top:132px;}
#bread-steal-near{background:#f4eddbf5;color:#64573c;border:1px solid #c4ae7d;border-radius:24px;font-size:12px;bottom:calc(140px + env(safe-area-inset-bottom));box-shadow:0 5px 20px #14291a33;}
#restore-ui{background:var(--ui-paper);color:#3e5745;border-color:var(--ui-line);border-radius:24px;}

/* One visual language for every sheet. Native dialog focus/escape remain intact. */
#settings,#invitation,#journey-panel,#mobile-menu,#seat-panel,#wardrobe,#nickname-dialog,#bread-dialog,#chat-dialog,#snack-menu{background:var(--ui-paper);color:var(--ui-ink);border:1px solid #aeb5a18c;border-radius:22px;box-shadow:0 20px 90px #081a1b5c;padding:22px;}
dialog::backdrop{background:#0a1c2280;backdrop-filter:blur(3px);}
dialog h2{color:#304f3e;letter-spacing:-.5px;font-size:18px;font-weight:650;}
dialog form[method="dialog"]>button,.seat-panel-header>button{min-height:36px;padding:7px 12px;border-radius:20px;font-size:11px;background:#e6e8dc;border-color:transparent;color:#58705c;}
dialog p,.bread-help,#bread-feedback,#bread-owned,#nickname-dialog p,#mobile-menu p{color:#778372;font-size:12px;line-height:1.7;}
dialog input:not([type="range"]),dialog select,#nickname-dialog input,#invitation input{background:#fffdf5;color:#344b3b;border:1px solid #a4b09b80;border-radius:11px;min-height:44px;padding:10px;font-size:16px;}
dialog input[type="range"]{accent-color:#64856a;}
#settings label,.sound-mixer summary{color:#45664b;}#settings output{color:#798a74;}
.sound-mixer,.sound-mixer>div{border-color:#bbc1ae6b;}.sound-mixer select{background:#fffdf5;color:#344b3b;}
#mobile-menu{width:min(350px,calc(100% - 24px));}.mobile-menu-items{gap:7px;}.mobile-menu-items button{background:#e8eadf;border:0;border-radius:12px;min-height:48px;font-size:13px;color:#466047;}.mobile-menu-items #leave{color:#8e6956;}
#nickname-dialog .nickname{gap:10px;}#save-name,#copy-invite,#chat-send,.seat-panel-footer>button,#board{background:#365f4b;color:#f7f2e3;border-color:#365f4b;box-shadow:0 3px 10px #2e513518;}
#save-name:hover,#copy-invite:hover,#chat-send:hover,.seat-panel-footer>button:hover,#board:hover{background:#294f3d;}
#seat-panel{width:min(420px,calc(100% - 24px));max-height:min(740px,calc(var(--visual-height,100dvh) - 48px));bottom:24px;}
.seat-panel-header,.seat-panel-footer{background:transparent;padding:0 0 12px;}.seat-panel-footer{padding:12px 0 0;border-top:1px solid #b8c0ac6b;}.seat-panel-header h2{font-size:18px;}
.seat-grid{gap:7px;}.seat-grid button{min-height:76px;border-radius:13px;border:1px solid #b1bea46b;background:#e6eadf;color:#42604a;padding:9px 3px;}
.seat-grid button:hover{background:#dce5d3;}.seat-grid button[aria-pressed="true"]{background:#cedfc8;border-color:#6b9270;box-shadow:inset 0 0 0 1px #6b9270;}
.seat-back{fill:#b6cbb1;stroke:#739877;}.seat-cushion{fill:#98b898;stroke:#739877;}.seat-arm{stroke:#739877;}.seat-grid .seat-name,.seat-grid small,.seat-grid .seat-owner{color:#718369;}
.seat-aisle,.seat-row-label,.seat-section-title{color:#8a947e;}.seat-recommend{background:#e4e8da;color:#5a7557;border-color:#afbea0;}
#seat-feedback{color:#6e7f62;font-size:11px;}.seat-panel-footer>button{min-height:46px;border-radius:12px;font-size:13px;}
#steal-seat{background:#80674c;border-color:#80674c;}
.wardrobe-header{border-bottom:1px solid #b9c2ae66;padding-bottom:15px;}.wardrobe-preview{background:radial-gradient(ellipse at 50% 25%,#fcf8ec,#ced8bf);border:1px solid #bcc7b366;border-radius:16px;}.wardrobe-preview p{color:#7a8c70;font-size:10px;}
.wardrobe-turn button,#random-look{color:#4e6d4d;background:#f2f2e5d9;border:1px solid #bac8ae80;border-radius:20px;font-size:11px;}
.wardrobe-options fieldset{border-color:#b9c3ae55;}.wardrobe-options legend{color:#71856a;font-size:11px;}.wardrobe-options button{background:#e7ecdf;color:#597250;border:1px solid #bfccb275;border-radius:12px;font-size:11px;min-height:62px;}
.wardrobe-options button[aria-pressed="true"]{background:#d7e4ca;border-color:#7f9f72;color:#3b5d35;box-shadow:inset 0 0 0 1px #8ba77c;}.wardrobe-options button[aria-pressed="true"]::after{color:#477240;}.appearance-swatch{border-color:#fff9ec;box-shadow:0 1px 5px #30492d33;}
#wardrobe-status{color:#748b69;font-size:11px;}
#chat-dialog{width:min(380px,calc(100% - 24px));}.chat-hint{font-size:10px;}#chat-log:empty::after{color:#8b9682;}.chat-message b{color:#85957b;}.chat-message span{background:#e2e8d8;color:#3f563d;border-radius:4px 14px 14px;}.chat-message[data-own="true"] span{background:#d0dfc3;color:#365337;border-radius:14px 4px 14px 14px;}
#chat-feedback{font-size:11px;color:#9b785b;}.chat-unread{background:#7b9671;color:#fffdf1;box-shadow:0 0 0 2px #f4f0e5;}
#chat-input,#settings select{background:#fffdf5;color:#344b3b;border-color:#a4b09b80;}
#boarding #board{background:#365f4b;color:#f7f2e3;border-color:#365f4b;}#boarding #board:hover{background:#294f3d;}
#journey-panel li[aria-current]{background:#dce7cf;color:#3e633c;}#journey-panel li[aria-current]::before{background:#7d9d73;box-shadow:0 0 0 4px #92ad7d25;}#journey-panel li[data-passed="true"]{color:#9aa38f;}
#settings form,#invitation form,#journey-panel form{background:#f4f0e5;box-shadow:0 -22px 0 #f4f0e5;}
#settings p,#journey-panel .service-badge,#journey-panel .journey-note,#journey-panel .timetable-caption{color:#7b8c70;}
#settings input{accent-color:#78946e;}
#journey-panel .journey-live{background:#e0e7d6;border-color:#bac8ac6b;}#journey-panel .journey-live small,#journey-panel h3 small{color:#7d936f;}
#journey-panel .journey-destinations small{color:#8a9a7c;}#journey-panel .journey-destinations span{color:#7b916d;}#journey-panel .journey-note a{color:#648257;}#journey-panel progress{accent-color:#78966b;}
.quiet-seat-zone{background:#e2e9d7;border-color:#b2c5a080;}.quiet-seat-zone h3,.quiet-pair p{color:#6e8560;}.seat-map-heading,.seat-divider{color:#8b977b;}.seat-arms{stroke:#7f9c76;}
.seat-grid button[aria-pressed="true"]{outline-color:#7d9c70;}.seat-grid button[aria-pressed="true"]::after{color:#527746;}
.seat-grid button:disabled{background:#e3e3d7;color:#9b9f91;border-color:#c3c9b8;}.seat-grid button:disabled .seat-back{fill:#c5cbbd;stroke:#a2af98;}
.bread-owner{border-color:#b6c2aa66;}.bread-owner p{color:#637a58;}.bread-owner button{background:#e6ebda;color:#58734b;min-height:44px;}
.snack-options button{background:#e7ecdd;color:#4b6748;border-color:#b2c19f80;border-radius:16px;}
#journey-panel li{border-color:#bbc5b155;color:#728568;}#journey-panel li.current{background:#dce7cf;color:#3e633c;}#journey-panel li.done{color:#9aa38f;}
#boarding{background:#f3efe2f5;border:1px solid #bfc4ad80;box-shadow:0 20px 100px #091f2a50;color:#324c3c;border-radius:26px;padding:30px;width:min(410px,calc(100% - 32px));}
#boarding h1{font-size:36px;font-weight:550;letter-spacing:-2px;color:#365540;}#boarding h1 span{font-size:24px;color:#9aa988;}.boarding-eyebrow{font-size:10px;color:#859279;letter-spacing:1.5px;}#boarding .boarding-subtitle{font-size:12px;color:#7e8f73;}
.boarding-ticket{border-color:#b0bba366!important;background:transparent!important;}.boarding-ticket span{color:#89977d;}#boarding .boarding-ticket b{color:#476443;font-weight:500;font-size:25px;}
.boarding-reference{color:#9aa48b;font-size:9px!important;}.boarding-experience{background:#dfe7d180;border-color:#c4ceb47a;color:#6f8361;}#boarding-state{font-size:12px;color:#78916b;}.boarding-name{color:#718367;font-size:11px;}.boarding-name input{background:#fffcf2;color:#395438;border-color:#b9c6aa;}
#boarding #board{border-radius:13px;min-height:48px;font-size:14px;font-weight:500;}#boarding #other-room{background:transparent;color:#7c8b6f;border-color:transparent;font-size:11px;min-height:38px;}.boarding-footnote{color:#9aa28f;}
@media(max-width:600px),(max-height:480px){
 header{inset:calc(10px + env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) auto max(8px,env(safe-area-inset-left));grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:start;}
 .train-brand{grid-column:1;grid-row:1;padding:8px 10px;border-radius:12px;max-width:148px;gap:3px;}body header .train-brand .train-service{font-size:12px;white-space:nowrap;}.train-service small{font-size:9px;margin-top:3px;}.train-service small b{font-size:9px;}body header .train-brand .train-service small{display:block;}
 header .toolbar{grid-column:2;grid-row:1;gap:4px;}header .toolbar button{width:38px;min-height:38px;height:38px;padding:9px;}header .toolbar button svg{width:19px;height:19px;flex-basis:19px;}
 #edition{position:static;flex-direction:row;width:auto;min-height:0;padding:4px 0 0;gap:5px;}#edition b{font-size:9px;}#edition span{font-size:8px;}
 #segment{grid-column:1 / -1;grid-row:2;justify-self:stretch;width:100%;max-width:none;min-height:42px;padding:9px 12px;gap:6px;border-radius:12px;}#next-station{font-size:12px;}#service-phase{font-size:9px;}
 #dock{bottom:calc(10px + env(safe-area-inset-bottom));width:calc(100% - 16px);max-width:520px;column-gap:6px;row-gap:7px;}
 #actions{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);padding:4px;gap:1px;border-radius:17px;width:100%;min-width:0;}
 #actions button{min-width:44px;min-height:54px;padding:7px 2px;gap:4px;border-radius:12px;font-size:0;flex-direction:column;}#actions button::after{font-size:9px;line-height:1.2;}#actions button svg{width:20px;height:20px;flex-basis:20px;}
 #travel-status-row{gap:5px;}#travel-status-row #status{font-size:9px;padding:7px 8px;line-height:1.5;min-width:0;}
 #chat-open,#bread-open{min-width:36px;min-height:36px;height:36px;font-size:11px;padding:8px;}
 #views{position:static;gap:5px;}#views button{width:36px;height:36px;min-height:36px;padding:9px;font-size:0;border-radius:50%;}#views button svg{width:17px;height:17px;flex-basis:17px;}
 #views #window-view{width:44px;height:44px;min-height:44px;padding:12px;font-size:0;}#views #window-view::after{display:none;content:none;}
 #touch-guide{top:calc(125px + env(safe-area-inset-top));font-size:10px;max-width:calc(100% - 24px);padding:8px 10px;}
 #bread-steal-near{bottom:calc(128px + env(safe-area-inset-bottom));font-size:11px;min-height:42px;}
 #settings,#invitation,#journey-panel,#mobile-menu,#nickname-dialog,#bread-dialog,#chat-dialog,#snack-menu{padding:18px;border-radius:20px;inset:auto 8px calc(8px + env(safe-area-inset-bottom) + var(--keyboard-inset,0px));width:auto;max-width:540px;margin:0 auto;max-height:calc(var(--visual-height,100dvh) - env(safe-area-inset-top) - 20px);}
 #seat-panel{padding:15px;bottom:calc(8px + env(safe-area-inset-bottom));max-height:calc(var(--visual-height,100dvh) - env(safe-area-inset-top) - 20px);border-radius:20px;width:calc(100% - 16px);max-width:440px;}
 .seat-grid{gap:5px;}.seat-grid button{min-height:70px;padding:7px 2px;font-size:11px;}.seat-grid button svg{width:25px;height:29px;}.seat-panel-header h2,dialog h2{font-size:16px;}
 #wardrobe{padding:14px;border-radius:20px;}.wardrobe-header{padding-bottom:10px;}.wardrobe-options button{font-size:9px;min-height:60px;padding:6px 2px;}.wardrobe-options legend{font-size:10px;}.wardrobe-preview p{font-size:8px;}
 #boarding{width:calc(100% - 24px);max-width:390px;padding:24px;}#boarding h1{font-size:32px;}.boarding-name input{font-size:16px;}
}
@media(max-width:350px){.train-brand{padding:7px 8px;max-width:126px;}body header .train-brand .train-service{font-size:11px;}header .toolbar{gap:3px;}header .toolbar button{width:36px;min-height:38px;height:38px;padding:8px;}}
@media(max-height:480px) and (min-width:480px){
 header{grid-template-columns:auto minmax(0,1fr) auto;gap:12px;}.train-brand{max-width:150px;}#edition{display:none;}header .toolbar{grid-column:3;grid-row:1;}#segment{grid-column:2;grid-row:1;min-height:42px;align-self:start;}
 #dock{max-width:560px;bottom:calc(6px + env(safe-area-inset-bottom));row-gap:5px;}#actions button{min-height:44px;padding:4px 2px;}#actions button svg{width:17px;height:17px;flex-basis:17px;}#actions button::after{font-size:8px;}
 #touch-guide{top:65px;}#bread-steal-near{bottom:calc(111px + env(safe-area-inset-bottom));}
 #boarding{width:min(720px,calc(100% - 24px));max-width:720px;padding:18px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6px 24px;}#boarding h1{font-size:28px;}
}
.wardrobe-options{scroll-padding-top:55px;}.wardrobe-options fieldset{scroll-margin-top:0;}
.wardrobe-jumps{position:sticky;top:0;z-index:2;display:flex;gap:5px;background:#f4f0e5;padding:0 0 10px;margin-bottom:8px;border-bottom:1px solid #bac5ac66;}
.wardrobe-jumps button{flex:1;min-height:36px;min-width:0;padding:7px 8px;background:#e2e9d8;border-radius:20px;color:#526c48;font-size:11px;}
.wardrobe-options button{white-space:normal;}.wardrobe-options button>span:last-child{line-height:1.35;}
@media(prefers-reduced-motion:reduce){button,select{transition:none;}}

/* Keep the quiet chrome readable and thumb-sized on compact screens. */
.train-service small,#edition span,#service-phase,.chat-hint,#chat-log:empty::after,dialog p,.seat-map-heading,.seat-divider{color:#68775f;}
#edition span{font-size:10px;}#service-phase{font-size:11px;}.seat-grid small,.seat-grid span{color:#68775f;}
@media(max-width:600px),(max-height:480px){
 header .toolbar{gap:3px;}header .toolbar button{width:44px;min-height:44px;height:44px;padding:11px;}header .toolbar button svg{width:20px;height:20px;flex-basis:20px;}
 body header .train-brand .train-service{font-size:12px;}.train-service small,.train-service small b{font-size:10px;}#edition b,#edition span{font-size:9px;}#service-phase{font-size:10px;}
 #actions button::after{font-size:10px;}#travel-status-row #status{font-size:10px;}
 #chat-open,#bread-open{min-width:44px;min-height:44px;height:44px;padding:12px;}
 #views button{width:44px;height:44px;min-height:44px;padding:12px;}#views #window-view{width:44px;height:44px;min-height:44px;padding:12px;}
}
@media(max-width:350px){.train-brand{max-width:112px;padding:7px 8px;}.train-service small,.train-service small b{font-size:9px;}}
@media(max-height:480px) and (min-width:480px){
 #boarding .boarding-name{grid-column:2;grid-row:3;margin:0;gap:4px;}
 #boarding #boarding-state{grid-row:2;margin:0;}#boarding .boarding-name input{min-height:44px;padding:7px 9px;}
}
