body{font:16px/1.5 system-ui,sans-serif;margin:0;background:#f4f6f8;color:#1c2530}
header.top{background:#1d2733;color:#fff;padding:10px 20px;display:flex;gap:18px;align-items:center;flex-wrap:wrap}
header.top a{color:#bfe3ff;text-decoration:none}header.top .sp{flex:1}
main{max-width:1000px;margin:20px auto;padding:0 16px}
.card{background:#fff;border:1px solid #d8dee4;border-radius:8px;padding:14px 18px;margin:14px 0}
table{border-collapse:collapse;width:100%}th,td{text-align:left;padding:6px 8px;border-bottom:1px solid #e5e9ed;vertical-align:top}
.msg{background:#e6f4ea;border:1px solid #9fd3ae;padding:8px 12px;border-radius:6px;margin:10px 0}
.err{background:#fdecea;border:1px solid #f1aeb5;padding:8px 12px;border-radius:6px;margin:10px 0}
.warn{background:#fff4d6;border:1px solid #e8cf7a;padding:8px 12px;border-radius:6px;margin:10px 0}
.badge{display:inline-block;padding:1px 8px;border-radius:10px;background:#e1e6eb;font-size:13px}
.badge.submitted{background:#dbe9ff}.badge.approved{background:#d8f0dc}.badge.applied{background:#b9e6c2}.badge.rejected,.badge.apply_failed{background:#f8d3d3}
.badge.onair{background:#1f8f4a;color:#fff;font-weight:600}
button,.btn{font:inherit;padding:5px 12px;border-radius:6px;border:1px solid #8aa;background:#fff;cursor:pointer}
button.primary{background:#2b6cb0;color:#fff;border-color:#2b6cb0}button.danger{background:#b83232;color:#fff;border-color:#b83232}
input[type=text],input[type=password],select,textarea{font:inherit;padding:5px 8px;border:1px solid #9ab;border-radius:6px}
textarea{width:100%;box-sizing:border-box}
code.secret{font-size:22px;background:#fff8d6;padding:6px 12px;border:1px dashed #b9a43a;user-select:all}
ul.ops{margin:6px 0;padding-left:20px}
form.inline{display:inline}

/* ---- phones / small tablets: nav wraps, tables become stacked cards, 44px tap targets, 16px inputs (no iOS zoom) ---- */
code{overflow-wrap:anywhere}
.card{overflow-wrap:anywhere}
@media (max-width:720px){
  body{font-size:17px}
  header.top{padding:8px 12px;gap:4px 8px}
  header.top>strong{flex:1 1 100%}
  header.top a{display:inline-flex;align-items:center;min-height:44px;padding:0 10px;border-radius:8px;background:#2a3748}
  header.top .sp{display:none}
  header.top>span{flex:1 1 100%;font-size:14px;opacity:.85}
  header.top form.inline{margin-left:auto}
  main{margin:12px auto;padding:0 12px}
  .card{padding:12px 14px}
  button,.btn,input[type=text],input[type=password],select,textarea{font-size:16px;min-height:44px}
  button,.btn{padding:8px 16px}
  input[type=text],input[type=password],select{width:100%;box-sizing:border-box}
  form.inline{display:inline-block}
  textarea{min-height:88px}
  .card form button.primary,.card form button.danger{width:100%;margin-top:8px}
  .card form[method=post]>p>button{width:100%}
  table.stack,table.stack tbody,table.stack tr,table.stack td{display:block;width:100%;box-sizing:border-box}
  table.stack tr:first-child:has(th){display:none}
  table.stack tr{padding:8px 0;border-bottom:2px solid #d8dee4}
  table.stack tr:last-child{border-bottom:0}
  table.stack td{border:0;padding:4px 0;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
  table.stack td[data-label]::before{content:attr(data-label);flex:0 0 96px;font-size:13px;color:#5a6a7a;text-transform:uppercase;letter-spacing:.04em}
  table.stack td form.inline{display:flex;gap:8px;align-items:center;flex:1 1 auto}
  table.stack td form.inline select{flex:1}
  table.stack td .actions{display:flex;gap:8px;flex-wrap:wrap;width:100%}
  table.stack td .actions form{flex:1 1 140px}
  table.stack td .actions button{width:100%}
  table.stack td a{display:inline-flex;align-items:center;min-height:44px}
  .login-card{margin:24px auto!important}
  code.secret{font-size:18px;display:block;overflow-wrap:anywhere}
  .badge{font-size:14px;padding:2px 10px}
}
