:root{
      --ui-bg: rgba(0,0,0,0.45);
      --ui-fg: rgba(255,255,255,0.92);
      --ui-dim: rgba(255,255,255,0.70);
      --accent: #6fd3ff;
    }
    html,body{height:100%;margin:0;overflow:hidden;background:#0b1020;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial;}
    #c{display:block;width:100vw;height:100vh;}
    .hud{
      position:fixed;left:12px;top:12px;z-index:10;
      color:var(--ui-fg);background:var(--ui-bg);backdrop-filter: blur(6px);
      border:1px solid rgba(255,255,255,0.12);
      border-radius:12px;padding:10px 12px;min-width:280px;
      box-shadow:0 10px 30px rgba(0,0,0,0.35);
    }
    .hud h1{font-size:14px;margin:0 0 6px 0;font-weight:700;letter-spacing:0.3px;}
    .hud .row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;}
    .pill{
      font-size:12px;color:var(--ui-dim);
      padding:2px 8px;border-radius:999px;border:1px solid rgba(255,255,255,0.12);
      background:rgba(255,255,255,0.06);
    }
    .kbd{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.12);padding:1px 6px;border-radius:6px;}
    .hud .small{font-size:12px;color:var(--ui-dim);line-height:1.35;margin-top:8px;}
    .panel{
      position:fixed;right:12px;top:12px;z-index:10;
      color:var(--ui-fg);background:var(--ui-bg);backdrop-filter: blur(6px);
      border:1px solid rgba(255,255,255,0.12);
      border-radius:12px;padding:10px 12px;min-width:300px;
      box-shadow:0 10px 30px rgba(0,0,0,0.35);
    }
    .panel h2{font-size:13px;margin:0 0 8px 0;font-weight:700;}
    .btns{display:flex;gap:8px;flex-wrap:wrap;}
    button{
      cursor:pointer;user-select:none;
      font-size:12px;color:var(--ui-fg);
      background:rgba(255,255,255,0.08);
      border:1px solid rgba(255,255,255,0.14);
      border-radius:10px;padding:6px 10px;
      transition:transform 0.04s ease, background 0.15s ease, border-color 0.15s ease;
    }
    button:hover{background:rgba(255,255,255,0.12);border-color:rgba(255,255,255,0.20);}
    button:active{transform:translateY(1px);}
    button.primary{border-color:rgba(111,211,255,0.45);box-shadow:0 0 0 2px rgba(111,211,255,0.10) inset;}
    .badge{display:inline-block;margin-left:6px;color:var(--accent);font-weight:700;}
    .tip{margin-top:8px;font-size:12px;color:var(--ui-dim);line-height:1.35;}
    .centerMsg{
      position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);
      z-index:10;color:var(--ui-fg);
      background:rgba(0,0,0,0.40);backdrop-filter: blur(6px);
      border:1px solid rgba(255,255,255,0.12);
      border-radius:14px;padding:14px 16px;min-width:360px;text-align:center;
      box-shadow:0 12px 40px rgba(0,0,0,0.5);
      display:none;
    }
    .centerMsg h3{margin:0 0 8px 0;font-size:14px;}
    .centerMsg p{margin:0;font-size:12px;color:var(--ui-dim);line-height:1.4;}
    .centerMsg .big{margin-top:10px;font-size:13px;color:var(--ui-fg);}
    a{color:var(--accent);}