:root{--bg:#0c0f14;--panel:#151a22;--line:#2a3340;--text:#f1f4f7;--muted:#8995a7;--red:#d52525}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,"Malgun Gothic",sans-serif}.topbar{height:72px;background:#090b0f;border-bottom:1px solid #222933;display:flex;align-items:center;justify-content:space-between;padding:0 24px}.brand{display:flex;align-items:center;gap:11px;color:#fff;text-decoration:none}.brand img{width:46px;height:46px;border-radius:50%}.brand b,.brand small{display:block}.brand b{font-size:20px}.brand small{font-size:9px;color:#6f7b8b;letter-spacing:1.4px}.userbox{display:flex;gap:12px;font-size:12px}.userbox a{color:#8e9aaa}.nav{display:flex;background:#10141a;padding:0 24px;border-bottom:1px solid #252c36;overflow:auto}.nav a{padding:13px 17px;color:#8f9aab;text-decoration:none;border-bottom:3px solid transparent;font-size:13px;font-weight:700;white-space:nowrap}.nav a.active{color:#fff;border-color:var(--red)}.container{max-width:1280px;margin:auto;padding:24px}h1{margin:0 0 6px}h2{font-size:18px;margin:20px 0 10px}.muted{color:var(--muted);font-size:12px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px}.register-alert{display:flex;justify-content:space-between;align-items:center;gap:14px;background:linear-gradient(90deg,#5c1b1b,#231619);border:1px solid #793030;border-radius:12px;padding:14px 16px;margin-bottom:16px}.register-alert b,.register-alert span{display:block}.register-alert span{font-size:11px;color:#d9bebe;margin-top:4px}.register-alert a,.save,.searchbar button,.notice-write button,.auth button{background:linear-gradient(#df2929,#a81212);color:#fff;border:0;border-radius:8px;padding:10px 14px;text-decoration:none;font-weight:800;cursor:pointer}.hero{display:grid;grid-template-columns:1fr 260px;gap:14px}.hero>div{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:20px}.hero h1{font-size:30px}.hero p{color:var(--muted)}.total{background:linear-gradient(135deg,#821d1d,#c82a2a)!important}.total span{display:block}.total strong{font-size:46px}.total em{font-style:normal}.levels{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.levels>div{background:#171d25;border:1px solid var(--line);border-radius:12px;padding:16px}.levels span{display:block;color:#9aa5b5;font-size:11px}.levels strong{font-size:30px}.levels em{font-style:normal;color:#9aa5b5}.skills-board{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.skills-board section{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px}.skill-card{display:flex;align-items:center;gap:10px;background:#0f141a;border:1px solid #29323d;border-radius:10px;padding:10px;margin-top:8px}.skill-icon{width:42px;height:42px;border-radius:10px;background:#6b2730;display:grid;place-items:center;font-weight:900}.skill-card b,.skill-card strong{display:block}.skill-card strong{font-size:22px}.section-head{display:flex;justify-content:space-between;align-items:center}.section-head a{color:#aeb8c6}.notice-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px}.notice-cards a{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px;color:#fff;text-decoration:none}.notice-cards p{color:var(--muted);font-size:12px}.notice-cards small{position:absolute;right:12px;bottom:10px;color:#d69d5b}.important{background:#c32626;color:#fff;border-radius:5px;padding:3px 6px;font-size:9px;margin-right:5px}.auth{min-height:72vh;display:grid;place-items:center}.auth section{width:min(400px,100%);background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:28px;text-align:center}.auth img{width:72px;height:72px;border-radius:50%}.auth form{display:grid;gap:12px;text-align:left;margin:18px 0}.auth label,.form label,.searchbar label{font-size:11px;color:#8f9bab}.auth input,.form input,.form select,.form textarea,.searchbar input,.searchbar select,.notice-write input,.notice-write textarea{width:100%;margin-top:5px;background:#0e1319;border:1px solid #333d49;border-radius:8px;color:#fff;padding:10px}.alert{background:#441a1a;border:1px solid #7d3030;padding:9px;border-radius:8px}.success{background:#163829;border:1px solid #2a664a;padding:10px;border-radius:8px}.form-section{margin-bottom:22px}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.save{float:right}.searchbar{display:grid;grid-template-columns:1.2fr .8fr 1fr 1fr auto auto;gap:9px;align-items:end;background:var(--panel);border:1px solid var(--line);padding:14px;border-radius:12px}.searchbar a{color:#aeb8c6;text-decoration:none;padding:10px}.count{margin:12px 0;color:#9ba6b4}.member-list{display:grid;gap:8px}.member-list article{display:grid;grid-template-columns:180px 90px 1fr;gap:14px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:12px}.member-list article div:first-child b,.member-list article div:first-child span{display:block}.member-list article div:first-child span{font-size:11px;color:var(--muted)}.member-mini{display:flex;gap:8px}.member-mini span{background:#0f141a;border-radius:7px;padding:7px 9px;font-size:11px}.date-head{display:grid;grid-template-columns:46px 1fr 46px;align-items:center;text-align:center;margin-bottom:14px}.date-head>a{width:42px;height:42px;border-radius:11px;background:#171d25;border:1px solid var(--line);display:grid;place-items:center;color:#fff;text-decoration:none;font-size:28px}.date-head>a:last-child{justify-self:end}.date-head h1{font-size:24px}.date-head small{color:var(--muted)}.boss-wrap{overflow:auto;border:1px solid var(--line);border-radius:12px;max-height:72vh}.boss-table{border-collapse:separate;border-spacing:0;min-width:1200px;width:100%}.boss-table th{position:sticky;top:0;background:#202733;padding:9px;border-right:1px solid #35404e;border-bottom:1px solid #35404e;font-size:11px}.boss-table tr th:first-child{left:0;z-index:4}.boss-table td{padding:4px;border-right:1px solid #242d38;border-bottom:1px solid #242d38}.boss-table button{width:100%;min-height:66px;background:#151b23;color:#fff;border:1px solid #2b3541;border-radius:8px;text-align:left;padding:7px;cursor:pointer}.boss-table button.joined{background:linear-gradient(135deg,#6d1e1e,#291718);border-color:#ad3b3b}.boss-table button b,.boss-table button span,.boss-table button small{display:block}.boss-table button span{font-size:10px;color:#8f9bab}.boss-table button small{font-size:9px;margin-top:4px}.notice-write input,.notice-write textarea{margin-bottom:9px}.notice-write>div{display:flex;gap:12px;align-items:center}.board{border:1px solid var(--line);border-radius:12px;overflow:hidden}.board-head,.board>a{display:grid;grid-template-columns:1fr 100px 70px;gap:10px;padding:11px 14px}.board-head{background:#202733;color:#8f9bab;font-size:10px}.board>a{background:var(--panel);border-top:1px solid #252d38;color:#fff;text-decoration:none;font-size:12px}.board em,.board i{font-style:normal;font-size:9px;padding:3px 5px;border-radius:5px;margin-right:5px}.board em{background:#c42626}.board i{background:#4b5563}.board .ok{color:#64c793}.board .no{color:#e4a15a}.notice-detail>div{display:flex;justify-content:space-between}.notice-detail h1{display:inline}.notice-detail section{white-space:pre-wrap;line-height:1.8;margin-top:22px}.audit{display:grid;grid-template-columns:1fr 1fr;gap:12px}.audit p{display:flex;justify-content:space-between;border-bottom:1px solid #252d38;padding:8px 0;font-size:11px}.audit span{color:var(--muted)}.empty{padding:28px;text-align:center;color:var(--muted)}
@media(max-width:900px){.hero{grid-template-columns:1fr}.levels{grid-template-columns:repeat(3,1fr)}.skills-board{grid-template-columns:1fr}.grid{grid-template-columns:repeat(2,1fr)}.searchbar{grid-template-columns:1fr 1fr}.notice-cards{grid-template-columns:1fr}.audit{grid-template-columns:1fr}}@media(max-width:600px){.container{padding:14px}.topbar{padding:0 14px}.nav{padding:0 8px}.levels{grid-template-columns:repeat(2,1fr)}.grid{grid-template-columns:1fr}.searchbar{grid-template-columns:1fr}.member-list article{grid-template-columns:1fr 70px}.member-mini{display:none}.register-alert{flex-direction:column;align-items:flex-start}.board-head,.board>a{grid-template-columns:1fr 80px}.board-head span:last-child,.board>a span:last-child{display:none}}

/* v0.8 mobile dashboard compact */
@media(max-width:600px){
  .container{padding:10px}
  .hero{grid-template-columns:1fr 104px;gap:8px;margin-bottom:10px}
  .hero>div{padding:12px;border-radius:10px}
  .hero h1{font-size:20px;margin-bottom:2px}
  .hero p{display:none}
  .hero>div:first-child small{font-size:8px}
  .total{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}
  .total span{font-size:9px}
  .total strong{font-size:30px;line-height:1}
  .total em{font-size:10px}

  h2{font-size:14px;margin:12px 0 7px}

  .levels{
    display:flex;
    gap:7px;
    overflow-x:auto;
    padding-bottom:3px;
    scroll-snap-type:x proximity;
  }
  .levels>div{
    flex:0 0 86px;
    min-height:66px;
    padding:9px;
    border-radius:9px;
    scroll-snap-align:start;
  }
  .levels span{font-size:9px}
  .levels strong{font-size:22px;line-height:1.1}
  .levels em{font-size:9px}

  .skills-board{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:6px;
  }
  .skills-board section{
    padding:8px;
    border-radius:9px;
    min-width:0;
  }
  .skills-board h3{
    font-size:11px;
    margin:0 0 5px;
  }
  .skill-card{
    gap:6px;
    padding:6px;
    margin-top:5px;
    border-radius:7px;
  }
  .skill-icon{
    width:26px;height:26px;border-radius:6px;font-size:10px;
  }
  .skill-card b{font-size:9px}
  .skill-card strong{font-size:15px}

  .section-head{margin-top:4px}
  .section-head h2{margin:10px 0 6px}
  .section-head a{font-size:9px}

  .notice-cards{
    display:flex;
    gap:7px;
    overflow-x:auto;
    padding-bottom:3px;
  }
  .notice-cards a{
    flex:0 0 78%;
    padding:10px;
    min-height:76px;
  }
  .notice-cards b{font-size:11px}
  .notice-cards p{
    font-size:10px;
    line-height:1.35;
    margin:6px 0 14px;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }

  .register-alert{
    padding:10px 11px;
    margin-bottom:9px;
  }
  .register-alert b{font-size:11px}
  .register-alert span{display:none}
  .register-alert a{padding:7px 10px;font-size:10px}
}

/* v0.10 dashboard readability */
.dashboard-block h2,
.section-head h2{
  font-size:30px;
  line-height:1.15;
  margin-bottom:12px;
}

.levels>div>span{
  font-size:20px;
  font-weight:900;
  color:#eef3f8;
  letter-spacing:-.4px;
}

.skills-board>section>h3{
  font-size:22px;
  margin:0 0 10px;
}
.skill-card{
  width:100%;
}
.skill-card-button{
  appearance:none;
  color:inherit;
  text-align:left;
  font:inherit;
  cursor:pointer;
}
.skill-card-button:hover{
  border-color:#74404a;
  background:#171d25;
}
.skill-card b{
  font-size:20px;
  line-height:1.1;
}
.skill-card strong{
  font-size:22px;
  line-height:1.1;
  margin-top:3px;
}
.tap-hint{
  display:block;
  margin-top:4px;
  font-size:11px;
  color:#8795a8;
}
.section-head + .notice-cards b,
.notice-cards b{
  font-size:22px;
  line-height:1.25;
}

.skill-modal{
  display:none;
  position:fixed;
  inset:0;
  z-index:1000;
}
.skill-modal.open{display:block}
.skill-modal-backdrop{
  position:absolute; inset:0;
  background:rgba(0,0,0,.72);
  backdrop-filter:blur(2px);
}
.skill-modal-panel{
  position:absolute;
  left:50%; top:50%;
  transform:translate(-50%,-50%);
  width:min(460px,calc(100% - 28px));
  max-height:78vh;
  overflow:hidden;
  background:#151a22;
  border:1px solid #394453;
  border-radius:16px;
  box-shadow:0 24px 70px rgba(0,0,0,.55);
}
.skill-modal-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 18px 10px;
  border-bottom:1px solid #2a3340;
}
.skill-modal-head small{color:#8d99aa;font-size:11px}
.skill-modal-head h2{margin:3px 0 0;font-size:22px}
.skill-modal-close{
  width:36px;height:36px;border-radius:9px;
  border:1px solid #394453;background:#202731;color:#fff;
  font-size:25px;line-height:1;cursor:pointer;
}
.skill-modal-count{
  padding:10px 18px;
  color:#d7dee7;
  font-weight:900;
  font-size:13px;
  background:#11161c;
  border-bottom:1px solid #252d38;
}
.skill-modal-list{
  max-height:55vh;
  overflow:auto;
  padding:8px 14px 14px;
}
.skill-member-row{
  display:grid;
  grid-template-columns:30px 1fr;
  align-items:center;
  gap:8px;
  padding:10px 6px;
  border-bottom:1px solid #252d38;
}
.skill-member-row span{color:#738095;font-size:11px;text-align:center}
.skill-member-row b{font-size:14px}
.skill-modal-empty{
  color:#8693a5;
  text-align:center;
  padding:30px 10px;
  font-size:12px;
}
body.modal-open{overflow:hidden}

/* mobile: five level cards = 3 + 2 rows */
@media(max-width:600px){
  .levels{
    display:grid !important;
    grid-template-columns:repeat(3,1fr) !important;
    gap:7px !important;
    overflow:visible !important;
    padding-bottom:0 !important;
  }
  .levels>div{
    min-width:0 !important;
    min-height:78px !important;
    padding:10px 7px !important;
  }
  .levels>div:nth-child(4),
  .levels>div:nth-child(5){
    /* second row remains naturally 2 cards */
  }

  h2,
  .dashboard-block h2,
  .section-head h2{
    font-size:26px !important;
    line-height:1.1 !important;
    margin:18px 0 10px !important;
  }

  .levels>div>span{
    font-size:17px !important;
    line-height:1.15 !important;
  }
  .levels strong{
    font-size:25px !important;
    margin-top:4px;
    display:inline-block;
  }
  .levels em{font-size:12px !important}

  .skills-board{
    grid-template-columns:repeat(3,1fr) !important;
    gap:6px !important;
  }
  .skills-board section{
    padding:8px !important;
  }
  .skills-board>section>h3{
    font-size:19px !important;
    margin:0 0 7px !important;
  }
  .skill-card{
    padding:7px !important;
    gap:6px !important;
  }
  .skill-icon{
    width:30px !important;
    height:30px !important;
  }
  .skill-card b{
    font-size:17px !important;
  }
  .skill-card strong{
    font-size:16px !important;
  }
  .tap-hint{
    font-size:9px !important;
  }

  .notice-cards b{
    font-size:19px !important;
  }
  .notice-cards p{
    font-size:11px !important;
  }
}

/* v0.11 dashboard tone + layout */
body{
  background:
    radial-gradient(circle at 15% -10%,rgba(109,35,35,.16),transparent 34%),
    radial-gradient(circle at 100% 20%,rgba(40,58,78,.14),transparent 30%),
    #0d1015;
}
.topbar{background:linear-gradient(90deg,#0a0c10,#121821)}
.nav{background:linear-gradient(90deg,#11161d,#171d25)}
.panel,.skills-board section,.member-list article,.notice-cards a{
  background:linear-gradient(180deg,#171d26,#131820);
}
.top-notice-head{margin-top:0}
.important-top{margin-bottom:14px}
.important-top a{
  border-left:3px solid #a72f2f;
  background:linear-gradient(135deg,#23191b,#171d25);
}
.compact-hero{grid-template-columns:1fr 430px;margin-top:8px}
.activity-panel{
  display:grid;
  grid-template-columns:150px 1fr;
  gap:10px;
  background:linear-gradient(135deg,#171e28,#10151c)!important;
}
.activity-panel .total{
  min-height:118px;
  padding:14px;
  border-radius:12px;
}
.class-count-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.class-count-grid>div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:52px;
  padding:10px 12px;
  background:linear-gradient(135deg,#202a36,#151c24);
  border:1px solid #33404e;
  border-radius:10px;
}
.class-count-grid span{font-size:13px;color:#b8c2cf;font-weight:800}
.class-count-grid b{font-size:18px}
.major-title{font-size:30px!important}
.levels{
  display:grid!important;
  grid-template-columns:repeat(3,1fr)!important;
  gap:10px!important;
  overflow:visible!important;
}
.level-card-button{
  border:1px solid #344152;
  background:linear-gradient(135deg,#1f2b38,#141a22);
  color:#fff;
  border-radius:12px;
  padding:14px 15px;
  text-align:left;
  cursor:pointer;
}
.level-card-button:nth-child(1){background:linear-gradient(135deg,#5a2227,#1b1820)}
.level-card-button:nth-child(2){background:linear-gradient(135deg,#563323,#1b1a1e)}
.level-card-button:nth-child(3){background:linear-gradient(135deg,#454028,#191b1d)}
.level-card-button:nth-child(4){background:linear-gradient(135deg,#203d4d,#161b21)}
.level-card-button:nth-child(5){background:linear-gradient(135deg,#293645,#161b21)}
.level-card-button span{
  display:block;
  font-size:20px;
  font-weight:900;
}
.level-card-button strong{font-size:28px;margin-top:6px;display:inline-block}
.level-card-button em{font-style:normal;color:#aab5c3}
.level-card-button small{display:block;color:#8d99aa;font-size:10px;margin-top:5px}
.level-card-button:hover{border-color:#7b4a4a;transform:translateY(-1px)}
.news-list{display:grid;gap:10px}.news-item{background:linear-gradient(180deg,#171d26,#131820);border:1px solid #2e3845;border-radius:12px;padding:15px}.news-item>div{display:flex;justify-content:space-between;gap:10px}.news-item span{font-size:10px;color:#7e8a9a}.news-item p{color:#a8b2bf;font-size:12px;line-height:1.6}
@media(max-width:900px){
  .compact-hero{grid-template-columns:1fr}
}
@media(max-width:600px){
  .important-top{margin-bottom:10px}
  .compact-hero{grid-template-columns:1fr!important}
  .activity-panel{grid-template-columns:110px 1fr;gap:6px}
  .class-count-grid{grid-template-columns:1fr 1fr;gap:5px}
  .class-count-grid>div{min-height:44px;padding:7px}
  .class-count-grid span{font-size:11px}
  .class-count-grid b{font-size:14px}
  .levels{grid-template-columns:repeat(3,1fr)!important}
  .level-card-button{padding:10px 8px}
  .level-card-button span{font-size:17px!important}
  .major-title{font-size:26px!important}
}

/* v0.13 official skill icons */
.official-skill-icon{
  overflow:hidden;
  padding:0!important;
  background:#0b0e12!important;
  border:1px solid #465160;
}
.official-skill-icon img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  image-rendering:auto;
}

/* v0.13 boss mobile: font 1.5x, cell width ~60% of previous */
@media(max-width:600px){
  .boss-table{
    min-width:760px!important;
    table-layout:fixed;
  }
  .boss-table th{
    font-size:16px!important;
    padding:7px 3px!important;
    width:72px!important;
  }
  .boss-table tr th:first-child{
    width:56px!important;
    min-width:56px!important;
    max-width:56px!important;
  }
  .boss-table td{
    width:72px!important;
    min-width:72px!important;
    max-width:72px!important;
    padding:3px!important;
  }
  .boss-table button{
    min-height:60px!important;
    padding:5px!important;
  }
  .boss-table button b{
    font-size:16px!important;
    line-height:1.1!important;
  }
  .boss-table button span{
    font-size:14px!important;
    line-height:1.1!important;
  }
  .boss-table button small{
    font-size:12px!important;
    line-height:1.25!important;
  }
  .date-head h1{
    font-size:28px!important;
  }
  .date-head small{
    font-size:15px!important;
  }
}

/* v0.14 dashboard class labels larger */
.class-count-grid span{
  font-size:26px!important;
  font-weight:900!important;
  line-height:1.1!important;
}
@media(max-width:600px){
  .class-count-grid span{
    font-size:22px!important;
  }
}

/* v0.15 clan search compact UI */
.clan-page-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
.clan-page-head h1{
  margin:0;
}
.clan-page-head p{
  margin:5px 0 0;
  color:#8d99aa;
  font-size:12px;
}
.clan-result-count{
  color:#cbd3dd;
  font-size:13px;
  font-weight:900;
  background:#1a222c;
  border:1px solid #33404d;
  border-radius:9px;
  padding:8px 11px;
}

.clan-search-box{
  background:linear-gradient(180deg,#171e27,#131920);
  border:1px solid #303a47;
  border-radius:13px;
  padding:12px;
  margin-bottom:10px;
}
.clan-search-top{
  display:grid;
  grid-template-columns:2fr 1fr;
  gap:8px;
}
.clan-search-top input{
  width:100%;
  min-width:0;
  height:44px;
  padding:0 13px;
  color:#fff;
  background:#0e1319;
  border:1px solid #394451;
  border-radius:9px;
  font-size:14px;
}
.clan-search-top input:focus{
  outline:none;
  border-color:#7d3b3f;
  box-shadow:0 0 0 2px rgba(125,59,63,.14);
}
.clan-reset-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  height:44px;
  color:#d3dae3;
  text-decoration:none;
  background:#222a34;
  border:1px solid #3a4552;
  border-radius:9px;
  font-size:13px;
  font-weight:900;
}
.clan-search-modes{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:7px;
  margin-top:8px;
}
.clan-search-modes button{
  height:40px;
  border:1px solid #35404d;
  border-radius:8px;
  background:#1b222c;
  color:#aab5c3;
  font-size:13px;
  font-weight:900;
  cursor:pointer;
}
.clan-search-modes button:hover{
  background:#232c38;
  color:#fff;
}
.clan-search-modes button.active{
  color:#fff;
  border-color:#8c3d42;
  background:linear-gradient(180deg,#743035,#4b2025);
}

.active-search-info{
  display:flex;
  align-items:center;
  gap:7px;
  margin:9px 2px 10px;
  font-size:12px;
  color:#95a1b1;
}
.active-search-info span{
  padding:3px 7px;
  border-radius:5px;
  background:#27313d;
  color:#d8dee7;
}
.active-search-info b{
  color:#fff;
}
.active-search-info em{
  margin-left:auto;
  font-style:normal;
  color:#a8b3c0;
}

.clan-member-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
.clan-member-card{
  min-width:0;
  padding:12px 13px;
  background:linear-gradient(180deg,#171d25,#121820);
  border:1px solid #2f3946;
  border-radius:10px;
}
.clan-member-main{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.clan-member-main strong{
  display:block;
  font-size:15px;
}
.clan-member-main span{
  display:block;
  margin-top:3px;
  color:#8c98a8;
  font-size:11px;
}
.clan-member-level{
  color:#dce5ee;
  font-size:16px;
  font-weight:900;
}
.clan-member-summary{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
  margin-top:9px;
}
.clan-member-summary>div{
  min-width:0;
  padding:7px 8px;
  background:#10151b;
  border-radius:7px;
}
.clan-member-summary span{
  display:block;
  margin-bottom:3px;
  color:#758294;
  font-size:9px;
}
.clan-member-summary b{
  display:block;
  overflow:hidden;
  color:#cfd7e1;
  font-size:11px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.clan-empty{
  grid-column:1/-1;
}

@media(max-width:600px){
  .clan-page-head{
    margin-bottom:8px;
  }
  .clan-page-head p{
    font-size:10px;
  }
  .clan-result-count{
    padding:6px 8px;
    font-size:11px;
  }
  .clan-search-box{
    padding:9px;
  }
  .clan-search-top{
    grid-template-columns:2fr 1fr !important;
  }
  .clan-search-top input,
  .clan-reset-btn{
    height:42px;
  }
  .clan-search-modes{
    gap:5px;
    margin-top:6px;
  }
  .clan-search-modes button{
    height:38px;
    padding:0;
    font-size:13px;
  }
  .clan-member-grid{
    grid-template-columns:1fr 1fr;
    gap:6px;
  }
  .clan-member-card{
    padding:9px;
  }
  .clan-member-main strong{
    font-size:13px;
  }
  .clan-member-level{
    font-size:13px;
  }
  .clan-member-summary{
    grid-template-columns:1fr;
    gap:4px;
  }
}

/* v0.16 clan search flow */
.clan-search-modes.top-first{
  margin-top:0;
  margin-bottom:8px;
}
.clan-search-bottom{
  display:grid;
  grid-template-columns:2fr 1fr;
  gap:8px;
}
.search-control-wrap{
  min-width:0;
}
.search-control-wrap input,
.search-control-wrap select{
  width:100%;
  height:44px;
  padding:0 13px;
  color:#fff;
  background:#0e1319;
  border:1px solid #394451;
  border-radius:9px;
  font-size:14px;
}
.search-control-wrap select{
  appearance:auto;
}
.clan-submit-btn{
  height:44px;
  border:1px solid #8c3d42;
  border-radius:9px;
  background:linear-gradient(180deg,#82353a,#562329);
  color:#fff;
  font-size:14px;
  font-weight:900;
  cursor:pointer;
}
.clan-submit-btn:hover{
  background:linear-gradient(180deg,#914047,#63272e);
}

/* v0.16 boss table */
.boss-date-title h1{
  margin:0;
  font-size:26px;
  letter-spacing:.2px;
}
.boss-my-participation-title{
  margin:0 0 8px;
  font-size:16px;
  font-weight:900;
  color:#dbe2ea;
}
.boss-table th,
.boss-table td{
  text-align:center!important;
  vertical-align:middle!important;
}
.boss-table button{
  text-align:center!important;
}
.boss-participation-btn{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}
.boss-participation-btn b{
  font-size:14px;
}
.boss-participation-btn.not-joined{
  background:#151b23;
  border-color:#303946;
  color:#aeb8c5;
}
.boss-participation-btn.joined{
  background:linear-gradient(135deg,#7b2428,#33191b);
  border-color:#b74549;
  color:#fff;
}
.boss-participation-btn span{
  margin-top:4px;
  color:#8895a6!important;
}
.boss-help{
  text-align:center;
  margin-top:8px;
}

@media(max-width:600px){
  .clan-search-bottom{
    grid-template-columns:2fr 1fr!important;
  }
  .clan-search-modes.top-first button{
    font-size:14px;
  }

  .boss-date-title h1{
    font-size:24px!important;
  }
  .boss-table th,
  .boss-table td{
    text-align:center!important;
  }
  .boss-table th{
    font-size:16px!important;
  }
  .boss-participation-btn b{
    font-size:16px!important;
  }
  .boss-participation-btn span{
    font-size:12px!important;
  }
}

/* v0.18 class-based skill selector */
.profile-skill-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}
.profile-skill-head h2{margin:0}
.profile-skill-head p{
  margin:4px 0 0;
  color:#8390a1;
  font-size:11px;
}
.selected-skill-count{
  min-width:52px;
  padding:7px 9px;
  text-align:center;
  border:1px solid #3a4553;
  border-radius:8px;
  background:#10161d;
  color:#8997a8;
  font-size:11px;
}
.selected-skill-count b{
  color:#fff;
  font-size:17px;
}
.skill-selector{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  min-height:46px;
  padding:10px;
  border:1px solid #303a47;
  border-radius:10px;
  background:#0f141a;
}
.skill-choice{
  appearance:none;
  border:1px solid transparent;
  border-radius:10px;
  padding:8px 11px;
  color:#f7f9fb;
  font-size:12px;
  font-weight:900;
  cursor:pointer;
  opacity:.72;
  transition:.12s ease;
}
.skill-choice:hover{opacity:1;transform:translateY(-1px)}
.skill-choice.selected{
  opacity:1;
  border-color:rgba(255,255,255,.62);
  box-shadow:0 0 0 2px rgba(255,255,255,.08);
}
.skill-blue{background:#2f8dc1}
.skill-orange{background:#c97f4b}
.skill-purple{background:#654093}
.skill-yellow{background:#d8ad53;color:#2a2110}
.skill-red{background:#b91f1f}
.skill-deepblue{background:#1766a6}
.skill-ice{background:#9fc6cf;color:#193942}
.skill-lavender{background:#c4a7df;color:#432c54}
.skill-brown{background:#8c470f}
.skill-dark{background:#594322}
.skill-green{background:#16845d}
.skill-gold{background:#e0b858;color:#3a2a08}
.skill-lime{background:#a9d982;color:#214321}
.skill-teal{background:#176477}
.skill-pink{background:#eda49d;color:#6a211b}
.skill-violet{background:#70468e}

.selected-skill-box{
  display:grid;
  grid-template-columns:82px 1fr;
  gap:8px;
  align-items:start;
  margin-top:8px;
  padding:9px 10px;
  border-radius:9px;
  background:#141a21;
  border:1px solid #2d3744;
}
.selected-skill-box>span{
  padding-top:5px;
  color:#7f8c9d;
  font-size:10px;
}
.selected-skill-list{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
}
.selected-skill-tag{
  border:1px solid #3b4654;
  border-radius:7px;
  padding:5px 7px;
  background:#252f3b;
  color:#e8edf3;
  font-size:10px;
  cursor:pointer;
}
.no-skill-selected{
  color:#657284;
  font-size:11px;
  padding:5px 0;
}
.skill-empty-message{
  width:100%;
  padding:8px;
  text-align:center;
  color:#7e8b9c;
  font-size:11px;
}

@media(max-width:600px){
  .skill-selector{
    gap:6px;
    padding:8px;
  }
  .skill-choice{
    padding:8px 9px;
    font-size:11px;
  }
  .selected-skill-box{
    grid-template-columns:1fr;
    gap:4px;
  }
}

/* v0.19 extra wizard skill colors */
.skill-cyan{background:#2d9ea8}
.skill-orange2{background:#b86b2b}
.skill-blue2{background:#315fa8}
.skill-silver{background:#7d8794}

/* v0.20 equipment selector */
.equipment-section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  margin-bottom:10px;
}
.equipment-section-head h2{margin:0}
.equipment-section-head p{
  margin:4px 0 0;
  color:#8491a2;
  font-size:11px;
}
.weapon-select-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-bottom:10px;
}
.weapon-slot-card,.armor-slot-card{
  background:linear-gradient(180deg,#151c24,#10161d);
  border:1px solid #303b48;
  border-radius:10px;
  padding:10px;
}
.weapon-slot-title{
  color:#e1e7ee;
  font-size:12px;
  font-weight:900;
  margin-bottom:7px;
}
.weapon-control-row{
  display:grid;
  grid-template-columns:1fr 92px;
  gap:7px;
}
.weapon-control-row select,
.armor-control-row input,
.armor-control-row select{
  width:100%;
  height:40px;
  color:#fff;
  background:#0d1218;
  border:1px solid #394552;
  border-radius:8px;
  padding:0 9px;
}
.equipment-preview{
  margin-top:7px;
  padding:6px 8px;
  background:#1b242e;
  border-radius:7px;
  color:#b9c4d0;
  font-size:11px;
}
.armor-select-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
}
.armor-slot-card>span{
  display:block;
  margin-bottom:6px;
  color:#aab5c2;
  font-size:10px;
  font-weight:900;
}
.armor-control-row{
  display:grid;
  grid-template-columns:1fr 72px;
  gap:6px;
}

@media(max-width:700px){
  .weapon-select-grid{
    grid-template-columns:1fr;
  }
  .armor-select-grid{
    grid-template-columns:1fr 1fr;
  }
}
@media(max-width:450px){
  .armor-select-grid{
    grid-template-columns:1fr;
  }
}

/* v0.21 clan reset + sort */
.clan-search-bottom.with-reset{
  grid-template-columns:minmax(0,1fr) 190px;
}
.clan-search-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
}
.clan-reset-btn.compact{
  height:44px;
}
.clan-sort-row{
  display:flex;
  align-items:center;
  gap:6px;
  margin-top:9px;
  padding-top:9px;
  border-top:1px solid #29323e;
}
.clan-sort-row>span{
  margin-right:4px;
  color:#7f8c9d;
  font-size:10px;
}
.clan-sort-row button{
  height:32px;
  padding:0 11px;
  color:#aab5c3;
  background:#1a212a;
  border:1px solid #333e4b;
  border-radius:7px;
  font-size:11px;
  font-weight:800;
  cursor:pointer;
}
.clan-sort-row button.active{
  color:#fff;
  background:linear-gradient(180deg,#4b5765,#303945);
  border-color:#637181;
}

@media(max-width:600px){
  .clan-search-bottom.with-reset{
    grid-template-columns:minmax(0,1fr) 138px!important;
  }
  .clan-search-actions{
    gap:5px;
  }
  .clan-submit-btn,
  .clan-reset-btn.compact{
    padding:0 6px;
    font-size:12px;
  }
  .clan-sort-row{
    display:grid;
    grid-template-columns:auto repeat(3,1fr);
    gap:5px;
  }
  .clan-sort-row button{
    padding:0 5px;
    font-size:10px;
  }
}

/* v0.22 clan profile / all skills / boss sort */
.clan-sort-row{
  flex-wrap:wrap;
}
.clickable-member{
  cursor:pointer;
  transition:.12s ease;
}
.clickable-member:hover{
  border-color:#596777;
  transform:translateY(-1px);
}
.clan-name-wrap{
  display:flex;
  align-items:center;
  gap:9px;
}
.clan-avatar{
  width:38px;
  height:38px;
  border-radius:10px;
  object-fit:cover;
  flex:0 0 38px;
}
.clan-avatar.placeholder{
  display:grid;
  place-items:center;
  background:#2a3644;
  color:#fff;
  font-weight:900;
}
.clan-member-summary.expanded{
  grid-template-columns:1.5fr 1fr 1fr .7fr;
}
.skills-all{
  min-width:0;
}
.skill-chip-list{
  display:flex;
  flex-wrap:wrap;
  gap:4px;
}
.skill-chip-list i{
  font-style:normal;
  padding:3px 6px;
  border-radius:6px;
  background:#26303b;
  color:#dce4ec;
  font-size:9px;
}
.weapon-text{
  font-variant-numeric:tabular-nums;
}

.member-profile-modal{
  display:none;
  position:fixed;
  inset:0;
  z-index:1100;
}
.member-profile-modal.open{display:block}
.member-profile-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.72);
  backdrop-filter:blur(2px);
}
.member-profile-panel{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:min(720px,calc(100% - 24px));
  max-height:86vh;
  overflow:auto;
  background:#151b23;
  border:1px solid #3a4552;
  border-radius:16px;
  box-shadow:0 30px 80px rgba(0,0,0,.55);
}
.member-profile-close{
  position:sticky;
  top:10px;
  float:right;
  z-index:2;
  margin:10px 10px 0 0;
  width:36px;
  height:36px;
  border:1px solid #3d4856;
  border-radius:9px;
  background:#202731;
  color:#fff;
  font-size:24px;
  cursor:pointer;
}
.member-profile-content{
  padding:20px;
}
.profile-loading{
  padding:50px;
  text-align:center;
  color:#8794a5;
}
.profile-popup-head{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:16px;
}
.profile-popup-image{
  width:82px;
  height:82px;
  border-radius:16px;
  object-fit:cover;
}
.profile-popup-image.placeholder{
  display:grid;
  place-items:center;
  background:#283645;
  font-size:30px;
  font-weight:900;
}
.profile-popup-head h2{margin:0;font-size:26px}
.profile-popup-head p{margin:5px 0;color:#b0bbc8}
.profile-popup-head small{color:#788596}
.profile-popup-stats{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
  margin-bottom:16px;
}
.profile-popup-stats>div,
.profile-popup-equipment>div{
  background:#10161d;
  border:1px solid #2b3541;
  border-radius:9px;
  padding:9px;
}
.profile-popup-stats span,
.profile-popup-equipment span{
  display:block;
  color:#7e8b9c;
  font-size:9px;
}
.profile-popup-stats b,
.profile-popup-equipment b{
  display:block;
  margin-top:4px;
  color:#eef2f6;
}
.profile-popup section h3{font-size:14px;margin:14px 0 8px}
.profile-popup-skills{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.profile-popup-skills span{
  padding:6px 8px;
  background:#283440;
  border-radius:7px;
  font-size:11px;
}
.profile-popup-skills em{color:#738092;font-size:11px}
.profile-popup-equipment{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:7px;
}

.profile-photo-panel{
  display:grid;
  grid-template-columns:100px 1fr;
  gap:14px;
  align-items:center;
  margin-bottom:14px;
}
.profile-photo-current img,
.profile-photo-placeholder{
  width:92px;
  height:92px;
  border-radius:16px;
  object-fit:cover;
}
.profile-photo-placeholder{
  display:grid;
  place-items:center;
  background:#293645;
  font-size:30px;
  font-weight:900;
}
.profile-photo-form{
  display:grid;
  grid-template-columns:1fr auto;
  gap:8px 10px;
  align-items:center;
}
.profile-photo-form>div{grid-column:1/-1}
.profile-photo-form h2{margin:0}
.profile-photo-form p{margin:4px 0 0;color:#8390a1;font-size:10px}
.profile-photo-form input[type=file]{
  width:100%;
  color:#aeb8c5;
  font-size:11px;
}
.profile-photo-form button{
  border:1px solid #854049;
  border-radius:8px;
  background:linear-gradient(#743039,#522229);
  color:#fff;
  padding:9px 12px;
  font-weight:900;
  cursor:pointer;
}

@media(max-width:700px){
  .clan-member-summary.expanded{
    grid-template-columns:1fr 1fr;
  }
  .skills-all{
    grid-column:1/-1;
  }
  .profile-popup-stats{
    grid-template-columns:repeat(2,1fr);
  }
  .profile-popup-equipment{
    grid-template-columns:repeat(2,1fr);
  }
}
@media(max-width:500px){
  .profile-photo-panel{
    grid-template-columns:76px 1fr;
  }
  .profile-photo-current img,
  .profile-photo-placeholder{
    width:70px;
    height:70px;
  }
}

/* v0.23 armor enhancement only */
.armor-enhance-only .armor-slot-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.armor-enhance-only .armor-slot-card>span{
  margin:0;
  font-size:11px;
}
.armor-enhance-select{
  width:92px;
  height:40px;
  color:#fff;
  background:#0d1218;
  border:1px solid #394552;
  border-radius:8px;
  padding:0 8px;
}
@media(max-width:600px){
  .armor-enhance-only{grid-template-columns:repeat(2,1fr)!important}
}

/* v0.24 boss participation by code */
.boss-code-panel{
  margin:10px 0 14px;
  padding:12px;
  border:1px solid #35404d;
  border-radius:12px;
  background:linear-gradient(180deg,#171e27,#11171e);
}
.boss-code-title{
  display:flex;
  align-items:baseline;
  gap:9px;
  margin-bottom:9px;
}
.boss-code-title strong{
  color:#fff;
  font-size:16px;
}
.boss-code-title span{
  color:#7f8c9c;
  font-size:10px;
}
.boss-code-form{
  display:grid;
  grid-template-columns:minmax(0,1fr) 96px;
  gap:7px;
}
.boss-code-form input{
  height:44px;
  min-width:0;
  padding:0 12px;
  text-transform:uppercase;
  letter-spacing:2px;
  color:#fff;
  background:#0d1218;
  border:1px solid #3b4653;
  border-radius:8px;
  font-size:16px;
  font-weight:900;
  text-align:center;
}
.boss-code-form button{
  height:44px;
  border:1px solid #8d4047;
  border-radius:8px;
  background:linear-gradient(#81363e,#58242a);
  color:#fff;
  font-weight:900;
  cursor:pointer;
}
.boss-code-form button:disabled,
.boss-code-form input:disabled{
  opacity:.45;
  cursor:not-allowed;
}
.boss-code-result{
  margin-top:8px;
  padding:8px 10px;
  border-radius:7px;
  font-size:11px;
  font-weight:800;
  text-align:center;
}
.boss-code-result.ok{
  background:#153625;
  color:#91e0ad;
}
.boss-code-result.already{
  background:#3a3219;
  color:#e4ca7d;
}
.boss-code-result.bad{
  background:#3c1d22;
  color:#e89aa3;
}

.boss-status-cell{
  display:flex;
  min-height:52px;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  text-align:center;
}
.boss-status-cell>b{
  font-size:14px;
}
.boss-status-cell>b.joined{
  color:#fff;
}
.boss-status-cell>b.not-joined{
  color:#7e8a99;
}
.boss-status-cell>span{
  color:#7f8c9b;
  font-size:10px;
}
.boss-table td.joined-cell{
  background:linear-gradient(135deg,rgba(125,36,42,.55),rgba(46,23,25,.4));
}
.boss-admin-code{
  display:block;
  margin-top:2px;
  padding:2px 4px;
  border-radius:4px;
  background:#29333e;
  color:#e3c677;
  font-size:8px;
  letter-spacing:.5px;
}

@media(max-width:600px){
  .boss-code-title{
    display:block;
  }
  .boss-code-title span{
    display:block;
    margin-top:3px;
  }
  .boss-code-form{
    grid-template-columns:minmax(0,1fr) 78px;
  }
  .boss-status-cell>b{
    font-size:15px;
  }
}

/* v0.25 dashboard level/skill member modal */
.skill-modal-list{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:7px!important;
}
.skill-member-row{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  min-width:0;
  padding:8px!important;
  border:1px solid #303a46!important;
  border-radius:9px!important;
  background:#11171e!important;
}
.skill-member-avatar{
  width:34px;
  height:34px;
  flex:0 0 34px;
  object-fit:cover;
  border-radius:8px;
  background:#26323f;
}
.skill-member-avatar.placeholder{
  display:grid;
  place-items:center;
  color:#fff;
  font-size:13px;
  font-weight:900;
}
.skill-member-info{
  min-width:0;
}
.skill-member-info b{
  display:block;
  overflow:hidden;
  color:#eef2f6;
  font-size:12px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.skill-member-info span{
  display:block;
  margin-top:2px;
  color:#7f8c9d;
  font-size:9px;
}
.skill-modal-empty{
  grid-column:1/-1;
}

@media(max-width:600px){
  .skill-modal-list{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:5px!important;
  }
  .skill-member-row{
    gap:6px!important;
    padding:7px!important;
  }
  .skill-member-avatar{
    width:30px;
    height:30px;
    flex-basis:30px;
  }
  .skill-member-info b{
    font-size:11px;
  }
  .skill-member-info span{
    font-size:8px;
  }
}

/* v0.26 clan rank display */
.member-name-line,
.profile-name-line,
.skill-member-name-line{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
}
.clan-rank-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  padding:2px 5px;
  border:1px solid #4c5967;
  border-radius:5px;
  background:#252e38;
  color:#aeb9c6;
  font-size:8px;
  font-style:normal;
  font-weight:900;
  line-height:1.2;
}
.profile-name-line h2{
  margin:0;
}
.profile-rank{
  font-size:9px;
}
.skill-member-name-line b{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.skill-member-rank{
  flex:0 0 auto;
  padding:1px 4px;
  border-radius:4px;
  background:#27313b;
  color:#9eabb9;
  font-size:7px;
  font-style:normal;
  font-weight:900;
}

input[readonly]{
  opacity:.75;
  cursor:not-allowed;
}

/* v0.27 dashboard level/skill popup readability */
.skill-modal-panel{
  width:min(820px,calc(100% - 20px))!important;
}
.skill-modal-head h2{
  font-size:24px!important;
}
.skill-modal-head small{
  font-size:13px!important;
}
.skill-modal-count{
  font-size:14px!important;
}
.skill-modal-list{
  gap:10px!important;
}
.skill-member-row{
  gap:12px!important;
  padding:12px!important;
  min-height:68px;
}
.skill-member-avatar{
  width:50px!important;
  height:50px!important;
  flex-basis:50px!important;
  border-radius:10px!important;
}
.skill-member-avatar.placeholder{
  font-size:18px!important;
}
.skill-member-info b{
  font-size:18px!important;
  line-height:1.15!important;
}
.skill-member-info span{
  margin-top:5px!important;
  font-size:13px!important;
}
.skill-member-rank{
  padding:2px 6px!important;
  font-size:10px!important;
}
.skill-modal-empty{
  padding:24px!important;
  font-size:15px!important;
}

@media(max-width:600px){
  .skill-modal-panel{
    width:calc(100% - 12px)!important;
  }
  .skill-modal-list{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
  }
  .skill-member-row{
    gap:8px!important;
    padding:9px!important;
    min-height:60px;
  }
  .skill-member-avatar{
    width:42px!important;
    height:42px!important;
    flex-basis:42px!important;
  }
  .skill-member-avatar.placeholder{
    font-size:16px!important;
  }
  .skill-member-info b{
    font-size:15px!important;
  }
  .skill-member-info span{
    font-size:11px!important;
  }
  .skill-member-rank{
    font-size:9px!important;
  }
}

/* v0.28 profile class click member list */
.profile-class-link{
  appearance:none;
  border:0;
  padding:0;
  background:transparent;
  color:#d9e2ec;
  font:inherit;
  font-weight:900;
  text-decoration:underline;
  text-underline-offset:3px;
  cursor:pointer;
}

.class-member-modal{
  display:none;
  position:fixed;
  inset:0;
  z-index:1300;
}
.class-member-modal.open{
  display:block;
}
.class-member-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.75);
}
.class-member-panel{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:min(680px,calc(100% - 20px));
  max-height:80vh;
  overflow:auto;
  padding:16px;
  border:1px solid #3a4552;
  border-radius:15px;
  background:#151b23;
  box-shadow:0 30px 80px rgba(0,0,0,.55);
}
.class-member-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.class-member-head small{
  color:#8190a1;
  font-size:11px;
}
.class-member-head h2{
  margin:2px 0 0;
  font-size:24px;
}
.class-member-close{
  width:36px;
  height:36px;
  border:1px solid #3e4956;
  border-radius:9px;
  background:#222a34;
  color:#fff;
  font-size:23px;
  cursor:pointer;
}
.class-member-count{
  margin:10px 0;
  color:#98a5b5;
  font-size:13px;
}
.class-member-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
.class-member-row{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
  padding:10px;
  border:1px solid #303a46;
  border-radius:10px;
  background:#10161d;
}
.class-member-avatar{
  width:46px;
  height:46px;
  flex:0 0 46px;
  object-fit:cover;
  border-radius:10px;
}
.class-member-avatar.placeholder{
  display:grid;
  place-items:center;
  background:#273441;
  color:#fff;
  font-weight:900;
}
.class-member-info{
  min-width:0;
}
.class-member-name-line{
  display:flex;
  align-items:center;
  gap:5px;
  min-width:0;
}
.class-member-name-line b{
  overflow:hidden;
  color:#eef2f6;
  font-size:15px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.class-member-rank{
  flex:0 0 auto;
  padding:2px 5px;
  border-radius:5px;
  background:#27313b;
  color:#a7b2bf;
  font-size:8px;
  font-style:normal;
  font-weight:900;
}
.class-member-info>span{
  display:block;
  margin-top:3px;
  color:#8290a1;
  font-size:11px;
}
.class-member-empty{
  grid-column:1/-1;
  padding:24px;
  text-align:center;
  color:#7f8b9b;
}

@media(max-width:600px){
  .class-member-list{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
  }
  .class-member-row{
    gap:7px;
    padding:8px;
  }
  .class-member-avatar{
    width:38px;
    height:38px;
    flex-basis:38px;
  }
  .class-member-name-line b{
    font-size:13px;
  }
}

/* v0.29 dashboard class cards clickable */
.class-count-card{
  width:100%;
  min-width:0;
  border:0;
  padding:0;
  background:transparent;
  color:inherit;
  text-align:left;
  cursor:pointer;
  font:inherit;
}
.class-count-card:hover{
  filter:brightness(1.12);
}
.class-count-card span,
.class-count-card b{
  pointer-events:none;
}

/* v0.30 level/skill/class popup: another ~1.5x enlargement */
.skill-modal-panel{
  width:min(980px,calc(100% - 12px))!important;
}
.skill-modal-head h2{
  font-size:34px!important;
}
.skill-modal-head small{
  font-size:18px!important;
}
.skill-modal-count{
  font-size:20px!important;
}
.skill-member-row{
  gap:16px!important;
  padding:17px!important;
  min-height:96px!important;
}
.skill-member-avatar{
  width:72px!important;
  height:72px!important;
  flex-basis:72px!important;
  border-radius:14px!important;
}
.skill-member-avatar.placeholder{
  font-size:26px!important;
}
.skill-member-info b{
  font-size:25px!important;
}
.skill-member-info span{
  margin-top:7px!important;
  font-size:18px!important;
}
.skill-member-rank{
  padding:3px 8px!important;
  font-size:14px!important;
}
.skill-modal-empty{
  padding:34px!important;
  font-size:21px!important;
}

/* admin account page */
.admin-user-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
}
.admin-user-card{
  padding:12px;
  border:1px solid #303b48;
  border-radius:10px;
  background:linear-gradient(180deg,#171e26,#11171d);
}
.admin-user-main{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.admin-user-main strong{
  display:block;
  font-size:15px;
}
.admin-user-main span{
  display:block;
  margin-top:3px;
  color:#7f8c9c;
  font-size:10px;
}
.admin-role-badge{
  padding:4px 7px;
  border-radius:6px;
  background:#29333d;
  color:#c4ced8;
  font-size:9px;
  font-style:normal;
  font-weight:900;
}
.admin-role-badge.master{background:#57332a;color:#ffd6a3}
.admin-role-badge.admin{background:#3b3158;color:#d8c8ff}
.admin-role-form{
  display:grid;
  grid-template-columns:1fr 78px;
  gap:7px;
  margin-top:10px;
}
.admin-role-form select,
.admin-role-form button{
  height:38px;
  border-radius:8px;
}
.admin-role-form select{
  color:#fff;
  background:#0d1218;
  border:1px solid #394552;
  padding:0 8px;
}
.admin-role-form button{
  border:1px solid #784049;
  background:#5d2930;
  color:#fff;
  font-weight:900;
  cursor:pointer;
}

@media(max-width:600px){
  .skill-modal-panel{
    width:calc(100% - 6px)!important;
  }
  .skill-member-row{
    gap:10px!important;
    padding:12px!important;
    min-height:82px!important;
  }
  .skill-member-avatar{
    width:58px!important;
    height:58px!important;
    flex-basis:58px!important;
  }
  .skill-member-info b{
    font-size:20px!important;
  }
  .skill-member-info span{
    font-size:15px!important;
  }
  .skill-member-rank{
    font-size:12px!important;
  }
  .admin-user-list{
    grid-template-columns:1fr;
  }
}

/* v0.31 reduce dashboard popup sizing to 80% of v0.30 */
.skill-modal-panel{
  width:min(784px,calc(100% - 12px))!important;
}
.skill-modal-head h2{
  font-size:27px!important;
}
.skill-modal-head small{
  font-size:14px!important;
}
.skill-modal-count{
  font-size:16px!important;
}
.skill-member-row{
  gap:13px!important;
  padding:14px!important;
  min-height:77px!important;
}
.skill-member-avatar{
  width:58px!important;
  height:58px!important;
  flex-basis:58px!important;
  border-radius:11px!important;
}
.skill-member-avatar.placeholder{
  font-size:21px!important;
}
.skill-member-info b{
  font-size:20px!important;
}
.skill-member-info span{
  margin-top:6px!important;
  font-size:14px!important;
}
.skill-member-rank{
  padding:2px 6px!important;
  font-size:11px!important;
}
.skill-modal-empty{
  padding:27px!important;
  font-size:17px!important;
}

@media(max-width:600px){
  .skill-member-row{
    gap:8px!important;
    padding:10px!important;
    min-height:66px!important;
  }
  .skill-member-avatar{
    width:46px!important;
    height:46px!important;
    flex-basis:46px!important;
  }
  .skill-member-info b{
    font-size:16px!important;
  }
  .skill-member-info span{
    font-size:12px!important;
  }
  .skill-member-rank{
    font-size:10px!important;
  }
}

/* v0.32 mobile-safe responsive member lists */
.skill-modal-panel{
  width:min(820px,calc(100% - 12px))!important;
}
.skill-modal-list{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
.skill-member-row{
  min-width:0!important;
}
.skill-member-info{
  min-width:0!important;
  width:100%;
}
.skill-member-name-line{
  min-width:0!important;
  flex-wrap:wrap;
  row-gap:3px;
}
.skill-member-info b{
  min-width:0;
  max-width:100%;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  overflow-wrap:anywhere;
  word-break:keep-all;
  font-size:clamp(14px,2.2vw,20px)!important;
  line-height:1.15!important;
}
.skill-member-info span{
  white-space:normal!important;
  overflow-wrap:anywhere;
  font-size:clamp(10px,1.7vw,14px)!important;
}
.skill-member-rank{
  font-size:clamp(8px,1.3vw,11px)!important;
}
.skill-member-avatar{
  width:clamp(42px,7vw,58px)!important;
  height:clamp(42px,7vw,58px)!important;
  flex-basis:clamp(42px,7vw,58px)!important;
}

.class-member-list{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
.class-member-row{
  min-width:0;
}
.class-member-info,
.class-member-name-line{
  min-width:0;
}
.class-member-name-line{
  flex-wrap:wrap;
  row-gap:3px;
}
.class-member-name-line b{
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  overflow-wrap:anywhere;
  word-break:keep-all;
  font-size:clamp(12px,2vw,17px)!important;
}
.class-member-info>span{
  font-size:clamp(10px,1.6vw,13px)!important;
}
.class-member-rank{
  font-size:clamp(8px,1.2vw,10px)!important;
}

@media(max-width:520px){
  .skill-modal-panel,
  .class-member-panel{
    width:calc(100% - 6px)!important;
    padding:10px!important;
  }

  .skill-modal-list,
  .class-member-list{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:5px!important;
  }

  .skill-member-row,
  .class-member-row{
    gap:6px!important;
    padding:7px!important;
  }

  .skill-member-avatar,
  .class-member-avatar{
    width:38px!important;
    height:38px!important;
    flex-basis:38px!important;
    border-radius:8px!important;
  }

  .skill-member-info b{
    font-size:13px!important;
  }
  .skill-member-info span{
    font-size:10px!important;
  }
  .skill-member-rank{
    font-size:8px!important;
  }

  .class-member-name-line b{
    font-size:12px!important;
  }
  .class-member-info>span{
    font-size:10px!important;
  }
  .class-member-rank{
    font-size:8px!important;
  }
}

/* Very narrow phones: switch to 1 column instead of clipping */
@media(max-width:360px){
  .skill-modal-list,
  .class-member-list{
    grid-template-columns:1fr!important;
  }
}

/* v0.33 boss code issuance - codes never shown in the grid */
.boss-issue-panel{
  margin:0 0 14px;
  padding:12px;
  border:1px solid #35404d;
  border-radius:12px;
  background:linear-gradient(180deg,#171d25,#11171d);
}
.boss-issue-form{
  display:grid;
  grid-template-columns:110px minmax(0,1fr) 100px;
  gap:7px;
}
.boss-issue-form select,
.boss-issue-form button{
  height:42px;
  border-radius:8px;
}
.boss-issue-form select{
  min-width:0;
  padding:0 8px;
  color:#fff;
  background:#0d1218;
  border:1px solid #394552;
}
.boss-issue-form button{
  border:1px solid #78503b;
  background:linear-gradient(#725036,#503521);
  color:#fff;
  font-weight:900;
  cursor:pointer;
}
.issued-code-box{
  display:grid;
  grid-template-columns:1fr auto;
  gap:4px 10px;
  align-items:center;
  margin-top:9px;
  padding:10px 12px;
  border:1px solid #5c4e30;
  border-radius:9px;
  background:#262113;
}
.issued-code-box>span{
  color:#b8aa7b;
  font-size:11px;
}
.issued-code-box>strong{
  grid-row:1/3;
  grid-column:2;
  color:#ffe184;
  font-size:24px;
  letter-spacing:3px;
}
.issued-code-box>small{
  color:#877c5d;
  font-size:9px;
}

/* old admin grid-code element is intentionally hidden even if stale HTML exists */
.boss-admin-code{
  display:none!important;
}

@media(max-width:600px){
  .boss-issue-form{
    grid-template-columns:82px minmax(0,1fr) 84px;
    gap:5px;
  }
  .issued-code-box>strong{
    font-size:20px;
  }
}

/* v0.34 pending boss code / admin management */
.boss-code-result.pending{
  background:#24314a;
  color:#a9c6ff;
}
.boss-register-form{
  display:grid;
  grid-template-columns:150px 88px minmax(0,1fr) 90px;
  gap:7px;
}
.boss-register-form input,
.boss-register-form select,
.boss-register-form button{
  height:42px;
  min-width:0;
  border-radius:8px;
}
.boss-register-form input,
.boss-register-form select{
  padding:0 8px;
  color:#fff;
  background:#0d1218;
  border:1px solid #394552;
}
.boss-register-form button{
  border:1px solid #78503b;
  background:linear-gradient(#725036,#503521);
  color:#fff;
  font-weight:900;
}

.admin-section{
  margin-bottom:12px;
}
.admin-create-form{
  display:grid;
  grid-template-columns:1fr 1fr 120px;
  gap:8px;
}
.admin-create-form input,
.admin-create-form button,
.admin-server-form input,
.admin-server-form button{
  height:42px;
  border-radius:8px;
}
.admin-create-form input,
.admin-server-form input{
  padding:0 10px;
  color:#fff;
  background:#0d1218;
  border:1px solid #394552;
}
.admin-create-form button,
.admin-server-form button,
.admin-backup-form button{
  border:1px solid #784049;
  background:#5d2930;
  color:#fff;
  font-weight:900;
  border-radius:8px;
  cursor:pointer;
}
.admin-member-table-wrap{
  overflow:auto;
}
.admin-member-table{
  width:100%;
  border-collapse:collapse;
}
.admin-member-table th,
.admin-member-table td{
  padding:8px;
  border-bottom:1px solid #29333e;
  text-align:center;
  white-space:nowrap;
}
.admin-member-form{
  display:grid;
  grid-template-columns:110px 90px 72px;
  gap:6px;
}
.admin-member-form select,
.admin-member-form button{
  height:34px;
  border-radius:7px;
}
.admin-member-form select{
  color:#fff;
  background:#10161d;
  border:1px solid #394552;
}
.admin-member-form button{
  border:1px solid #4d5a68;
  background:#2b3540;
  color:#fff;
  font-weight:800;
}
.admin-server-form{
  display:grid;
  grid-template-columns:1fr 110px;
  gap:8px;
  margin-bottom:12px;
}
.admin-server-form label{
  display:grid;
  grid-template-columns:100px 1fr;
  align-items:center;
  gap:8px;
}
.admin-backup-form{
  display:grid;
  grid-template-columns:1fr 110px;
  gap:10px;
  align-items:center;
  padding:10px;
  border:1px solid #313c48;
  border-radius:9px;
  background:#10161d;
}
.admin-backup-form strong,
.admin-backup-form span{
  display:block;
}
.admin-backup-form span{
  margin-top:3px;
  color:#7f8c9d;
  font-size:10px;
}
.admin-backup-form button{
  height:40px;
}
.backup-list{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  align-items:center;
  margin-top:10px;
}
.backup-list>span{
  margin-right:5px;
  color:#8794a3;
  font-size:10px;
}
.backup-list code{
  padding:4px 6px;
  border-radius:5px;
  background:#202933;
  color:#b8c4d0;
  font-size:9px;
}

@media(max-width:700px){
  .boss-register-form{
    grid-template-columns:1fr 76px;
  }
  .boss-register-form select[name="boss_name"]{
    grid-column:1;
  }
  .boss-register-form button{
    grid-column:2;
  }

  .admin-create-form{
    grid-template-columns:1fr;
  }
  .admin-server-form{
    grid-template-columns:1fr;
  }
  .admin-server-form label{
    grid-template-columns:1fr;
  }
}

/* v0.36 visible administrator navigation */
.admin-nav-link{
  color:#ffd28a!important;
  font-weight:900!important;
}
.admin-nav-link.active{
  background:linear-gradient(180deg,#624021,#3b2918)!important;
  border-color:#7d5a30!important;
  color:#ffe7b3!important;
}
.top-role-badge{
  padding:3px 6px;
  border-radius:6px;
  background:#5a3a20;
  color:#ffdca1;
  font-size:9px;
  font-weight:900;
}

/* v0.37 multi-boss code registration */
.boss-register-form.multi-boss-form{
  display:grid;
  grid-template-columns:150px 88px minmax(0,1fr) 90px;
  gap:7px;
  align-items:start;
}
.boss-multi-select{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:5px;
}
.boss-multi-select label{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  min-height:42px;
  padding:5px 6px;
  border:1px solid #394552;
  border-radius:8px;
  background:#10161d;
  color:#aeb8c5;
  font-size:10px;
  font-weight:800;
  cursor:pointer;
}
.boss-multi-select label:has(input:checked){
  border-color:#8a4c39;
  background:#4a2e22;
  color:#fff;
}
.boss-multi-select input{
  width:auto!important;
  height:auto!important;
  accent-color:#9a5b3e;
}

@media(max-width:700px){
  .boss-register-form.multi-boss-form{
    grid-template-columns:1fr 82px;
  }
  .boss-multi-select{
    grid-column:1/-1;
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  .boss-register-form.multi-boss-form>button{
    grid-column:1/-1;
  }
}

/* v0.39 password management */
.password-force-notice{
  margin-bottom:12px;
  padding:12px;
  border:1px solid #7b5c28;
  border-radius:9px;
  background:#322917;
  color:#f1d78e;
  font-size:12px;
  font-weight:800;
}
.password-change-panel{
  max-width:560px;
}
.password-change-form{
  display:grid;
  gap:10px;
}
.password-change-form label{
  display:grid;
  gap:5px;
  color:#aab5c2;
  font-size:11px;
}
.password-change-form input{
  height:42px;
  padding:0 10px;
  color:#fff;
  background:#0d1218;
  border:1px solid #394552;
  border-radius:8px;
}
.password-change-form button{
  height:42px;
  border:1px solid #784049;
  border-radius:8px;
  background:#5d2930;
  color:#fff;
  font-weight:900;
  cursor:pointer;
}
.admin-reset-form{
  display:grid;
  grid-template-columns:minmax(0,1fr) 108px;
  gap:7px;
  margin-top:8px;
}
.admin-reset-form input,
.admin-reset-form button{
  height:38px;
  border-radius:8px;
}
.admin-reset-form input{
  min-width:0;
  padding:0 8px;
  color:#fff;
  background:#0d1218;
  border:1px solid #394552;
}
.admin-reset-form button{
  border:1px solid #66523c;
  background:#473825;
  color:#f3dfb5;
  font-size:10px;
  font-weight:900;
  cursor:pointer;
}

/* v0.40 character trait field */
.form input::placeholder{
  color:#687585;
  opacity:1;
}
.profile-popup-stats{
  grid-template-columns:repeat(auto-fit,minmax(110px,1fr))!important;
}

/* v0.41 stat field guides */
.field-guide{
  display:block;
  margin-top:2px;
  color:#6f7d8c;
  font-size:9px;
  font-weight:500;
}
.profile-popup-stats small{
  display:block;
  margin-top:2px;
  color:#6f7d8c;
  font-size:8px;
  font-weight:500;
}

/* v0.42 stat descriptions moved into gray input placeholders */
.form input::placeholder,
.profile-form input::placeholder,
input[name="stat_1"]::placeholder,
input[name="stat_2"]::placeholder,
input[name="stat_3"]::placeholder{
  color:#6f7d8c;
  opacity:1;
}

/* v0.43 dashboard active member emphasis */
.activity-panel .active-member-total>span{
  display:block;
  font-size:22px!important;   /* 기존 대비 약 2배 */
  font-weight:900;
  line-height:1.1;
}
.active-member-number{
  display:flex;
  align-items:baseline;
  gap:5px;
  margin-top:8px;
}
.active-member-number strong{
  font-size:46px!important;
  line-height:1;
}
.active-member-number em{
  font-style:normal;
  font-size:22px!important;   /* '명'도 약 2배 */
  font-weight:900;
  color:#fff;
  line-height:1;
}

@media(max-width:700px){
  .activity-panel .active-member-total>span{
    font-size:20px!important;
  }
  .active-member-number strong{
    font-size:42px!important;
  }
  .active-member-number em{
    font-size:20px!important;
  }
}

/* v0.44 dashboard class count spacing */
.class-count-button{
  display:flex!important;
  align-items:center;
  justify-content:flex-start!important;
  gap:16px!important;
}
.class-count-button span{
  flex:0 0 auto;
}
.class-count-button b{
  flex:0 0 auto;
  margin-left:4px;
}
@media(max-width:700px){
  .class-count-button{
    gap:12px!important;
  }
}

/* v0.45 member card class/join date on separate lines */
.member-class-line,
.member-joined-line{
  display:block!important;
}
.member-joined-line{
  margin-top:2px;
  color:#7f8b99!important;
  font-size:10px!important;
}

/* v0.46 password management moved into My Info */
.profile-password-shortcut{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:0 0 12px;
  padding:12px 14px;
  border:1px solid #34404d;
  border-radius:10px;
  background:#121820;
}
.profile-password-shortcut strong,
.profile-password-shortcut span{
  display:block;
}
.profile-password-shortcut strong{
  font-size:13px;
  color:#fff;
}
.profile-password-shortcut span{
  margin-top:3px;
  font-size:10px;
  color:#7f8b99;
}
.profile-password-shortcut a{
  flex:0 0 auto;
  padding:8px 12px;
  border:1px solid #5b4733;
  border-radius:8px;
  background:#3c2f21;
  color:#f2dbb6;
  text-decoration:none;
  font-size:11px;
  font-weight:900;
}

/* v0.47 approval/admin tabs/read-only monitoring */
.auth-message,
.signup-approval-note{
  width:min(400px,calc(100% - 24px));
  margin:10px auto;
  padding:10px 12px;
  border:1px solid #66542f;
  border-radius:9px;
  background:#2d2617;
  color:#e6cf91;
  font-size:11px;
  text-align:center;
}
.admin-mode-tabs{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:7px;
  margin-bottom:12px;
}
.admin-mode-tabs button{
  min-height:44px;
  border:1px solid #34404d;
  border-radius:9px;
  background:#151c24;
  color:#9ca9b8;
  font-weight:900;
  cursor:pointer;
}
.admin-mode-tabs button.active{
  border-color:#805036;
  background:#4a3020;
  color:#fff0d0;
}
.admin-tab-panel{display:none}
.admin-tab-panel.active{display:block}
.admin-account-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
.admin-account-card{
  min-width:0;
  padding:11px;
  border:1px solid #303b47;
  border-radius:10px;
  background:#10161d;
}
.admin-account-card.pending-account{
  border-color:#66542f;
  background:#211d14;
}
.admin-account-badges{
  display:flex;
  gap:5px;
  align-items:center;
  flex-wrap:wrap;
}
.approval-badge{
  padding:3px 6px;
  border-radius:6px;
  font-size:9px;
  font-style:normal;
  font-weight:900;
}
.approval-badge.pending{background:#604b22;color:#ffe09a}
.approval-badge.approved{background:#244d37;color:#aee6c2}
.approval-badge.viewer{background:#273d58;color:#b9d8ff}
.admin-account-primary-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
  margin-top:9px;
}
.admin-account-primary-actions form{margin:0}
.approve-btn,.delete-btn{
  width:100%;
  min-height:38px;
  border-radius:8px;
  font-weight:900;
  cursor:pointer;
}
.approve-btn{border:1px solid #3d6a50;background:#27513a;color:#d6ffe4}
.delete-btn{border:1px solid #6b3e43;background:#4d292e;color:#ffd9dd}
.admin-delete-account-form{margin-top:8px}
.viewer-account-note{
  margin-top:8px;
  padding:8px;
  border-radius:7px;
  background:#162336;
  color:#9dc3ee;
  font-size:10px;
}
.top-role-badge{
  white-space:nowrap;
}
@media(max-width:700px){
  .admin-account-list{grid-template-columns:1fr}
  .admin-mode-tabs button{font-size:11px}
}

/* v0.49 pending account approval notification */
.admin-nav-link{
  position:relative;
}
.approval-nav-badge,
.approval-tab-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:18px;
  height:18px;
  margin-left:5px;
  padding:0 5px;
  border-radius:999px;
  background:#d62f3a;
  color:#fff;
  font-size:10px;
  font-weight:900;
  line-height:1;
  vertical-align:middle;
}
.pending-approval-notice{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin:10px 0 12px;
  padding:10px 12px;
  border:1px solid #8d5b2f;
  border-radius:9px;
  background:#342416;
}
.pending-approval-notice strong{
  color:#ffd095;
  font-size:12px;
}
.pending-approval-notice span{
  color:#bda98d;
  font-size:10px;
}

/* v0.52 boss registered-code history */
.boss-code-history{
  margin:10px 0 14px;
  padding:11px;
  border:1px solid #34404d;
  border-radius:10px;
  background:#10161d;
}
.boss-code-history-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
  margin-bottom:8px;
}
.boss-code-history-head strong{
  font-size:13px;
  color:#fff;
}
.boss-code-history-head span{
  font-size:9px;
  color:#768391;
}
.boss-code-history-list{
  display:grid;
  gap:6px;
}
.boss-code-history-row{
  display:grid;
  grid-template-columns:62px minmax(0,1fr) 92px 110px;
  gap:7px;
  align-items:center;
  padding:8px 9px;
  border:1px solid #2c3641;
  border-radius:8px;
  background:#0d1218;
}
.boss-code-history-time{
  font-weight:900;
  color:#e6edf5;
}
.boss-code-history-bosses{
  display:flex;
  flex-wrap:wrap;
  gap:4px;
}
.boss-code-history-bosses span{
  padding:3px 6px;
  border-radius:6px;
  background:#26313d;
  color:#c7d0da;
  font-size:9px;
  font-weight:800;
}
.boss-code-history-row code{
  text-align:center;
  font-size:13px;
  font-weight:900;
  color:#ffd078;
  letter-spacing:1px;
}
.boss-code-history-row small{
  text-align:right;
  color:#7d8997;
  font-size:8px;
}
.boss-code-history-empty{
  padding:12px;
  text-align:center;
  color:#6f7b88;
  font-size:10px;
}

@media(max-width:700px){
  .boss-code-history-row{
    grid-template-columns:55px minmax(0,1fr) 80px;
  }
  .boss-code-history-row small{
    grid-column:2/4;
    text-align:left;
  }
}

/* v0.54 top user id link / profile class cleanup */
.user-id-link{
  color:inherit;
  text-decoration:none;
  font-weight:700;
  cursor:pointer;
}
.user-id-link:hover{
  text-decoration:underline;
}
.profile-class-text{
  color:inherit;
  text-decoration:none!important;
  border:0!important;
  background:none!important;
  cursor:default;
}

/* v0.55 dashboard member rows -> profile popup */
.dashboard-member-profile-trigger{
  width:100%;
  border:0;
  color:inherit;
  text-align:left;
  font:inherit;
  cursor:pointer;
}
.dashboard-member-profile-trigger:hover{
  filter:brightness(1.08);
}
.dashboard-member-profile-trigger:active{
  transform:translateY(1px);
}

.dashboard-profile-modal{
  position:fixed;
  inset:0;
  z-index:1300;
  display:none;
}
.dashboard-profile-modal.open{
  display:block;
}
.dashboard-profile-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.72);
}
.dashboard-profile-panel{
  position:relative;
  width:min(620px,calc(100% - 18px));
  max-height:88vh;
  overflow:auto;
  margin:6vh auto 0;
  padding:14px;
  border:1px solid #3b4653;
  border-radius:14px;
  background:#11171e;
  box-shadow:0 18px 60px rgba(0,0,0,.5);
}
.dashboard-profile-close{
  position:absolute;
  top:9px;
  right:10px;
  z-index:2;
  width:34px;
  height:34px;
  border:1px solid #46515d;
  border-radius:8px;
  background:#1d2630;
  color:#fff;
  font-size:22px;
  cursor:pointer;
}
.dashboard-profile-body{
  padding-top:4px;
}
.dashboard-profile-loading{
  padding:36px 12px;
  text-align:center;
  color:#8c98a6;
}

/* Fetched member_profile.html already carries .profile-popup layout */
.dashboard-profile-body .profile-popup{
  margin:0;
  padding:0;
  border:0;
  background:transparent;
}

@media(max-width:600px){
  .dashboard-profile-panel{
    width:calc(100% - 8px);
    margin-top:2vh;
    max-height:96vh;
    padding:10px;
  }
}