*{box-sizing:border-box}html,body,#root{color:#eef2f7;background:#0c1016;min-height:100%;margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}body{padding-bottom:82px}.app{max-width:760px;margin:auto;padding-bottom:28px}header{background:linear-gradient(#171e29,#0c1016);padding:24px 18px 8px}h1{letter-spacing:-.7px;margin:4px 0 2px;font-size:30px}h2{margin:0 0 12px;font-size:19px}h3{margin:10px 0 7px;font-size:18px}.eyebrow,.kicker,.label{letter-spacing:1.2px;color:#9aa8ba;font-size:10px;font-weight:800}.hero{background:#151c26;border:1px solid #293342;border-radius:18px;margin-top:18px;padding:17px;position:relative}.hero h2{margin:6px 0;font-size:25px}.hero p{color:#aab5c4;margin:0;line-height:1.4}.hero>strong{font-size:20px;position:absolute;top:17px;right:17px}.progress{background:#293342;border-radius:9px;height:7px;margin-top:16px;overflow:hidden}.progress i{background:#75d48a;border-radius:9px;height:100%;display:block}nav{z-index:20;max-width:760px;padding:7px 7px calc(7px + env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#121822;border-top:1px solid #293342;grid-template-columns:repeat(5,1fr);margin:auto;display:grid;position:fixed;bottom:0;left:0;right:0}nav button{color:#8290a3;background:0 0;border:0;flex-direction:column;align-items:center;gap:2px;padding:6px 2px;font-size:10px;display:flex}nav button b{font-size:18px}nav button.active{color:#fff}main{padding:10px 14px}.card{background:#151c26;border:1px solid #293342;border-radius:17px;margin:10px 0;padding:16px;box-shadow:0 8px 30px #0002}.card>h2{margin-bottom:14px}.missionHero{text-align:left;color:#fff;background:#1b2532;border:1px solid #344253;border-radius:14px;justify-content:space-between;align-items:center;width:100%;padding:15px;display:flex}.missionHero h3{margin:5px 0;font-size:19px}.missionHero p{color:#aeb9c8;margin:0;line-height:1.4}.arrow{color:#7fd68e;padding-left:12px;font-size:32px}.chips{flex-wrap:wrap;gap:7px;margin:11px 0;display:flex}.chip{color:#aeb9c8;border:1px solid #354253;border-radius:999px;padding:5px 9px;font-size:11px}.chip.ok{color:#89dc99;background:#183021;border-color:#326243}.primary,button{font:inherit;cursor:pointer}.primary{color:#08110b;background:#75d48a;border:0;border-radius:11px;width:100%;margin-top:5px;padding:11px 14px;font-weight:800}.phaseScroll{gap:8px;padding-bottom:5px;display:flex;overflow-x:auto}.phase{text-align:left;color:#8794a6;background:#111721;border:1px solid #293342;border-radius:12px;min-width:92px;padding:10px}.phase small{display:block}.phase b{margin-top:5px;display:block}.phase.active{color:#fff;background:#193022;border-color:#75d48a}.phase.done{color:#8cd89a}.small{color:#8f9bad;font-size:12px;line-height:1.5}.grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.tile{color:#dce3ec;background:#151c26;border:1px solid #293342;border-radius:14px;flex-direction:column;gap:5px;padding:13px;display:flex}.tile span{color:#8f9bad;font-size:12px;line-height:1.4}.tile b{font-size:13px}.tile.compact{justify-content:center;min-height:52px}.tile.clickable{text-align:left;width:100%}.callgrid{gap:9px;display:grid}.callgrid div{background:#111721;border:1px solid #263140;border-radius:12px;padding:11px}.callgrid b,.callgrid span{display:block}.callgrid span{color:#9ba8b8;margin-top:4px;font-size:12px}.sessionTop{align-items:center;gap:9px;margin-bottom:8px;display:flex}.sessionTop select{flex:1}.sessionTop>span{color:#90a0b2;font-size:11px}.missionRow{text-align:left;color:#eaf0f6;background:0 0;border:0;border-top:1px solid #293342;grid-template-columns:30px 1fr 20px;align-items:center;gap:10px;width:100%;padding:13px 2px;display:grid}.missionRow small{color:#8997a8;margin-top:3px;font-size:11px;line-height:1.35;display:block}.missionRow em{color:#718095;font-size:25px;font-style:normal}.circle{border:2px solid #425064;border-radius:50%;place-items:center;width:24px;height:24px;font-size:13px;display:grid}.circle.checked{color:#07100a;background:#75d48a;border-color:#75d48a}.side{color:#cbd4df;background:#111721;border:1px solid #293342;border-radius:13px;margin-bottom:10px;padding:15px;line-height:1.5}.learnRow{color:#eaf0f6;text-align:left;background:0 0;border:0;border-top:1px solid #293342;width:100%;padding:14px 25px 14px 2px;position:relative}.learnRow:first-of-type{border-top:0}.learnRow>div:first-child b,.learnRow>div:first-child span{display:block}.learnRow span{color:#8f9bad;margin-top:3px;font-size:12px;line-height:1.45}.learnRow>strong{color:#79d48a;position:absolute;top:16px;right:3px}.learnDetail{background:#111721;border-radius:10px;margin-top:10px;padding:8px 10px}.learnDetail p{color:#b6c0ce;margin:7px 0;font-size:12px}.intro{color:#929fb0;margin-top:-3px;font-size:12px;line-height:1.5}.map{background:linear-gradient(135deg,#173022 0%,#203a28 44%,#263728 100%);border:1px solid #344636;border-radius:18px;height:430px;position:relative;overflow:hidden}.map:before{content:"";background-image:linear-gradient(#ffffff0a 1px,#0000 1px),linear-gradient(90deg,#ffffff0a 1px,#0000 1px);background-size:34px 34px;position:absolute;inset:0;transform:rotate(-2deg)scale(1.08)}.zone{z-index:4;color:#fff;text-align:center;background:#172118e8;border:1px solid #b7c6ad;border-radius:12px;min-width:92px;max-width:120px;padding:8px 6px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 5px 18px #0005}.zone span{font-size:21px;display:block}.zone b{font-size:10px;line-height:1.1;display:block}.river{z-index:1;background:#4e7f91aa;border:1px solid #79a9b8aa;position:absolute;transform:rotate(-16deg)}.r1{border-radius:50%;width:120%;height:48px;top:24%;left:-10%}.r2{border-radius:50%;width:100%;height:35px;top:69%;left:15%;transform:rotate(18deg)}.road{z-index:2;background:#b49a70aa;border-radius:10px;height:9px;position:absolute}.road1{width:88%;top:47%;left:6%;transform:rotate(2deg)}.road2{width:72%;top:64%;left:14%;transform:rotate(-38deg)}.check{border-top:1px solid #293342;align-items:flex-start;gap:10px;padding:12px 2px;display:flex}.check input{accent-color:#75d48a;margin-top:2px}.check b,.check small{display:block}.check small{color:#8794a6;margin-top:3px;font-size:11px}.check.done b{color:#728092;text-decoration:line-through}.flow{color:#d5dde7;font-size:14px;line-height:2.1}.resource{border-top:1px solid #293342;gap:12px;padding:12px 0;display:flex}.resource:first-child{border-top:0}.ico{font-size:24px}.resource b,.resource span,.resource small{display:block}.resource span{color:#a0acbc;margin-top:2px;font-size:12px}.resource small{color:#768396;margin-top:4px;font-size:11px}.add{gap:7px;margin-bottom:8px;display:flex}.add input,select{color:#eaf0f6;background:#0e141d;border:1px solid #344253;border-radius:10px;min-width:0;padding:10px}.add input{flex:1}.add button,.card>button:not(.primary){color:#e8eef5;background:#202b39;border:1px solid #38485b;border-radius:10px;padding:9px 12px}.coord{border-top:1px solid #293342;grid-template-columns:1fr auto auto;align-items:center;gap:10px;padding:10px 2px;display:grid}.coord span{color:#8e9cad;font-size:12px}.coord button{color:#d27474;background:0 0;border:0;font-size:18px}.danger{color:#ef9da4!important;background:#382126!important;border-color:#63353d!important}.overlay{z-index:50;background:#000a;justify-content:center;align-items:flex-end;padding:10px;display:flex;position:fixed;inset:0}.modal{background:#151c26;border:1px solid #3a4859;border-radius:20px 20px 12px 12px;width:min(700px,100%);max-height:88vh;padding:21px 17px 18px;position:relative;overflow:auto;box-shadow:0 -15px 50px #0008}.close{color:#cbd5e0;background:#293442;border:0;border-radius:50%;width:32px;height:32px;font-size:22px;position:absolute;top:10px;right:12px}.modal h2{margin:7px 40px 5px 0;font-size:24px}.modalSummary{color:#aeb9c8;margin:0 0 18px;line-height:1.5}.modal h3{margin-top:20px}.needgrid{grid-template-columns:1fr 1fr;gap:7px;display:grid}.needgrid span{color:#cbd4df;background:#111721;border:1px solid #303d4d;border-radius:9px;padding:9px;font-size:12px}.modal ol,.modal ul{color:#cbd4df;padding-left:22px;font-size:13px;line-height:1.55}.modal li{margin:8px 0}.why{background:#182b20;border:1px solid #2d5940;border-radius:12px;margin:17px 0;padding:12px}.why p{color:#b8c8bc;margin:4px 0;font-size:12px;line-height:1.5}.unlock{color:#9eabba;border:1px solid #344253;border-radius:11px;justify-content:space-between;gap:10px;margin:14px 0;padding:11px;font-size:12px;display:flex}.unlock span{color:#8bd998;font-weight:700}.modal .chips{margin-top:4px}@media (width>=700px){main{padding:14px 20px}.card{padding:19px}.map{height:500px}.overlay{align-items:center}.modal{border-radius:20px}}
