/* ACERWIKI Codex Theme
   Shared final layer for the official strategy wiki/editor look. */

:root{
  --codex-bg:#E4DCCB;
  --codex-bg-deep:#D3C6AD;
  --codex-panel:#EEE7D8;
  --codex-panel-soft:#F8F4EC;
  --codex-panel-dark:#342A22;
  --codex-line:#C4B79E;
  --codex-line-soft:#D8D0C2;
  --codex-ink:#26231F;
  --codex-muted:#6B6258;
  --codex-gold:#8B6B42;
  --codex-gold-soft:#D5C4A1;
  --codex-red:#8B4D3F;
  --codex-green:#64764E;
  --codex-shadow:0 12px 32px rgba(54,40,27,.14);
  --codex-shadow-soft:0 4px 20px rgba(0,0,0,.06);
}

html,
body{
  min-height:100%;
}

body{
  margin:0;
  background:
    radial-gradient(circle at 50% -140px, rgba(139,107,66,.28), transparent 390px),
    linear-gradient(180deg, rgba(44,38,32,.12), rgba(44,38,32,.035)),
    var(--codex-bg) !important;
  background-attachment:fixed;
  color:var(--codex-ink);
  font-family:system-ui, "Noto Sans KR", sans-serif;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    repeating-linear-gradient(0deg, rgba(64,49,35,.024) 0 1px, transparent 1px 9px),
    repeating-linear-gradient(90deg, rgba(64,49,35,.018) 0 1px, transparent 1px 11px);
  mix-blend-mode:multiply;
}

header,
.page-header,
.site-header{
  position:relative;
  max-width:1200px;
  min-height:150px;
  margin:0 auto;
  padding:28px 24px 14px;
  box-sizing:border-box;
  text-align:center;
}

.logo{
  margin:0;
  display:flex;
  justify-content:center;
}

.logo img{
  height:136px !important;
  max-width:min(420px, 80vw);
  object-fit:contain;
  filter:drop-shadow(0 10px 14px rgba(38,31,24,.18)) !important;
}

.top-right{
  position:absolute;
  top:28px;
  right:24px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:5px !important;
  border:1px solid var(--codex-line) !important;
  border-radius:999px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,.18)),
    rgba(248,244,236,.9) !important;
  box-shadow:0 8px 24px rgba(54,40,27,.1) !important;
  backdrop-filter:blur(6px);
}

.user-label{
  max-width:180px;
  overflow:hidden;
  color:var(--codex-ink) !important;
  font-size:14px;
  font-weight:700;
  text-overflow:ellipsis;
  white-space:nowrap;
}

button,
.top-right button,
.rw-btn,
.talent-add-btn,
.admin-secondary,
.danger-btn,
.talent-del-btn{
  min-height:38px;
  border:1px solid rgba(139,107,66,.28) !important;
  border-radius:999px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.2)),
    var(--codex-panel-soft) !important;
  box-shadow:none !important;
  color:var(--codex-ink) !important;
  font-size:14px;
  font-weight:700;
  letter-spacing:0;
}

button:hover,
.top-right button:hover,
.rw-btn:hover,
.talent-add-btn:hover,
.admin-secondary:hover{
  background:#E9DDC8 !important;
  transform:none !important;
}

.danger-btn,
.talent-del-btn{
  border-color:#A46A5A !important;
  background:rgba(139,77,63,.1) !important;
  color:#6B3029 !important;
}

.back,
.banner-back{
  position:absolute;
  top:36px;
  left:24px;
  width:44px;
  height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(139,107,66,.26) !important;
  border-radius:14px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.68), rgba(255,255,255,.2)),
    rgba(248,244,236,.9) !important;
  box-shadow:0 8px 24px rgba(54,40,27,.1) !important;
  color:var(--codex-ink) !important;
  text-decoration:none;
  font-size:0 !important;
}

.back::before,
.banner-back::before{
  content:"<";
  font-size:18px;
  font-weight:900;
}

main,
.page-main,
.stack,
.home-main{
  width:min(1200px, calc(100% - 48px));
  margin:0 auto;
  padding:18px 0 72px !important;
  box-sizing:border-box;
}

.stack{
  display:flex;
  flex-direction:column;
  align-items:stretch !important;
  gap:36px !important;
}

.page-content{
  width:100% !important;
  max-width:1200px !important;
}

.page-title{
  margin:0 0 34px !important;
  color:var(--codex-ink) !important;
  font-family:Georgia, "Times New Roman", "Noto Serif KR", serif;
  font-size:34px !important;
  line-height:1.2;
  font-weight:800 !important;
  text-align:left !important;
  letter-spacing:0;
}

