*{box-sizing:border-box}
:root{
  --bg:#0b0b0b; --text:#fff; --muted:#a1a1aa;
  --brand:#2563eb; --ok:#22c55e; --note:#facc15;
  --border:rgba(255,255,255,.10); --panel:rgba(255,255,255,.05);
}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif}
.wrapper{width:100%;max-width:460px;margin:0 auto;padding:24px 16px 80px;text-align:center}

.logo{width:144px;height:144px;margin:0 auto 24px;display:block}
h1{font-size:28px;line-height:1.3;font-weight:800;margin:0 0 18px}
h1 span{color:var(--brand)}

.steps{text-align:left;margin:8px 0 22px}
.step{display:flex;gap:10px;font-size:16px;line-height:1.4;margin-bottom:16px;align-items:flex-start}
.circle{background:var(--brand);color:#fff;font-weight:700;width:26px;height:26px;border-radius:50%;font-size:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.link-style{color:#3b82f6;text-decoration:none}

/* Ввод ID: поле на всю ширину, кнопка ниже */
.id-row{display:flex;flex-direction:column;align-items:stretch;gap:10px;margin:8px 0 8px}
input[type="number"],input[type="text"]{
  width:100%;padding:14px 16px;border-radius:12px;border:1px solid var(--border);
  background:var(--panel);color:var(--text);font-size:16px;outline:none;appearance:textfield
}
input[type="number"]::-webkit-outer-spin-button,input[type="number"]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
input[type="number"]:focus,input[type="text"]:focus{border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.25)}

.btn{
  display:inline-block;width:100%;padding:15px;margin:10px 0;border-radius:12px;
  font-size:16px;font-weight:800;text-decoration:none;cursor:pointer;user-select:none;
  transition:transform .08s ease,filter .15s ease;border:0;color:#fff;background:var(--brand) /* синяя "Найти" */
}
.btn:active{transform:translateY(1px)}
.btn[aria-disabled="true"]{filter:grayscale(.6) brightness(.85);pointer-events:none}
.btn.primary{background:var(--ok);color:#fff}                          /* зелёная заливка */
.btn.outline{background:transparent;color:#fff;border:2px solid var(--ok)} /* зелёная рамка, белый текст */

.actions,.alt-actions{display:none}
.actions.show,.alt-actions.show{display:block;animation:reveal .35s ease forwards}

.note{display:none;color:var(--note);font-size:13px;margin-top:10px}
.note a{color:#fff;text-decoration:underline}
.note .toggle{display:inline-block;margin-top:10px;text-decoration:underline;cursor:pointer}
.note.show{display:block}  /* <<< фикс, как на tv */

.error{color:#f87171;margin-top:8px}

@keyframes reveal{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
:focus-visible{outline:3px solid rgba(59,130,246,.6);outline-offset:2px;border-radius:12px}

@media (max-width:480px){
  .wrapper{padding-top:12px}
  h1{font-size:24px}
  .step{font-size:15px}
  .btn{font-size:15px;padding:14px}
}
