@font-face{font-family:Klad;src:url(data:font/woff;base64,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) format("woff");font-display:block}
:root{--yellow:#ffff55;--cyan:#55ffff;--green:#55ff55;--magenta:#ff55ff;--red:#ff5555;--grey:#9a9a9a}
*{box-sizing:border-box}
html,body{margin:0;background:#000;color:#fff;min-height:100%}
body{font:16px/1.5 ui-monospace,"SF Mono",Menlo,Consolas,monospace;overscroll-behavior:none}
[hidden]{display:none!important}
.klad{font-family:Klad,ui-monospace,Menlo,monospace}
/* ---- start page ---- */
#start{max-width:900px;margin:0 auto;padding:24px 16px 48px}
#start h1{font-size:22px;line-height:1.4;margin:36px 0 12px;color:var(--cyan)}
#start .lead{margin-bottom:20px}
#start h3{font-size:18px;color:var(--green);margin:24px 0 8px}
/* the line that says the pictures below are the buttons */
#start .pick{font-size:20px;color:var(--green);text-align:center;margin:16px 0 14px}
/* the two borders of the title screen, 512x27 px, scaled by whole pixels as the picture allows */
#start .band{display:block;width:100%;height:auto;image-rendering:pixelated}
#start footer{margin-top:44px}
#start h2{font-size:22px;color:var(--cyan);margin:36px 0 12px}
#start p{margin:0 0 12px}
.parts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:16px}
.part{display:block;position:relative;border:2px solid #333;border-radius:6px;overflow:hidden;color:inherit;text-decoration:none;background:#000}
.part:hover,.part:focus-visible{border-color:var(--cyan);outline:none}
/* the maze is 512x220 Korvet pixels, and they are 1.5 times taller than wide */
.part canvas{width:100%;height:auto;display:block;image-rendering:pixelated;aspect-ratio:512/330}
.part .num{position:absolute;right:10px;top:8px;font-size:26px;color:var(--magenta);background:#000c;padding:2px 10px 4px;border-radius:4px;letter-spacing:1px}
.part .cap{display:block;text-align:center;font-size:20px;color:var(--green);padding:10px 8px 8px}
#start .about{font-size:17px;line-height:1.8;border-left:4px solid var(--magenta);padding:2px 0 2px 16px;margin:28px 0 0}
table{border-collapse:collapse;margin:0 0 12px}
td,th{padding:3px 14px 3px 0;text-align:left;vertical-align:top}
th{color:var(--grey);font-weight:normal}
@media (max-width:400px){#key-bindings table{font-size:14px}#key-bindings td,#key-bindings th{padding-right:8px}}
/* Fit the complete game picker into a short landscape viewport, including browser chrome.
   Shrink both axes together so the original maze proportions remain intact. */
@media (orientation:landscape) and (max-height:600px){
  #start{padding-top:max(8px,env(safe-area-inset-top));padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
  #start .launch{max-width:calc(250svh - 240px);margin-inline:auto}
  #start .pick{font-size:16px;line-height:1.5;margin:8px 0 10px}
  .parts{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .part .num{font-size:20px;right:6px;top:6px;padding:2px 6px}
  .part .cap{font-size:16px;line-height:1.5;padding:6px}
}
/* ---- game page ---- */
#game{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:#000;-webkit-user-select:none;user-select:none;touch-action:manipulation}
.tube{width:min(100vw,calc((100dvh - 48px)*4/3));aspect-ratio:4/3;background:#000}
#screen{width:100%;height:100%;display:block;image-rendering:pixelated;image-rendering:crisp-edges}
.hint{color:var(--grey);font-size:13px;margin:0;text-align:center;min-height:1.5em}
#record-name{font:inherit;padding:8px;background:#111;color:#fff;border:1px solid #444;max-width:90vw}
.touch{display:none}
@media (pointer:coarse){
  .hint.kb{display:none}
  .touch{display:contents}
  .touch button{font:inherit;color:#fff;background:#222;border:1px solid #555;border-radius:12px;min-height:56px;padding:0;font-size:20px;touch-action:none}
  .touch button.on{background:var(--yellow);color:#000}
  .dpad,.fire{position:fixed;display:grid;gap:6px;touch-action:none}
  .dpad{grid-template:repeat(3,56px)/repeat(3,56px)}
  .fire{grid-template-columns:repeat(2,64px)}
  .fire button{min-height:64px;border-radius:50%;border-color:var(--red);font-size:12px}
  .u{grid-area:1/2}.l{grid-area:2/1}.r{grid-area:2/3}.d{grid-area:3/2}
  .corner{position:fixed;top:calc(8px + env(safe-area-inset-top));width:44px;min-height:44px!important;border-radius:50%!important;background:#2229!important;font-size:18px!important}
  #btn-menu{left:calc(8px + env(safe-area-inset-left))}
  #btn-sound{right:calc(8px + env(safe-area-inset-right))}
  /* no room for a hint over the picture: the corner button carries the state instead */
  #audio-hint{display:none}
  .corner[aria-pressed="false"]{opacity:.4}
  #record-name{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(8px + env(safe-area-inset-bottom));z-index:2;margin:0}
  @media (orientation:landscape){
    .tube{height:100dvh;width:calc(100dvh*4/3)}
    .dpad{left:calc(12px + env(safe-area-inset-left));top:50%;transform:translateY(-50%)}
    .fire{right:calc(12px + env(safe-area-inset-right));top:50%;transform:translateY(-50%)}
  }
  @media (orientation:portrait){
    /* the picture sits between the corner buttons and the pads, not pinned to the top */
    #game{padding-top:calc(52px + env(safe-area-inset-top));padding-bottom:calc(210px + env(safe-area-inset-bottom))}
    .tube{width:100vw}
    .dpad{left:calc(12px + env(safe-area-inset-left));bottom:calc(16px + env(safe-area-inset-bottom))}
    .fire{right:calc(12px + env(safe-area-inset-right));bottom:calc(24px + env(safe-area-inset-bottom))}
  }
}