@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}body{margin:0;background:#eef1f5;color:#17181c;font-family:Inter,Arial,sans-serif}.hidden{display:none!important}button{font:inherit}
#menu{min-height:100vh;padding:24px;max-width:850px;margin:auto}.brand{font-weight:800;letter-spacing:-1px;font-size:22px}.brand span{color:#ff5c5c}.top{display:flex;justify-content:space-between;align-items:center}.badge{font-size:11px;background:#e5e8ed;padding:7px 10px;border-radius:20px;color:#68707c}.hero{padding:70px 0 45px}.hero h1{font-size:54px;letter-spacing:-3px;margin:0}.hero p{color:#747b86;line-height:1.6}.case{background:#fff;border-radius:24px;padding:20px;margin:13px 0;box-shadow:0 8px 30px #1d26300c;border:1px solid #e9ebee}.case:active{transform:scale(.985)}.case small{color:#ff5c5c;font-weight:700}.case h2{margin:10px 0 7px;font-size:21px}.case p{font-size:13px;color:#7a818b;line-height:1.55}.case footer{display:flex;justify-content:space-between;margin-top:18px;font-size:12px;color:#8b929c}.locked{opacity:.45}
#game{min-height:100vh;display:flex;align-items:center;justify-content:center;background:#dfe4ea}.phone{width:min(100vw,430px);height:100vh;background:#f7f7f8;overflow:hidden;position:relative}@media(min-width:600px){.phone{height:850px;border-radius:42px;box-shadow:0 25px 70px #0003}}.status{height:50px;padding:15px 24px;display:flex;justify-content:space-between;font-size:12px;font-weight:700}.page{position:absolute;inset:0;padding-top:50px}.lock{background:linear-gradient(145deg,#cbd6e4,#8fa0b7 45%,#e1c6c8);color:#fff;text-align:center}.lock h1{font-size:70px;font-weight:400;letter-spacing:-4px;margin:10px}.lock p{margin:35px 0 0;font-size:14px}.notification{margin:55px 16px;background:#ffffffb8;color:#222;padding:14px;border-radius:20px;text-align:left;display:flex;gap:12px;backdrop-filter:blur(15px)}.notification strong{font-size:12px}.notification span{font-size:11px;color:#666}.unlock{position:absolute;bottom:35px;width:100%;font-size:12px}.unlock b{display:block;width:120px;height:5px;border-radius:8px;background:#fff;margin:12px auto}.pin{text-align:center;padding-top:110px}.pin h2{font-size:23px}.dots{display:flex;justify-content:center;gap:13px;margin:30px}.dots i{width:11px;height:11px;border-radius:50%;border:1px solid #333}.dots i.on{background:#222}.pad{width:250px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.pad button{width:65px;height:65px;border:0;border-radius:50%;background:#e9eaed;font-size:20px;margin:auto}.home{background:linear-gradient(155deg,#e5ebf1,#bac8d8 52%,#dfc5ca)}.homeinner{padding:12px 18px}.widgets{display:grid;grid-template-columns:1fr 1.35fr;gap:10px}.widget{height:100px;border-radius:22px;padding:15px;background:#ffffff9c;backdrop-filter:blur(20px)}.widget small{color:#777}.widget b{font-size:36px;display:block;margin-top:5px}.widget.weather b{font-size:26px}.alert{margin:14px 0 24px;padding:13px;background:#ffffffa8;border-radius:18px;font-size:11px}.apps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px 11px}.app{border:0;background:none;color:#222;text-align:center;padding:0}.icon{height:58px;width:58px;border-radius:17px;margin:auto;display:grid;place-items:center;color:white;box-shadow:0 5px 12px #0001}.icon svg{width:27px}.app span{font-size:10px;margin-top:6px;display:block}.msg{background:#35c759}.photo{background:linear-gradient(135deg,#ffb14d,#f04f71,#7662e9)}.weathericon{background:#58aaff}.notesicon{background:#f3d452;color:#594b00}.fileicon{background:#4f91ff}.phoneicon{background:#40c96a}.mapicon{background:#64c987}.cameraicon{background:#444}.dwicon{background:#242830}.dock{position:absolute;bottom:20px;left:16px;right:16px;padding:10px;border-radius:26px;background:#ffffff92;display:flex;justify-content:space-around;backdrop-filter:blur(20px)}.dock button{border:0;background:none}
.appPage{background:#f7f7f8;color:#191a1d;overflow:auto}.bar{height:62px;padding:10px 16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e7e7e8;background:#ffffffcc;position:sticky;top:0;backdrop-filter:blur(15px)}.bar button{border:0;background:none;font-size:22px}.bar h2{font-size:16px}.content{padding:16px}.search{background:#e7e8eb;padding:11px;border-radius:11px;color:#858b94;font-size:12px}.chat{width:100%;border:0;border-bottom:1px solid #e6e6e8;background:none;display:flex;gap:12px;padding:14px 0;text-align:left}.avatar{width:45px;height:45px;border-radius:50%;background:#d8dce1;display:grid;place-items:center;flex:none}.unknown{background:#242934;color:white}.chat strong{font-size:13px}.chat p{margin:4px 0;color:#777;font-size:11px}.conversation{padding:25px 14px}.bubble{max-width:78%;padding:11px 14px;border-radius:18px;margin:8px 0;font-size:13px;line-height:1.45}.in{background:#e5e6e9}.out{background:#2583ff;color:white;margin-left:auto}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:3px}.grid div{aspect-ratio:1;overflow:hidden;position:relative}.grid img{width:100%;height:100%;object-fit:cover}.clue{position:absolute;right:6px;bottom:6px;background:#ffffffd9;padding:6px;border-radius:50%}.note{background:#fff1a7;border-radius:16px;padding:17px;margin-bottom:12px}.note small{color:#8c7f46}.note h3{margin:10px 0}.note p{font-size:13px;line-height:1.6}.row{display:flex;gap:12px;padding:15px 0;border-bottom:1px solid #e7e7e8}.row strong{font-size:13px}.row p{font-size:11px;color:#888;margin:4px 0}.rowicon{width:42px;height:42px;border-radius:13px;background:#e3edff;color:#4388f5;display:grid;place-items:center}.weatherPage{background:linear-gradient(#6ba1c8,#c7d9e1);color:white;height:100%}.weatherBody{padding:45px 25px}.temp{font-size:92px;font-weight:300;margin:25px 0}.simplecard{padding:20px;border-radius:22px;background:#ffffff2d;display:flex;justify-content:space-between}.simplecard b{font-size:28px}
.popup{position:absolute;z-index:100;inset:0;background:#0007;display:grid;place-items:center;padding:22px;backdrop-filter:blur(10px)}.pop{background:#fff;border-radius:27px;padding:28px;text-align:center;width:100%;max-width:340px}.pop .bigicon{width:58px;height:58px;margin:auto;border-radius:50%;display:grid;place-items:center;background:#e6f0ff;color:#4a8cff}.pop h2{font-size:22px}.pop p{color:#747b86;font-size:13px;line-height:1.6}.progress{height:6px;background:#eceef1;border-radius:9px;overflow:hidden}.progress i{display:block;width:18%;height:100%;background:#4b8cff}.pop button{margin-top:22px;width:100%;padding:14px;border:0;border-radius:14px;background:#22262d;color:white;font-weight:700}
