.onager-page{min-height:100svh;color:var(--ink);background-color:var(--paper-cool);background-image:radial-gradient(circle at 1px 1px,#1717171a .65px,#0000 .8px);background-size:4px 4px;flex-direction:column;display:flex}.onager-shell{flex:1;width:min(1120px,100% - 64px);margin:0 auto;padding:28px 0 18px}.onager-heading{justify-content:space-between;align-items:end;gap:24px;padding:0 0 22px;display:flex}.onager-eyebrow,.onager-kicker{color:var(--print);font:800 9px/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;margin:0 0 12px}.onager-heading h1{color:var(--ink);font:400 clamp(29px, 3.3vw, 46px)/.95 var(--display);letter-spacing:-.04em;text-transform:uppercase;text-shadow:1px 1px 0 var(--accent);white-space:nowrap;margin:0}.onager-heading h1 span{color:var(--print);letter-spacing:-.03em;text-shadow:none;vertical-align:.03em;font-family:Georgia,Times New Roman,serif;font-size:.8em;font-weight:400;line-height:1;display:inline-block}.onager-heading p:last-child{margin:12px 0 0;font-size:20px;line-height:1.2}.onager-new{border:0;border-bottom:1px solid var(--print);color:var(--print);font:800 9px/1.2 var(--sans);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;background:0 0;flex-shrink:0;justify-content:space-between;align-items:center;gap:20px;padding:10px 0 7px;display:inline-flex}.onager-new span{font:24px/1 var(--serif)}.onager-new:hover{color:var(--ink);border-color:var(--accent)}.onager-new:disabled{opacity:.4;cursor:default}.onager-cabinet{--rule:color-mix(in srgb, var(--ink) 23%, var(--paper-cool));--muted:color-mix(in srgb, var(--ink) 65%, var(--paper-cool));border:1px solid var(--ink);background:var(--paper-cool);padding:5px;position:relative;container:onager/inline-size}.onager-hud{align-items:center;gap:20px;padding:13px 16px 17px;display:flex}.onager-armies{flex:1;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;min-width:0;display:grid}.army-0{--company:#304a86}.army-1{--company:#943e51}.army-2{--company:#95713b}.onager-army{opacity:.7;min-width:0}.onager-army.is-active{opacity:1}.onager-army>div{font:800 9px/1 var(--sans);text-transform:uppercase;letter-spacing:.03em;white-space:nowrap;align-items:center;gap:6px;margin-bottom:8px;display:flex}.onager-army b{color:var(--company);font-variant-numeric:tabular-nums;margin-left:auto;font-size:15px}.onager-army b small{color:var(--muted);font-size:8px;font-weight:400}.onager-company-flag{background:var(--company);clip-path:polygon(0 0,100% 0,100% 100%,50% 70%,0 100%);flex-shrink:0;width:7px;height:10px}.onager-army progress{-webkit-appearance:none;appearance:none;background:var(--rule);border:0;width:100%;height:4px;display:block}.onager-army progress::-webkit-progress-bar{background:var(--rule)}.onager-army progress::-webkit-progress-value{background:var(--company);transition:width .3s}.onager-army progress::-moz-progress-bar{background:var(--company)}.onager-army.is-destroyed{opacity:.35}.onager-army.is-destroyed>div>span:nth-child(2){text-decoration:line-through}.onager-weather{gap:3px;min-width:74px;padding-left:4px;display:grid}.onager-weather>span{font:800 8px/1 var(--sans);text-transform:uppercase;letter-spacing:.1em}.onager-weather b{color:var(--print);font:800 18px/1 var(--sans);font-variant-numeric:tabular-nums;align-items:center;gap:7px;display:flex}.onager-weather b span{font:26px/.75 var(--serif)}.onager-icon{border:1px solid var(--print);width:38px;height:38px;color:var(--print);font:800 18px/1 var(--sans);cursor:pointer;background:0 0;flex-shrink:0;justify-content:center;align-items:center;gap:5px;padding:4px;display:flex}.onager-icon small{font-size:7px}.onager-icon:hover:not(:disabled){color:var(--paper-cool);background:var(--print)}.onager-icon:disabled{color:var(--rule);border-color:var(--rule);cursor:default}.onager-stage{aspect-ratio:16/9;isolation:isolate;background:#403a59;outline:none;position:relative;overflow:hidden}.onager-stage:focus-visible{outline:2px solid var(--print);outline-offset:2px}.onager-canvas,.onager-canvas canvas{width:100%;height:100%;image-rendering:pixelated;display:block}.onager-canvas{margin:0;position:absolute;inset:0}.onager-loading{color:var(--paper-cool);text-align:center;background:#3b344e;place-items:center;padding:24px;font-size:20px;display:grid;position:absolute;inset:0}.onager-dialog{z-index:3;border:1px solid var(--ink);outline:4px solid var(--paper-cool);width:330px;max-width:90%;max-height:calc(100% - 16px);color:var(--ink);background:var(--paper-cool);margin:0;padding:23px;position:absolute;top:50%;left:5%;overflow-y:auto;transform:translateY(-50%)}.onager-kicker{letter-spacing:.1em;margin-bottom:15px;font-size:8px;display:block}.onager-dialog h2{font:400 clamp(25px, 2.8vw, 36px)/.95 var(--display);letter-spacing:-.035em;text-transform:uppercase;text-shadow:1px 1px 0 var(--accent);margin:0}.onager-dialog p{font:400 16px/1.3 var(--serif);margin:17px 0}.onager-center{text-align:center;left:50%;transform:translate(-50%,-50%)}.onager-primary{border:1px solid var(--print);width:100%;min-height:46px;color:var(--paper-cool);background:var(--print);font:800 10px/1.2 var(--sans);letter-spacing:.07em;text-transform:uppercase;cursor:pointer;justify-content:space-between;align-items:center;gap:18px;padding:13px 15px;display:flex}.onager-primary>span{font:22px/.8 var(--serif)}.onager-primary:hover:not(:disabled){border-color:var(--ink);background:var(--ink)}.onager-primary:active:not(:disabled){color:var(--ink);border-color:var(--ink);background:var(--accent);transform:translateY(1px)}.onager-primary:disabled{border-color:var(--rule);color:var(--muted);background:color-mix(in srgb, var(--ink) 8%, var(--paper-cool));cursor:default}.onager-text-button{color:var(--print);font:800 9px/1.3 var(--sans);text-transform:uppercase;letter-spacing:.06em;cursor:pointer;background:0 0;border:0;padding:12px 0 0}.onager-text-button:hover{text-decoration:underline}.onager-turn-tag{color:#f0dfbe;font:800 9px/1 var(--sans);text-transform:uppercase;letter-spacing:.06em;pointer-events:none;background:#272332d9;align-items:center;gap:7px;padding:7px 10px;display:flex;position:absolute;top:14px;left:16px}.onager-turn-dot{background:var(--company);outline:1px solid #fff4;width:7px;height:7px}.onager-controls{grid-template-columns:156px 88px minmax(0,1fr) minmax(0,1fr);grid-template-areas:"ammo direction angle power""status status fire fire";align-items:end;gap:14px 18px;padding:18px 16px 13px;display:grid}.onager-ammunition,.onager-direction{border:0;min-width:0;margin:0;padding:0}.onager-ammunition{grid-area:ammo}.onager-direction{grid-area:direction}.onager-ammunition legend,.onager-direction legend,.onager-range>span:first-child{width:100%;color:var(--muted);font:800 8px/1 var(--sans);text-transform:uppercase;letter-spacing:.09em;margin:0 0 9px;padding:0;display:block}.onager-ammunition>div{gap:4px;display:flex}.onager-ammunition button{width:48px;min-height:44px;color:var(--muted);background:color-mix(in srgb, var(--ink) 5%, transparent);cursor:pointer;border:1px solid #0000;justify-content:center;align-items:center;padding:5px 8px 3px 2px;display:flex;position:relative}.onager-ammo-icon{width:30px;height:25px;image-rendering:pixelated;flex-shrink:0;display:block}.onager-ammunition button b{min-width:9px;font:800 10px/1 var(--sans);font-variant-numeric:tabular-nums;text-align:center;position:absolute;top:4px;right:4px}.onager-ammunition button[aria-pressed=true]{border-color:var(--print);color:var(--print);background:color-mix(in srgb, var(--print) 10%, var(--paper-cool));box-shadow:inset 0 -2px 0 var(--print)}.onager-ammunition button:hover:not(:disabled){border-color:var(--print);background:color-mix(in srgb, var(--print) 7%, var(--paper-cool))}.onager-ammunition button:disabled{cursor:default}.onager-ammunition:not(:disabled) button:disabled{opacity:.3}.onager-ammunition:disabled{opacity:.5}.onager-ammunition:disabled button{cursor:default}.onager-direction>div{display:flex}.onager-direction button{border:1px solid var(--rule);min-width:0;min-height:44px;color:var(--muted);cursor:pointer;background:0 0;flex:1;place-items:center;padding:9px;display:grid}.onager-direction button+button{border-left:0}.onager-direction button svg{width:22px;height:17px}.onager-direction button[aria-pressed=true]{border-color:var(--print);color:var(--paper-cool);background:var(--print)}.onager-direction button:hover:not(:disabled):not([aria-pressed=true]){color:var(--print);background:color-mix(in srgb, var(--print) 7%, var(--paper-cool))}.onager-direction:disabled{opacity:.4}.onager-direction:disabled button{cursor:default}.onager-range{min-width:0;display:block}.onager-angle{grid-area:angle}.onager-power{grid-area:power}.onager-range>span:first-child{justify-content:space-between;align-items:baseline;gap:6px;margin-bottom:0;display:flex}.onager-range b{color:var(--print);font-variant-numeric:tabular-nums;letter-spacing:-.04em;font-size:18px;line-height:1}.onager-range small{letter-spacing:0;margin-left:1px;font-size:10px}.onager-range input{-webkit-appearance:none;appearance:none;background:linear-gradient(to right, var(--print) 0 var(--onager-range-fill), var(--rule) var(--onager-range-fill) 100%) center / 100% 3px no-repeat;width:100%;height:44px;accent-color:var(--print);cursor:pointer;border:0;border-radius:0;margin:0;display:block}.onager-range input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;border:2px solid var(--paper-cool);outline:1px solid var(--print);background:var(--print);border-radius:0;width:10px;height:14px}.onager-range input::-moz-range-thumb{border:2px solid var(--paper-cool);outline:1px solid var(--print);background:var(--print);border-radius:0;width:6px;height:10px}.onager-range:has(input:disabled){opacity:.4}.onager-range input:disabled{cursor:default}.onager-fire{grid-area:fire;place-self:center end;gap:10px;min-width:0;max-width:160px;min-height:44px;margin:0;padding:10px 12px}.onager-fire>.onager-fire-copy{font-family:var(--sans);align-items:center;gap:9px;line-height:1;display:flex}.onager-fire strong{letter-spacing:.08em;font-size:11px;font-weight:800}.onager-fire kbd{opacity:.65;font:500 7px/1 var(--sans);letter-spacing:0;text-transform:none;border:1px solid;padding:3px 4px}.onager-fire>.onager-fire-arrow{flex-shrink:0;display:flex}.onager-fire-arrow svg{width:23px;height:18px;transform:rotate(-35deg)}.onager-status{min-width:0;color:var(--muted);grid-area:status;justify-content:space-between;align-self:center;align-items:center;gap:16px;display:flex}.onager-status p{font:500 10px/1.5 var(--sans);align-items:center;gap:7px;margin:0;display:flex}.onager-status p>i{background:var(--rule);flex-shrink:0;width:5px;height:5px}.onager-status[data-ready=true] p>i{background:var(--print)}.onager-shortcuts{font:500 8px/1 var(--sans);white-space:nowrap;align-items:center;gap:3px;display:none}.onager-shortcuts kbd{font:inherit}.onager-shortcuts>span{margin:0 4px}@container onager (width>=780px){.onager-controls{grid-template-columns:156px 88px minmax(0,1fr) minmax(0,1fr) 132px;grid-template-areas:"ammo direction angle power fire""status status status status status";gap:12px 20px;padding:18px 18px 11px}.onager-fire{align-self:end;min-height:57px}.onager-fire>.onager-fire-copy{flex-direction:column;align-items:start;gap:6px}.onager-shortcuts{display:flex}.onager-status{padding-top:1px}}@container onager (width<=539px){.onager-controls{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"ammo direction""angle power""fire fire""status status";gap:15px 22px;padding:16px 12px 11px}.onager-direction{justify-self:end;width:88px}.onager-fire{max-width:none;min-height:44px;padding:12px 14px}.onager-fire>.onager-fire-copy{gap:12px}.onager-status p{font-size:9px}}.onager-footnote{font:800 9px/1.5 var(--sans);letter-spacing:.03em;justify-content:space-between;align-items:center;gap:20px;padding-top:15px;display:flex}.onager-footnote p{margin:0}.onager-footnote a{color:var(--print);border-bottom:1px solid var(--print);padding-bottom:3px}.onager-footnote a:hover{color:var(--ink);border-color:var(--accent)}:is(.onager-page button:focus-visible,.onager-page input:focus-visible,.onager-page a:focus-visible){outline:2px solid var(--print);outline-offset:4px}@media (min-width:851px) and (min-height:650px){.onager-shell{width:min(1120px,100% - 64px,175svh - 525px)}.onager-heading h1{font-size:clamp(27px,3vw,42px)}.onager-heading p:last-child{margin-top:8px;font-size:17px}.onager-shell{padding-top:20px;padding-bottom:12px}.onager-heading{padding-bottom:16px}.onager-heading .onager-eyebrow{margin-bottom:9px}}@media (max-width:850px){.onager-shell{width:calc(100% - 36px);padding-top:22px}.onager-hud{gap:12px;padding:12px 10px 15px}.onager-armies{gap:12px}.onager-army b small{display:none}.onager-army>div{gap:4px;font-size:8px}.onager-icon{width:32px;height:34px}.onager-weather{min-width:55px}.onager-dialog .onager-primary{padding:12px;font-size:9px}.onager-dialog{width:300px;padding:18px}}@media (max-width:600px){.onager-shell{width:calc(100% - 20px);padding-top:20px}.onager-heading{padding-bottom:16px;display:block}.onager-heading h1{font-size:clamp(24px,7.4vw,34px)}.onager-heading p:last-child{font-size:17px}.onager-eyebrow{font-size:8px}.onager-new{margin-top:12px;padding-top:0;font-size:8px}.onager-hud{grid-template-columns:1fr auto auto;gap:12px 8px;padding:8px 6px 12px;display:grid}.onager-armies{grid-column:1/-1;gap:12px}.onager-army>div{font-size:8px}.onager-company-suffix{display:none}.onager-weather{align-items:center;gap:10px;display:flex}.onager-weather b{font-size:15px}.onager-icon{width:30px;height:28px;font-size:15px}.onager-stage{aspect-ratio:16/10}.onager-canvas{height:90%;top:5%;bottom:5%}.onager-dialog{outline-width:3px;width:280px;padding:13px}.onager-dialog h2{font-size:25px}.onager-dialog p{margin:10px 0;font-size:13px}.onager-kicker{margin-bottom:9px;font-size:7px}.onager-dialog .onager-primary{min-height:37px;padding:10px}.onager-turn-tag{padding:5px 7px;font-size:7px;top:8px;left:7px}.onager-footnote{align-items:start;padding-top:12px;font-size:8px}.onager-footnote>a{white-space:nowrap}}@media (max-width:400px){.onager-intro{padding:10px}.onager-intro h2{font-size:22px}.onager-intro .onager-kicker{margin-bottom:6px;font-size:6px}.onager-intro p{margin:8px 0;font-size:12px;line-height:1.2}}
