@font-face{font-family:Pixel;src:url('assets/pixel.ttf')}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;background:#101331;color:#fff2c7;overscroll-behavior:none}body{font:12px/1.5 Pixel,monospace}button{font:inherit;color:#fff2c7;background:#252650;border:2px solid #7778ab;border-radius:4px;min-width:44px;min-height:44px;padding:6px 9px;box-shadow:0 3px #080c24;touch-action:manipulation;cursor:pointer}button:active{transform:translateY(2px);background:#ffd56b;color:#101331}button:disabled{opacity:.45}button:focus-visible{outline:3px solid #ffd56b;outline-offset:2px}.primary{color:#101331;background:#ffd56b;border-color:#fff2c7}#app{position:relative;isolation:isolate;max-width:1120px;margin:auto;width:100%;height:var(--vh,100dvh);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);display:flex;flex-direction:column;overflow:hidden}#scene{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated;z-index:-1}header{display:flex;align-items:center;justify-content:space-between;padding:5px 7px;gap:5px;min-height:54px;flex-shrink:0;background:#101331e8;z-index:10}.logo{line-height:1.1;color:#8bf4c5}.logo b{font-size:18px}.logo small{display:block;font-size:7px}nav{display:flex;gap:3px}nav button{font-size:9px;padding:5px}#mission{display:grid;grid-template-columns:minmax(308px,1fr) 240px;grid-template-rows:54px 1fr;flex:1;min-height:0;padding:8px;gap:8px;max-width:850px;width:100%;margin:auto}#target-strip{grid-column:1;display:flex;align-items:center;gap:6px;min-width:0}#target{min-width:0;flex:1;text-align:center;line-height:1.25;background:#101331e8;padding:3px;border:1px solid #5d5c8a}#target small{display:block;font-size:8px;color:#bca1ff}#word{font-size:18px;color:#ffd56b;display:block;overflow-wrap:anywhere}#field-view{grid-column:1;grid-row:2;min-height:0;min-width:0;overflow:auto;overscroll-behavior:contain;align-self:start;justify-self:center;max-width:100%;max-height:100%;border:2px solid #7778ab;background:#101331;scrollbar-width:thin;scrollbar-color:#bca1ff #101331}#field{display:grid;grid-template-columns:repeat(7,44px);grid-template-rows:repeat(7,44px);width:308px;height:308px;touch-action:none;user-select:none;-webkit-user-select:none}#field.pan-mode{touch-action:pan-x pan-y}.cell{width:44px;height:44px;display:grid;place-items:center;font-size:24px;color:#fff2c7;background:#191c3cf5;border:1px solid #343965;position:relative}.cell.found{background:#205c60;color:#8bf4c5}.cell.preview{background:#ffd56b;color:#101331}.cell.anchor{outline:3px solid #fa8c8b;outline-offset:-4px}.cell.hint{box-shadow:inset 0 0 0 4px #bca1ff}.cell.jammed{background:#37315c;color:#bca1ff}.cell.focused:after{content:'';position:absolute;inset:4px;border:2px dashed #ffd56b;pointer-events:none}#sidebar{grid-column:2;grid-row:1/3;background:#101331e6;padding:12px;border:1px solid #5d5c8a;align-self:start;min-width:0;max-height:100%;overflow:auto}#notice{font-size:11px;color:#8bf4c5;min-height:55px}#tools{display:grid;grid-template-columns:1fr 1fr;gap:7px}#tools button{font-size:10px}#selection{font-size:9px;color:#bca1ff;margin-top:9px;overflow-wrap:anywhere}footer{flex-shrink:0;padding:3px 7px;background:#101331ec;font-size:7px;color:#bca1ff}footer strong{font-weight:normal;color:#ffd56b}.expanded{position:fixed!important;inset:0;max-width:none!important;z-index:999}#overlay{position:absolute;inset:calc(57px + env(safe-area-inset-top)) 0 env(safe-area-inset-bottom);z-index:5;background:#080c24a8;display:grid;place-items:center;padding:10px max(10px,env(safe-area-inset-right)) 10px max(10px,env(safe-area-inset-left));overflow:hidden}#overlay.hidden{display:none}#panel{width:min(100%,610px);max-height:calc(var(--vh,100dvh) - 84px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow:auto;overscroll-behavior:contain;background:#171b3af2;border:2px solid #8d89b7;border-radius:5px;box-shadow:0 0 0 4px #101331;padding:19px}h1{font-size:clamp(30px,6vw,46px);line-height:1.15;color:#8bf4c5;margin:6px 0 12px;text-shadow:3px 3px #383166}h2{font-size:23px;color:#ffd56b;line-height:1.3;margin:4px 0 10px}h3{font-size:13px;color:#8bf4c5}.eyebrow{font-size:9px;letter-spacing:2px;color:#bca1ff}p{font-size:11px;color:#e2dff0;margin:10px 0}.credits{font-size:8px;color:#bca1ff}.credits b{color:#ffd56b}.buttons{display:flex;flex-wrap:wrap;gap:8px;margin-top:13px}.stats{display:flex;flex-wrap:wrap;gap:10px;font-size:10px;color:#8bf4c5}.portrait{image-rendering:pixelated;width:160px;max-width:100%;aspect-ratio:4/3;float:right;margin:0 0 10px 12px;border:2px solid #7778ab}.clear{clear:both}.word-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}.word-list button{text-align:left;font-size:15px}.word-list small{font-size:8px;display:block;color:#8bf4c5}.album{display:grid;grid-template-columns:1fr 1fr;gap:8px}.album button{text-align:left;font-size:10px}.album canvas{image-rendering:pixelated;width:100%;display:block;aspect-ratio:4/3}.album small{display:block;font-size:8px;color:#8bf4c5}#scan-info{font-size:12px;color:#8bf4c5}.scan-pad{display:grid;grid-template-columns:repeat(3,55px);grid-auto-rows:48px;gap:6px;width:max-content;margin:9px auto}.scan-pad button{font-size:15px;padding:3px}.scan-letter{font-size:38px;color:#ffd56b;text-align:center}.scan-tip{font-size:10px}.title-open #mission{opacity:.35;pointer-events:none}.title-open #field-view{visibility:hidden}
@media(max-width:600px) and (min-height:421px){#mission{display:flex;flex-direction:column;gap:4px;padding:3px 4px;align-items:center;justify-content:flex-start}#target-strip{width:min(100%,312px);flex-shrink:0;min-height:44px}#target-strip button{padding:2px;font-size:20px}#target{padding:1px}#target small{font-size:7px}#word{font-size:16px}#field-view{width:312px;max-width:100%;height:312px;flex:0 1 312px;min-height:100px;align-self:auto}#sidebar{width:100%;padding:2px 0;border:0;background:transparent;max-height:none;flex-shrink:0;overflow:visible}#notice{min-height:0;height:18px;font-size:8px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#tools{grid-template-columns:repeat(6,1fr);gap:3px}#tools button{font-size:7px;padding:3px;min-width:44px}#selection{font-size:7px;text-align:center;margin-top:2px;line-height:1.2;min-height:9px}footer{font-size:6px;padding:2px 4px}#panel{padding:15px}.portrait{width:128px}.credits{font-size:8px}}
@media(max-height:420px){header{padding:2px 7px;min-height:48px}.logo b{font-size:15px}.logo small{font-size:6px}#mission{grid-template-columns:312px minmax(180px,260px);grid-template-rows:minmax(44px,1fr);max-width:740px;padding:4px 6px;gap:7px;justify-content:center}#field-view{grid-row:1;grid-column:1;height:100%;align-self:stretch;width:312px}#target-strip{grid-column:2;grid-row:1;align-self:start;z-index:1;min-height:44px}#target-strip button{font-size:18px;padding:2px}#target{padding:1px}#target small{font-size:7px}#word{font-size:15px}#sidebar{grid-column:2;grid-row:1;margin-top:48px;padding:3px;border:0;align-self:stretch;max-height:none;overflow:auto}#notice{min-height:30px;font-size:8px}#tools{grid-template-columns:repeat(3,1fr);gap:4px}#tools button{font-size:8px;padding:3px}#selection{font-size:8px;margin-top:5px}footer{display:none}#overlay{top:calc(48px + env(safe-area-inset-top))}#panel{padding:12px;max-height:calc(var(--vh,100dvh) - 68px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}h1{font-size:28px;margin:3px 0 8px}h2{font-size:20px;margin-bottom:7px}p{font-size:10px;margin:7px 0}.credits{font-size:7px}.portrait{width:130px}.buttons{margin-top:8px;gap:6px}.buttons button{font-size:10px;padding:5px 8px}.title-open h1{float:left;width:44%;margin-right:12px}.title-open p{font-size:9px;line-height:1.35}.title-open .eyebrow{font-size:7px}.title-open .credits{font-size:7px}.title-open .buttons{clear:both}.scan-letter{float:left;width:120px;margin-top:8px;font-size:36px}.scan-pad{float:left;margin:3px 12px}.scan-tip{font-size:9px}.scan-panel .buttons{clear:both}.scan-panel .credits{display:none}.scan-panel h2{font-size:17px}.scan-panel #scan-info{font-size:9px}.scan-pad{grid-template-columns:repeat(3,48px);grid-auto-rows:44px;gap:4px}.album{grid-template-columns:repeat(4,1fr)}}
@media(max-height:420px) and (max-width:640px){#mission{grid-template-columns:312px minmax(150px,1fr);gap:4px;padding:4px}#word{font-size:13px}#notice{font-size:7px}#tools{gap:3px}#tools button{font-size:7px;padding:2px}#selection{font-size:7px}.logo small{display:none}}
@media(max-width:600px) and (min-height:421px) and (max-height:650px){#notice,#selection{display:none}#mission{gap:3px}#sidebar{padding:2px 0}}
.cell.hint{box-shadow:inset 0 0 0 4px #bca1ff}
@media(max-width:600px) and (min-height:421px){#sidebar{margin-top:auto}}
@media(max-height:420px){#panel.scan-panel{padding:8px}.scan-panel .eyebrow{display:none}.scan-panel h2{float:left;width:130px;font-size:15px;line-height:1.2;margin:0 0 3px}.scan-panel #scan-info{float:left;clear:left;width:130px;font-size:8px;line-height:1.25;min-height:30px}.scan-panel .scan-letter{float:left;clear:left;width:130px;height:60px;margin:3px 0 0}.scan-panel .scan-pad{float:right;margin:0 0 4px 8px}.scan-panel .scan-tip{display:none}.scan-panel .buttons{clear:both;margin-top:4px}}
@media(max-width:600px) and (min-height:421px){#tools button{font-size:8px}footer{font-size:8px;white-space:nowrap}}
@media(max-width:600px) and (min-height:421px) and (max-height:650px){#mission{gap:2px}}
@media(max-height:420px) and (max-width:640px){#tools button{font-size:8px}}
@media(max-height:420px){.scan-panel .scan-pad{margin-bottom:0}.scan-panel .buttons{margin-top:2px}}
@media(max-height:420px){#panel.scan-panel{display:grid;grid-template-columns:minmax(130px,1fr) 156px;grid-template-rows:18px 30px minmax(52px,1fr) 44px;gap:4px 10px;padding:8px}#panel.scan-panel h2{float:none;grid-column:1;grid-row:1;width:auto;margin:0;font-size:15px;line-height:18px}#panel.scan-panel #scan-info{float:none;clear:none;grid-column:1;grid-row:2;width:auto;min-height:0;font-size:8px;line-height:1.25}#panel.scan-panel .scan-letter{float:none;clear:none;grid-column:1;grid-row:3;width:auto;height:52px;min-height:52px;margin:0;font-size:36px;line-height:52px;align-self:start}#panel.scan-panel .scan-pad{float:none;grid-column:2;grid-row:1/4;margin:0;width:156px;height:140px}#panel.scan-panel .scan-tip{display:block;grid-column:1;grid-row:3;align-self:end;max-height:26px;overflow:hidden;font-size:8px;line-height:1.2;margin:0}#panel.scan-panel .buttons{float:none;clear:none;grid-column:1/-1;grid-row:4;align-self:end;margin:0;height:44px;flex-wrap:nowrap}#panel.scan-panel .buttons button{flex-shrink:0}}
@media(max-height:420px){#mission{grid-template-rows:auto minmax(0,1fr)}#field-view{grid-row:1/3}#target-strip{grid-row:1}#sidebar{grid-row:2;margin-top:0}}
@media(max-height:420px) and (max-width:640px){#target-strip>button:first-child{display:none}}

/* An unmasked signal-world window makes the actual title scene visible on phones. */
.title-hero{display:grid;gap:8px}.title-hero h1{float:none;width:auto;margin-right:0}.title-hero .title-tagline{margin:5px 0 8px}.title-hero #title-vista{display:block;width:100%;height:auto;aspect-ratio:384/180;object-fit:contain;image-rendering:pixelated;background:#101331;border:2px solid #575c8f;border-radius:2px}.title-intro{margin:9px 0}.title-details{color:#bca1ff}
@media(max-width:600px) and (max-height:650px) and (min-height:421px){.title-hero{gap:4px}.title-hero .title-identity>.eyebrow:first-child{display:none}.title-hero h1{font-size:24px;line-height:1.08;margin:3px 0}.title-hero .title-tagline{font-size:8px;margin:3px 0}.title-open .title-details{display:none}.title-open .title-intro{font-size:11px;line-height:1.4;margin:6px 0}}
@media(max-height:420px){.title-hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;align-items:center}.title-hero #title-vista{grid-column:2;grid-row:1;height:108px}.title-hero .title-identity{grid-column:1;grid-row:1}.title-hero h1{float:none;width:auto;margin:2px 0;font-size:27px}.title-hero .title-tagline{font-size:8px;margin:4px 0}.title-open .title-details{display:none}.title-open .title-intro{font-size:9px;line-height:1.3;margin:5px 0}.title-open .buttons{margin-top:5px}}

.title-open #mission{visibility:hidden}