@import url("/assets/v22.css");

/* V23: ein ruhiger, autonomer Arbeitszyklus auf derselben Heimatwelt. */
.settlement-gate{position:absolute;z-index:20;right:max(20px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));display:grid;grid-template-columns:1fr auto;width:min(232px,30vw);min-height:52px;padding:11px 14px;border:1px solid rgba(134,225,222,.58);border-radius:12px;background:linear-gradient(135deg,rgba(4,22,27,.97),rgba(8,36,42,.95));color:#efffff;text-align:left;box-shadow:0 0 0 1px rgba(91,210,205,.11),0 12px 36px rgba(0,0,0,.42);cursor:pointer}
.settlement-gate[hidden],.work-plan[hidden],.cycle-summary[hidden]{display:none}
.settlement-gate small,.settlement-gate strong{grid-column:1}
.settlement-gate small{color:#86d7d2;font-size:8px;letter-spacing:.12em}
.settlement-gate strong{margin-top:3px;font-size:14px}
.settlement-gate span{grid-column:2;grid-row:1/3;align-self:center;color:#8ee5df;font-size:26px}
.settlement-gate:after{content:"";position:absolute;inset:-4px;border:1px solid rgba(102,225,216,.42);border-radius:15px;animation:work-gate-guide 2.8s ease-out infinite;pointer-events:none}
@keyframes work-gate-guide{0%{transform:scale(.985);opacity:.64}78%,100%{transform:scale(1.045);opacity:0}}

.work-plan{position:absolute;z-index:25;right:max(20px,env(safe-area-inset-right));top:50%;width:min(430px,52vw);max-height:calc(100% - max(20px,env(safe-area-inset-top)) - max(20px,env(safe-area-inset-bottom)));overflow:auto;box-sizing:border-box;padding:16px 18px;transform:translateY(-50%);border:1px solid rgba(133,221,220,.5);border-radius:16px;background:linear-gradient(150deg,rgba(4,16,23,.98),rgba(8,31,36,.98));color:#eafffd;box-shadow:0 22px 60px rgba(0,0,0,.58);backdrop-filter:blur(14px)}
.work-plan>small,.cycle-summary>small{display:block;color:#7ed5cf;font-size:8px;font-weight:750;letter-spacing:.18em}
.work-plan>strong,.cycle-summary>strong{display:block;margin-top:5px;font-size:18px;line-height:1.15}
.work-plan>p{margin:8px 0 12px;color:#b9d3d3;font-size:11px;line-height:1.4}
.work-plan__roles{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;margin:0 0 13px;padding:9px;border:1px solid rgba(126,207,209,.18);border-radius:10px;background:rgba(2,10,15,.38)}
.work-plan__roles span{min-width:0}
.work-plan__roles b,.work-plan__roles small{display:block}
.work-plan__roles b{font-size:12px}
.work-plan__roles small{margin-top:2px;color:#86b9bb;font-size:9px;letter-spacing:.08em;white-space:normal}
.work-plan__roles i{color:#77d8d3;font-style:normal;font-size:18px}
.work-plan>button{width:100%;min-height:44px;padding:11px 16px;border:1px solid rgba(157,237,231,.48);border-radius:999px;background:linear-gradient(135deg,#b7f1dc,#75cbd0);color:#06171b;font-size:12px;font-weight:800;letter-spacing:.03em;cursor:pointer}
.work-plan>button:disabled{opacity:.55;cursor:default}

.cycle-summary{position:absolute;z-index:20;right:max(20px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));width:min(395px,46vw);box-sizing:border-box;padding:13px 15px;border:1px solid rgba(126,222,213,.38);border-radius:14px;background:linear-gradient(145deg,rgba(4,18,23,.96),rgba(9,34,37,.94));color:#efffff;box-shadow:0 15px 42px rgba(0,0,0,.46);backdrop-filter:blur(12px)}
.cycle-summary>strong{font-size:16px}
.cycle-summary__facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:9px}
.cycle-summary__facts span{min-width:0;padding:7px 8px;border:1px solid rgba(124,211,211,.16);border-radius:8px;background:rgba(3,13,18,.38)}
.cycle-summary__facts b,.cycle-summary__facts small{display:block;overflow:visible;white-space:normal}
.cycle-summary__facts b{font-size:10px}
.cycle-summary__facts small{margin-top:2px;color:#8edbd4;font-size:9px;font-weight:750;letter-spacing:.08em}
.cycle-summary>p{margin:8px 0 0;color:#bad3d2;font-size:10px;line-height:1.35}
.cycle-summary__next{display:grid!important;grid-template-columns:1fr auto;gap:2px 8px;padding-top:8px;border-top:1px solid rgba(127,215,210,.16)}
.cycle-summary__next small,.cycle-summary__next b{grid-column:1}
.cycle-summary__next small{color:#79c9c5;font-size:7px;letter-spacing:.14em}
.cycle-summary__next b{color:#eefefd;font-size:11px}
.cycle-summary__next span{grid-column:2;grid-row:1/3;align-self:center;color:#a9c2c2;font-size:10px;white-space:nowrap}

.repair-link{display:none;position:absolute;z-index:3;left:37%;top:60%;width:28vw;height:18px;transform:rotate(-2deg);pointer-events:none}
.repair-link i{position:absolute;top:8px;height:2px;background:linear-gradient(90deg,rgba(85,214,206,.2),rgba(123,240,225,.92));box-shadow:0 0 8px rgba(87,225,217,.48);opacity:.18;transition:opacity .55s ease,transform .7s ease}
.repair-link i:nth-child(1){left:0;width:30%}
.repair-link i:nth-child(2){left:35%;width:29%;transform:translateY(-5px) rotate(-7deg)}
.repair-link i:nth-child(3){right:0;width:31%}
.game[data-stage="work-active"] .repair-link,.game[data-stage="cycle-complete"] .repair-link{display:block}
.game[data-stage="work-active"][data-work-phase="repair"] .repair-link i:nth-child(1){opacity:.86}
.game[data-stage="work-active"][data-work-phase="repair"] .repair-link i:nth-child(2){opacity:.28}
.game[data-stage="work-active"][data-work-phase="collect"] .repair-link i,.game[data-stage="cycle-complete"] .repair-link i{opacity:.82;transform:translateY(0) rotate(0)}
.game[data-stage="work-active"][data-work-phase="collect"] .repair-link:after{content:"";position:absolute;left:0;top:4px;width:12px;height:10px;border-radius:50%;background:#9af3e2;box-shadow:0 0 16px rgba(113,239,225,.88);animation:work-flow 1.7s ease-in-out infinite}
@keyframes work-flow{from{transform:translateX(0);opacity:.2}38%{opacity:1}to{transform:translateX(27vw);opacity:.1}}

.resident--nemi{display:none;position:absolute;z-index:7;left:65%;top:58%;width:58px;height:76px;transform:translate(-50%,-50%) scale(.75);border:0;background:transparent;color:#ecfffb;text-align:center;filter:drop-shadow(0 8px 16px rgba(0,0,0,.72));pointer-events:none}
.resident--nemi .resident__body{filter:hue-rotate(18deg) saturate(.82)}
.resident--nemi>i{position:absolute;right:4px;top:38px;width:16px;height:20px;border:1px solid rgba(145,233,222,.64);border-radius:7px 7px 10px 10px;background:rgba(14,49,48,.92);box-shadow:0 0 12px rgba(80,212,198,.22)}
.resident--nemi b,.resident--nemi small{position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap;text-shadow:0 2px 8px #000}
.resident--nemi b{top:59px;font-size:10px}
.resident--nemi small{top:72px;color:#8fc9c5;font-size:6px;letter-spacing:.12em}
.game[data-stage="work-brief"] .resident--kiro,.game[data-stage="work-active"] .resident--kiro,.game[data-stage="cycle-complete"] .resident--kiro{display:block;left:48%;top:64%;transform:translate(-50%,-50%) scale(.76);opacity:.96;filter:drop-shadow(0 8px 16px rgba(0,0,0,.72))}
.game[data-stage="work-brief"] .resident--nemi,.game[data-stage="work-active"] .resident--nemi,.game[data-stage="cycle-complete"] .resident--nemi{display:block}
.game[data-stage="work-active"][data-work-phase="repair"] .resident--kiro{animation:kiro-repair 1.05s ease-in-out infinite}
.game[data-stage="work-active"][data-work-phase="collect"] .resident--nemi{animation:nemi-collect 1.35s ease-in-out infinite}
@keyframes kiro-repair{0%,100%{transform:translate(-50%,-50%) scale(.76) rotate(-2deg)}50%{transform:translate(-50%,-50%) scale(.78) rotate(3deg)}}
@keyframes nemi-collect{0%,100%{transform:translate(-50%,-50%) scale(.75)}50%{transform:translate(-50%,-54%) scale(.78);filter:drop-shadow(0 0 15px rgba(112,235,219,.7))}}

.game[data-stage="work-brief"] .world-ui button,.game[data-stage="work-active"] .world-ui button,.game[data-stage="cycle-complete"] .world-ui button{pointer-events:none}
.game[data-stage="work-brief"] .world-response,.game[data-stage="work-active"] .world-response,.game[data-stage="cycle-complete"] .world-response{opacity:0;animation:none}
.game[data-stage="work-brief"] .vela{opacity:.28}
.game[data-stage="work-active"] .vela{width:min(430px,56vw)}
.game[data-stage="cycle-complete"] .vela{width:min(430px,48vw)}
.game[data-stage="work-active"] .energy-cycle strong,.game[data-stage="cycle-complete"] .energy-cycle strong{overflow:visible;text-overflow:clip;white-space:normal;font-size:10px;line-height:1.18}
.game[data-stage="path-complete"][data-work-gate="ready"] .vela{display:flex;width:min(450px,54vw)}
.game[data-stage="work-brief"] .vela,.game[data-stage="work-active"] .vela,.game[data-stage="cycle-complete"] .vela{display:none}

/* Beim Übergang aus V22 bleibt dieselbe Base ohne Helligkeits- oder Gebäude-Sprung sichtbar. */
.game[data-stage="work-brief"] .world--sleeping,.game[data-stage="work-active"] .world--sleeping,.game[data-stage="cycle-complete"] .world--sleeping{opacity:.08;filter:saturate(.4) brightness(.5)}
.game[data-stage="work-brief"] .world--awake,.game[data-stage="work-active"] .world--awake,.game[data-stage="cycle-complete"] .world--awake{opacity:.94;filter:saturate(.92) brightness(.79);transform:scale(1.02)}
.game[data-stage="work-brief"] .aurora,.game[data-stage="work-active"] .aurora,.game[data-stage="cycle-complete"] .aurora{opacity:.38}
.game[data-stage="work-brief"] .building--nest,.game[data-stage="work-active"] .building--nest,.game[data-stage="cycle-complete"] .building--nest{display:block}
.game[data-stage="work-brief"] .building--storage,.game[data-stage="work-active"] .building--storage,.game[data-stage="cycle-complete"] .building--storage{opacity:.82;filter:none}
.game[data-stage="work-brief"] .portal,.game[data-stage="work-active"] .portal,.game[data-stage="cycle-complete"] .portal{opacity:.42;filter:saturate(.58)}
.game[data-stage="work-brief"] .topbar,.game[data-stage="work-active"] .topbar,.game[data-stage="cycle-complete"] .topbar,.game[data-stage="work-brief"] .objective,.game[data-stage="work-active"] .objective,.game[data-stage="cycle-complete"] .objective{opacity:1;transform:none}

.settlement-gate:focus-visible,.work-plan>button:focus-visible,.cycle-summary:focus-visible,.objective:focus-visible{outline:2px solid #b9fff5;outline-offset:3px}

@media (max-height:430px){
  .settlement-gate{right:max(15px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));width:min(215px,29vw);min-height:44px;padding:8px 11px}
  .settlement-gate strong{font-size:12px}
  .work-plan{right:max(14px,env(safe-area-inset-right));width:min(430px,50vw);padding:11px 13px}
  .work-plan>strong{font-size:15px}.work-plan>p{margin:5px 0 8px;font-size:10px;line-height:1.3}
  .work-plan__roles{margin-bottom:8px;padding:6px}.work-plan__roles small{font-size:9px}
  .work-plan>button{min-height:44px;padding:9px 13px}
  .cycle-summary{right:max(14px,env(safe-area-inset-right));bottom:max(10px,env(safe-area-inset-bottom));width:min(390px,45vw);padding:9px 11px}
  .cycle-summary>strong{font-size:13px}.cycle-summary__facts{margin-top:6px}.cycle-summary__facts span{padding:5px 6px}
  .cycle-summary>p{margin-top:5px;font-size:10px}.cycle-summary__next{padding-top:5px}.cycle-summary__facts small,.cycle-summary__next span{font-size:10px}
  .game[data-stage="cycle-complete"] .vela{opacity:.2}
}

@media (prefers-reduced-motion:reduce){
  .settlement-gate:after,.game[data-stage="work-active"] .resident--kiro,.game[data-stage="work-active"] .resident--nemi,.game[data-stage="work-active"] .repair-link:after{animation:none}
  .repair-link i{transition:none}
}