/* Formnext 2026 报名页样式，从临时 HTML 拆分。 */

:root{
    --paper:#f1ece2; --surface:#fcfbf7; --inset:#f5f1e8;
    --ink:#1b1a16; --ink-2:#26241f; --muted:#6e6960; --faint:#9b9488;
    --line:#e2dccd; --line-2:#ece7da;
    --clay:#bd5a30; --clay-2:#a44b25; --clay-soft:#f3e4d8;
    --err:#b1402a;
    --sans:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei","Hiragino Sans GB","Noto Sans CJK SC",system-ui,sans-serif;
    --serif:Georgia,"Times New Roman","Songti SC",SimSun,"Noto Serif CJK SC",serif;
    --mono:"SF Mono",ui-monospace,"Cascadia Code",Consolas,Menlo,"PingFang SC",monospace;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{font-family:var(--sans);background:var(--paper);color:var(--ink);line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}

  /* top bar */
  .topbar{border-bottom:1px solid var(--line);background:var(--paper);position:sticky;top:0;z-index:30}
  .topbar .in{max-width:980px;margin:0 auto;padding:12px 28px;display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:space-between}
  .brand{display:flex;align-items:center;gap:11px;min-width:0}
  .mark{width:22px;height:22px;flex:none;color:var(--clay)}
  .mark path{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round}
  .org{display:flex;flex-wrap:wrap;gap:6px 22px}
  .org .grp{display:flex;flex-direction:column;gap:2px}
  .org .role{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
  .org .who{font-size:12.5px;font-weight:600;color:var(--ink)}
  .right{display:flex;align-items:center;gap:14px}
  .stamp{font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--faint)}
  .langtoggle{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden;background:var(--inset);flex:none}
  .langtoggle button{font-family:var(--mono);font-size:11px;letter-spacing:.06em;padding:6px 13px;border:none;background:transparent;color:var(--muted);cursor:pointer;transition:.15s}
  .langtoggle button.on{background:var(--clay);color:#fdf6f1}

  /* hero */
  .hero{max-width:980px;margin:0 auto;padding:58px 28px 30px}
  .eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--clay);margin-bottom:22px}
  h1{font-size:clamp(28px,4.7vw,49px);line-height:1.12;font-weight:800;letter-spacing:-.018em;max-width:21ch;color:var(--ink)}
  h1 .em{color:var(--clay)}
  .ensub{font-family:var(--serif);font-style:italic;font-size:clamp(18px,2.5vw,26px);line-height:1.25;color:var(--muted);margin-top:13px}
  .lead{font-size:15px;color:var(--muted);max-width:64ch;margin-top:20px;line-height:1.65}
  .meta{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:22px;font-family:var(--mono);font-size:11.5px;letter-spacing:.03em;color:var(--ink)}
  .meta span{display:inline-flex;align-items:center;gap:7px}
  .meta svg{width:14px;height:14px;color:var(--clay);flex:none}
  .stats{display:flex;flex-wrap:wrap;margin-top:30px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .stat{padding:17px 26px 17px 0}
  .stat + .stat{border-left:1px solid var(--line);padding-left:26px}
  .stat b{display:block;font-size:25px;font-weight:800;letter-spacing:-.01em;color:var(--ink)}
  .stat span{font-family:var(--mono);font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:var(--faint)}
  .src{margin-top:11px;font-family:var(--mono);font-size:10px;letter-spacing:.04em;color:var(--faint)}

  /* media */
  .media{max-width:980px;margin:0 auto;padding:14px 28px 6px;display:grid;gap:12px}
  .heroimg{width:100%;border:1px solid var(--line);border-radius:12px;display:block}
  .gallery{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .gallery img{width:100%;height:100%;border:1px solid var(--line);border-radius:12px;display:block;object-fit:cover}

  /* form shell */
  .wrap{max-width:980px;margin:0 auto;padding:18px 28px 90px}
  .card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:32px 36px;margin-bottom:18px;box-shadow:0 1px 2px rgba(27,26,22,.03)}
  .chead{display:flex;align-items:baseline;gap:14px;padding-bottom:16px;margin-bottom:24px;border-bottom:1px solid var(--line)}
  .cnum{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.05em;color:var(--clay);flex:none}
  .ctitle{font-size:21px;font-weight:700;letter-spacing:-.01em;color:var(--ink)}
  .ctitle .req{color:var(--clay)}

  .grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 22px}
  .field{display:flex;flex-direction:column;gap:8px}
  .field.full{grid-column:1/-1}
  .flabel{font-size:13.5px;font-weight:600;color:var(--ink)}
  .flabel .req{color:var(--clay);margin-left:2px}
  input[type=text],input[type=email],input[type=tel],textarea{
    font-family:var(--sans);font-size:14.5px;color:var(--ink);background:var(--inset);
    border:1px solid var(--line);border-radius:8px;padding:12px 14px;width:100%;transition:.16s;outline:none}
  textarea{resize:vertical;min-height:92px;line-height:1.6}
  input::placeholder,textarea::placeholder{color:var(--faint)}
  input:focus,textarea:focus{border-color:var(--clay);background:#fff;box-shadow:0 0 0 3px rgba(189,90,48,.13)}
  .field.invalid input,.field.invalid textarea{border-color:var(--err);background:#faf0ec}
  .err{display:none;font-size:11.5px;color:var(--err);font-weight:600}
  .field.invalid .err{display:block}

  .ques{margin-bottom:26px}
  .ques:last-child{margin-bottom:0}
  .qlabel{font-size:13.5px;font-weight:600;color:var(--ink);margin-bottom:12px;display:flex;align-items:baseline;flex-wrap:wrap;gap:9px}
  .qlabel .tag{font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--clay);border:1px solid var(--clay-soft);background:var(--clay-soft);padding:2px 7px;border-radius:5px}
  .qlabel .req{color:var(--clay)}
  .opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(172px,1fr));gap:8px}
  .opts.sm{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}
  .opts.wide{grid-template-columns:repeat(auto-fill,minmax(238px,1fr))}
  .opt{position:relative;display:flex;align-items:center;gap:11px;cursor:pointer;user-select:none;background:var(--inset);border:1px solid var(--line);border-radius:9px;padding:12px 14px;transition:.14s;font-size:13.5px;color:var(--ink);line-height:1.3}
  .opt:hover{border-color:#cbbda4;background:#fff}
  .opt input{position:absolute;opacity:0;pointer-events:none}
  .opt .ind{width:16px;height:16px;flex:none;border:1.5px solid var(--faint);border-radius:4px;display:grid;place-items:center;transition:.14s;margin-top:1px}
  .opts.single .opt .ind{border-radius:50%}
  .opt .ind svg{width:10px;height:10px;color:#fff;opacity:0;transform:scale(.5);transition:.14s}
  .opt .t{font-weight:500}
  .opt:has(input:checked){border-color:var(--clay);background:var(--clay-soft)}
  .opt:has(input:checked) .ind{background:var(--clay);border-color:var(--clay)}
  .opt:has(input:checked) .ind svg{opacity:1;transform:scale(1)}
  .opt:has(input:checked) .t{color:var(--clay-2);font-weight:600}
  .opt:has(input:focus-visible){box-shadow:0 0 0 3px rgba(189,90,48,.2)}
  .hint{display:flex;gap:8px;margin-top:11px;font-size:12px;color:var(--muted);line-height:1.55}
  .hint svg{width:14px;height:14px;flex:none;color:var(--clay);margin-top:2px}

  /* role cards */
  .roles{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .role{position:relative;cursor:pointer;display:block;border:1px solid var(--line);border-radius:12px;padding:20px 20px 18px;background:var(--inset);transition:.15s}
  .role:hover{border-color:#cbbda4;background:#fff}
  .role input{position:absolute;opacity:0;pointer-events:none}
  .role .ind{position:absolute;top:18px;right:18px;width:20px;height:20px;border:1.5px solid var(--faint);border-radius:50%;display:grid;place-items:center;transition:.15s}
  .role .ind svg{width:11px;height:11px;color:#fff;opacity:0;transform:scale(.4);transition:.15s}
  .role .ic{width:26px;height:26px;color:var(--muted);margin-bottom:13px;display:block}
  .role .ic *{stroke:currentColor;stroke-width:1.5;fill:none;stroke-linecap:round;stroke-linejoin:round}
  .role .rt{font-size:15.5px;font-weight:700;letter-spacing:-.01em;color:var(--ink)}
  .role .re{font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);margin:4px 0 9px}
  .role .rd{font-size:12.5px;color:var(--muted);line-height:1.5}
  .role:has(input:checked){border-color:var(--clay);background:var(--clay-soft)}
  .role:has(input:checked) .ic,.role:has(input:checked) .rt{color:var(--clay-2)}
  .role:has(input:checked) .ind{background:var(--clay);border-color:var(--clay)}
  .role:has(input:checked) .ind svg{opacity:1;transform:scale(1)}
  .role:has(input:focus-visible){box-shadow:0 0 0 3px rgba(189,90,48,.2)}

  .roleblock[hidden]{display:none}
  .roleblock{animation:rise .35s cubic-bezier(.2,.7,.3,1) both}
  @keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
  .rbtag{display:inline-block;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--clay);margin-bottom:14px}
  .reveal{display:none}
  .reveal.show{display:block;animation:rise .25s both}

  /* hotel docs box + upload */
  .docbox{border:1px solid var(--clay-soft);background:#fbf4ee;border-radius:11px;padding:18px;margin-top:13px}
  .upload{display:flex;align-items:center;gap:13px;flex-wrap:wrap;background:var(--inset);border:1px dashed var(--clay);border-radius:9px;padding:13px 15px;cursor:pointer;transition:.15s}
  .upload:hover{background:#fff}
  .upload input{display:none}
  .upload .ubtn{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--clay);border:1px solid var(--clay);border-radius:6px;padding:8px 12px;white-space:nowrap}
  .upload .uname{font-size:12.5px;color:var(--muted)}
  .docbox .field{margin-top:13px}

  /* consent + submit */
  .consent{display:flex;gap:12px;align-items:flex-start;cursor:pointer;background:var(--inset);border:1px solid var(--line);border-radius:10px;padding:15px 17px;transition:.15s}
  .consent:has(input:checked){border-color:var(--clay);background:var(--clay-soft)}
  .consent.invalid{border-color:var(--err);background:#faf0ec}
  .consent input{position:absolute;opacity:0;pointer-events:none}
  .consent .ind{width:18px;height:18px;flex:none;border:1.5px solid var(--faint);border-radius:5px;display:grid;place-items:center;margin-top:1px;transition:.15s}
  .consent .ind svg{width:11px;height:11px;color:#fff;opacity:0;transform:scale(.5);transition:.15s}
  .consent:has(input:checked) .ind{background:var(--clay);border-color:var(--clay)}
  .consent:has(input:checked) .ind svg{opacity:1;transform:scale(1)}
  .consent span{font-size:13px;line-height:1.55;color:var(--ink)}

  .submitrow{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin-top:24px}
  .btn{font-family:var(--sans);font-size:14.5px;font-weight:600;letter-spacing:.01em;border:none;cursor:pointer;border-radius:9px;padding:14px 28px;transition:.16s;display:inline-flex;align-items:center;gap:9px}
  .btn svg{width:16px;height:16px}
  .btn-primary{background:var(--clay);color:#fdf6f1}
  .btn-primary:hover{background:var(--clay-2)}
  .note{font-family:var(--mono);font-size:11px;letter-spacing:.03em;color:var(--faint)}

  /* modal */
  .modal-overlay{position:fixed;inset:0;background:rgba(27,26,22,.55);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:grid;place-items:center;padding:24px;z-index:100;animation:fade .25s both}
  .modal-overlay[hidden]{display:none}
  @keyframes fade{from{opacity:0}to{opacity:1}}
  .modal{background:var(--surface);border:1px solid var(--line);border-radius:16px;max-width:560px;width:100%;max-height:88vh;overflow:auto;padding:36px 34px;box-shadow:0 30px 80px -30px rgba(27,26,22,.55);animation:pop .3s cubic-bezier(.2,.7,.3,1) both}
  @keyframes pop{from{transform:translateY(12px) scale(.98);opacity:0}to{transform:none;opacity:1}}
  .ck{width:50px;height:50px;border-radius:50%;background:var(--clay-soft);display:grid;place-items:center;margin-bottom:18px}
  .ck svg{width:26px;height:26px;color:var(--clay)}
  .modal h2{font-size:23px;font-weight:800;letter-spacing:-.015em;color:var(--ink)}
  .modal .msub{color:var(--muted);font-size:14px;margin-top:9px;line-height:1.6}
  .summary{margin:22px 0;border:1px solid var(--line);border-radius:11px;overflow:hidden}
  .srow{display:flex;gap:16px;padding:11px 16px;border-bottom:1px solid var(--line-2);font-size:13px}
  .srow:last-child{border-bottom:0}
  .srow:nth-child(odd){background:var(--inset)}
  .srow .k{flex:0 0 38%;color:var(--muted);font-weight:600}
  .srow .v{flex:1;color:var(--ink)}
  .hotelnote{display:none;gap:9px;background:var(--clay-soft);border:1px solid #e7cdbb;border-radius:10px;padding:14px 15px;margin-bottom:20px;font-size:12.5px;color:var(--clay-2);line-height:1.6}
  .hotelnote.show{display:flex}
  .hotelnote svg{width:15px;height:15px;flex:none;margin-top:2px}
  .cbtns{display:flex;flex-wrap:wrap;gap:12px}
  .btn-dark{background:var(--ink);color:var(--paper)}
  .btn-dark:hover{background:#000}
  .btn-line{background:transparent;color:var(--muted);border:1px solid var(--line)}
  .btn-line:hover{border-color:var(--clay);color:var(--clay)}

  /* footer */
  footer{background:var(--ink);color:#c9c3b6;padding:44px 28px 52px;margin-top:6px}
  footer .in{max-width:980px;margin:0 auto}
  footer .forg{display:flex;flex-wrap:wrap;gap:18px 40px;margin-bottom:22px}
  footer .grp{display:flex;flex-direction:column;gap:3px}
  footer .frole{font-family:var(--mono);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:#8a847a}
  footer .fwho{font-size:14px;font-weight:600;color:#efe9dd}
  footer .fline{font-size:12.5px;color:#928c81;line-height:1.75;max-width:74ch;border-top:1px solid rgba(255,255,255,.1);padding-top:20px}

  @media(max-width:680px){
    .grid,.roles{grid-template-columns:1fr}
    .gallery{grid-template-columns:1fr}
    .card{padding:24px 18px}
    .hero{padding:40px 20px 24px}
    .topbar .in,.hero,.wrap,footer .in,.media{padding-left:20px;padding-right:20px}
    .topbar .in{gap:10px 14px}
    .org,.stamp{display:none}
    h1{font-size:30px;max-width:none}
    .ensub{font-size:19px}
    .stat{padding:12px 14px 12px 0}
    .stat + .stat{padding-left:14px}
    .stat b{font-size:20px}
    .stat span{font-size:9.5px}
    input[type=text],input[type=email],input[type=tel],textarea{font-size:16px}
    .opts{grid-template-columns:1fr}
    .opts.sm{grid-template-columns:1fr 1fr}
    .opt{padding:13px 14px}
    .role{padding:17px 16px 15px}
    .modal{padding:28px 22px}
    .submitrow{gap:12px}
    .btn{width:100%;justify-content:center}
    .note{text-align:center;width:100%}
    .palette button{width:22px;height:22px}
    .palette{gap:9px}
    .srow{flex-direction:column;gap:3px}
    .srow .k{flex:none}
  }

/* === additive / mechanical enhancements (formal, restrained) === */
  .hero{position:relative;overflow:hidden}
  .hero>*{position:relative;z-index:2}
  .hero-grid{position:absolute;inset:0;z-index:0;pointer-events:none;
    background-image:linear-gradient(to right,rgba(27,26,22,.05) 1px,transparent 1px),linear-gradient(to bottom,rgba(27,26,22,.05) 1px,transparent 1px);
    background-size:32px 32px;
    -webkit-mask-image:linear-gradient(155deg,#000 28%,transparent 78%);mask-image:linear-gradient(155deg,#000 28%,transparent 78%)}
  .hero-layer{position:absolute;inset:0;z-index:0;pointer-events:none;
    background-image:repeating-linear-gradient(180deg,rgba(189,90,48,.06) 0 1.5px,transparent 1.5px 8px);
    -webkit-mask-image:radial-gradient(130% 78% at 88% 4%,#000,transparent 60%);mask-image:radial-gradient(130% 78% at 88% 4%,#000,transparent 60%)}
  .hero-iso{position:absolute;z-index:1;top:18px;right:-22px;width:340px;height:auto;pointer-events:none;opacity:.58}
  @media(max-width:880px){.hero-iso{display:none}}
  .hero-iso .edge{fill:none;stroke:rgba(27,26,22,.34);stroke-width:1.3;stroke-linejoin:round;vector-effect:non-scaling-stroke}
  .hero-iso .top{fill:rgba(189,90,48,.09);stroke:var(--clay);stroke-width:1.5;stroke-linejoin:round;vector-effect:non-scaling-stroke}
  .hero-iso .ll{stroke:var(--clay);stroke-width:1.1;vector-effect:non-scaling-stroke;opacity:0;animation:scanin .55s ease forwards}
  .hero-iso .axis{stroke:var(--clay);stroke-width:1.2;stroke-dasharray:3 4;vector-effect:non-scaling-stroke}
  .hero-iso .noz{fill:var(--clay)}
  .hero-iso .sh{fill:rgba(27,26,22,.05)}
  @keyframes scanin{to{opacity:1}}
  .htick{position:absolute;z-index:3;width:14px;height:14px;color:var(--faint);opacity:.5;pointer-events:none}
  .htick svg{width:100%;height:100%}
  .htick.tl{top:15px;left:15px}.htick.tr{top:15px;right:15px}.htick.bl{bottom:13px;left:15px}.htick.br{bottom:13px;right:15px}

  /* layer-deposition / scale band */
  .layerband{max-width:980px;margin:4px auto 0;height:13px;border-top:1px solid var(--line);
    background-image:repeating-linear-gradient(90deg,var(--line) 0 1px,transparent 1px 9px),repeating-linear-gradient(90deg,var(--clay) 0 1px,transparent 1px 45px)}
  @media(max-width:680px){.layerband{margin-left:20px;margin-right:20px}}

  /* section number → machined chip + accent tab */
  .chead{position:relative;align-items:center}
  .cnum{border:1px solid var(--clay);border-radius:6px;padding:5px 8px;line-height:1;align-self:center}
  .chead::after{content:"";position:absolute;left:0;bottom:-1px;width:42px;height:2px;background:var(--clay)}

  /* primary button depth */
  .btn-primary{box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 7px 16px -9px rgba(189,90,48,.55)}

  /* banner technical frame */
  .framewrap{position:relative}
  .framewrap .bk{position:absolute;width:18px;height:18px;border:2px solid var(--clay);z-index:2}
  .framewrap .bk.tl{top:-1px;left:-1px;border-right:0;border-bottom:0}
  .framewrap .bk.tr{top:-1px;right:-1px;border-left:0;border-bottom:0}
  .framewrap .bk.bl{bottom:-1px;left:-1px;border-right:0;border-top:0}
  .framewrap .bk.br{bottom:-1px;right:-1px;border-left:0;border-top:0}

  /* footer blueprint grid */
  footer{position:relative;overflow:hidden}
  footer .in{position:relative;z-index:2}
  .foot-grid{position:absolute;inset:0;z-index:0;pointer-events:none;
    background-image:linear-gradient(to right,rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(to bottom,rgba(255,255,255,.05) 1px,transparent 1px);
    background-size:30px 30px;-webkit-mask-image:linear-gradient(0deg,#000 35%,transparent 92%);mask-image:linear-gradient(0deg,#000 35%,transparent 92%)}
  .foot-grid::after{content:"";position:absolute;inset:0;
    background-image:repeating-linear-gradient(180deg,rgba(189,90,48,.07) 0 1px,transparent 1px 7px);
    -webkit-mask-image:radial-gradient(75% 120% at 10% 100%,#000,transparent 58%);mask-image:radial-gradient(75% 120% at 10% 100%,#000,transparent 58%)}
  /* ===== palette options — switch via data-theme on <html> ===== */
  html[data-theme="blueprint"]{
    --paper:#eef1f5; --surface:#fbfcfe; --inset:#eaeff5;
    --ink:#16202c; --ink-2:#1f2c3a; --muted:#566273; --faint:#93a0b0;
    --line:#d6dde7; --line-2:#e4e9f0;
    --clay:#266c8e; --clay-2:#1b5573; --clay-soft:#dceaf1; --err:#b1402a;
  }
  html[data-theme="graphite"]{
    --paper:#eceae5; --surface:#faf9f6; --inset:#e9e7e1;
    --ink:#1a1b1c; --ink-2:#26282a; --muted:#63635e; --faint:#9a9a93;
    --line:#dcd9d1; --line-2:#e7e4dc;
    --clay:#d2691e; --clay-2:#b3540f; --clay-soft:#f5e3d2; --err:#a83a26;
  }
  html[data-theme="pine"]{
    --paper:#eef1ea; --surface:#fbfcf8; --inset:#e9eee3;
    --ink:#172019; --ink-2:#222c24; --muted:#586259; --faint:#929d90;
    --line:#d7ded0; --line-2:#e4e9dc;
    --clay:#356a4f; --clay-2:#27543c; --clay-soft:#dde9e0; --err:#a8442b;
  }
  /* palette switcher */
  .palette{display:inline-flex;align-items:center;gap:7px}
  .palette button{width:18px;height:18px;border-radius:50%;border:1.5px solid rgba(0,0,0,.18);cursor:pointer;padding:0;transition:.15s}
  .palette button:hover{transform:scale(1.12)}
  .palette button.on{box-shadow:0 0 0 2px var(--surface),0 0 0 3.5px currentColor}
  .palette button[data-t="clay"]{background:#bd5a30;color:#bd5a30}
  .palette button[data-t="blueprint"]{background:#266c8e;color:#266c8e}
  .palette button[data-t="graphite"]{background:#d2691e;color:#d2691e}
  .palette button[data-t="pine"]{background:#356a4f;color:#356a4f}
