*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top,#263641,#0b1016 80%);color:#e6e5d9;font-family:system-ui,-apple-system,sans-serif}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;border:0}header{max-width:560px;display:flex;justify-content:space-between;align-items:center;margin:auto;padding:14px 20px}a{color:#d9ba73}header a{text-decoration:none;font-size:12px;font-weight:800}header button{border:1px solid #41535c;border-radius:30px;background:transparent;color:#c6d1cf;padding:7px 13px;font-size:11px}main{max-width:510px;margin:auto;padding:0 18px 30px}.brand{text-align:center}.brand>span{font-size:8px;letter-spacing:4px;color:#ad956c}.brand h1{font-weight:950;font-size:40px;margin:6px 0 0;letter-spacing:3px}.brand h1 span{color:#d9b976}.brand p{font-size:11px;color:#9aa9af;margin:5px 0 15px}.hud{display:flex;align-items:center;justify-content:space-between;padding:12px 15px;border-top:1px solid #42505b;border-bottom:1px solid #42505b;margin-bottom:14px}.hud small{display:block;font-size:7px;color:#92a2a8;letter-spacing:2px}.hud b{font-size:23px;font-variant-numeric:tabular-nums}.hud #best{font-size:18px}.lockrow{display:flex;gap:7px}.lockrow span{border:1px solid #52626b;padding:9px;border-radius:7px;font-size:11px;color:#849b9f}.lockrow .open{background:#71866a;color:#f5f1dc;border-color:#a1b891}.lockrow .active{color:#ffe9b1;border-color:#d0ac6a;box-shadow:0 0 12px #d0ac6a25}#cabinet{border-radius:14px;background:linear-gradient(140deg,#56666b,#2b363f 55%,#46555b);padding:11px;box-shadow:0 20px 55px #0009,inset 0 1px 1px #afb9b9;border:1px solid #6d7b7d}.safe-top{display:flex;justify-content:space-between;font-size:8px;letter-spacing:2px;padding:3px 4px 10px;color:#bbc4c2}#lamp{color:#dfbf78}.door{background:linear-gradient(120deg,#223138,#111b23 80%);border:3px solid #1a252c;box-shadow:inset 0 0 0 1px #687275,inset 0 0 40px #060e1699;border-radius:8px;position:relative;min-height:350px;overflow:hidden;padding-top:24px}.bolts i{width:8px;height:8px;position:absolute;border:1px solid #828e8c;background:#566467;border-radius:50%;box-shadow:1px 1px 3px #000}.bolts i:nth-child(1){top:11px;left:11px}.bolts i:nth-child(2){top:11px;right:11px}.bolts i:nth-child(3){bottom:11px;left:11px}.bolts i:nth-child(4){bottom:11px;right:11px}#dial{width:min(75%,290px);aspect-ratio:1;margin:0 auto;position:relative;touch-action:none;border-radius:50%;background:radial-gradient(circle,#3c4a50 55%,#111b20 56%,#697174 57%,#29343a 59%,#121d24 62%);box-shadow:0 12px 18px #0007;user-select:none}#ticks{position:absolute;inset:0;width:100%;height:100%;filter:drop-shadow(0 1px 1px #000)}.knob{position:absolute;width:48%;height:48%;left:26%;top:26%;border-radius:50%;background:repeating-conic-gradient(#5b6668 0deg 4deg,#374448 4deg 8deg);box-shadow:0 7px 15px #000a,inset 0 0 0 3px #7b8584;pointer-events:none}.knob-inner{position:absolute;inset:8%;border-radius:50%;background:radial-gradient(circle at 35% 20%,#526368,#1b2c35 85%);display:flex;align-items:center;justify-content:center;flex-direction:column;border:1px solid #8b9895}.knob-inner span,.knob-inner small{font-size:6px;letter-spacing:2px;color:#acb7b2}.knob-inner b{font-size:32px;color:#e5d7ae;font-variant-numeric:tabular-nums;line-height:1.4}.knob-line{position:absolute;width:3px;height:13px;background:#e2c784;left:calc(50% - 1px);top:2%;z-index:2}#pointer{position:absolute;left:calc(50% - 5px);top:15px;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:10px solid #e8c27b;z-index:1}.readout{text-align:center;padding:15px 20px 22px}.readout>span{font-size:12px;color:#bfc9bd;font-weight:800}.readout small{font-size:8px;color:#7d939c;display:block;margin-top:8px}.alarm{display:flex;align-items:center;gap:10px;font-size:9px;padding:13px 3px 2px;color:#c2b9a3}.alarm>div{height:5px;flex:1;border-radius:8px;overflow:hidden;background:#1a252c}.alarm i{height:100%;display:block;width:0;background:#d47764}.alarm b{width:30px;text-align:right;font-variant-numeric:tabular-nums}#overlay{position:absolute;inset:0;background:#0e1c26f0;backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:20px;z-index:3}#overlay[hidden]{display:none}#eyebrow{font-size:8px;letter-spacing:2px;color:#cab078}#overlay h2{font-size:30px;letter-spacing:-1px;margin:17px 0 8px}#overlay p{font-size:12px;line-height:1.9;color:#a9bac0}#overlay button{background:linear-gradient(135deg,#eed59b,#bb955f);color:#263139;padding:13px 22px;font-weight:900;border-radius:9px;min-width:220px;margin-top:8px}#overlay #share{background:#324955;color:#e8e1c5}#treasure{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(circle,#ab854688,#0e1c26);z-index:2;pointer-events:none}#treasure[hidden]{display:none}#treasure span{font-size:100px;color:#ffd986;animation:shine 1.5s infinite alternate}#treasure b{font-size:28px;letter-spacing:4px;color:#efcf90}#treasure p{font-size:9px;letter-spacing:5px;color:#cbb680}@keyframes shine{to{text-shadow:0 0 70px #ffcf69;transform:scale(1.1) rotate(15deg)}}.controls{display:flex;gap:9px;margin-top:14px}.controls>button{padding:12px;border-radius:10px;color:#bbc8c9;background:#30434e;touch-action:none;font-size:26px;width:60px}.controls #unlock{flex:1;background:#d8b97c;color:#253640;font-size:17px;font-weight:900}.controls small{display:block;font-size:8px;font-weight:500;margin-top:3px}#status{font-size:10px;text-align:center;color:#a4b9bd;min-height:18px;margin:11px 0}.links{display:flex;gap:8px;margin:0 0 15px}.links button{width:50%;background:transparent;border:1px solid #3d535e;border-radius:8px;color:#a5b9be;font-size:10px;padding:10px}.links button:disabled{opacity:.35}details{border:1px solid #364a55;border-radius:10px;padding:14px;font-size:11px;line-height:1.9;color:#9cafb4}summary{cursor:pointer;color:#cfbf9c;font-weight:700}@media(max-height:780px){header{padding:10px 20px}.brand h1{font-size:32px}.brand p{margin-bottom:10px}.hud{padding:8px 12px;margin-bottom:10px}#dial{width:min(66%,250px)}.door{min-height:290px}.readout{padding:12px 18px 15px}.controls{margin-top:10px}.controls>button{padding:9px}}