.page-title::after{
  content:"";
  display:block;
  width:84px;
  height:2px;
  margin-top:14px;
  background:linear-gradient(90deg, var(--codex-gold), transparent);
}

.card,
.wide,
.admin-card,
.sheet-section,
.weapon-view-card,
.pv-card,
.pa-card,
.hero-main,
#talentWrap,
.rw-field,
.rw-card2,
.rw-modal,
.rw-page,
.admin-panel,
.signup .box{
  box-sizing:border-box;
  background:
    linear-gradient(180deg, rgba(255,255,255,.48), rgba(255,255,255,.14)),
    var(--codex-panel) !important;
  border:1px solid var(--codex-line) !important;
  border-radius:16px !important;
  box-shadow:var(--codex-shadow) !important;
  color:var(--codex-ink) !important;
}

.wide{
  width:100% !important;
  max-width:1200px !important;
  height:auto !important;
  padding:28px 32px !important;
}

.form-stack{
  display:grid !important;
  gap:24px !important;
}

.form-title,
.hero-subtitle,
.weapon-subtitle,
.weapon-stat-title,
.pa-section-title,
.pv-section-title,
.section-title,
.weapon-usedby-title,
.admin-title{
  margin:0 0 16px !important;
  color:var(--codex-ink) !important;
  font-family:Georgia, "Times New Roman", "Noto Serif KR", serif;
  font-size:20px !important;
  font-weight:700 !important;
  line-height:1.35;
}

.form-title::before,
.hero-subtitle::before,
.weapon-subtitle::before,
.weapon-stat-title::before,
.pa-section-title::before,
.pv-section-title::before,
.section-title::before,
.weapon-usedby-title::before{
  content:"";
  display:inline-block;
  width:8px;
  height:8px;
  margin-right:10px;
  border:1px solid var(--codex-gold);
  background:var(--codex-gold-soft);
  transform:rotate(45deg) translateY(-2px);
}

.muted,
.viewer-text,
.pa-hint,
.weapon-stat-note,
.pv-sub,
.hero-picked-empty{
  color:var(--codex-muted) !important;
  opacity:1 !important;
  font-size:14px;
  line-height:1.65;
}

input,
select,
textarea{
  box-sizing:border-box;
  width:100%;
  border:1px solid var(--codex-line) !important;
  border-radius:10px !important;
  background:var(--codex-panel-soft) !important;
  box-shadow:none !important;
  color:var(--codex-ink) !important;
  font:inherit;
  font-size:16px !important;
  font-weight:400 !important;
  line-height:1.5;
  outline:none;
  transition:border-color .14s ease, box-shadow .14s ease, background .14s ease;
}

input,
select{
  min-height:48px;
  padding:0 14px !important;
}

textarea{
  min-height:180px;
  padding:14px 16px !important;
  resize:vertical;
}

input:focus,
select:focus,
textarea:focus{
  border-color:var(--codex-gold) !important;
  background:#FFFDF8 !important;
  box-shadow:0 0 0 3px rgba(139,107,66,.14) !important;
}

label,
.stat-label,
.pa-label,
.difficulty-label,
.weapon-stat-range .field span,
.weapon-stat-type label{
  color:#4C4640 !important;
  font-size:14px;
  font-weight:700 !important;
  line-height:1.5;
}

.img-grid,
.hero-palette,
.weapon-palette,
.pa-grid{
  display:grid !important;
  grid-template-columns:repeat(auto-fill, minmax(80px, 80px));
  gap:16px !important;
  align-items:start;
  max-height:none !important;
  margin:0 0 16px !important;
  padding:0 !important;
  overflow:visible !important;
  border:0 !important;
  background:transparent !important;
}

.img-item,
.hero-item,
.weapon-item,
.pa-item,
.troop-chip,
.weapon-picked,
.hero-picked,
.pa-selected-thumb,
.weapon-view-icon,
.pv-thumb,
.troop-icon,
.hero-portrait{
  box-sizing:border-box;
  border:1px solid var(--codex-line) !important;
  border-radius:12px !important;
  background:var(--codex-panel-soft) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65) !important;
}

