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

/* V24: derselbe Heimat-Ausschnitt öffnet den Resonanzhof und ruft Daro. */
.cycle-summary__next{width:100%;min-height:44px;margin-top:9px;padding:8px 10px;border:1px solid rgba(126,222,213,.28);border-radius:10px;background:rgba(4,20,25,.62);color:#efffff;text-align:left;cursor:pointer}
.cycle-summary__next:hover{background:rgba(13,48,51,.72)}
.cycle-summary__next:after{content:"";position:absolute;inset:-3px;border:1px solid rgba(106,220,210,.24);border-radius:13px;animation:resonance-guide 3.2s ease-out infinite;pointer-events:none}
@keyframes resonance-guide{0%{transform:scale(.99);opacity:.48}76%,100%{transform:scale(1.035);opacity:0}}

.building--resonance{display:none;position:absolute;z-index:5;left:68%;top:43%;width:104px;height:84px;transform:translate(-50%,-50%);color:#eafffb;text-align:center;filter:drop-shadow(0 12px 20px rgba(0,0,0,.72));pointer-events:none}
.resonance-shape{position:absolute;left:50%;top:2px;width:72px;height:54px;transform:translateX(-50%);border:2px solid rgba(124,215,205,.72);border-radius:50% 50% 36% 36%;background:radial-gradient(circle at 50% 58%,rgba(129,227,211,.24) 0 13%,transparent 14%),linear-gradient(145deg,#17363a,#0b1c25);box-shadow:inset 0 -11px 18px rgba(0,0,0,.46),0 0 18px rgba(78,194,186,.18)}
.resonance-shape:before,.resonance-shape:after{content:"";position:absolute;top:13px;width:13px;height:35px;border:2px solid rgba(125,211,203,.5);border-bottom:0;border-radius:10px 10px 0 0;background:#10272d}
.resonance-shape:before{left:-10px;transform:rotate(-18deg)}
.resonance-shape:after{right:-10px;transform:rotate(18deg)}
.resonance-shape i{position:absolute;left:50%;top:18px;width:19px;height:19px;transform:translateX(-50%) rotate(45deg);border:1px solid rgba(184,250,235,.8);background:rgba(74,177,167,.36);box-shadow:0 0 14px rgba(104,231,214,.56)}
.building--resonance b,.building--resonance small{position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap;text-shadow:0 2px 8px #000}
.building--resonance b{top:60px;font-size:11px}.building--resonance small{top:74px;color:#8fc8c5;font-size:6px;letter-spacing:.13em}

.resident--daro{display:none;position:absolute;z-index:7;left:58%;top:53%;width:60px;height:78px;transform:translate(-50%,-50%) scale(.8);border:0;background:transparent;color:#fff8e8;text-align:center;filter:drop-shadow(0 9px 17px rgba(0,0,0,.74));pointer-events:none}
.resident--daro .resident__head{background:linear-gradient(135deg,#b99364,#664b39)}
.resident--daro .resident__body{background:linear-gradient(140deg,#31545a,#15282f)}
.resident--daro>i{position:absolute;right:-2px;top:33px;width:13px;height:31px;border:2px solid rgba(218,204,161,.75);border-radius:7px 7px 3px 3px;background:#243c40;transform:rotate(-11deg)}
.resident--daro b,.resident--daro small{position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap;text-shadow:0 2px 8px #000}
.resident--daro b{top:61px;font-size:10px}.resident--daro small{top:73px;color:#d6c69d;font-size:6px;letter-spacing:.1em}

.resonance-panel{position:absolute;z-index:30;right:max(20px,env(safe-area-inset-right));top:50%;width:min(445px,53vw);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(132,218,210,.52);border-radius:16px;background:linear-gradient(150deg,rgba(4,17,23,.985),rgba(10,35,38,.98));color:#efffff;box-shadow:0 22px 60px rgba(0,0,0,.6);backdrop-filter:blur(14px)}
.resonance-panel[hidden],.daro-summary[hidden]{display:none}
.resonance-panel>small,.daro-summary>small{display:block;color:#82d6cf;font-size:8px;font-weight:760;letter-spacing:.18em}
.resonance-panel>strong,.daro-summary>strong{display:block;margin-top:5px;font-size:18px;line-height:1.15}
.resonance-panel>p{margin:7px 0 10px;color:#b8d1d0;font-size:10px;line-height:1.35}
.resonance-ledger{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:8px}
.resonance-ledger span{padding:7px 9px;border:1px solid rgba(127,211,207,.17);border-radius:9px;background:rgba(2,12,17,.38)}
.resonance-ledger b,.resonance-ledger small{display:block}.resonance-ledger b{font-size:14px}.resonance-ledger small{margin-top:2px;color:#8ecbc7;font-size:7px;letter-spacing:.13em}
.daro-card{display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:9px;padding:9px;border:1px solid rgba(189,218,200,.2);border-radius:10px;background:linear-gradient(135deg,rgba(40,70,69,.38),rgba(6,18,23,.42))}
.daro-card__mark{display:grid;place-items:center;width:34px;height:34px;border:1px solid rgba(211,206,166,.42);border-radius:50%;background:#173238;color:#dcebc9;font-size:17px}
.daro-card b,.daro-card small{display:block}.daro-card b{font-size:12px}.daro-card small{margin-top:2px;color:#a9c2bd;font-size:8px}.daro-card>strong{color:#d8cda2;font-size:10px;white-space:nowrap}
.resonance-panel>button{width:100%;min-height:44px;margin-top:10px;padding:11px 15px;border:1px solid rgba(170,237,226,.46);border-radius:999px;background:linear-gradient(135deg,#b8ead7,#78c6c6);color:#06171b;font-size:12px;font-weight:820;cursor:pointer}
.resonance-panel>button:disabled{background:rgba(86,111,112,.42);color:#9bb0b0;cursor:default}
.training-status{margin-top:9px}.training-status[hidden]{display:none}.training-status span{display:flex;justify-content:space-between;color:#a7c8c5;font-size:9px}.training-status span b{color:#e9fffb;font-size:10px}
.training-status__bar{height:5px;margin-top:5px;overflow:hidden;border-radius:999px;background:rgba(111,174,174,.18)}
.training-status__bar i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#67bab8,#bcefdc);box-shadow:0 0 10px rgba(104,219,207,.5);transition:width .35s linear}

.daro-summary{position:absolute;z-index:22;right:max(20px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));width:min(405px,47vw);box-sizing:border-box;padding:13px 15px;border:1px solid rgba(148,222,204,.4);border-radius:14px;background:linear-gradient(145deg,rgba(5,20,24,.97),rgba(14,39,39,.95));color:#f4fffb;box-shadow:0 15px 42px rgba(0,0,0,.48);backdrop-filter:blur(12px)}
.daro-summary>strong{font-size:16px}.daro-summary__facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:9px}.daro-summary__facts span{padding:7px 8px;border:1px solid rgba(149,211,197,.17);border-radius:8px;background:rgba(3,14,18,.4)}.daro-summary__facts b,.daro-summary__facts small{display:block}.daro-summary__facts b{font-size:10px}.daro-summary__facts small{margin-top:2px;color:#a8d3c5;font-size:8px;letter-spacing:.08em}.daro-summary>p{margin:8px 0 0;color:#bdd1cc;font-size:10px;line-height:1.35}.daro-summary__next{padding-top:8px;border-top:1px solid rgba(141,210,198,.17)}.daro-summary__next small{display:block;color:#7dc7c1;font-size:7px;letter-spacing:.14em}.daro-summary__next b{display:block;margin-top:2px;color:#f0fffb;font-size:11px}

.game[data-stage="resonance-brief"] .building--resonance,.game[data-stage="daro-training"] .building--resonance,.game[data-stage="daro-ready"] .building--resonance{display:block}
.game[data-stage="daro-training"] .resonance-shape i{animation:resonance-form 2.2s ease-in-out infinite}
.game[data-stage="daro-ready"] .resident--daro{display:block;animation:daro-arrive .7s ease-out both}
@keyframes resonance-form{0%,100%{transform:translateX(-50%) rotate(45deg) scale(.84);opacity:.55}50%{transform:translateX(-50%) rotate(225deg) scale(1.06);opacity:1}}
@keyframes daro-arrive{from{transform:translate(-50%,-42%) scale(.62);opacity:0}to{transform:translate(-50%,-50%) scale(.8);opacity:1}}

.game[data-stage="resonance-brief"] .world--sleeping,.game[data-stage="daro-training"] .world--sleeping,.game[data-stage="daro-ready"] .world--sleeping{opacity:.08;filter:saturate(.4) brightness(.5)}
.game[data-stage="resonance-brief"] .world--awake,.game[data-stage="daro-training"] .world--awake,.game[data-stage="daro-ready"] .world--awake{opacity:.94;filter:saturate(.92) brightness(.79);transform:scale(1.02)}
.game[data-stage="resonance-brief"] .aurora,.game[data-stage="daro-training"] .aurora,.game[data-stage="daro-ready"] .aurora{opacity:.38}
.game[data-stage="resonance-brief"] .building--nest,.game[data-stage="daro-training"] .building--nest,.game[data-stage="daro-ready"] .building--nest{display:block}
.game[data-stage="resonance-brief"] .building--storage,.game[data-stage="daro-training"] .building--storage,.game[data-stage="daro-ready"] .building--storage{opacity:.82;filter:none}
.game[data-stage="resonance-brief"] .portal,.game[data-stage="daro-training"] .portal,.game[data-stage="daro-ready"] .portal{opacity:.42;filter:saturate(.58)}
.game[data-stage="resonance-brief"] .topbar,.game[data-stage="daro-training"] .topbar,.game[data-stage="daro-ready"] .topbar,.game[data-stage="resonance-brief"] .objective,.game[data-stage="daro-training"] .objective,.game[data-stage="daro-ready"] .objective{opacity:1;transform:none}
.game[data-stage="resonance-brief"] .world-ui button,.game[data-stage="daro-training"] .world-ui button,.game[data-stage="daro-ready"] .world-ui button{pointer-events:none}
.game[data-stage="resonance-brief"] .world-response,.game[data-stage="daro-training"] .world-response,.game[data-stage="daro-ready"] .world-response{opacity:0;animation:none}
.game[data-stage="resonance-brief"] .vela,.game[data-stage="daro-training"] .vela,.game[data-stage="daro-ready"] .vela{display:none}
.game[data-stage="daro-ready"] .energy-cycle strong{overflow:visible;text-overflow:clip;white-space:normal;font-size:10px;line-height:1.18}

.cycle-summary__next:focus-visible,.resonance-panel:focus-visible,.resonance-panel>button:focus-visible,.daro-summary:focus-visible{outline:2px solid #bdfff3;outline-offset:3px}

@media (max-height:430px){
  .resonance-panel{right:max(14px,env(safe-area-inset-right));width:min(445px,52vw);padding:10px 13px}.resonance-panel>strong{font-size:15px}.resonance-panel>p{margin:4px 0 7px;font-size:9px}.resonance-ledger{margin-bottom:6px}.daro-card{padding:6px}.resonance-panel>button{min-height:42px;margin-top:7px;padding:8px 12px}.training-status{margin-top:6px}
  .daro-summary{right:max(14px,env(safe-area-inset-right));bottom:max(10px,env(safe-area-inset-bottom));width:min(405px,46vw);padding:9px 11px}.daro-summary>strong{font-size:13px}.daro-summary__facts{margin-top:6px}.daro-summary__facts span{padding:5px 6px}.daro-summary>p{margin-top:5px}
  .building--resonance{left:68%;top:42%;transform:translate(-50%,-50%) scale(.84)}.resident--daro{left:57%;top:53%}
}

@media (prefers-reduced-motion:reduce){
  .cycle-summary__next:after,.game[data-stage="daro-training"] .resonance-shape i,.game[data-stage="daro-ready"] .resident--daro{animation:none}
  .training-status__bar i{transition:none}
}