:root{
  --orange:#ff9c3f; --orange-d:#f07f13; --blue:#4aa8e8; --deep:#1c2b4a;
  --paper:#fff8ec; --ink:#3a2c1a;
}
*{margin:0;padding:0;box-sizing:border-box}
body{
  font-family:"PingFang SC","Microsoft YaHei",sans-serif; color:var(--ink);
  background:linear-gradient(180deg,#a8dff5 0%,#cdeaff 38%,#fff3d9 100%) fixed;
  min-height:100vh;
}
/* 云朵 */
.cloud{position:fixed;border-radius:50px;background:#fff;opacity:.85;z-index:0;
  animation:drift linear infinite}
.cloud::before,.cloud::after{content:"";position:absolute;background:#fff;border-radius:50%}
.cloud.c1{width:110px;height:34px;top:12%;left:-140px;animation-duration:70s}
.cloud.c1::before{width:44px;height:44px;top:-22px;left:16px}
.cloud.c1::after{width:32px;height:32px;top:-14px;left:56px}
.cloud.c2{width:80px;height:26px;top:34%;left:-100px;animation-duration:95s;animation-delay:-30s}
.cloud.c2::before{width:32px;height:32px;top:-16px;left:12px}
.cloud.c2::after{width:24px;height:24px;top:-10px;left:42px}
@keyframes drift{to{transform:translateX(115vw)}}

header{
  position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:18px;
  padding:10px 22px;background:linear-gradient(180deg,#2c3e63,#1c2b4a);
  box-shadow:0 2px 10px rgba(0,0,0,.3)}
.logo{font-size:24px;font-weight:800;color:#fff;text-decoration:none;letter-spacing:1px}
.logo em{color:var(--orange);font-style:normal}
nav{display:flex;gap:4px;flex-wrap:wrap;margin-left:auto}
nav a{color:#dbe7ff;text-decoration:none;padding:7px 13px;border-radius:8px;font-size:15px}
nav a:hover,nav a.active{background:rgba(255,156,63,.22);color:var(--orange)}
#nav-user{color:#8ff0b3}

main{position:relative;z-index:1;max-width:960px;margin:0 auto;padding:26px 16px 60px}
.card{
  background:var(--paper);border:3px solid #e8cfa5;border-radius:14px;
  box-shadow:0 4px 0 #d9b984,0 8px 18px rgba(120,80,20,.15);
  padding:26px;margin-bottom:22px}
h1.hero{font-size:44px;text-align:center;color:#fff;
  text-shadow:2px 2px 0 var(--orange-d),4px 4px 0 rgba(0,0,0,.18);margin:34px 0 6px}
.sub{text-align:center;color:#24507e;font-size:17px;margin-bottom:26px}
.btn{
  display:inline-block;background:linear-gradient(180deg,#ffb35c,var(--orange-d));
  color:#fff;border:0;border-radius:10px;padding:12px 30px;font-size:17px;font-weight:700;
  cursor:pointer;text-decoration:none;box-shadow:0 3px 0 #b35f08;transition:.12s}
.btn:hover{transform:translateY(-2px);box-shadow:0 5px 0 #b35f08}
.btn:active{transform:translateY(1px);box-shadow:0 1px 0 #b35f08}
.btn.blue{background:linear-gradient(180deg,#62b8f2,#2f86c9);box-shadow:0 3px 0 #1d5e94}
.btn.blue:hover{box-shadow:0 5px 0 #1d5e94}
.btn.sm{padding:8px 18px;font-size:14px}
.center{text-align:center}
.btn-row{margin-top:22px;margin-bottom:4px}
.dim{color:#888;font-size:13px}
.grid{display:grid;gap:16px}
.grid.c3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.feature h3{margin-bottom:8px;color:var(--orange-d)}
h2.title{font-size:24px;border-left:6px solid var(--orange);padding-left:10px;margin-bottom:16px}

form.auth{max-width:380px;margin:0 auto}
label{display:block;margin:14px 0 6px;font-weight:700}
input[type=text],input[type=password]{
  width:100%;padding:11px 13px;border:2px solid #d9c39a;border-radius:9px;font-size:16px;background:#fff}
input:focus{outline:none;border-color:var(--orange)}
.msg{margin:12px 0;padding:10px 14px;border-radius:9px;display:none}
.msg.err{display:block;background:#ffe2e2;color:#a02525;border:1px solid #f0a8a8}
.msg.ok{display:block;background:#ddf6e0;color:#1e7a35;border:1px solid #9adba6}

table.stat{width:100%;border-collapse:collapse}
table.stat td,table.stat th{padding:9px 12px;border-bottom:1px dashed #e0cba2;text-align:left}
.qr{width:210px;height:210px;border:3px dashed #d9c39a;border-radius:12px;
  display:flex;align-items:center;justify-content:center;color:#b9a074;font-size:14px;
  background:#fff;object-fit:cover}
.vote-item{display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px dashed #e0cba2}
.vote-item:last-child{border-bottom:0}
.vote-item .desc{flex:1}
footer{position:relative;z-index:1;text-align:center;color:#5a7699;font-size:13px;padding:18px}
.mush{font-size:40px}
.skill-icon{width:24px;height:24px;image-rendering:pixelated;vertical-align:middle;margin-right:6px}
/* 技改特色表: 职业/技能列收缩到内容宽度且不换行, 改动内容列吃掉剩余空间 */
table.tweak td:nth-child(1),table.tweak th:nth-child(1),
table.tweak td:nth-child(2),table.tweak th:nth-child(2){white-space:nowrap;width:1%}
table.tweak td:nth-child(2){min-width:96px}
.hidden{display:none}
.badge{display:inline-block;background:var(--orange);color:#fff;border-radius:20px;
  padding:2px 12px;font-size:13px;margin-left:8px}
