:root{
  --ink:#14161c;--ink2:#1d2029;--panel:#232733;
  --gold:#d2a659;--gold-dim:#96793f;--paper:#efe6d0;--grey:#7f8494;
  --wood:#4e9e63;--fire:#d4553e;--earth:#c99a3f;--metal:#c9ccd4;--water:#4a7fc1;
  --red:#c0392b;
}
*{margin:0;padding:0;box-sizing:border-box}
body{
  font-family:"Songti SC","STSong","Noto Serif SC","SimSun",serif;
  background:radial-gradient(ellipse 120% 60% at 50% -10%,#262b3a 0%,var(--ink) 60%),var(--ink);
  color:var(--paper);min-height:100vh;display:flex;flex-direction:column;align-items:center;
}
nav{
  width:100%;display:flex;justify-content:center;gap:6px;flex-wrap:wrap;
  padding:16px 12px;border-bottom:1px solid #262b38;background:rgba(20,22,28,.7);
  position:sticky;top:0;backdrop-filter:blur(6px);z-index:10;
}
nav a{
  color:var(--grey);text-decoration:none;font-size:14px;letter-spacing:.15em;
  padding:7px 14px;border-radius:3px;transition:all .2s;
}
nav a:hover{color:var(--gold)}
nav a.on{color:var(--gold);background:rgba(210,166,89,.1)}
nav .who{margin-left:8px;color:var(--gold-dim);font-size:13px;padding:7px 6px}
header{text-align:center;padding:40px 20px 8px}
.seal{display:inline-block;border:2px solid var(--gold);color:var(--gold);
  font-size:13px;letter-spacing:6px;text-indent:6px;padding:5px 12px 4px;margin-bottom:16px;border-radius:2px}
h1{font-size:clamp(30px,6.5vw,46px);letter-spacing:.24em;text-indent:.24em}
h1 b{color:var(--gold)}
.sub{margin-top:12px;color:var(--grey);font-size:14px;letter-spacing:.18em;line-height:1.9}
main{width:100%;max-width:640px;padding:24px 18px 50px}
.card{background:var(--panel);border:1px solid #2f3442;border-radius:6px;
  padding:26px 22px;margin-bottom:22px;box-shadow:0 14px 34px rgba(0,0,0,.4)}
.card h2{font-size:19px;color:var(--gold);letter-spacing:.18em;margin-bottom:18px;
  display:flex;align-items:center;gap:10px}
.card h2::before{content:"";width:5px;height:20px;background:var(--gold);border-radius:2px}
.form-row{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}
.form-row label{font-size:14px;color:var(--grey);letter-spacing:.1em}
select,input{
  font-family:inherit;font-size:16px;color:var(--paper);
  background:var(--ink2);border:1px solid #3a3f4e;border-radius:4px;
  padding:11px 12px;width:100%;
}
select:focus,input:focus{outline:2px solid var(--gold-dim);border-color:var(--gold-dim)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.btn{
  font-family:inherit;display:block;width:100%;
  font-size:17px;letter-spacing:.3em;text-indent:.3em;
  color:#1c1611;background:linear-gradient(180deg,#e4bd75,var(--gold));
  border:none;border-radius:4px;padding:14px;cursor:pointer;margin-top:6px;
  transition:filter .25s;
}
.btn:hover{filter:brightness(1.08)}
.btn:disabled{filter:grayscale(.6);cursor:not-allowed}
.btn.ghost{background:transparent;color:var(--gold);border:1px solid var(--gold-dim);letter-spacing:.2em}
.note{font-size:12px;color:var(--grey);line-height:1.9;margin-top:14px}
.msg{font-size:14px;color:var(--fire);min-height:1.6em;margin-top:10px;text-align:center}
.msg.ok{color:var(--wood)}
table{width:100%;border-collapse:collapse;font-size:14px;margin:6px 0 14px}
th,td{border:1px solid #333949;padding:9px 10px;text-align:center;line-height:1.7}
th{background:var(--ink2);color:var(--gold);font-weight:700;letter-spacing:.1em}
td{color:#d8cfbb}
td.good{color:var(--gold)}
.e-wood{color:var(--wood)}.e-fire{color:var(--fire)}.e-earth{color:var(--earth)}
.e-metal{color:var(--metal)}.e-water{color:var(--water)}
.modal-mask{position:fixed;inset:0;background:rgba(0,0,0,.65);display:none;
  align-items:center;justify-content:center;z-index:20;padding:20px}
.modal-mask.show{display:flex}
.modal{background:var(--panel);border:1px solid var(--gold-dim);border-radius:8px;
  max-width:360px;width:100%;padding:28px 24px;text-align:center}
.modal h3{color:var(--gold);letter-spacing:.2em;margin-bottom:14px;font-size:18px}
.modal p{font-size:14px;color:#cfc6b2;line-height:1.9;margin-bottom:18px}
footer{color:#565b69;font-size:12px;letter-spacing:.12em;padding:0 24px 36px;
  text-align:center;line-height:2;max-width:640px}
@media(max-width:460px){.row2{grid-template-columns:1fr}}
