@font-face{font-family:DotGothic16Subset;src:url(/fonts/dotgothic16-subset.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}:root{--bg-color: #050811;--panel-bg: #0f172a;--pixel-border: #38bdf8;--pixel-border-gold: #fbbf24;--text-main: #f8fafc;--text-sub: #94a3b8;--accent-gold: #fbbf24;--accent-red: #ef4444;--accent-green: #22c55e;--panel-pad-y: clamp(2px, 1.1dvh, 8px);--panel-pad-x: clamp(8px, 2.5vw, 24px);--fs-h1: clamp(12px, min(4.2dvh, 4.6vw), 20px);--fs-year: clamp(10px, 2.4dvh, 13px);--fs-dir: clamp(14px, min(5.5dvh, 6.2vw), 26px);--fs-angle: clamp(10px, min(2.6dvh, 3.6vw), 14px);--fs-btn: clamp(10px, 2.8dvh, 16px);--fs-btn-sm: clamp(10px, 2.4dvh, 13px);--fs-note: clamp(9px, min(2dvh, 2.8vw), 11px);--gap-y: clamp(2px, 1.1dvh, 8px)}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-main);font-family:DotGothic16Subset,monospace;-webkit-font-smoothing:none;-moz-osx-font-smoothing:grayscale;font-synthesis:none;text-rendering:optimizeSpeed;font-variant-ligatures:none;width:100%;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;padding:clamp(2px,1.2dvh,8px) clamp(4px,1.5vw,8px)}.pixel-box{background-color:var(--panel-bg);border:4px solid #000;box-shadow:0 -4px #334155,0 4px #334155,-4px 0 #334155,4px 0 #334155,0 0 0 4px #050811;padding:var(--panel-pad-y) var(--panel-pad-x);width:calc(100% - 8px);max-width:clamp(280px,92vw,520px);margin:auto 0;position:relative}.pixel-box.matched{box-shadow:0 -4px 0 0 var(--pixel-border-gold),0 4px 0 0 var(--pixel-border-gold),-4px 0 0 0 var(--pixel-border-gold),4px 0 0 0 var(--pixel-border-gold),0 0 0 4px #b45309;animation:pulse-gold 1s steps(2,start) infinite alternate}@keyframes pulse-gold{0%{border-color:#000}to{border-color:#fbbf24}}@media(prefers-reduced-motion:reduce){.pixel-box.matched{animation:none}}.pixel-btn{font-family:inherit;font-size:var(--fs-btn);line-height:1.3;background-color:#1e293b;color:#fff;border:4px solid #000;box-shadow:inset -4px -4px #0f172a,inset 4px 4px #475569,0 4px #000;padding:clamp(2px,1.4dvh,8px) clamp(8px,2.5vw,16px);cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;display:inline-flex;align-items:center;justify-content:center;gap:6px;image-rendering:pixelated}.pixel-btn:active{transform:translateY(4px);box-shadow:inset -4px -4px #475569,inset 4px 4px #0f172a}.pixel-btn.primary{background-color:#0284c7;box-shadow:inset -4px -4px #0369a1,inset 4px 4px #38bdf8,0 4px #000}.pixel-btn.gold{background-color:#d97706;box-shadow:inset -4px -4px #b45309,inset 4px 4px #fde047,0 4px #000}.pixel-btn.sm{font-size:var(--fs-btn-sm);padding:clamp(1px,.9dvh,5px) clamp(6px,2vw,10px)}.pixel-btn.active{background-color:#15803d}header{display:flex;justify-content:space-between;align-items:center;gap:6px;margin-bottom:var(--gap-y);padding-bottom:clamp(2px,1dvh,8px);border-bottom:2px solid #1e293b}h1{font-size:var(--fs-h1);line-height:1.25;color:var(--accent-gold);text-shadow:2px 2px 0 #000;letter-spacing:clamp(.5px,.3vw,2px);white-space:nowrap}.ehou-banner{text-align:center;margin-bottom:clamp(2px,.8dvh,6px)}.ehou-year{font-size:var(--fs-year);line-height:1.3;color:var(--text-sub)}.ehou-direction{font-size:var(--fs-dir);line-height:1.25;color:var(--accent-gold);text-shadow:3px 3px 0 #000;letter-spacing:clamp(.5px,.3vw,2px);margin:clamp(1px,.3dvh,2px) 0}.ehou-angles{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:4px 8px;font-size:var(--fs-angle);line-height:1.3;color:var(--pixel-border)}.ehou-angles .angle-sep{color:#475569}#currentHeadingText{color:var(--text-sub)}.compass-container{display:flex;justify-content:center;align-items:center;margin:var(--gap-y) 0;position:relative;min-width:0}canvas#compassCanvas{width:min(100%,48dvh,360px);height:auto;aspect-ratio:1 / 1;touch-action:none;-webkit-user-select:none;user-select:none;display:block;image-rendering:pixelated;image-rendering:crisp-edges;image-rendering:-moz-crisp-edges}.status-overlay{position:absolute;left:4px;right:4px;bottom:clamp(4px,2dvh,12px);display:flex;flex-direction:column;align-items:center;gap:clamp(2px,.6dvh,4px);pointer-events:none;z-index:10}.toast-notice,.match-badge{max-width:100%;padding:clamp(2px,.8dvh,5px) clamp(6px,2vw,12px);text-align:center;line-height:1.3;display:none;box-shadow:0 4px #000000bf}.toast-notice{background-color:#7f1d1df2;color:#fecaca;border:4px solid #ef4444;font-size:clamp(9px,2.2dvh,12px)}.toast-notice.show{display:block}.match-badge{background-color:#14532df2;color:#86efac;border:4px solid #22c55e;font-size:clamp(10px,2.8dvh,16px);font-weight:400;letter-spacing:1px}.match-badge.show{display:block}.notice-footer{font-size:var(--fs-note);line-height:1.3;color:#64748b;margin-top:clamp(2px,1.2dvh,10px);text-align:center}.manual-controls{display:flex;justify-content:center;gap:clamp(6px,2vw,12px);margin:var(--gap-y) 0}.controls-bar{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:clamp(2px,1.2dvh,10px)}footer{text-align:center;font-size:var(--fs-note);line-height:1.3;color:#64748b;margin-top:clamp(2px,.8dvh,6px);padding:0}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#000c;align-items:center;justify-content:center;padding:clamp(4px,1.5dvh,16px) clamp(6px,2vw,16px);z-index:100;display:none}.modal-overlay.open{display:flex}.modal-content{width:min(94vw,460px);max-width:460px;max-height:calc(100dvh - 12px);overflow-y:auto;display:flex;flex-direction:column;padding:clamp(6px,2dvh,18px) clamp(10px,3vw,24px);outline:none}.modal-title{font-size:clamp(13px,3.2dvh,18px);color:var(--accent-gold);margin-bottom:clamp(4px,1.6dvh,12px);text-align:center}.setting-row{margin:clamp(4px,1.4dvh,12px) 0}.setting-row label{display:block;font-size:clamp(11px,2.5dvh,14px);color:var(--text-sub);margin-bottom:clamp(2px,.6dvh,4px)}.setting-hint{font-size:clamp(9px,2dvh,11px);color:var(--text-sub);margin-top:clamp(2px,.8dvh,6px)}.modal-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:clamp(6px,2dvh,16px)}select,input[type=range]{width:100%;font-family:inherit;font-size:clamp(12px,3.2dvh,16px);padding:clamp(3px,1.2dvh,8px);background-color:#050811;color:#fff;border:4px solid #334155;image-rendering:pixelated}.pixel-btn:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid var(--accent-gold);outline-offset:2px}.credits-list{display:flex;flex-direction:column;gap:clamp(4px,1.4dvh,10px);font-size:clamp(10px,2.2dvh,12px);line-height:1.45;color:var(--text-main)}.credit-item{padding:clamp(4px,1.2dvh,8px);background-color:#050811;border:2px solid #334155}.credit-title{color:var(--accent-gold);font-size:clamp(11px,2.4dvh,13px);margin-bottom:2px}.credit-desc{color:var(--text-sub);word-break:break-word}@media(orientation:landscape)and (max-height:540px){#mainPanel.pixel-box{max-width:clamp(280px,94vw,880px);padding:clamp(3px,1.2dvh,14px) clamp(8px,2.8vw,28px);display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-template-rows:auto 1fr auto auto auto 1fr;column-gap:clamp(8px,2.5vw,32px);align-items:center}#mainPanel .compass-container{grid-column:1;grid-row:1 / 7;margin:0}#mainPanel canvas#compassCanvas{width:min(100%,78dvh,380px)}#mainPanel header{grid-column:2;grid-row:1;margin-bottom:clamp(1px,.8dvh,10px);padding-bottom:clamp(1px,.6dvh,8px)}#mainPanel .ehou-banner{grid-column:2;grid-row:2;align-self:end;margin-bottom:clamp(1px,.8dvh,8px)}#mainPanel .manual-controls{grid-column:2;grid-row:3;margin:clamp(1px,.6dvh,6px) 0}#mainPanel .controls-bar{grid-column:2;grid-row:4;margin-top:clamp(1px,.8dvh,10px)}#mainPanel .notice-footer{grid-column:2;grid-row:5;margin-top:clamp(1px,.6dvh,8px)}#mainPanel footer{grid-column:2;grid-row:6;align-self:end;margin-top:clamp(1px,.8dvh,8px)}.modal-content{width:min(94vw,600px);max-width:600px}.modal-content .setting-row{display:grid;grid-template-columns:clamp(92px,32%,145px) minmax(0,1fr);align-items:center;column-gap:10px}.modal-content .setting-row label{margin-bottom:0}.modal-content .setting-row>div{grid-column:2}}@media(max-height:240px){.pixel-btn,.toast-notice,.match-badge{border-width:2px;box-shadow:none}.pixel-btn:active{transform:translateY(2px)}select,input[type=range]{border-width:2px}}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}#settingsBtn{display:inline-flex;align-items:center;gap:5px}#manualControls,#lockBtn,#settingsCreditsView{display:none}.noscript-notice{margin-top:8px;font-size:13px;line-height:1.6}