/* =========================================================
   PROJECT MIMI — GARDEN GATE
========================================================= */
#gardenGate{position:fixed;inset:0;overflow:hidden;color:#fff;background:radial-gradient(circle at 50% 58%,rgba(228,196,119,.10),transparent 23%),radial-gradient(circle at 50% 90%,rgba(43,99,69,.18),transparent 42%),linear-gradient(180deg,#02060c,#071321 58%,#06151b);font-family:Georgia,"Times New Roman",serif}
#gardenGate *{box-sizing:border-box}#gardenGate button{-webkit-tap-highlight-color:transparent}
.gg-sky{position:absolute;inset:0;pointer-events:none}.gg-sky i{position:absolute;width:3px;height:3px;border-radius:50%;background:#dfc17b;box-shadow:0 0 12px rgba(223,193,123,.6);animation:ggTwinkle 4s infinite}.gg-sky i:nth-child(1){left:12%;top:22%}.gg-sky i:nth-child(2){left:81%;top:18%;animation-delay:.7s}.gg-sky i:nth-child(3){left:23%;top:47%;animation-delay:1.2s}.gg-sky i:nth-child(4){left:74%;top:42%;animation-delay:1.9s}.gg-sky i:nth-child(5){left:47%;top:16%;animation-delay:2.4s}.gg-sky i:nth-child(6){left:90%;top:71%;animation-delay:3s}.gg-sky i:nth-child(7){left:8%;top:73%;animation-delay:1.5s}.gg-sky i:nth-child(8){left:56%;top:84%;animation-delay:2.8s}
.gg-stage{position:relative;z-index:2;width:min(94vw,540px);height:100%;margin:auto}.gg-header{position:absolute;top:38px;left:0;right:0;display:flex;justify-content:space-between;color:rgba(255,255,255,.32);font-size:9px;letter-spacing:4px}.gg-header span:first-child{color:#e7c77d}.gg-footer{position:absolute;bottom:24px;left:0;right:0;text-align:center;color:rgba(231,198,125,.34);font-size:10px;letter-spacing:3px}
.gg-phase{position:absolute;left:50%;top:50%;width:100%;transform:translate(-50%,-50%);transition:.9s cubic-bezier(.22,.61,.36,1)}.gg-phase[aria-hidden="true"]{opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%,-47%) scale(.96)}
.gg-intro{display:grid;place-items:center;height:450px}.gg-gate-mini{width:100px;height:125px;border:1px solid rgba(232,199,125,.3);border-radius:55px 55px 8px 8px;position:relative;box-shadow:0 0 50px rgba(232,199,125,.08)}.gg-gate-mini span{position:absolute;top:0;bottom:0;width:1px;background:rgba(232,199,125,.16)}.gg-gate-mini span:first-child{left:50%}.gg-gate-mini span:last-child{left:50%;height:75%;top:12%;background:#e4c27c;opacity:.35}.gg-line{width:70px;height:1px;margin-top:25px;background:linear-gradient(90deg,transparent,#e4c27c,transparent)}
.gg-gate-phase{height:560px;display:grid;place-items:center}.gg-gate-glow{position:absolute;width:370px;height:450px;border-radius:50%;background:radial-gradient(circle,rgba(222,190,111,.13),transparent 65%);filter:blur(18px);animation:ggBreath 5s infinite}.gg-gate{position:relative;width:min(76vw,330px);height:min(72vw,400px);max-height:430px;border:1px solid rgba(226,193,116,.4);border-radius:170px 170px 8px 8px 10px 10px;background:linear-gradient(180deg,rgba(19,36,43,.55),rgba(6,20,24,.85));box-shadow:0 30px 100px rgba(0,0,0,.5),0 0 55px rgba(226,193,116,.07);overflow:hidden}.gg-arch{position:absolute;inset:13px;border:1px solid rgba(226,193,116,.12);border-radius:160px 160px 3px 3px}.gg-door{position:absolute;top:0;bottom:0;width:50%;background:linear-gradient(150deg,rgba(21,47,47,.88),rgba(7,24,28,.95));transition:transform 1.7s cubic-bezier(.22,.61,.36,1),filter 1.2s ease}.gg-door.left{left:0;transform-origin:left center;border-right:1px solid rgba(226,193,116,.18)}.gg-door.right{right:0;transform-origin:right center;border-left:1px solid rgba(226,193,116,.18)}.gg-door span{position:absolute;top:50%;width:18px;height:18px;border:1px solid rgba(226,193,116,.18);transform:translateY(-50%) rotate(45deg)}.gg-door.left span{right:18px}.gg-door.right span{left:18px}.gg-gate.open .gg-door.left{transform:perspective(800px) rotateY(-58deg);filter:brightness(.55)}.gg-gate.open .gg-door.right{transform:perspective(800px) rotateY(58deg);filter:brightness(.55)}
.gg-keyhole{position:absolute;left:50%;top:54%;width:58px;height:58px;transform:translate(-50%,-50%);border:1px solid rgba(231,198,125,.45);border-radius:50%;display:grid;place-items:center;background:rgba(3,10,13,.65);box-shadow:0 0 0 10px rgba(231,198,125,.025),0 0 35px rgba(231,198,125,.14);z-index:4;transition:.8s}.gg-keyhole i{font-style:normal;color:#e8c77d}.gg-keyhole.unlocked{box-shadow:0 0 0 14px rgba(231,198,125,.04),0 0 70px rgba(231,198,125,.4);background:rgba(232,199,125,.10);transform:translate(-50%,-50%) scale(1.12)}
.gg-symbols{position:absolute;inset:0;z-index:8}.gg-symbol{position:absolute;width:48px;height:48px;border:1px solid rgba(232,199,125,.12);border-radius:50%;background:rgba(3,9,14,.4);color:rgba(232,199,125,.35);font-size:15px;opacity:.18;cursor:pointer;transition:.5s}.gg-symbol:nth-child(1){left:12%;top:26%}.gg-symbol:nth-child(2){right:11%;top:38%}.gg-symbol:nth-child(3){left:18%;bottom:15%}.gg-symbol:hover,.gg-symbol:focus-visible{opacity:1;color:#f0d58f;box-shadow:0 0 30px rgba(232,199,125,.16);outline:none}.gg-symbol.found{opacity:1;color:#f1d48b;border-color:rgba(232,199,125,.5);box-shadow:0 0 35px rgba(232,199,125,.24);transform:scale(1.12)}
.gg-seed{position:absolute;left:50%;top:58%;z-index:6;width:70px;height:70px;transform:translate(-50%,-50%) scale(.3);opacity:0;display:grid;place-items:center;border-radius:50%;color:#e8c77d;background:rgba(232,199,125,.06);box-shadow:0 0 0 10px rgba(232,199,125,.025),0 0 40px rgba(232,199,125,.14);transition:1s}.gg-seed.show{opacity:1;transform:translate(-50%,-50%) scale(1)}.gg-seed.bloom{animation:ggBloom 1.6s ease forwards}.gg-seed span{font-size:24px}
.gg-firefly{position:absolute;left:50%;top:54%;width:7px;height:7px;border-radius:50%;background:#ffe6a0;box-shadow:0 0 15px #f7d67d,0 0 35px rgba(247,214,125,.8);opacity:0;z-index:10}.gg-firefly.fly{opacity:1;animation:ggFly 2.2s cubic-bezier(.4,0,.2,1) forwards}.gg-drag-hint{position:absolute;left:50%;bottom:7%;transform:translateX(-50%);width:58px;height:34px;border:1px solid rgba(232,199,125,.25);border-radius:999px;display:grid;place-items:center;color:#e8c77d;opacity:0;z-index:20}.gg-drag-hint.show{opacity:1;animation:ggHint 1.8s ease-in-out infinite}
.gg-main-btn{position:absolute;left:50%;top:82%;transform:translateX(-50%);width:58px;height:58px;border:1px solid rgba(232,199,125,.3);border-radius:50%;background:rgba(255,255,255,.025);color:#e8c77d;font-size:18px;cursor:pointer;box-shadow:0 0 30px rgba(232,199,125,.06);transition:.3s}.gg-main-btn:hover{transform:translateX(-50%) scale(1.08)}.gg-main-btn.hide{opacity:0;pointer-events:none}.gg-status{position:absolute;left:50%;top:89%;transform:translateX(-50%);height:20px;color:rgba(255,255,255,.38);font-size:9px;letter-spacing:2px;white-space:nowrap}
@keyframes ggTwinkle{50%{opacity:.15;transform:scale(.6)}}@keyframes ggBreath{50%{transform:scale(1.08);opacity:.72}}@keyframes ggBloom{0%{transform:translate(-50%,-50%) scale(1)}45%{transform:translate(-50%,-50%) scale(1.35)}100%{transform:translate(-50%,-50%) scale(1)}}@keyframes ggFly{0%{transform:translate(0,0)}55%{transform:translate(20px,-100px)}100%{transform:translate(0,-175px)}}@keyframes ggHint{50%{transform:translateX(-50%) translateY(-5px)}}
@media(max-width:420px){.gg-header{top:30px;font-size:8px}.gg-footer{bottom:20px}.gg-gate{height:390px}.gg-main-btn{top:84%}.gg-status{top:91%}}