/* Sudan Builders v2.4.0 — cinematic visual system, self contained and additive.
   The saved learning state, shortcode and voting rules remain in the original app.js. */
.sb-app.sb22-theme{
  --sb24-night:#17382f;--sb24-forest:#116d51;--sb24-copper:#a65d44;
  --sb24-amber:#c9a05a;--sb24-paper:#fffefa;--sb24-line:#d9e5dc;
  font-family:inherit!important;background:#f5f8f5!important;
}
.sb-app.sb22-theme .sb2-header{
  background:linear-gradient(105deg,#102e29 0%,#145e4c 75%,#187359 100%)!important;
  box-shadow:0 4px 20px rgba(15,59,42,.10);border:0!important;
}
.sb-app.sb22-theme .sb2-header::before,.sb-app.sb22-theme .sb2-header::after,
.sb-app.sb22-theme .sb2-shell::before,.sb-app.sb22-theme .sb2-shell::after{content:none!important;display:none!important;border:0!important}
.sb-app.sb22-theme .sb20-stage-header{
  background:linear-gradient(112deg,#fffefa 26%,#f1f8f1 100%)!important;
  box-shadow:0 8px 27px rgba(23,68,46,.04)!important;
  border-radius:19px!important;
}
.sb-app.sb22-theme .sb20-stage-header h1{letter-spacing:-.025em;font-size:clamp(24px,2.5vw,38px)!important;line-height:1.18!important}
.sb-app.sb22-theme .sb2-reset{background:#a04838!important;border:1px solid #ba7966!important;border-radius:12px!important;box-shadow:0 5px 15px rgba(101,34,27,.20)!important}
.sb-app.sb22-theme .sb20-control,.sb-app.sb22-theme .sb20-visual,
.sb-app.sb22-theme .sb9-task-card,.sb-app.sb22-theme .sb9-maincard{
  border-color:#dbe7de!important;border-radius:20px!important;
  box-shadow:0 9px 28px rgba(21,57,38,.05)!important;
}
.sb-app.sb22-theme .sb20-visual{padding:12px!important}
.sb-app.sb22-theme .sb20-visual-top{margin-bottom:6px!important}
.sb-app.sb22-theme .sb20-visual h2{color:#164e3e!important;font-weight:850!important}
.sb-app.sb22-theme .sb20-world{
  position:relative;overflow:hidden;
  border-radius:19px!important;
  border:1px solid #b9cfb9!important;
  box-shadow:0 13px 22px rgba(37,79,56,.10), inset 0 0 30px rgba(228,242,219,.2)!important;
}
.sb-app.sb22-theme .sb20-world.village{background:radial-gradient(ellipse at 44% 21%,#f5f0d8 3%,#cde0c2 80%)!important}
.sb-app.sb22-theme .sb20-world.town{background:radial-gradient(ellipse at 50% 18%,#f8eee0 1%,#ceded7 82%)!important}
.sb-app.sb22-theme .sb20-world.neighborhood{background:radial-gradient(ellipse at 43% 25%,#f2f6e9 0%,#c8dfcb 82%)!important}
/* Cinematic tint is visual only; buttons and canvas remain interactive. */
.sb-app.sb22-theme .sb20-world::after{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  box-shadow:inset 0 0 56px rgba(35,64,45,.08);
  background:linear-gradient(180deg,rgba(255,250,225,.11),transparent 32%,rgba(32,80,51,.025));
}
.sb-app.sb22-theme .sb21-world .sb21-canvas{touch-action:none;cursor:grab}
.sb-app.sb22-theme .sb21-world .sb21-canvas:active{cursor:grabbing}
.sb-app.sb22-theme .sb23-map-controls{z-index:7!important;border:1px solid #d3e1d5!important;border-radius:13px!important;box-shadow:0 9px 25px rgba(33,62,41,.15)!important}
.sb-app.sb22-theme .sb23-map-controls button{border-radius:9px!important}
.sb-app.sb22-theme .sb20-map-caption{background:rgba(255,254,247,.90)!important;border-radius:11px!important;box-shadow:0 3px 15px rgba(26,53,35,.08)}
.sb-app.sb22-theme .sb20-map-caption .sb20-map-live i{box-shadow:0 0 0 4px #bfe4cb}
.sb-app.sb22-theme .sb21-world .sb20-center{
  border:1px solid #ddcba7!important;
  box-shadow:0 12px 28px rgba(58,74,38,.19)!important;
  background:rgba(255,254,249,.97)!important;
}
.sb-app.sb22-theme .sb20-visual .sb22-world-progress>span.done{color:#156c52}
.sb-app.sb22-theme .sb20-people-grid{scrollbar-width:thin;scrollbar-color:#b1ccb5 #f5f8f4}
.sb-app.sb22-theme .sb20-people-grid .sb2-person{
  border-radius:11px!important;min-height:46px!important;
  transition:border-color .18s ease,background .18s ease,box-shadow .18s ease;
}
.sb-app.sb22-theme .sb20-people-grid .sb2-person.is-picked{box-shadow:inset 3px 0 0 #1b7c58!important}
.sb-app.sb22-theme .sb20-people-grid .sb2-person-action{border-radius:9px!important}
.sb-app.sb22-theme .sb20-control-actions button,.sb-app.sb22-theme .sb20-control-footer button{border-radius:11px!important}
.sb-app.sb22-theme .sb20-control-actions .sb2-primary,.sb-app.sb22-theme .sb20-primary{background:#166d53!important;color:#fff!important}
.sb-app.sb22-theme .sb20-control-actions .sb2-primary:hover,.sb-app.sb22-theme .sb20-primary:hover{background:#0c583f!important}
.sb-app.sb22-theme .sb20-family-ribbon button{border-radius:10px!important}
.sb-app.sb22-theme .sb20-family-ribbon button.active{background:#145f4a!important}
.sb-app.sb22-theme .sb22-lesson{background:#f1f7f0!important;max-height:61px;overflow:hidden}
.sb-app.sb22-theme .sb20-stage .sb9-fold{border-radius:14px!important;overflow:hidden}
.sb-app.sb22-theme .sb24-feature{filter:drop-shadow(0px 5px 7px rgba(27,56,40,.18))}
.sb-app.sb22-theme .sb24-city-feature{filter:drop-shadow(2px 8px 5px rgba(18,47,35,.20))}
.sb-app.sb22-theme .sb24-village-feature{filter:drop-shadow(3px 7px 3px rgba(39,68,36,.13))}
.sb-app.sb22-theme .sb24-neighborhood-feature{filter:drop-shadow(2px 6px 3px rgba(20,70,46,.14))}
.sb-app.sb22-theme .sb20-dwelling.is-joined .sb20-citizen{filter:drop-shadow(0 0 2px #ebc05e)}
.sb-app.sb22-theme .sb20-hero-art{background:radial-gradient(circle at 50% 45%,#f3f1d9,#d4e3d5)!important}
.sb-app.sb22-theme .sb23-env-tile{background:linear-gradient(160deg,#fffefa,#f3f8f1);min-height:77px!important;border-radius:13px!important}
.sb-app.sb22-theme .sb23-env-tile.active{border:2px solid #1c8461!important;box-shadow:0 5px 12px #105c4021!important;background:#ebf7ee!important}
.sb-app.sb22-theme .sb23-env-picture{height:32px;width:39px}
.sb-app.sb22-theme .sb2-unit,.sb-app.sb22-theme .sb9-rakiza-tile{border-radius:13px!important}
.sb-app.sb22-theme .sb9-rakiza-tile.done{background:linear-gradient(150deg,#ecf8f0,#fffefb)!important}
.sb-app.sb22-theme .sb6-council-world{background:linear-gradient(130deg,#faf6ea,#eef6e9)!important}
.sb-app.sb22-theme .sb21-federation-world{background:radial-gradient(circle at 52% 46%,#f6f5e8,#e9f2e6)!important}
@media(min-width:1100px){
 .sb-app.sb22-theme .sb20-stage-grid{grid-template-columns:minmax(345px,.76fr) minmax(0,1.24fr)!important;gap:12px!important}
 .sb-app.sb22-theme .sb20-world{aspect-ratio:1.92!important;max-height:480px!important}
 .sb-app.sb22-theme .sb20-people-grid{max-height:242px!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:780px){
 .sb-app.sb22-theme .sb2-header{min-height:52px!important;padding:8px 10px!important}
 .sb-app.sb22-theme .sb2-main{padding:7px 6px 11px!important}
 .sb-app.sb22-theme .sb20-stage-header{padding:8px 10px!important;margin-bottom:7px!important}
 .sb-app.sb22-theme .sb20-stage-header h1{font-size:20px!important}
 .sb-app.sb22-theme .sb20-mobile-tabs{position:sticky!important;top:0;z-index:12;box-shadow:0 3px 12px rgba(20,67,45,.08);margin-bottom:6px!important}
 .sb-app.sb22-theme .sb20-control{padding:8px!important;gap:5px!important}
 .sb-app.sb22-theme .sb20-people-grid{max-height:210px!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:5px!important}
 .sb-app.sb22-theme .sb20-people-grid .sb2-person{min-height:44px!important;padding:6px!important}
 .sb-app.sb22-theme .sb20-people-grid .sb2-person-action{min-height:29px!important;min-width:42px!important}
 .sb-app.sb22-theme .sb20-family-ribbon button{min-height:34px!important}
 .sb-app.sb22-theme .sb20-world{aspect-ratio:1.52!important;min-height:222px!important;border-radius:14px!important}
 .sb-app.sb22-theme .sb20-visual{padding:7px!important}
 .sb-app.sb22-theme .sb21-world .sb20-center{min-height:45px!important;padding:5px 10px!important}
 .sb-app.sb22-theme .sb20-stage .sb9-fold{margin-top:7px!important}
 .sb-app.sb22-theme .sb20-visual .sb22-world-progress{margin-top:4px!important}
 .sb-app.sb22-theme .sb23-env-tile{min-height:58px!important;padding:4px!important}
 .sb-app.sb22-theme .sb23-env-picture{height:24px;width:29px}
 .sb-app.sb22-theme .sb20-control-actions{position:sticky;bottom:0;z-index:9;background:#fffefa;padding:7px 0 2px!important;box-shadow:0 -5px 10px #fefefaee}
 .sb-app.sb22-theme .sb20-control-footer{padding-bottom:2px!important}
 .sb-app.sb22-theme .sb22-lesson{max-height:56px;padding:5px!important}
 .sb-app.sb22-theme .sb2-footer{display:none!important}
}
@media(prefers-reduced-motion:reduce){.sb-app.sb22-theme .sb24-feature{filter:none!important}.sb-app.sb22-theme .sb20-hero-art *{animation:none!important}}