:root { --accent:#3e6bcc; --teal:#158b8c; --ink:#213e57; --muted:#627b8d; --line:#dce8ed; --green:#168163; --paper:#fff; --canvas:#f4f9fb; }
    * { box-sizing:border-box; }
    body { margin:0; background:var(--canvas); color:var(--ink); font-family:Arial,"Microsoft YaHei",system-ui,sans-serif; font-size:15px; line-height:1.6; }
    button { font:inherit; cursor:pointer; }
    button:focus-visible,a:focus-visible { outline:3px solid #4267b2; outline-offset:4px; }
    button { -webkit-tap-highlight-color:transparent; }
    .topbar { background:linear-gradient(105deg,#deedf2,#cce8f5); border-bottom:1px solid #cadfe9; }
    .topbar-inner { max-width:1140px; margin:auto; padding:12px 30px; display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:70px; }
    .brand { display:flex; gap:22px; align-items:center; min-width:0; }
    .conference-logo { display:block; width:216px; height:auto; }
    .brand-service { border-left:1px solid #aacbd9; padding-left:22px; color:#41637b; font-size:12px; line-height:1.5; }
    .brand-service small { display:block; font-size:9px; letter-spacing:.13em; margin-top:2px; }
    .official-link { display:inline-flex; align-items:center; gap:9px; min-height:44px; color:#345a78; font-size:12px; text-decoration:none; white-space:nowrap; }
    .official-link:hover { color:var(--accent); text-decoration:underline; }
    .conference-hero { position:relative; isolation:isolate; overflow:hidden; background:#e3f5fa; border-bottom:1px solid #cde9ec; }
    .hero-art { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 78%; z-index:-2; }
    .hero-wash { position:absolute; inset:0; background:linear-gradient(90deg,#edf9fcf7 0%,#edf9fcea 37%,#edf9fc80 62%,#edf9fc00 100%); z-index:-1; }
    .hero-inner { max-width:1140px; margin:auto; padding:27px 30px 29px; }
    .hero-kicker { color:#237d89; letter-spacing:.13em; font-size:10px; font-weight:700; margin:0 0 9px; }
    h1 { max-width:750px; font-size:30px; line-height:1.2; font-weight:700; letter-spacing:-.025em; color:var(--accent); margin:0; }
    h1 span { display:block; }
    .conference-cn { margin:10px 0 0; color:#276a9c; font-size:16px; letter-spacing:.06em; }
    .conference-theme { margin:5px 0 0; color:#4d7b92; font-size:12px; }
    .conference-meta { display:flex; align-items:center; flex-wrap:wrap; gap:8px 22px; margin-top:17px; font-size:12px; color:#2a6580; }
    .conference-meta span { display:inline-flex; align-items:center; gap:7px; }
    .conference-meta svg { width:14px; height:14px; flex-shrink:0; }
    main { max-width:1140px; padding:26px 30px 24px; margin:auto; }
    .heading { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:19px; }
    .eyebrow { color:var(--teal); font-size:9px; letter-spacing:.16em; font-weight:700; margin:0 0 4px; }
    .heading h2 { color:#2c537c; font-size:23px; line-height:1.45; }
    .intro { margin:5px 0 0; color:var(--muted); font-size:12px; }
    .sync-button { display:inline-flex; align-items:center; justify-content:center; gap:6px; flex-shrink:0; min-height:44px; border:1px solid #c8d8ee; border-radius:7px; padding:7px 12px; font-size:12px; color:var(--accent); white-space:nowrap; background:white; }
    .sync-button:hover { background:#edf5fc; }
    .sync-button::before { content:'↻'; font-size:17px; line-height:1; }
    .sync-button[data-synced="true"] { border-color:#b5dfd0; background:#ebf8f3; color:var(--green); }
    .sync-button[data-synced="true"]::before { content:'✓'; font-size:14px; }
    .days { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; }
    .day { padding:11px 8px; border:1px solid var(--line); border-radius:8px; background:#fff; color:#456579; transition:background .15s, border-color .15s; }
    .day:hover { border-color:#7aa8d5; background:#edf6fc; }
    .day[aria-pressed="true"] { background:linear-gradient(115deg,#3e6bcc,#2b92c5); border-color:#3e6bcc; color:white; box-shadow:0 4px 12px #3e6bcc20; }
    .day-number { display:block; font-weight:650; font-size:19px; }
    .day-caption { display:block; font-size:11px; margin-top:3px; opacity:.85; }
    .board { margin-top:30px; }
    .tabbar { display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); gap:10px; }
    .tabs { display:flex; gap:28px; }
    .tab { padding:0 0 14px; border:0; border-bottom:3px solid transparent; margin-bottom:-1px; background:transparent; color:var(--muted); display:flex; align-items:center; gap:9px; font-weight:600; }
    .tab[aria-selected="true"] { border-bottom-color:var(--accent); color:var(--accent); }
    .count { font-size:11px; padding:1px 7px; border-radius:5px; background:#eaf1f5; color:#587084; min-width:23px; }
    .tab[aria-selected="true"] .count { background:#e4edfc; color:var(--accent); }
    .reset { color:var(--muted); background:none; border:0; font-size:12px; padding:5px 0 17px 8px; }
    .reset:hover { color:var(--accent); }
    .list-caption { display:flex; justify-content:space-between; gap:10px; color:var(--muted); font-size:12px; margin:18px 0 14px; }
    .card { background:var(--paper); border:1px solid var(--line); border-top:3px solid #72bec5; border-radius:12px; padding:24px 28px 0; box-shadow:0 5px 20px #24577905; }
    .card-head { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; }
    .person { display:flex; align-items:center; gap:13px; }
    .avatar { width:49px; height:49px; display:grid; place-items:center; border-radius:50%; background:linear-gradient(135deg,#e4f1fa,#e4f6f1); color:#387d99; font-size:20px; font-weight:600; }
    h2, .person h3 { margin:0; font-size:22px; letter-spacing:.02em; }
    .person-sub { color:var(--muted); font-size:12px; margin-top:1px; }
    .badge { display:inline-flex; align-items:center; gap:6px; color:#4d728c; background:#eef4f8; border-radius:6px; padding:5px 10px; font-size:12px; white-space:nowrap; }
    .badge::before { content:""; width:6px; height:6px; background:currentColor; border-radius:50%; }
    .badge.done { color:var(--green); background:#e8f6f0; }
    .details { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; margin:27px 0 25px; }
    .details dt { color:var(--muted); font-size:12px; margin-bottom:6px; }
    .details dd { margin:0; font-size:14px; font-weight:550; overflow-wrap:anywhere; }
    .details .volunteer-contact { display:flex; flex-wrap:wrap; align-items:baseline; gap:2px 9px; }
    .volunteer-name, .volunteer-phone { white-space:nowrap; }
    .volunteer-phone { font-size:13px; font-weight:400; }
    .details small { font-weight:400; color:var(--muted); font-size:11px; }
    .progress-section { border-top:1px solid #edf2f5; padding:20px 0 24px; }
    .progress-title { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:13px; }
    .progress-title strong { font-size:13px; font-weight:600; }
    .progress-title span { font-size:11px; color:var(--muted); }
    .steps { display:grid; grid-template-columns:1fr 32px 1fr 32px 1fr; align-items:center; }
    .step { display:flex; align-items:center; gap:11px; text-align:left; min-height:69px; padding:12px 14px; background:#f8fbfd; border:1px solid var(--line); border-radius:8px; color:#45647d; }
    .step:hover { border-color:#88b6d6; background:#edf5fc; }
    .step-icon { flex-shrink:0; width:27px; height:27px; display:grid; place-items:center; border:1px solid #cddfe9; border-radius:50%; color:#6b8da5; font-size:12px; background:white; }
    .step-label { display:block; font-size:14px; font-weight:600; }
    .step-action { display:block; color:var(--muted); font-size:10px; margin-top:1px; }
    .step[aria-pressed="true"] { background:#ebf8f3; border-color:#b5dfd0; color:var(--green); }
    .step[aria-pressed="true"] .step-icon { background:var(--green); border-color:var(--green); color:white; font-size:15px; }
    .step[aria-pressed="true"] .step-action { color:#39826a; }
    .arrow { color:#a5c2d2; text-align:center; font-size:20px; pointer-events:none; }
    .card-footer { display:flex; justify-content:space-between; gap:15px; flex-wrap:wrap; margin:0 -28px; padding:12px 28px; background:#f9fcfd; border-top:1px solid #edf2f5; border-radius:0 0 12px 12px; font-size:11px; color:var(--muted); }
    .empty { text-align:center; padding:57px 20px; border:1px dashed #c8dfe8; border-radius:12px; background:#ffffffaa; }
    .empty-icon { font-size:25px; color:#6c9caf; margin-bottom:7px; }
    .empty h2 { font-size:17px; }
    .empty p { color:var(--muted); font-size:13px; margin:9px 0 16px; }
    .text-action { border:1px solid #c8d8ee; color:var(--accent); background:#eff5fc; border-radius:8px; padding:8px 15px; font-size:13px; }
    .hint { display:flex; align-items:flex-start; gap:9px; margin:20px 0 0; font-size:12px; color:var(--muted); }
    .hint-icon { display:inline-grid; place-items:center; border:1px solid #97b1c2; width:15px; height:15px; margin-top:3px; font-size:10px; border-radius:50%; flex-shrink:0; }
    .conference-footer { display:flex; align-items:center; justify-content:space-between; gap:14px; border-top:1px solid var(--line); margin-top:29px; padding-top:17px; font-size:11px; color:#56798d; }
    .conference-footer strong { color:#47769c; font-weight:600; }
    .footnote { margin-top:9px; padding-top:0; display:flex; justify-content:space-between; gap:14px; color:var(--muted); font-size:10px; }
    .toast { position:fixed; bottom:26px; left:50%; transform:translateX(-50%); padding:12px 18px; border-radius:10px; background:#244b66; color:#fff; font-size:13px; box-shadow:0 6px 22px #0002; width:max-content; max-width:calc(100% - 32px); z-index:5; }
    .toast[hidden] { display:none; }
    .change-dialog { width:calc(100% - 32px); max-width:420px; max-height:calc(100dvh - 32px); overflow:auto; border:1px solid #dce8ed; border-radius:16px; padding:26px; color:var(--ink); background:white; box-shadow:0 20px 70px #183a5b33; }
    .change-dialog::backdrop { background:#183a5b77; backdrop-filter:blur(3px); }
    .change-dialog h2 { font-size:20px; color:#2c537c; }
    .change-expert { font-size:13px; color:var(--muted); margin:7px 0 20px; }
    .change-summary { display:grid; grid-template-columns:1fr 22px 1fr; align-items:center; gap:8px; padding:16px 12px; border-radius:10px; background:#f2f7fb; text-align:center; }
    .change-summary small { display:block; color:var(--muted); font-size:11px; margin-bottom:5px; }
    .change-summary strong { display:block; font-size:14px; }
    #change-to { color:var(--accent); }
    .change-note { font-size:13px; line-height:1.7; color:var(--muted); margin:17px 0 22px; }
    .change-actions { display:flex; justify-content:flex-end; gap:12px; }
    .change-actions button { flex:1; min-height:44px; border:1px solid #d3e0eb; border-radius:8px; background:white; color:#46657d; font-size:14px; padding:10px 14px; }
    .change-actions #confirm-change { border-color:var(--accent); background:var(--accent); color:white; }
    .change-actions button:hover { filter:brightness(.96); }
    @media(max-width:680px) {
      .topbar-inner { padding:8px 16px; min-height:60px; } .conference-logo { width:166px; } .brand-service { display:none; } .official-link { font-size:11px; }
      .hero-inner { padding:22px 18px 24px; } .hero-kicker { font-size:9px; margin-bottom:10px; } h1 { max-width:450px; font-size:clamp(20px,5.5vw,28px); line-height:1.25; }
      .hero-art { object-position:70% 75%; } .hero-wash { background:linear-gradient(100deg,#edf9fcf5,#edf9fcc9 65%,#edf9fc70); }
      .conference-cn { font-size:13px; letter-spacing:.02em; margin-top:10px; } .conference-theme { font-size:10px; } .conference-meta { gap:6px 13px; font-size:10px; margin-top:12px; } .conference-meta .host { flex-basis:100%; }
      main { padding:22px 16px 22px; } .heading { align-items:center; margin-bottom:16px; } .heading h2 { font-size:21px; } .intro { font-size:11px; max-width:240px; } .eyebrow { font-size:8px; } .sync-button { font-size:11px; padding:6px 9px; }
      .days { gap:6px; } .day { padding:12px 2px; border-radius:7px; } .day-number { font-size:clamp(10px,3vw,13px); white-space:nowrap; } .day-caption { font-size:10px; }
      .board { margin-top:24px; } .tabs { gap:24px; } .card { padding:21px 18px 0; } .details { grid-template-columns:1fr 1fr; gap:19px 15px; margin:23px 0; }
      .steps { grid-template-columns:minmax(0,1fr); gap:5px; } .arrow { width:24px; justify-self:center; font-size:16px; line-height:16px; transform:rotate(90deg); } .step { min-height:59px; padding:10px 13px; }
      .step-content { display:flex; justify-content:space-between; align-items:center; gap:10px; width:100%; } .step-action { font-size:11px; }
      .card-footer { margin:0 -18px; padding:11px 18px; gap:4px; } .progress-title span { font-size:10px; } .conference-footer { flex-wrap:wrap; gap:4px; margin-top:24px; font-size:10px; } .footnote { display:block; margin-top:8px; } .footnote span { display:block; margin-top:5px; }
      .list-caption { font-size:11px; } .badge { font-size:11px; padding:4px 8px; }
    }
    @media(prefers-reduced-motion:reduce) { * { transition:none!important; } }
  
[hidden] { display:none!important; }
.login-card { max-width:440px; margin:12px auto 36px; background:#fff; padding:28px; border:1px solid var(--line); border-radius:14px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:20px; }
.form-grid.single { grid-template-columns:1fr; }
label { display:grid; gap:6px; font-size:13px; }
input,select,textarea { width:100%; min-width:0; padding:10px 12px; border:1px solid #c9dbe5; border-radius:7px; color:var(--ink); background:#fff; font:inherit; font-size:16px; }
textarea { resize:vertical; }
input:focus,select:focus,textarea:focus { outline:2px solid var(--accent); outline-offset:2px; }
.toolbar button,.button,.form-actions button,.form-grid>button,.row-actions button { display:inline-flex; align-items:center; justify-content:center; min-height:42px; padding:8px 13px; border:1px solid #c9dbe5; background:white; color:var(--ink); border-radius:7px; text-decoration:none; font:inherit; font-size:13px; }
.primary { background:var(--accent)!important; color:#fff!important; border-color:var(--accent)!important; }
.form-actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:10px; margin-top:8px; }
.full { grid-column:1/-1; }
.account-bar { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; margin-bottom:22px; color:var(--muted); font-size:12px; }
.link-button { background:none; border:0; padding:6px 8px; color:var(--accent); font:inherit; font-size:12px; }
.toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:16px; }
.search-label { flex:1; min-width:200px; }
.admin-tools { padding-bottom:16px; border-bottom:1px solid var(--line); }
.days { grid-template-columns:repeat(auto-fit,minmax(100px,1fr)); }
.card+.card { margin-top:20px; }
.step:disabled { cursor:default; }
.step:disabled:hover { border-color:var(--line); background:#f8fbfd; }
.step[aria-pressed=true]:disabled:hover { background:#ebf8f3; border-color:#b5dfd0; }
button:disabled:not(.step) { opacity:.55; cursor:wait; }
.expert-note { white-space:pre-wrap; overflow-wrap:anywhere; font-size:13px; color:var(--muted); }
.wide-dialog { width:calc(100% - 32px); max-width:740px; max-height:calc(100dvh - 32px); overflow:auto; border:1px solid var(--line); border-radius:16px; padding:26px; color:var(--ink); }
.wide-dialog::backdrop { background:#183a5b77; }
.wide-dialog h2 { font-size:22px; }
.user-row { display:flex; justify-content:space-between; align-items:center; gap:12px; border-bottom:1px solid var(--line); padding:13px 0; }
.user-row small,.audit-list small { display:block; color:var(--muted); font-size:12px; margin-top:4px; }
.row-actions { display:flex; flex-wrap:wrap; gap:6px; }
.audit-list { padding-left:24px; }
.audit-list li { padding:12px 0; border-bottom:1px solid var(--line); overflow-wrap:anywhere; }
.audit-list strong { font-size:14px; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
@media(max-width:680px) { .form-grid { grid-template-columns:1fr; }.wide-dialog { padding:20px; }.user-row { align-items:flex-start; flex-direction:column; }.tabbar { flex-wrap:wrap; }.tabbar>.intro { margin-bottom:8px; }.login-card { padding:22px; }.days { grid-template-columns:repeat(auto-fit,minmax(82px,1fr)); } }