*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;font-family:Arial,Helvetica,sans-serif;background:#102020;color:#eff6e7}button{font:inherit;cursor:pointer;touch-action:manipulation;min-height:44px;padding:10px 14px;border:1px solid #78918a;background:#173c3bee;color:#edf6e7;border-radius:10px}button:disabled{opacity:.45;cursor:default}button:focus-visible{outline:3px solid #edd591}main{height:100dvh;display:flex;flex-direction:column;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 12px;background:#102526;flex-shrink:0}header>div{text-align:center}header strong{letter-spacing:3px;font-family:Georgia,serif;font-size:20px}header small{display:block;font-size:12px;color:#b4d4ca;margin-top:4px}.world{position:relative;min-height:0;flex:1;display:flex;align-items:center;justify-content:center;background:#132c27}canvas{width:100%;height:100%;object-fit:fill;touch-action:none}.objective{position:absolute;left:12px;top:12px;max-width:330px;background:#122720dd;border:1px solid #8a9b69;padding:10px 13px;border-radius:9px;font-size:14px;line-height:1.4;pointer-events:none}.toast{position:absolute;left:50%;bottom:15px;transform:translateX(-50%);max-width:90%;width:max-content;padding:10px 16px;background:#112b2aea;border-radius:10px;font-size:14px;line-height:1.4;pointer-events:none}.toast:empty{display:none}.radar{position:absolute;right:12px;top:12px;padding:10px;border-radius:10px;background:#132b35e8;font-size:14px;max-width:220px}footer{display:flex;gap:10px;padding:8px;align-items:center;justify-content:space-between;background:#132c2c}.directions{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}.tools{display:flex;gap:5px}#interact,#bind,#begin{background:#e2cb8c;color:#253628;border:0;font-weight:bold}.tools .active{background:#76894b;color:#fff}.modal{position:fixed;inset:0;display:grid;place-items:center;background:#071716e8;padding:20px;z-index:10;overflow:auto}.modal section{background:linear-gradient(135deg,#244842,#102a2c);border:1px solid #8cae90;border-radius:18px;padding:24px;width:min(100%,720px);max-height:95dvh;overflow:auto;box-shadow:0 20px 60px #0008}h1,h2,h3{font-family:Georgia,serif}h1{font-size:clamp(38px,8vw,70px);letter-spacing:4px;margin:20px 0;color:#f3d993}h2{font-size:28px}p{font-size:16px;line-height:1.6;color:#c9dacf}small{font-size:13px;line-height:1.5}.welcome{text-align:center}.welcome>span,.encounter>span{color:#e9cb85;font-size:12px;letter-spacing:2px}.welcome #begin{display:block;margin:24px auto}.welcome small{display:block;color:#abc6bc}.close{float:right}.collection{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.entry{display:flex;align-items:center;gap:12px;border:1px solid #607d71;background:#102d2a;padding:12px;border-radius:12px}.entry img{width:70px;height:70px;object-fit:cover;border-radius:12px}.entry strong{font-size:16px}.entry small{display:block;color:#bfd3be;margin-top:6px}.entry.locked img{filter:brightness(.1)}.encounter{text-align:center;max-width:500px!important}.encounter img{width:140px;height:140px;object-fit:cover;border-radius:50%;box-shadow:0 0 35px #73a48d66}.encounter h2{margin:10px}.encounter p{font-size:14px;margin:8px}.timing{height:32px;position:relative;margin:18px 0;background:#142a30;border:1px solid #829a94;border-radius:8px;overflow:hidden}#window{position:absolute;top:0;bottom:0;background:#e6c36e66;border-left:2px solid #efd991;border-right:2px solid #efd991}#needle{position:absolute;top:0;bottom:0;width:5px;background:#eefff6;box-shadow:0 0 10px white}#bind{min-width:150px;margin-right:8px}a{color:#ead79e;display:inline-block;margin:20px}#routes{display:grid;grid-template-columns:1fr 1fr;gap:8px}#routes div{padding:12px;border:1px solid #59786d;border-radius:10px;font-size:14px}.modal details{margin:20px 0}[hidden]{display:none!important}@media(max-width:600px){header{padding:6px}header strong{font-size:16px}header button{font-size:12px;padding:7px}.objective{font-size:12px;max-width:240px;padding:7px}footer{flex-wrap:wrap;gap:5px}.directions button{padding:8px 12px}.tools button{font-size:12px;padding:8px}.collection{grid-template-columns:1fr}.toast{font-size:13px}.modal{padding:12px}.modal section{padding:18px}.radar{top:auto;bottom:60px;font-size:12px}}@media(orientation:landscape) and (max-height:550px){header{padding:4px 10px}header small{display:inline;margin-left:12px}header strong{font-size:16px}footer{padding:4px 10px}button{min-height:40px;padding:7px 12px}.modal section{max-height:95dvh}.encounter{display:grid;grid-template-columns:130px 1fr;column-gap:18px}.encounter img{grid-column:1;grid-row:2/6;width:120px;height:120px}.encounter>span,.encounter #feedback{grid-column:1/-1}.encounter .timing{grid-column:2;margin:8px 0}.encounter #bind{grid-column:2;margin:0}.encounter #leave{grid-column:1}.encounter h2{font-size:24px}.encounter p{font-size:13px}}
header #zoom{font-size:12px;padding:8px}.entry{flex-wrap:wrap}.entry button{font-size:13px;min-height:36px}.entry>div{flex:1}#observe{background:#304d56}footer{gap:6px}header{gap:6px}@media(max-width:600px){header strong{font-size:13px;letter-spacing:1px}header button{padding:7px 8px;font-size:11px}footer .directions button{padding:8px 10px}.objective{max-width:230px}footer .tools{gap:3px}footer button{font-size:12px}.world{min-height:180px}}
.world::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 45%,#0a201d44 100%)}#encounterCanvas{width:150px;height:150px;margin:auto;flex:none;border-radius:50%;background:#10252d;box-shadow:0 0 28px #bcd69a33}.encounter button{transition:filter .15s}.encounter button:active{filter:brightness(1.3)}@media(orientation:landscape) and (max-height:550px){#encounterCanvas{grid-column:1;grid-row:2/6;width:120px;height:120px}}

.radar{top:155px;right:12px;max-width:190px;padding:7px 10px;pointer-events:none}@media(max-width:600px){.radar{top:155px;bottom:auto;max-width:150px}.objective{max-width:55%}}
.bag-item{display:flex;align-items:center;gap:16px;padding:12px 0;border-bottom:1px solid #537567}.bag-item>div{flex:1}.bag-item p{font-size:14px;margin:5px 0;line-height:1.4}#outfits{display:flex;flex-wrap:wrap;gap:8px}#outfits [data-outfit=teal]{border-color:#65b5b4}#outfits [data-outfit=amber]{border-color:#ddac64}#outfits [data-outfit=moon]{border-color:#ac98da}@media(max-width:600px){footer{justify-content:center}.directions{margin-right:auto}.tools{order:3;width:100%;justify-content:center}.bag-item{gap:8px}}
.quest-complete{position:absolute;left:50%;top:60px;transform:translateX(-50%);background:#173e31f5;border:1px solid #b8cc94;color:#f0eed5;padding:10px 16px;border-radius:12px;font-size:14px;pointer-events:none;max-width:80%}.world canvas{object-fit:fill}.objective{max-width:55%;width:max-content}.radar{top:155px}