html,body{margin:0;min-height:100%;background:#a8a88b;font-family:UnbanGame,monospace}body{overflow-x:hidden}#city-viewport{position:relative;width:100%;height:var(--city-height,1500px);overflow:hidden;background:#2d6280}#tower{position:absolute;left:var(--city-left,0px);top:0;width:1128px;height:1500px;isolation:isolate;transform:scale(var(--city-scale,1));transform-origin:top left}.layer{position:absolute}.layer img{display:block;border:0;image-rendering:pixelated}.layer a{display:block}.layer iframe{display:block;border:0}a:focus-visible,area:focus-visible{outline:2px solid #ffff00;outline-offset:2px}#divBg{background:url('assets/scenery/sky/sky_bg.png')}#divTowertile{background:url('assets/scenery/city/stacktower_tile.png')}dialog{max-width:420px;background:#fff8cc;color:#222;border:3px solid #222;padding:24px;box-shadow:8px 8px #0006;font:16px/1.5 UnbanGame,monospace}dialog::backdrop{background:#0008}dialog h1{font-size:20px}.close{float:right;background:none;border:0;font-size:24px;cursor:pointer}.score-note{margin:0;padding:12px;font:16px/1.5 UnbanGame,monospace;color:#fff;background:#262626;box-sizing:border-box;height:100%}

/* Reflow the native banners instead of making phones scroll a desktop canvas. */
.city-panel,.panel-art,.building-signs,.mobile-scenery{display:contents}
.building-facade,.building-ground,.mobile-rooftop,.mobile-intro{display:none}
#tower{image-rendering:pixelated;z-index:1}
#city-viewport.compact{height:auto;overflow:clip;background:#b5dce2 url('assets/scenery/sky/sky_bg.png') repeat-x top left;image-rendering:pixelated}
#tower.compact{position:relative;left:0;top:0;min-width:0;max-width:100%;height:auto;box-sizing:border-box;margin:0 0 0 var(--compact-left,0px);padding:12px 0 0;transform:none;display:flex;flex-direction:column;align-items:center;gap:12px;isolation:isolate}
#tower.compact>.layer{display:none}
#tower.compact>map{position:absolute;width:0;height:0}
.compact .city-panel{display:block;flex:none;position:relative;height:var(--panel-height);max-width:100%;z-index:1}
.compact .panel-art{display:block;position:absolute;left:0;top:0;transform:none}
.compact .panel-art>.layer{left:var(--panel-left)!important;top:var(--panel-top)!important}
.compact .building-facade{display:block;position:absolute;z-index:-1;top:var(--facade-top,226px);bottom:var(--facade-bottom,137px);left:12px;right:12px;background:#9f9b63 url('assets/scenery/city/stacktower_tile.png');border-top:3px solid #b9c6ae;box-shadow:0 -2px #344b4c}
/* Repeat just a clean wall section, not the entire tower with its ground floor. */
.compact .building-facade::before,.compact .building-facade::after{content:"";position:absolute;top:0;bottom:0;width:16px;image-rendering:pixelated;background-image:url('assets/scenery/city/stack_tower.png');background-repeat:repeat-y;background-size:16px 256px;pointer-events:none}
.compact .building-facade::before{left:-12px;background-image:var(--edge-left);background-position:0 0}
.compact .building-facade::after{right:-12px;background-image:var(--edge-right);background-position:0 0}
.compact .building-signs{display:block;position:relative;flex:none}
.compact .building-signs>.city-panel{position:absolute;left:var(--card-x);top:var(--card-y);margin:0}
.compact .building-signs>.city-panel::before{content:"";position:absolute;inset:-3px;z-index:-1;border:1px solid #3a4944;background:#b4ad75;box-shadow:inset 1px 1px #e0dab0,2px 3px #626843}
.compact .building-ground{display:block;position:relative;align-self:flex-start;flex:none;left:calc(-1 * var(--compact-left,0px));width:var(--viewport-width);height:137px;overflow:hidden;z-index:2;margin-top:0}
.compact .building-ground img{position:absolute;display:block;top:0;left:var(--ground-left);width:var(--ground-native-width);height:137px;max-width:none;image-rendering:pixelated}
#tower.compact>#divRobotleg{display:block;left:var(--robot-joint-x,0px)!important;top:var(--robot-joint-y,1800px)!important;z-index:0!important;pointer-events:none}
.compact .mobile-scenery{display:contents}
/* Exterior scenery keeps its native size and can crop at the viewport edge. */
.compact .mobile-scenery #divBlocblimp{left:var(--compact-blimp-left)!important;top:var(--compact-blimp-top)!important;translate:none}
#tower.compact>#divKong{display:block;left:var(--kong-x)!important;top:var(--kong-y)!important;pointer-events:none}
.compact .mobile-scenery #divScoresign{left:var(--playlist-x)!important;top:var(--playlist-y)!important;translate:none}
.compact .mobile-scenery #divScoresign img{left:0!important;top:0!important}
/* The phone billboard stacks the existing emblem and wordmark at native 1:1. */
.narrow .city-panel.wide>.panel-art{display:none}
.narrow .city-panel.rooftop{height:var(--phone-roof-height,254px)}
.narrow .mobile-rooftop{display:flex;position:absolute;top:0;transform-origin:top left;width:315px;height:239px;box-sizing:content-box;flex-direction:column;align-items:center;gap:4px;padding:5px 0;border:2px solid #9eab8d;background:#080c08;box-shadow:0 2px #263b36;margin:0}
.mobile-art-window{position:relative;overflow:hidden;flex:none}
.mobile-art-window img{position:absolute;max-width:none;image-rendering:pixelated}
.narrow .city-panel.wide:not(.rooftop){height:337px}
.narrow .mobile-intro{display:flex;flex-direction:column;align-items:center;gap:12px}
.mobile-welcome{display:block;image-rendering:pixelated}
.mobile-desk{display:flex;flex-direction:column;align-items:center;gap:4px;padding:4px;border:2px solid #303b32;background:#332d28;box-shadow:1px 2px #72754e}
.scenery-extensions{position:absolute;top:0;pointer-events:none;image-rendering:pixelated;z-index:0}
#city-viewport:not(.compact){background-color:#a8a88b;background-image:url('assets/scenery/sky/sky_bg.png');background-repeat:repeat-x;background-size:var(--sky-size,10px 4500px);background-position:left top;image-rendering:pixelated}
html.scenery-reference,html.scenery-reference body{overflow:hidden;background:transparent}
html.scenery-reference .scenery-extensions{display:none}
html.scenery-reference #city-viewport{background:none}

/* Third pass: packed little signs, in the game's checkpoint palette. */

@font-face{font-family:UnbanSmall;src:url('assets/showcase/fonts/UnbanGameSmall.ttf') format('truetype');font-display:swap}

@font-face{font-family:UnbanGame;src:url('assets/showcase/fonts/UnbanGame.ttf') format('truetype');font-display:swap}

.showcase-layer{z-index:12}

/* Kong's foreground hand overlaps both the queue and the verdict displays. */

#divKong{z-index:30!important}

#showcase-title{z-index:4}

.game-logo{position:absolute;left:0;top:0}

#divBillboard img,#divTb1 img,#divTb2 img{filter:saturate(.18) brightness(.72)}

.showcase-layer img{max-width:none}

.banner-intro{box-sizing:border-box;color:#eee9ce;text-align:center;background:#424b3b;padding:3px 12px}

.banner-intro h2{font:16px/16px UnbanGame,monospace;margin:0 0 1px;color:#e7eccd}

.banner-intro .banner-copy{font:16px/16px UnbanGame,monospace;margin:0}

.banner-intro .banner-tag{font:8px/10px UnbanSmall,monospace;margin-top:2px;color:#d7dfbd}

.banner-scene{overflow:hidden}

.scene-label{position:absolute;bottom:0;left:0;right:0;padding:3px 6px;background:#262128;color:#d7d2ae;font:8px/10px UnbanSmall,monospace;letter-spacing:1px}

.banner-feature{box-sizing:border-box;overflow:hidden;border:2px solid #25212a;background:#626954;color:#eee9d3;box-shadow:inset 0 0 0 1px #96977c,2px 2px #272429;font:11px/13px UnbanGame,monospace}

.banner-feature h2{box-sizing:border-box;height:20px;margin:0;padding:4px 7px 3px;background:#29262c;border-bottom:1px solid #96977c;color:#e0dfb6;font:8px/12px UnbanSmall,monospace;letter-spacing:1px}

.banner-illustration{margin:3px 3px 0}

.banner-copy{margin:5px 8px 0;font:16px/16px UnbanGame,monospace}

.banner-tag{margin:5px 8px 0;font:8px/10px UnbanSmall,monospace;color:inherit}

.game-prop{position:absolute}

.theme-paper{background:#ded8bd;color:#312c2b;box-shadow:inset 0 0 0 1px #fff7d8,2px 2px #272429}

.theme-record{background:#cbded9;color:#303e40;box-shadow:inset 0 0 0 1px #e4eeee,2px 2px #272429}

.theme-record h2{background:#455557;color:#e4eeee}

.theme-red{background:#543b3e;color:#eee0c9}

.theme-red h2{background:#702f38;color:#f1ddd2}

.theme-slate{background:#555557;color:#eeeece}

.theme-slate h2{background:#363638;color:#d2d0ad}

.theme-brass{background:#695637;color:#f2e4bf}

.theme-brass h2{background:#403626;color:#daceaa}

.theme-ink{background:#30272d;color:#e4ddc8}

.banner-references{position:absolute;left:78px;top:26px;right:7px}

.banner-references a{display:block!important;color:#e1dfbb;text-decoration:underline;font:16px/18px UnbanGame,monospace}

.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}



/* Printed desk signs, set only in the game's own fonts. */

#showcase-stats .banner-tag{margin-top:9px;padding:3px 5px;border:1px solid #aaa889;color:#ddd9bc;font:16px/16px UnbanGame,monospace;text-align:center;letter-spacing:2px}

#showcase-languages .banner-tag{margin-top:8px;color:#eee9ce;font:24px/24px UnbanGame,monospace;text-align:center;letter-spacing:6px}



/* Small illustrated web banners: one headline, no repeated caption paragraphs. */

.banner-feature{background:#292529;border-color:#211e23;box-shadow:inset 0 0 0 1px #85846c,2px 2px #272429;--sign-bg:#4c5540;--sign-ink:#e6e3c7}

.banner-feature h2{position:absolute;z-index:2;left:2px;right:2px;bottom:2px;height:28px;padding:1px 3px;margin:0;border:0;border-top:1px solid #b0ad87;border-bottom:2px solid #292529;background:var(--sign-bg);color:var(--sign-ink);font:24px/24px UnbanGame,monospace;letter-spacing:0;text-align:center;white-space:nowrap;text-shadow:1px 1px #242126}

.banner-illustration{position:absolute;margin:0}

.theme-paper{--sign-bg:#d3ceb1;--sign-ink:#292529}

.theme-paper h2{text-shadow:none;border-top-color:#f2eccd}

.theme-record{--sign-bg:#465958;--sign-ink:#dce4ce}

.theme-red{--sign-bg:#813b43;--sign-ink:#f4e2bf}

.theme-slate{--sign-bg:#414347;--sign-ink:#ede7c7}

.theme-brass{--sign-bg:#74633c;--sign-ink:#f2e3bb}

.theme-ink{--sign-bg:#373139;--sign-ink:#e6dbb7}

#showcase-queue h2{font-size:32px;line-height:28px;height:32px;padding:0}

#showcase-voice h2{height:26px;line-height:24px;bottom:0}

#showcase-references h2{bottom:auto;top:0;height:20px;padding:1px 6px;font:16px/16px UnbanGame,monospace;text-align:left;border-top:0;border-bottom:1px solid #85846c}

.banner-badges{position:absolute;left:8px;right:8px;top:10px;display:flex;gap:8px;justify-content:center}

.banner-badges span{padding:4px 6px;border:2px solid #809779;color:#b8cea4;font:16px/16px UnbanGame,monospace;box-shadow:inset 0 0 0 1px #292529}

.banner-badges span+span{border-color:#b46d70;color:#dfa7a0}

#showcase-languages .banner-tag{position:absolute;top:5px;left:0;right:0;margin:0;color:#dedac1;font:32px/32px UnbanGame,monospace;letter-spacing:4px;text-align:center}

.banner-intro{padding-top:6px}

.banner-intro h2{font:24px/24px UnbanGame,monospace;margin-bottom:2px}

.banner-intro .banner-tag{margin-top:4px}



/* The original unequal display boxes replace the repeated caption-card layout. */

.banner-vignette,.banner-video{box-sizing:border-box;overflow:hidden;border:2px solid #252126;background:#252126;box-shadow:inset 0 0 0 1px #96977c,2px 2px #272429}

.banner-loop{position:absolute;display:block;image-rendering:pixelated}

#showcase-casefile{border-top-color:#b7b39a}

#showcase-visitors{border-top-color:#90ad9c;box-shadow:inset 0 0 0 1px #657f70,2px 2px #272429}

#showcase-verdict{border-top-color:#a45d60}

#showcase-chat{border-top-color:#dedac1}

#showcase-cabinet{border-top-color:#98966e}

#showcase-handoff{box-shadow:inset 0 0 0 1px #504537,2px 2px #272429}



/* Keep small printed labels clear of their frames. */

#showcase-references h2{height:20px;padding:4px 6px;font:8px/12px UnbanSmall,monospace;text-shadow:none}

.banner-references{top:25px}

.banner-references a{line-height:20px}

.banner-intro{padding-top:9px}

.banner-intro h2{font:16px/20px UnbanGame,monospace;margin-bottom:3px}

.banner-intro .banner-copy{line-height:18px}

.banner-intro .banner-tag{margin-top:4px}



.video-heading{box-sizing:border-box;height:34px;margin:0;padding:4px 6px 5px;border-bottom:1px solid #96977c;color:#e0dfb6;background:#29262c;font:8px/12px UnbanSmall,monospace;text-transform:uppercase;text-align:center}

.showcase-video{display:block;width:100%;height:calc(100% - 24px);background:#000}

.banner-intro{display:flex;flex-direction:column;justify-content:center;padding:0 12px}



.video-meta{display:block;color:#b9b29a;font:8px/12px UnbanSmall,monospace}


/* Desktop zoom fits the main composition; peripheral scenery may extend beyond it. */
#city-viewport:not(.compact){overflow:clip;--scenery-clearance:24px}

/* The illustrated welcome banner uses the original full sign bounds. */
.banner-welcome{background:transparent;line-height:0}
.banner-welcome img{display:block}

/* Native bitmap heading assets: no browser font rasterization or fractional fitting. */
.video-heading.pixel-heading,#showcase-references h2.pixel-heading{box-sizing:border-box;padding:0;margin:0;border:0;background:none;line-height:0;text-shadow:none;left:0;right:auto;top:0}
.video-heading.pixel-heading{height:24px}
#showcase-references h2.pixel-heading{height:20px}
.pixel-heading img,.banner-references a img{display:block;image-rendering:pixelated}

/* Center on whole CSS pixels even with an odd scrollbar or column width. */
.compact .building-signs,.compact .city-panel,.compact .mobile-rooftop,.compact .mobile-desk,.compact .mobile-welcome,.compact .mobile-art-window,.compact .mobile-scenery>.layer{translate:var(--pixel-snap,0px) 0}

/* One viewport-wide skyline and street, with a shared ground baseline. */
#city-viewport.compact .scenery-extensions{display:none}
#city-viewport.compact::after{content:"";position:absolute;left:0;right:0;bottom:0;height:var(--footer-city-height);z-index:0;pointer-events:none;background:url('assets/scenery/city/right_city.png') var(--footer-city-left,0px) bottom / var(--footer-city-width) var(--footer-city-height) no-repeat;image-rendering:pixelated}


/* Tiny-screen previews already have their own native pixel grid. */
.mobile-rooftop-mini{display:none;position:absolute;top:0;image-rendering:pixelated}
.narrow .mini-rooftop .mobile-rooftop{display:none}
.narrow .mini-rooftop .mobile-rooftop-mini{display:block}