.img-item,
.hero-item,
.weapon-item,
.pa-item{
  position:relative;
  width:80px !important;
  height:80px !important;
  padding:8px !important;
  cursor:pointer;
  transition:transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.img-item:hover,
.hero-item:hover,
.weapon-item:hover,
.pa-item:hover,
.troop-chip:hover{
  transform:scale(1.05);
  border-color:var(--codex-gold) !important;
  box-shadow:0 10px 20px rgba(59,43,29,.14), inset 0 1px 0 rgba(255,255,255,.65) !important;
}

.img-item img,
.hero-item img,
.weapon-item img,
.pa-item img{
  width:64px !important;
  height:64px !important;
  object-fit:contain;
  image-rendering:pixelated;
}

.img-item.selected,
.hero-item.is-selected,
.weapon-item.is-selected,
.pa-item.selected,
.troop-chip.is-selected{
  border:2px solid var(--codex-gold) !important;
  outline:0 !important;
  background:#EFE3CF !important;
  box-shadow:0 0 0 3px rgba(139,107,66,.14) !important;
}

.weapon-item.is-selected{
  transform:scale(1.05);
}

.img-item.used,
.hero-item.is-used,
.weapon-item.is-used{
  opacity:1 !important;
  cursor:not-allowed !important;
  background:#E4DBCB !important;
}

.img-item.used img,
.hero-item.is-used img,
.weapon-item.is-used img{
  filter:grayscale(1);
  opacity:.42;
}

.img-item.used::after,
.hero-badge,
.weapon-badge{
  content:"used";
  position:absolute;
  right:5px;
  bottom:5px;
  padding:2px 6px;
  border:0;
  border-radius:999px;
  background:var(--codex-panel-dark);
  color:#F8F6F1;
  font-size:10px;
  font-weight:700;
  line-height:1.4;
}

.stat-grid,
.weapon-stat-range{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:20px 24px !important;
}

.stat-item,
.weapon-stat-range .field,
.admin-text-field{
  display:grid !important;
  gap:8px !important;
}

.stat-row{
  gap:10px !important;
}

.stat-table{
  width:100%;
  margin:0 !important;
  overflow:hidden;
  border:1px solid var(--codex-line) !important;
  border-radius:14px;
  border-collapse:separate !important;
  border-spacing:0 !important;
  background:var(--codex-panel-soft);
}

.stat-table th{
  position:sticky;
  top:0;
  z-index:1;
  height:48px;
  border:0 !important;
  border-bottom:1px solid var(--codex-line) !important;
  background:#D8CCB5;
  color:#332C25;
  font-size:14px;
  font-weight:700;
}

.stat-table td{
  height:64px;
  padding:8px 12px !important;
  border:0 !important;
  border-bottom:1px solid #E2D8C7 !important;
  text-align:center;
}

.stat-table tr:hover td{
  background:#E9DDC8;
}

.stat-table input{
  max-width:160px;
  margin:0 auto;
  text-align:center;
}

.difficulty-wrap{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  align-items:start;
  gap:24px !important;
}

.difficulty-buttons{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:8px !important;
  height:52px;
  padding:5px !important;
  border:1px solid var(--codex-line) !important;
  border-radius:14px !important;
  background:rgba(248,244,236,.74) !important;
}

.diff-btn{
  width:100% !important;
  height:40px !important;
  min-height:40px !important;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 10px !important;
  border:1px solid transparent !important;
  border-radius:10px !important;
  background:transparent !important;
  color:#5B5248 !important;
  font-size:14px;
  font-weight:700;
}

.diff-btn:hover{
  background:rgba(255,255,255,.42) !important;
}

.diff-btn.selected{
  border-color:var(--codex-gold) !important;
  background:#EFE3CF !important;
  color:var(--codex-ink) !important;
  outline:0 !important;
  box-shadow:0 4px 12px rgba(59,43,29,.1) !important;
}

.diff-btn.selected::after{
  content:none !important;
}

.difficulty-status{
  display:none !important;
}

#tier{
  height:52px !important;
}

.hero-layout,
.weapon-layout{
  display:grid !important;
  grid-template-columns:minmax(0, 1.08fr) minmax(0, .92fr) !important;
  gap:28px !important;
}

.pa-selected,
.main-2col,
.weapon-view-card,
.pv-top{
  gap:28px !important;
}

.talent-block,
.weapon-dropzone,
.talent-tier,
.hero-desc,
.weapon-view-content,
.pv-content,
.rw-desc{
  border:1px solid var(--codex-line) !important;
  border-radius:14px !important;
  background:rgba(248,244,236,.68) !important;
  box-shadow:none !important;
  color:var(--codex-ink) !important;
}

.right-actions,
.weapon-view-actions,
.pa-actions,
.admin-actions,
.rw-actions{
  display:flex;
  justify-content:flex-end;
  gap:12px;
  margin-top:20px;
}

.rw-field{
  padding:24px !important;
}

.rw-page-shell{
  width:min(1120px, calc(100% - 48px)) !important;
  max-width:1120px !important;
  margin:0 auto !important;
}

.rw-page-title{
  margin-bottom:24px !important;
}

