*{box-sizing:border-box}html,body{margin:0;height:100%;background:#0f1115;color:#fff;font-family:system-ui,-apple-system,sans-serif;overflow:hidden}
button,input{font:inherit}.panel{max-width:420px;margin:12vh auto;padding:24px}.panel h1{margin:0 0 10px;font-size:32px}.panel p{color:#aeb4bf}
.panel input{width:100%;margin:7px 0;padding:15px;border-radius:14px;border:1px solid #343945;background:#181b21;color:#fff}
button{border:0;border-radius:13px;padding:12px 15px;background:#ffffff;color:#111;font-weight:700}.panel button{width:100%;margin-top:10px}
small{display:block;margin-top:12px;color:#ff8080}
main{height:100%;display:grid;grid-template-rows:auto 1fr auto}
header{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:#15181e;border-bottom:1px solid #272c35}
header span{display:block;font-size:12px;color:#9da5b2}.ghost{background:#272c35;color:#fff}
#stage{position:relative;min-height:0;touch-action:none;background:linear-gradient(145deg,#1d2230,#08090c)}
canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none}
#clock{position:absolute;top:7%;left:0;right:0;text-align:center;pointer-events:none;text-shadow:0 2px 10px #000}
#time{font-size:64px;font-weight:250;line-height:1}#date{font-size:17px;margin-top:8px}
#toolbar{display:flex;gap:8px;align-items:center;overflow-x:auto;padding:10px;background:#15181e;border-top:1px solid #272c35}
#toolbar label{display:flex;align-items:center;gap:7px;white-space:nowrap;font-size:12px;color:#c4cad3}
#toolbar button{white-space:nowrap;background:#292e38;color:#fff}.active{outline:2px solid #fff}.danger{background:#7a1f2b!important}
input[type=color]{width:38px;height:34px;padding:0;border:0;background:none}
dialog{border:0;border-radius:18px;background:#1a1e25;color:#fff;width:min(90vw,400px);padding:20px}
dialog::backdrop{background:#000a}dialog input[type=text],dialog input:not([type]){width:100%;padding:13px;border-radius:12px;border:1px solid #3b414d;background:#11141a;color:#fff}
dialog label{display:block;margin:16px 0}.dialog-actions{display:flex;justify-content:flex-end;gap:9px}
@media(max-width:500px){#time{font-size:54px}}