:root{
  --bg:#0b1220; --bg2:#111c33; --card:#fff; --text:#0f172a; --muted:#64748b;
  --pri:#2563eb; --pri2:#1d4ed8; --accent:#38bdf8; --line:#e6ebf2;
  --ok:#16a34a; --warn:#d97706; --err:#dc2626; --r:14px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Noto Sans JP","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  color:var(--text); min-height:100dvh; -webkit-text-size-adjust:100%;
  background:
    radial-gradient(1100px 520px at 50% -12%, #1e3a8a 0%, rgba(30,58,138,0) 62%),
    linear-gradient(180deg,#0b1220 0%,#0d1526 100%);
  background-attachment:fixed;
}
a{color:var(--pri);text-decoration:none}
.wrap{max-width:540px;margin:0 auto;padding:22px 16px 56px}
.wrap.wide{max-width:1040px}
.brand{display:flex;align-items:center;justify-content:center;gap:12px;margin:14px 0 20px}
.brand svg{width:46px;height:46px;filter:drop-shadow(0 8px 20px rgba(37,99,235,.5))}
.brand .nm{color:#e8eefc;font-weight:700;font-size:20px;letter-spacing:.3px}
.brand .sub{display:block;font-weight:400;font-size:11px;color:#8fa6cc;letter-spacing:1.4px;margin-top:2px}
.card{background:var(--card);border-radius:var(--r);padding:22px 18px;box-shadow:0 20px 45px rgba(2,6,23,.42)}
.card+.card{margin-top:14px}
h1{font-size:20px;margin:0 0 8px;line-height:1.35}
h2{font-size:16px;margin:0 0 10px}
p{line-height:1.7;color:#334155;margin:0 0 12px;font-size:14px}
.muted{color:var(--muted);font-size:12.5px;line-height:1.6}
label{display:block;font-size:13px;font-weight:600;margin:14px 0 6px}
input[type=email],input[type=text],input[type=password],input[type=search],select{
  width:100%;padding:13px 14px;border:1px solid var(--line);border-radius:11px;font-size:16px;
  background:#f8fafc;outline:none;transition:.15s;font-family:inherit
}
input:focus,select:focus{border-color:var(--pri);background:#fff;box-shadow:0 0 0 4px rgba(37,99,235,.13)}
.code-input{letter-spacing:.55em;text-align:center;font-size:24px;font-weight:700}
.pw-wrap{position:relative}
.pw-toggle{position:absolute;right:10px;top:50%;transform:translateY(-50%);border:0;background:transparent;color:var(--muted);font-size:12px;cursor:pointer;padding:6px}
button.primary,.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;
  padding:14px 16px;border:0;border-radius:11px;font-size:16px;font-weight:700;cursor:pointer;
  background:linear-gradient(135deg,var(--pri) 0%,var(--pri2) 100%);color:#fff;
  box-shadow:0 10px 22px rgba(37,99,235,.32);transition:.15s;font-family:inherit
}
button.primary:hover,.btn:hover{filter:brightness(1.06)}
button.primary:disabled,.btn:disabled{opacity:.6;cursor:not-allowed;box-shadow:none}
.btn.ghost{background:#fff;color:var(--pri);border:1px solid var(--line);box-shadow:none}
.btn.sm{width:auto;padding:8px 14px;font-size:13px;border-radius:9px}
.btn.danger{background:#fff;color:var(--err);border:1px solid #fecaca;box-shadow:none}
.mt{margin-top:16px}
.alert{border-radius:11px;padding:12px 14px;font-size:13.5px;line-height:1.6;margin:12px 0 0;display:none}
.alert.show{display:block}
.alert.err{background:#fef2f2;color:#991b1b;border:1px solid #fecaca}
.alert.ok{background:#f0fdf4;color:#166534;border:1px solid #bbf7d0}
.alert.info{background:#eff6ff;color:#1e40af;border:1px solid #bfdbfe}
.steps{display:flex;gap:6px;justify-content:center;margin:0 0 16px}
.steps i{width:26px;height:4px;border-radius:2px;background:#dbe3ef;display:block}
.steps i.on{background:var(--pri)}
.foot{text-align:center;color:#7f94b8;font-size:11.5px;margin-top:18px;line-height:1.7}
.spin{width:16px;height:16px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:sp .7s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}
.badge{display:inline-block;padding:3px 9px;border-radius:999px;font-size:11.5px;font-weight:700;white-space:nowrap}
.badge.pending{background:#fff7ed;color:#b45309}
.badge.used{background:#f0fdf4;color:#15803d}
.badge.expired{background:#f1f5f9;color:#64748b}
/* configurable text blocks */
.notice-body{white-space:pre-wrap;line-height:1.75;color:#334155;font-size:14px;margin:6px 0 0}
textarea{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:11px;font-size:14px;background:#f8fafc;outline:none;font-family:inherit;line-height:1.6;resize:vertical}
textarea:focus{border-color:var(--pri);background:#fff;box-shadow:0 0 0 4px rgba(37,99,235,.13)}
.switch{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;margin:14px 0 4px}

/* ===== Android / mobile fit ===== */
html{height:100%}
body{overflow-x:hidden;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.wrap.fill{
  min-height:100dvh; min-height:100vh; display:flex; flex-direction:column;
  justify-content:center; gap:10px; padding:10px 14px calc(12px + env(safe-area-inset-bottom));
  max-width:540px; margin:0 auto;
}
.wrap.fill .card{ margin:0; }
.brand.compact{ margin:0 0 2px; }
.brand.compact svg{ width:34px; height:34px; }
.brand.compact .nm{ font-size:16px }
.brand.compact .sub{ font-size:9.5px; letter-spacing:1.1px }
.notice-card{ display:flex; flex-direction:column; max-height:calc(100dvh - 140px); max-height:calc(100vh - 140px); overflow:hidden }
.notice-card h1{ flex:0 0 auto }
#noticeBody,#doneBody,#doneNote,#doneContact{ flex:1 1 auto; min-height:0; overflow:hidden; -webkit-overflow-scrolling:touch }
/* 公告：字号放大 + 允许卡片内滚动；重点文字红色加粗 */
#noticeBody{ font-size:16px; line-height:1.85; overflow-y:auto; padding-right:6px; scrollbar-width:thin }
#noticeBody::-webkit-scrollbar,#doneBody::-webkit-scrollbar{ width:4px }
#noticeBody::-webkit-scrollbar-thumb,#doneBody::-webkit-scrollbar-thumb{ background:#cbd5e1; border-radius:4px }
#doneBody{ font-size:15px; line-height:1.8; overflow-y:auto; padding-right:4px }
.hl{ color:#dc2626; font-weight:700 }
.notice-fade{ position:relative }
.notice-fade::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:18px; background:linear-gradient(to bottom, rgba(255,255,255,0), #fff); pointer-events:none; opacity:0; transition:opacity .2s }
.notice-fade.has-more::after{ opacity:1 }
.scrollable{ overflow-y:auto !important }
.notice-actions{ flex:0 0 auto; margin-top:10px }
.notice-actions .btn{ width:100% }
/* 小屏收紧 */
@media (max-width:400px){
  .wrap{padding:10px 12px calc(10px + env(safe-area-inset-bottom))}
  .card{padding:16px 14px;border-radius:13px}
  h1{font-size:17px}
  p{font-size:13.5px}
  input[type=email],input[type=text],input[type=password]{padding:12px 12px}
  button.primary,.btn{padding:13px 14px;font-size:15.5px}
}
@media (max-height:680px){
  .brand.compact{display:none}
  .step-title li h4{font-size:.6rem}
}
/* admin */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}
.topbar .brand{margin:0;justify-content:flex-start}
.brand.sm svg{width:34px;height:34px}
.brand.sm .nm{font-size:16px}
.toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}
.toolbar input[type=search]{max-width:240px;padding:9px 12px;font-size:14px}
.toolbar select{max-width:150px;padding:9px 12px;font-size:14px;flex:0 0 auto}
.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse;font-size:13px}
th,td{padding:9px 10px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}
th{color:var(--muted);font-size:12px;font-weight:700;background:#f8fafc;position:sticky;top:0}
tr:nth-child(even) td{background:#fcfdff}
.tabs{display:flex;gap:6px;margin-bottom:12px;border-bottom:1px solid var(--line)}
.tabs button{border:0;background:transparent;padding:9px 12px;font-size:14px;font-weight:600;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;font-family:inherit}
.tabs button.on{color:var(--pri);border-bottom-color:var(--pri)}
.pager{display:flex;gap:8px;align-items:center;justify-content:center;margin-top:12px;font-size:13px;color:var(--muted)}
@media (max-width:420px){ h1{font-size:18px} .card{padding:18px 14px} th,td{padding:8px} }