.rw-editor-layout{
  display:grid;
  grid-template-columns:minmax(300px, .9fr) minmax(420px, 1.1fr);
  gap:28px;
  align-items:start;
}

.rw-source-panel,
.rw-target-panel{
  min-width:0;
}

.rw-source-panel{
  position:sticky;
  top:18px;
}

.rw-target-panel{
  display:grid;
  gap:0;
}

.rw-drop-stack{
  display:grid;
  gap:20px;
}

.rw-drop-card,
.rw-desc-card{
  min-width:0;
}

.rw-label{
  margin:0 0 12px !important;
  color:var(--codex-ink) !important;
  font-family:Georgia, "Times New Roman", "Noto Serif KR", serif;
  font-size:18px !important;
  font-weight:700 !important;
}

.rw-label::before{
  content:"";
  display:inline-block;
  width:8px;
  height:8px;
  margin-right:10px;
  border:1px solid var(--codex-gold);
  background:var(--codex-gold-soft);
  transform:rotate(45deg) translateY(-2px);
}

.rw-textarea{
  min-height:160px !important;
}

.rw-editor-layout .weapon-palette{
  grid-template-columns:repeat(auto-fill, minmax(80px, 80px)) !important;
  min-height:405px;
  align-content:start;
  padding:14px !important;
  border:1px solid var(--codex-line-soft) !important;
  border-radius:14px !important;
  background:rgba(248,244,236,.62) !important;
}

.rw-editor-layout .weapon-dropzone{
  min-height:170px !important;
  display:flex;
  align-items:flex-start;
  padding:18px !important;
  border:2px dashed rgba(139,107,66,.58) !important;
  border-radius:16px !important;
  background:
    linear-gradient(135deg, rgba(139,107,66,.08), rgba(255,255,255,.12)),
    rgba(248,244,236,.72) !important;
}

.rw-desc-card{
  width:100%;
  margin-top:28px;
}

.rw-desc-card .rw-textarea{
  min-height:220px !important;
}

.rw-editor-layout .weapon-dropzone::before{
  content:"";
  position:absolute;
  inset:10px;
  pointer-events:none;
  border:1px solid rgba(139,107,66,.16);
  border-radius:12px;
}

.rw-editor-layout .weapon-dropzone.dragover{
  border-color:var(--codex-gold) !important;
  background:#EFE3CF !important;
  box-shadow:0 0 0 4px rgba(139,107,66,.14) !important;
}

.rw-editor-layout .weapon-drop-hint{
  position:absolute;
  inset:auto 18px 16px auto;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(52,42,34,.82);
  color:#FFF8EA;
  font-size:12px;
  font-weight:800;
  opacity:1;
}

.rw-editor-layout .weapon-list{
  position:relative;
  z-index:1;
  min-height:76px;
}

.rw-card2{
  padding:22px !important;
}

.rw-card2-head{
  border-bottom:1px solid var(--codex-line-soft) !important;
  padding-bottom:14px !important;
}

.rw-card2-title{
  color:var(--codex-ink) !important;
  font-family:Georgia, "Times New Roman", "Noto Serif KR", serif;
  font-size:20px !important;
  font-weight:800 !important;
}

.rw-badge{
  border:1px solid rgba(255,255,255,.24) !important;
  border-radius:999px !important;
  box-shadow:none !important;
  font-weight:800 !important;
}

.rw-badge.core{
  background:#7E4035 !important;
}

.rw-badge.good{
  background:#8B6B42 !important;
}

.rw-badge.usable{
  background:#64764E !important;
}

.rw-del{
  border:1px solid #A46A5A !important;
  border-radius:10px !important;
  background:rgba(139,77,63,.1) !important;
  color:#6B3029 !important;
}

.grid,
#pageGrid.cardGrid,
.cardGrid,
#pageList{
  width:100%;
  max-width:1040px !important;
  margin:0 auto !important;
  display:grid !important;
  grid-template-columns:repeat(auto-fill, minmax(112px, 1fr)) !important;
  gap:18px !important;
  justify-items:center;
}

