/* Scoped to Krazlings. All game units retain their existing world dimensions. */
body[data-arcade=krazlings]{--exp-ink:#15202a;--exp-paper:#ece3cd;--exp-muted:#b4bbaf;--exp-sage:#a6c69d;--exp-brass:#dfbc7e}
.arcade-web body[data-arcade=krazlings]{background:radial-gradient(ellipse at 55% 0,#303349,#121a23 75%);gap:5px}
body[data-arcade=krazlings] button{font-family:inherit;letter-spacing:0;text-transform:none}
.arcade-web body[data-arcade=krazlings] .arcade-toolbar{background:#131d27;border-bottom-color:#4a4b53;min-height:62px}
.arcade-web body[data-arcade=krazlings] .arcade-identity small{color:#c0b9a6;letter-spacing:.03em}
#mission-strip{display:flex;flex:0 0 auto;align-items:center;justify-content:space-between;gap:12px;padding:3px 16px;min-height:30px;color:var(--exp-paper);font-size:12px}
#mission-line{margin:0;font-weight:600;letter-spacing:.035em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#rescue-meter{position:relative;flex:0 0 140px;height:5px;background:#49505a;border-radius:4px;overflow:hidden}
#rescue-meter::before{content:'';display:block;width:var(--rescue,0%);height:100%;background:var(--exp-sage);transition:width .25s}
.arcade-web body[data-arcade=krazlings] #game-area{position:relative;flex:1;min-height:190px;margin:0 12px;padding:0;overflow:hidden;border:1px solid #696571;border-radius:12px;background:#162730}
.arcade-web body[data-arcade=krazlings] canvas#game{width:100%;height:100%;max-width:none;max-height:none;border:0;border-radius:0;box-shadow:none;image-rendering:pixelated}
.arcade-web body[data-arcade=krazlings] #hud{top:0;gap:4px;padding:7px;background:linear-gradient(#14212ac9,transparent);justify-content:flex-start}
.arcade-web body[data-arcade=krazlings] #hud span{padding:5px 9px;border:1px solid #77828450;border-radius:5px;background:#162a33dc;color:#eee5d4;font-size:11px}
.arcade-web body[data-arcade=krazlings] #hud b{color:#dfcd9b}
.arcade-web body[data-arcade=krazlings] #msg{display:block;position:absolute;inset:auto 10px 8px;top:auto;min-height:0;background:#14212ade;color:#f0e6cf;font:12px/1.4 system-ui;padding:6px 10px;border-radius:5px;max-width:720px;margin:auto}
#expedition-card{position:absolute;z-index:20;top:50%;left:50%;transform:translate(-50%,-50%);width:min(440px,calc(100% - 32px));max-height:calc(100% - 74px);overflow:auto;background:linear-gradient(145deg,#23353af7,#172630fa);border:1px solid #aa997d;border-radius:12px;padding:23px 26px;color:var(--exp-paper);box-shadow:0 14px 40px #06101780;text-align:left}
#expedition-card[hidden]{display:none}
.expedition-eyebrow{color:#c8b78d;font-size:10px;letter-spacing:.16em;font-weight:750;margin:0 0 10px}
#expedition-card h2{font-family:Georgia,serif;font-weight:500;font-size:30px;line-height:1.08;margin:0 0 12px;color:#f2e8cf}
.expedition-objective{font-size:13px;font-weight:650;color:#bad3a8;margin:0 0 10px}
.expedition-blurb{font-size:13px;line-height:1.6;margin:8px 0;color:#d0d1c2}
.expedition-quip{font-size:11px;line-height:1.4;color:#b5b0a4;font-style:italic;margin:12px 0 16px}
body[data-arcade=krazlings] .expedition-go{background:#b1c49b;color:#17292b;border:1px solid #d0d8b9;min-height:42px;padding:10px 18px;font-size:13px;font-weight:750;min-width:0;border-radius:6px}
#expedition-dock{display:flex;align-items:center;gap:14px;flex:0 0 auto;margin:0 12px;padding:3px 8px;color:#bfc6b7}
#route-map{position:static;inset:auto;aspect-ratio:5;max-width:none;max-height:none;width:160px;height:32px;flex:0 0 160px;border:1px solid #65716b;border-radius:4px;box-shadow:none;background:#14232a;cursor:crosshair;touch-action:none;image-rendering:pixelated}
#skill-info{margin:0;font-size:11px;line-height:1.4;min-height:30px;display:flex;align-items:center}
.arcade-web body[data-arcade=krazlings] #action-bar{position:static;display:flex;flex-wrap:wrap;flex-direction:row;justify-content:center;gap:5px;padding:0 10px;margin:0;max-width:none;flex:0 0 auto}
.arcade-web body[data-arcade=krazlings] #action-bar button{flex:0 0 auto;width:auto;white-space:nowrap;background:#283840;border-color:#69757270;border-radius:5px;color:#e6dfcd;min-height:35px;min-width:0;padding:6px 11px;font-size:11px}
.arcade-web body[data-arcade=krazlings] #action-bar #startBtn{background:#a5bd95;color:#17292b;border-color:#bfd0ad;font-weight:750}
.arcade-web body[data-arcade=krazlings] #action-bar button[aria-pressed=true]{border-color:#d8bd85;color:#f3dca8}
.arcade-web body[data-arcade=krazlings] #skill-bar{position:static;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));width:auto;max-width:none;flex:0 0 auto;gap:5px;margin:0 12px 8px;padding:0;flex-direction:row}
.arcade-web body[data-arcade=krazlings] #skill-bar button{display:flex;min-width:0;min-height:54px;padding:6px;gap:6px;border-radius:6px;font-size:11px;background:#21323a;border:1px solid #586b6d;color:#eee4d1}
.arcade-web body[data-arcade=krazlings] #skill-bar button.active{border-color:#e4c68c;box-shadow:inset 0 -3px #e4c68c;background:#405044}
.arcade-web body[data-arcade=krazlings] #skill-bar button.depleted{opacity:.38}
body[data-arcade=krazlings] .skill-icon{display:flex;width:23px;height:23px;flex:0 0 23px;color:var(--skill-color)}
body[data-arcade=krazlings] .skill-icon svg{width:100%;height:100%}
body[data-arcade=krazlings] .skill-count{font:700 14px/1 ui-monospace,monospace;color:#f0d6a2;margin-left:auto}
#expedition-dialog{position:fixed;inset:0;background:#08131dc7;z-index:300;display:flex;align-items:center;justify-content:center;padding:16px}
#expedition-dialog[hidden]{display:none}
.expedition-dialog-card{background:#1c2c33;color:#ece3cd;border:1px solid #8a8270;border-radius:12px;width:min(650px,100%);max-height:90dvh;overflow:auto;padding:22px}
.expedition-dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}
#expedition-dialog-title{font:500 28px Georgia,serif;margin:0}
body[data-arcade=krazlings] #closeExpeditionBtn{background:#33434a;border:1px solid #8a8270;min-width:50px;font-size:12px}
.region h3{font-size:12px;color:#c7b78e;margin:18px 0 7px;letter-spacing:.06em}
.region-levels{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
body[data-arcade=krazlings] .region-levels button{background:#2d4247;border:1px solid #6e7e74;min-width:0;min-height:49px;padding:8px;font-size:15px;color:#f1e8d2}
.region-levels small{display:block;font-size:10px;margin-top:4px;color:#c5cea9}
body[data-arcade=krazlings] .region-levels .current-level{border:2px solid #dcc287}
.field-skill{font-size:13px;line-height:1.5;color:#c7cfc3}.field-skill strong{color:#ead4a2}
@media(max-width:700px){
 #mission-strip{padding:2px 10px;font-size:10px;min-height:25px}#rescue-meter{flex-basis:65px}
 .arcade-web body[data-arcade=krazlings] #game-area{margin:0 6px}
 .arcade-web body[data-arcade=krazlings] #skill-bar{margin:0 6px 5px;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}
 .arcade-web body[data-arcade=krazlings] #skill-bar button{min-height:43px;font-size:10px;gap:3px;padding:4px}
 #expedition-dock{margin:0 6px;gap:8px}#route-map{width:112px;flex-basis:112px;height:30px}#skill-info{font-size:10px}
 .arcade-web body[data-arcade=krazlings] #hud span{font-size:9px;padding:4px 6px}
 #expedition-card{padding:16px 18px}#expedition-card h2{font-size:25px}.expedition-blurb{font-size:12px}.expedition-quip{margin:8px 0 12px}
 .arcade-web body[data-arcade=krazlings] #action-bar{gap:4px;padding:0 6px}
 .arcade-web body[data-arcade=krazlings] #action-bar button{padding:5px 8px;min-height:35px;font-size:10px}
}
@media(max-height:540px) and (orientation:landscape){
 .arcade-web body[data-arcade=krazlings]{display:flex;gap:3px}
 .arcade-web body[data-arcade=krazlings] .arcade-toolbar{min-height:38px;padding:3px 8px}
 #mission-strip{min-height:18px;font-size:9px;padding:0 10px}
 .arcade-web body[data-arcade=krazlings] #game-area{min-height:120px;margin:0 6px;flex:1}
 #expedition-dock{display:none}
 .arcade-web body[data-arcade=krazlings] #action-bar button{min-height:30px;padding:3px 9px;font-size:10px}
 .arcade-web body[data-arcade=krazlings] #skill-bar{grid-template-columns:repeat(8,minmax(0,1fr));gap:3px;margin-bottom:3px}
 .arcade-web body[data-arcade=krazlings] #skill-bar button{min-height:35px;padding:3px;font-size:9px}.skill-icon{width:17px!important;height:17px!important;flex-basis:17px!important}
 #expedition-card{max-height:calc(100% - 34px);padding:12px 18px;width:min(480px,calc(100% - 25px))}
 #expedition-card h2{font-size:23px;margin:0 0 5px}.expedition-eyebrow{margin:0 0 5px;font-size:9px}.expedition-objective{font-size:11px;margin-bottom:5px}.expedition-blurb{font-size:11px;line-height:1.4}.expedition-quip{display:none}
 body[data-arcade=krazlings] .expedition-go{min-height:33px;padding:6px 12px;font-size:11px}
 .arcade-web body[data-arcade=krazlings] #msg{display:block;font-size:10px;padding:3px 7px}
}
@media(prefers-reduced-motion:reduce){#rescue-meter::before{transition:none}}

/* Only jobs supplied by this rescue are shown. Depleted supplied jobs stay visible. */
body[data-arcade=krazlings] #skill-bar button[hidden]{display:none!important}
.arcade-web body[data-arcade=krazlings] #skill-bar[data-focused=true]{
 grid-template-columns:repeat(var(--job-count),minmax(0,1fr));
 width:min(calc(var(--job-count)*164px),calc(100% - 24px));align-self:center;margin-left:auto;margin-right:auto;
}
/* Pixel expedition panels retain readable DOM text and existing touch targets. */
body[data-arcade=krazlings]{font-family:"Courier New",ui-monospace,monospace;--exp-paper:#efe4c5}
.arcade-web body[data-arcade=krazlings]{background:#19262f}
body[data-arcade=krazlings] button,body[data-arcade=krazlings] #msg{font-family:inherit}
.arcade-web body[data-arcade=krazlings] .arcade-toolbar{background:#20333a;border-bottom:3px solid #101c25;box-shadow:0 2px #65766b}
body[data-arcade=krazlings] .arcade-identity strong{font-family:inherit;letter-spacing:.08em;text-shadow:2px 2px #101c25}
.arcade-web body[data-arcade=krazlings] #game-area{border:3px solid #66796e;border-radius:0;box-shadow:inset 0 0 0 2px #17232d,2px 2px #101c25}
#expedition-card,.expedition-dialog-card{background:#21363b;border:3px solid #c0b18b;border-radius:0;box-shadow:4px 0 #101d27,-4px 0 #101d27,0 4px #101d27,0 -4px #101d27,inset 2px 2px #52665b,inset -2px -2px #16292f}
#expedition-card h2,#expedition-dialog-title{font-family:inherit;font-weight:700;letter-spacing:-.04em;text-shadow:2px 2px #101c25}
.expedition-quip{font-style:normal;color:#b9bfac}
body[data-arcade=krazlings] button{border-radius:0!important;box-shadow:inset 2px 2px #ffffff20,inset -2px -2px #09192380;transition:none}
body[data-arcade=krazlings] button:hover:not(:disabled){filter:brightness(1.12)}
body[data-arcade=krazlings] button:focus-visible{outline:2px solid #f4d391;outline-offset:2px}
body[data-arcade=krazlings] button:active:not(:disabled){box-shadow:inset 2px 2px #09192380,inset -2px -2px #ffffff20}
.arcade-web body[data-arcade=krazlings] #skill-bar button{border:2px solid #6d8275}
.arcade-web body[data-arcade=krazlings] #skill-bar button.active{border-color:#e9cb89;box-shadow:inset 2px 2px #ffffff25,inset -2px -3px #a68e5f;background:#405847}
.arcade-web body[data-arcade=krazlings] #hud{background:#15262bcc;border-bottom:2px solid #677c6a}
.arcade-web body[data-arcade=krazlings] #hud span{border-radius:0;border:1px solid #697b6a;background:#1e343a}
.arcade-web body[data-arcade=krazlings] #msg{border-radius:0;background:#192d33;border:1px solid #71806b}
#route-map,#rescue-meter{border-radius:0}
#rescue-meter{height:7px;border:1px solid #7a896f;background:#17272b}
#rescue-meter::before{transition:none}
body[data-arcade=krazlings] .skill-icon svg{shape-rendering:crispEdges}

#save-status{order:3;margin-left:auto;font-size:10px;color:#bfceaa;max-width:210px}
@media(max-width:700px){#expedition-dock{flex-wrap:wrap;row-gap:2px}#save-status{flex-basis:100%;max-width:none;text-align:right;font-size:9px;line-height:12px}}
@font-face{font-family:KrazlingsField;src:url('krazlings-field.ttf') format('truetype');font-display:swap;font-weight:100 900}
.arcade-web body[data-arcade=krazlings]{font-family:"Courier New",ui-monospace,monospace!important}
body[data-arcade=krazlings] button,body[data-arcade=krazlings] #expedition-card h2,body[data-arcade=krazlings] #expedition-dialog-title,body[data-arcade=krazlings] .arcade-identity strong{font-family:KrazlingsField,"Courier New",monospace!important;font-weight:400!important;letter-spacing:0}
body[data-arcade=krazlings] #expedition-card h2,body[data-arcade=krazlings] #expedition-dialog-title{line-height:1.3}