:root{

  --royal:#0c1220;

  --royal-ink:#0b1630;

  --gold:#d4af37; --gold-deep:#b8860b;

  --silver:#c0c0c0; --muted:#9aa4b2;

  --text:#f2f4f7;

  --card:#121a2f;

  --radius:16px;

  --shadow:0 12px 30px rgba(0,0,0,.35);

  --ring:0 0 0 2px rgba(212,175,55,.25), 0 0 32px rgba(212,175,55,.2);

}



*{box-sizing:border-box}

html,body{margin:0;padding:0;background:var(--royal);color:var(--text);font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}



.tm-header{

  position:sticky;top:0;z-index:50;

  background:linear-gradient(180deg, #0b1630 0%, #0c1220 100%);

  border-bottom:1px solid rgba(212,175,55,.2);

}

.tm-brand{max-width:1200px;margin:0 auto;display:flex;gap:10px;align-items:center;padding:14px 18px}

.tm-logo{font-size:22px}

.tm-name{font-weight:800;letter-spacing:.5px}



.tm-main{display:flex;justify-content:center;padding:32px 16px}

.tm-card{

  width:100%;max-width:820px;background:linear-gradient(180deg,#121a2f 0%,#0c1220 100%);

  border:1px solid rgba(212,175,55,.25);

  border-radius:var(--radius); box-shadow:var(--shadow); padding:28px;

}

.tm-title{margin:0 0 6px;font-size:28px}

.tm-subtitle{margin:0 0 18px;color:var(--muted)}



.grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}

.field{display:flex;flex-direction:column;gap:8px}

.field.full{grid-column:1/-1}

.field span{font-size:14px;color:var(--silver)}

.field input,.field select,.field textarea{

  background:#0e1730;border:1px solid rgba(212,175,55,.2);border-radius:12px;color:var(--text);

  padding:14px 14px;font-size:16px;outline:none;

}

.field input:focus,.field select:focus,.field textarea:focus{box-shadow:var(--ring);border-color:var(--gold)}

.field textarea{resize:vertical}



.tm-btn{

  margin-top:12px;display:inline-flex;align-items:center;justify-content:center;gap:8px;

  background:linear-gradient(180deg,var(--gold) 0%, var(--gold-deep) 100%);

  color:#1a1200;border:none;border-radius:14px;padding:14px 18px;font-weight:700;font-size:16px;

  cursor:pointer;box-shadow:0 8px 20px rgba(212,175,55,.35);transition:transform .06s ease, box-shadow .2s ease;

}

.tm-btn:hover{transform:translateY(-1px);box-shadow:0 10px 26px rgba(212,175,55,.45)}

.tm-btn:active{transform:translateY(0);box-shadow:0 6px 14px rgba(212,175,55,.28)}

.tm-btn:disabled{opacity:.6;cursor:not-allowed}



.status{margin-top:10px;min-height:22px;color:#c1ffd6}



.tm-footer{

  padding:20px 16px;display:flex;justify-content:center;color:var(--muted);

  border-top:1px solid rgba(212,175,55,.2);margin-top:24px

}



@media (max-width: 720px){

  .grid{grid-template-columns:1fr}

  .tm-card{padding:20px}

  .tm-title{font-size:24px}

}