#pageGrid .card,
.grid .card,
#pageList .card,
.troop-card{
  width:100% !important;
  max-width:132px !important;
  min-height:0 !important;
  height:auto !important;
  aspect-ratio:1 / 1;
  display:flex !important;
  align-items:center;
  justify-content:center;
  padding:10px !important;
  overflow:hidden;
  color:var(--codex-ink) !important;
  text-decoration:none;
  transition:transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

#pageGrid .card:hover,
.grid .card:hover,
#pageList .card:hover,
.troop-card:hover{
  transform:translateY(-3px);
  border-color:var(--codex-gold) !important;
  box-shadow:0 14px 28px rgba(59,43,29,.15) !important;
}

#pageGrid .card img,
.grid .card img,
#pageList .card img,
.troop-card img{
  width:100%;
  height:100%;
  object-fit:contain;
  image-rendering:pixelated;
}

#addCard,
.add-card{
  min-height:112px;
  cursor:pointer;
  color:var(--codex-gold) !important;
  font-size:28px !important;
  font-weight:800 !important;
}

.troop-sheet,
.hero-sheet{
  width:min(1040px, 100%) !important;
  max-width:1040px !important;
  margin:0 auto !important;
}

.title-banner{
  min-height:74px;
  height:auto !important;
  margin:0 !important;
  border:1px solid var(--codex-line) !important;
  border-radius:18px 18px 0 0 !important;
  background:linear-gradient(135deg, #332A22, #5A4329) !important;
  box-shadow:var(--codex-shadow) !important;
}

.title-board{
  opacity:.18;
  filter:saturate(.65);
}

.banner-title-wrap{
  min-height:74px;
}

.banner-title{
  color:#FFF8EA !important;
  font-family:Georgia, "Times New Roman", "Noto Serif KR", serif;
  font-size:24px !important;
  font-weight:800 !important;
  text-shadow:0 2px 0 rgba(0,0,0,.24) !important;
}

.main-2col,
.hero-main,
#talentWrap,
.troop-sheet > .sheet-section,
.hero-sheet > .sheet-section{
  padding:28px !important;
}

.main-2col{
  display:grid !important;
  grid-template-columns:minmax(0, .95fr) minmax(0, 1.05fr);
}

.home-main{
  width:min(1200px, calc(100% - 48px));
  margin:0 auto;
  padding:20px 0 72px !important;
}

.home-grid{
  width:100%;
  max-width:1040px;
  gap:24px !important;
}

.home-card{
  height:260px;
  border:1px solid var(--codex-line) !important;
  border-radius:18px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.28), rgba(255,255,255,.06)),
    var(--codex-panel) !important;
  box-shadow:var(--codex-shadow) !important;
}

.home-card::before{
  border-radius:14px;
  background:
    linear-gradient(rgba(255,255,255,.08), rgba(255,255,255,0) 40%),
    repeating-linear-gradient(0deg, rgba(64,87,52,.18) 0 26px, rgba(64,87,52,.26) 26px 52px),
    repeating-linear-gradient(90deg, rgba(64,87,52,.12) 0 26px, rgba(64,87,52,.2) 26px 52px),
    #80985E !important;
}

.home-card::after{
  height:96px;
  background:linear-gradient(to top, rgba(38,31,24,.92), rgba(38,31,24,.22), transparent);
}

.card-title{
  color:#FFF8EA !important;
  font-family:Georgia, "Times New Roman", "Noto Serif KR", serif;
  font-size:26px !important;
  text-shadow:0 2px 0 rgba(0,0,0,.35) !important;
}

.admin-panel{
  width:min(1200px, calc(100% - 48px));
  margin:24px auto 72px;
  padding:24px !important;
}

table:not(.stat-table){
  width:100%;
  border:1px solid var(--codex-line) !important;
  border-collapse:separate !important;
  border-spacing:0 !important;
  overflow:hidden;
  border-radius:14px;
  background:var(--codex-panel-soft);
}

table:not(.stat-table) th,
table:not(.stat-table) td{
  padding:12px 14px !important;
  border:0 !important;
  border-bottom:1px solid #E2D8C7 !important;
}

table:not(.stat-table) th{
  background:#D8CCB5;
  color:#332C25;
  font-weight:800;
}

table:not(.stat-table) tr:hover td{
  background:#E9DDC8;
}

@media (max-width: 860px){
  header,
  .page-header,
  .site-header{
    min-height:132px;
    padding-top:70px;
  }

  .logo img{
    height:96px !important;
  }

  .top-right{
    top:14px;
    right:14px;
    left:auto;
  }

  .back,
  .banner-back{
    top:14px;
    left:14px;
  }

  main,
  .page-main,
  .stack,
  .home-main{
    width:min(100% - 28px, 1200px);
  }

  .page-title{
    font-size:30px !important;
  }

  .hero-layout,
  .weapon-layout,
  .main-2col,
  .weapon-view-card,
  .pv-top{
    grid-template-columns:1fr !important;
  }

  .difficulty-wrap,
  .stat-grid,
  .weapon-stat-range{
    grid-template-columns:1fr !important;
  }

  .rw-editor-layout{
    grid-template-columns:1fr;
  }

  .rw-source-panel{
    position:static;
  }
}
