/* APPROX BOARDING-LAYOUT-02 / BOARDING-CONTROL-02. New design, no recovered-layout claim. */
:root{color-scheme:light;--ink:#191815;--paper:#f2e4ca;--light:#fbf1de;--red:#ad291d;--line:#b4a58b;--muted:#655849;--brass:#bd9555;--deep-red:#6d2119;font-family:"Segoe UI",Arial,sans-serif;color:var(--ink);background:var(--ink);font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--red);outline-offset:3px}button:focus-visible{position:relative;z-index:3}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}h1,h2,p{margin:0}
.composition{max-width:1000px;min-height:600px;margin:16px auto 0;background:var(--ink);border:1px solid var(--paper);padding:0 20px;overflow:visible}.masthead{height:64px;display:flex;align-items:center;gap:20px;color:var(--paper)}.masthead img{width:156px;height:60px;object-fit:contain}.masthead-tag{text-transform:uppercase;letter-spacing:.19em;font-size:10px;border-top:1px solid #71634d;border-bottom:1px solid #71634d;padding:6px 0;margin-left:auto}.brand{font-size:12px;font-weight:700;margin-left:12px}.paper{background:var(--paper);display:grid;grid-template-columns:300px minmax(0,1fr);gap:26px;padding:18px 20px 16px}.destination{min-width:0;align-self:start;box-shadow:0 3px 0 #c5b18c;background:var(--light);position:relative}.scenery{height:236px;position:relative;background:#252923;overflow:hidden}.scenery>img{display:block;width:100%;height:125%;object-fit:cover;object-position:center top}.scene-serial{position:absolute;bottom:0;left:0;right:0;background:var(--ink);color:var(--paper);font-size:9px;letter-spacing:.15em;padding:7px 12px}.neutral-scene{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;background:repeating-linear-gradient(0deg,transparent,transparent 30px,#f2e4ca0a 30px,#f2e4ca0a 31px),repeating-linear-gradient(90deg,transparent,transparent 30px,#f2e4ca0a 30px,#f2e4ca0a 31px);color:var(--paper);text-align:center;gap:12px;padding:20px}.compass{font-family:Georgia,serif;font-size:88px;line-height:1;color:#c3a16c}.neutral-scene p{font-size:13px}.ticket{padding:13px 16px 17px;position:relative}.ticket:before,.ticket:after{content:"";position:absolute;top:-5px;width:10px;height:10px;border-radius:50%;background:var(--paper)}.ticket:before{left:-5px}.ticket:after{right:-5px}.ticket-top{display:flex;justify-content:space-between;align-items:center;gap:8px}.ticket-label{text-transform:uppercase;font-size:10px;letter-spacing:.16em;font-weight:700;color:var(--muted)}#stamp{font-size:10px;font-weight:800;color:var(--red);text-transform:uppercase;letter-spacing:.08em;transform:rotate(-5deg);border-bottom:2px solid var(--red);padding:2px 0}.ticket-place{display:flex;align-items:baseline;gap:10px;margin:10px 0 5px}#destination-number{font-size:12px;font-weight:800;color:var(--red);white-space:nowrap}#destination-name{font-family:Impact,"Arial Narrow",sans-serif;font-size:27px;line-height:1.18;overflow-wrap:anywhere;min-width:0;font-weight:400}#destination-status{color:var(--muted);font-size:12px;line-height:1.4}.ticket-action{padding-top:13px;margin-top:11px;border-top:1px dashed var(--line)}
/* A physical control: metal rim, raised face, separate lower edge. No raster skin. */
.sail{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:53px;padding:6px 14px 7px;border:1px solid #5e381f;border-radius:9px;background:linear-gradient(#c7452d 0%,#ad291d 50%,#92251c 100%);box-shadow:inset 0 0 0 2px #d6b174,inset 0 3px 0 2px #ebc58a,inset 0 -3px 0 2px #743d21,0 4px 0 #5e381f,0 5px 0 #d6b174;color:var(--light);font-weight:800;font-size:20px;text-shadow:0 1px 0 #672117;transition:transform 130ms ease-out,box-shadow 130ms ease-out,background-color 130ms ease-out;position:relative}.sail:before,.sail:after{content:"";position:absolute;top:23px;width:3px;height:3px;border-radius:50%;background:#edcf94;box-shadow:0 1px 0 #783d22}.sail:before{left:6px}.sail:after{right:6px}.sail-mark{display:flex;align-items:center;padding-right:12px;border-right:1px solid #e7bd7870}.sail-mark svg{width:28px;height:28px;fill:#f2dfb4;filter:drop-shadow(0 1px 0 #672117)}.sail-arrow{font-size:23px;font-weight:400}.sail:hover:not(:disabled){background:linear-gradient(#de5b38,#bc3422 55%,#a52b20);box-shadow:inset 0 0 0 2px #eac58a,inset 0 3px 0 2px #f5d9a1,inset 0 -3px 0 2px #8a4927,0 4px 0 #5e381f,0 5px 0 #d6b174}.sail:active:not(:disabled){transform:translateY(3px);background:linear-gradient(#8a241b,#a02b1e);box-shadow:inset 0 0 0 2px #c09a61,inset 0 3px 3px 2px #5d211a,0 1px 0 #5e381f,0 2px 0 #d6b174}.sail:focus-visible{outline:3px solid var(--ink);outline-offset:4px}.sail:disabled{background:#d6c8af;color:#655849;text-shadow:none;box-shadow:inset 0 0 0 2px #e6d8bf,inset 0 -2px 0 2px #b3a184,0 2px 0 #8b785a;border-color:#8b785a;transform:none}.sail:disabled .sail-mark svg{fill:#75644d;filter:none}.sail:disabled .sail-mark{border-color:#b3a184}
.directory{min-width:0}.directory-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.eyebrow{font-size:9px;letter-spacing:.16em;color:var(--red);text-transform:uppercase;font-weight:700;margin-bottom:3px}h1{font-family:Impact,"Arial Narrow",sans-serif;text-transform:uppercase;font-weight:400;font-size:29px;line-height:1.15}.back{background:transparent;border:0;font-size:12px;text-decoration:underline;text-underline-offset:4px;min-height:34px;padding:6px}.back:hover{color:var(--red)}.recent{display:flex;align-items:center;gap:10px;padding:10px 0 9px;border-bottom:1px solid var(--line);font-size:10px;flex-wrap:wrap}.recent>span{color:var(--muted)}#recent-list{display:flex;gap:10px;flex-wrap:wrap}.recent-button{background:transparent;padding:2px 0;border:0;font-size:10px;font-weight:600;text-decoration:underline;text-underline-offset:3px}.recent-button[aria-pressed=true]{color:var(--red);text-decoration-thickness:2px}.tools{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}.tools h2{font-size:13px;white-space:nowrap}.tools h2 span{font-weight:400;font-size:11px;color:var(--muted);margin-left:6px}.tools label{width:180px}#search{width:100%;border:1px solid #948268;background:var(--light);padding:6px 8px;min-height:30px;font-size:12px;border-radius:2px}.legend{display:flex;gap:14px;padding:8px 0 7px;font-size:10px;color:var(--muted)}.key-hint{margin-left:auto}#server-list{display:grid;grid-template-rows:repeat(10,minmax(28px,auto));grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);column-gap:12px}.server{display:grid;grid-template-columns:24px minmax(0,1fr) 10px;gap:3px;align-items:center;text-align:left;min-width:0;min-height:28px;padding:5px 3px;border:0;border-bottom:1px solid #cbbba0;background:transparent;font-size:11px;line-height:1.25;border-radius:1px}.server-id{font-size:9px;font-weight:800;color:var(--muted)}.server-name{overflow-wrap:anywhere}.server-status{font-size:10px;text-align:center}.server:hover:not(:disabled){background:#e0cdab}.server[aria-checked=true],.server[aria-checked=true]:hover{background:var(--ink);color:var(--light)}.server[aria-checked=true] .server-id{color:#e8ca9a}.server:focus-visible{outline-offset:1px}.server:disabled{background:repeating-linear-gradient(135deg,transparent,transparent 6px,#ccbc9f77 6px,#ccbc9f77 7px);color:#655849;opacity:1}.server[aria-checked=true]:disabled{background:#655849;color:var(--light)}.server[aria-checked=true]:disabled .server-id{color:var(--paper)}#no-matches{min-height:290px;padding:48px 12px;line-height:1.6;font-size:14px}#keyboard-help{font-size:10px;color:var(--muted);line-height:1.4;margin-top:10px}.page-footer{display:flex;justify-content:space-between;padding:12px 0;color:#c1b395;font-size:10px}.page-footer span:first-child{font-weight:700}.review-notes{max-width:1000px;margin:auto;padding:12px 0 24px;font-size:12px;line-height:1.6;color:#d4c6ab}.review-notes a{color:#e8c997}.review-notes p+p{margin-top:4px}
@media(min-width:1000px){.composition{min-height:600px}}
@media(max-width:999px) and (min-width:761px){.composition{margin:12px 8px 0;padding:0 14px}.paper{grid-template-columns:250px minmax(0,1fr);padding:16px;gap:18px}#server-list{column-gap:8px}.server{font-size:10px;grid-template-columns:21px minmax(0,1fr) 9px;padding:5px 2px;min-height:34px}h1{font-size:26px}.scenery{height:270px}.key-hint{display:none}.recent{padding:10px 0}.review-notes{padding:12px}.masthead-tag{display:none}}
@media(max-width:760px){.review-bar{display:block;padding:10px 14px}.review-bar label{display:block;margin-top:8px}.composition{margin:10px 10px 0;padding:0 14px;min-height:0}.masthead{height:64px}.masthead img{width:145px}.masthead-tag{display:none}.brand{margin-left:auto}.paper{grid-template-columns:1fr;padding:16px;gap:26px}.destination{display:grid;grid-template-columns:45% minmax(0,1fr)}.scenery{height:100%;min-height:245px}.ticket{padding:15px}.scene-serial{font-size:8px;padding:7px}.ticket-place{display:block}#destination-name{margin-top:4px;font-size:26px}.ticket-action{margin-top:12px}.sail{font-size:18px;padding:7px 12px}.sail-mark{padding-right:8px}.sail-mark svg{width:24px}#server-list{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;grid-auto-flow:row;grid-auto-columns:auto}.server{min-height:44px;font-size:13px;padding:8px 5px;grid-template-columns:27px minmax(0,1fr) 12px}.server-id{font-size:10px}.legend{font-size:11px}.recent{font-size:11px}.recent-button{font-size:11px;min-height:30px}.tools label{width:50%}.tools h2{font-size:14px}.tools{margin-top:16px}#keyboard-help{font-size:11px;line-height:1.5}.review-notes{padding:12px 14px}.back{min-height:44px}.page-footer{gap:10px;font-size:9px}.scene-serial{letter-spacing:.08em}}
@media(max-width:480px){.composition{padding:0 10px}.paper{padding:14px}.destination{display:block}.scenery{height:196px;min-height:0}.ticket{padding:13px 15px 18px}.ticket-place{display:flex;margin-top:10px}#destination-name{font-size:27px;margin:0}.ticket-action{margin-top:11px;padding-top:12px}.sail{min-height:53px;font-size:20px}.sail-mark svg{width:28px}.tools{align-items:stretch;flex-direction:column;gap:8px}.tools label{width:100%}#search{min-height:40px}.directory-heading{gap:6px}h1{font-size:27px}.key-hint{display:none}#server-list{grid-template-columns:1fr}.server{min-height:44px;font-size:14px}.recent{gap:5px}.recent>span{width:100%}.page-footer span:last-child{display:none}}
/* Complete unchanged original tiles are drawn at native integer coordinates into
   one 2000x600 canvas; CSS uniformly scales a single surface, avoiding tile seams. */
.tile-scene{position:absolute;left:50%;top:0;transform:translateX(-50%);height:100%;width:auto;aspect-ratio:10/3;display:block}
/* References have their own CSS framing; original Android crop remains above. */
.scenery[data-kind="reference_image"]{background:var(--ink)}
.scenery[data-kind="reference_image"]>img{height:calc(100% - 25px);width:100%;object-fit:cover;object-position:50% 50%}
.scenery[data-frame="sign"]>img,.scenery[data-frame="manga"]>img,.scenery[data-frame="panorama"]>img,.scenery[data-frame="palace"]>img{object-fit:contain}
.scenery[data-frame="manga"],.scenery[data-frame="panorama"],.scenery[data-frame="palace"]{background:var(--light)}
.scenery[data-destination="S05"]>img{object-position:50% 58%}
.scenery[data-destination="S10"]>img{object-position:50% 58%}
.scenery[data-destination="S11"]>img{object-position:36% 42%}
.scenery[data-destination="S12"]>img{object-position:50% 55%}
.scenery[data-destination="S14"]>img{object-position:50% 52%}
.scenery[data-destination="S16"]>img{object-position:50% 30%}
.scenery[data-destination="S19"]>img{object-position:50% 48%}
.scenery[data-destination="S23"]>img{object-position:50% 48%}
.scenery[data-destination="S29"]>img{object-position:50% 28%}
.scenery[data-destination="S30"]>img{object-position:50% 42%}
/* A narrow tablet frame keeps references complete when it becomes portrait. */
@media(min-width:481px) and (max-width:760px){.scenery[data-kind="reference_image"]>img{object-fit:contain}}
#destination-name:focus{outline:none}#destination-name:focus-visible{outline:2px solid var(--red);outline-offset:4px}
/* Source order: directory then independent confirmation, so Tab from a row reaches Set Sail. */
.destination{grid-column:1;grid-row:1}.directory{grid-column:2;grid-row:1}
@media(max-width:760px){.destination{grid-column:1;grid-row:1}.directory{grid-column:1;grid-row:2}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Review-only provenance paths must wrap on narrow screens. */

/* Production context and feedback; layout is the owner-approved new composition. */
.pp-skip{position:absolute;left:12px;top:-80px;z-index:5;background:var(--light);padding:12px;color:var(--ink)}.pp-skip:focus{top:8px}
.masthead>a{display:block;line-height:0}.brand a{color:inherit;font-size:11px;font-weight:400;margin-left:12px}.back{display:inline-flex;align-items:center;color:var(--ink)}
.selector-feedback{max-width:1000px;margin:10px auto;padding:0 20px;font-size:12px;line-height:1.5;color:var(--paper);overflow-wrap:anywhere}.selector-error{color:#ffbc9d}.directory-feedback{font-size:11px;margin-top:8px;color:var(--muted);line-height:1.5;overflow-wrap:anywhere}
.page-footer .back{color:var(--paper);font-size:10px;min-height:24px;padding:0}#world-notices:empty{display:none}.server-id{min-width:0;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#history-empty{color:var(--muted);font-size:10px}#world-notes{font-size:11px;color:var(--muted);line-height:1.5;margin-top:8px;overflow-wrap:anywhere}.page-footer a{color:inherit}
.scenery[data-kind="web_surface"]>img{position:absolute;left:50%;top:0;transform:translateX(-50%);height:100%;width:auto;max-width:none;aspect-ratio:10/3;object-fit:fill}
#server-list.over-capacity{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:none;grid-auto-flow:row;grid-auto-columns:auto;max-height:340px;overflow:auto}
@media(max-width:760px){#server-list.over-capacity{grid-template-columns:repeat(2,minmax(0,1fr));max-height:none;overflow:visible}.brand a{display:inline-block;margin:0 0 0 8px}.brand{max-width:155px;text-align:right}.masthead{gap:8px}}
@media(max-width:480px){#server-list.over-capacity{grid-template-columns:1fr}.brand{font-size:10px;max-width:125px}.brand a{font-size:10px}.composition{height:auto}.selector-feedback{padding:0 16px}}

/* APPROX ACCOUNT-NAV-01: ordinary logout uses existing boarding colors/control styles. */
.brand button{margin-left:12px;min-height:32px;padding:4px 10px;border:1px solid currentColor;border-radius:3px;background:transparent;color:inherit;font:inherit;font-weight:400}.brand button:hover{background:#f2e4ca1a}.brand button:disabled{opacity:.65;cursor:wait}
@media(max-width:760px){.brand button{min-height:44px;margin-left:8px}.masthead{height:auto;min-height:64px}.brand{padding:4px 0}}

/* Keep long public world identifiers from squeezing the name to zero width. */
.ticket-place{flex-wrap:wrap}
#destination-number{min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere}
#destination-name{flex:1 1 160px}
