:root{
  --a-primary:#5d8f42;
  --a-primary-600:#4f7c37;
  --a-primary-700:#40672c;
  --a-side:#2f4f2f;
  --a-side-2:#243f24;
  --a-side-text:rgba(255,255,255,.82);
  --a-side-text-mute:rgba(255,255,255,.52);
  --a-side-active:rgba(177,218,149,.2);
  --a-bg:#f4f7f2;
  --a-line:#dbe5d4;
  --a-text:#243024;
  --a-danger:#b3261e;
}
*{box-sizing:border-box}
html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
body{
  margin:0;
  font-family:'Noto Sans KR',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-size:clamp(0.9375rem, 0.88rem + 0.25vw, 1rem);
  line-height:1.6;
  background:var(--a-bg);
  color:var(--a-text);
  overflow-x:clip;
}
a{color:inherit;text-decoration:none}
body.admin{background:var(--a-bg)}

.admin-wrap{
  display:grid;
  grid-template-columns:250px 1fr;
  min-height:100vh;
}
.admin-side{
  position:sticky;
  top:0;
  align-self:start;
  height:100vh;
  background:linear-gradient(180deg,var(--a-side) 0%,var(--a-side-2) 100%);
  color:#fff;
  padding:20px 16px;
  display:flex;
  flex-direction:column;
  overflow-y:auto;
}
.admin-side .brand{
  display:flex;
  align-items:center;
  gap:10px;
  padding:5px 6px 18px;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.admin-side .brand-mark{
  width:38px;height:38px;border-radius:10px;
  background:linear-gradient(135deg,#6ca54a,#8cc56b);
  display:grid;place-items:center;
  font-weight:800;
}
.admin-side .brand-name{font-weight:800;letter-spacing:-.02em}
.admin-side .brand-name small{
  display:block;font-size:10px;letter-spacing:.2em;margin-top:2px;color:var(--a-side-text-mute);font-weight:500
}
.admin-nav{margin-top:14px;display:grid;gap:3px}
.admin-nav .group-title{
  padding:12px 8px 5px;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--a-side-text-mute);
  font-weight:700;
}
.admin-nav a{
  display:flex;align-items:center;
  padding:10px 12px;
  border-radius:10px;
  color:var(--a-side-text);
  font-size:14px;
  font-weight:500;
}
.admin-nav a:hover{color:#fff;background:rgba(255,255,255,.08)}
.admin-nav a.is-active{color:#fff;background:var(--a-side-active)}
.admin-side .user-box{
  margin-top:auto;
  padding:14px;
  border-radius:12px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  font-size:13px;
}
.admin-side .user-box .name{font-weight:700}
.admin-side .user-box .role{font-size:11px;letter-spacing:.08em;color:var(--a-side-text-mute);margin-top:2px}
.admin-side .user-box .logout{display:inline-block;margin-top:10px;color:var(--a-side-text)}
.admin-side .user-box .logout:hover{color:#d7efc6}

.admin-main{padding:clamp(18px, 3vw, 28px) clamp(16px, 3vw, 28px) 54px;min-width:0}
.admin-topbar{
  display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;
  margin-bottom:18px;
}
.admin-topbar h1{margin:0;font-size:1.55rem}
.admin-topbar .sub{margin-top:4px;color:#667767;font-size:13px}

.admin-card{
  background:#fff;border:1px solid var(--a-line);
  border-radius:14px;padding:clamp(16px, 3vw, 22px);
  box-shadow:0 10px 26px rgba(33,56,33,.06);
  min-width:0;
  overflow-wrap:anywhere;
  word-break:keep-all;
}

.a-btn{
  display:inline-flex;align-items:center;justify-content:center;
  height:38px;padding:0 14px;border-radius:9px;
  border:1px solid transparent;cursor:pointer;font-size:14px;font-weight:600;
}
.a-btn-primary{background:linear-gradient(135deg,var(--a-primary-600),var(--a-primary));color:#fff}
.a-btn-primary:hover{background:linear-gradient(135deg,var(--a-primary-700),var(--a-primary-600))}
.a-btn-outline{background:#fff;border-color:var(--a-line);color:#324632}
.a-btn-outline:hover{border-color:var(--a-primary);color:var(--a-primary)}
.a-btn-danger{background:var(--a-danger);color:#fff}

.adm-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.adm-tab{
  display:inline-block;padding:8px 12px;border:1px solid var(--a-line);border-radius:999px;
  background:#fff;color:#324632;font-size:13px
}
.adm-tab.active{background:var(--a-primary);border-color:var(--a-primary);color:#fff}

.a-table{width:100%;border-collapse:collapse;min-width:0;table-layout:auto}
.a-table th,.a-table td{
  padding:12px;
  border-bottom:1px solid var(--a-line);
  text-align:left;
  vertical-align:top;
  overflow-wrap:anywhere;
  word-break:keep-all;
}
.a-table thead th{background:#f2f7ee;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#4b5d4a}

.a-field{display:grid;gap:8px;margin-bottom:14px}
.a-field label{font-size:13px;font-weight:700;color:#3e503e}
.a-input,.a-textarea{
  width:100%;
  border:1px solid var(--a-line);
  border-radius:10px;
  padding:10px 12px;
  font-size:14px;
}
.a-textarea{min-height:320px;resize:vertical;font-family:inherit;line-height:1.6}
.a-input:focus,.a-textarea:focus{
  outline:none;border-color:var(--a-primary);
  box-shadow:0 0 0 4px rgba(93,143,66,.14)
}
.a-actions{display:flex;gap:8px;flex-wrap:wrap}
.msg-error{color:var(--a-danger);font-size:13px;margin:0 0 10px}

.login-wrap{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:40px 20px;
  background:linear-gradient(135deg,#243f24 0%,#335733 45%,#5d8f42 120%);
}
.login-card{
  width:100%;
  max-width:430px;
  background:rgba(255,255,255,.96);
  border-radius:22px;
  padding:40px 34px;
  box-shadow:0 28px 70px -24px rgba(0,0,0,.4);
}
.login-brand{display:flex;align-items:center;gap:10px;margin-bottom:24px}
.login-brand .mark{
  width:42px;height:42px;border-radius:11px;
  background:linear-gradient(135deg,#5d8f42,#8cc56b);
  color:#fff;display:grid;place-items:center;font-weight:800;
}
.login-brand .name{font-weight:800;letter-spacing:-.02em}
.login-brand .name small{display:block;font-size:11px;letter-spacing:.18em;color:#6f7f6f}

.board-content{
  overflow-wrap:anywhere;
  word-break:keep-all;
  line-height:1.78;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  max-width:100%;
  font-size:clamp(0.9375rem, 0.88rem + 0.25vw, 1rem);
}
.board-content a{overflow-wrap:anywhere}
.board-content img,
.board-content video,
.board-content iframe{
  max-width:100%!important;
  height:auto!important;
  display:block;
  margin:1rem auto;
  border-radius:10px;
}
.board-content table{width:100%;max-width:100%;border-collapse:collapse}
.board-content td,.board-content th{overflow-wrap:anywhere;word-break:break-word}
.board-content pre,.board-content code{overflow-wrap:anywhere;word-break:break-all;white-space:pre-wrap;max-width:100%}

@media (max-width:900px){
  .admin-wrap{grid-template-columns:1fr}
  .admin-side{position:static;height:auto}
  .a-table{font-size:clamp(0.8125rem, 2.5vw, 0.9375rem)}
  .a-table th,.a-table td{padding:10px 8px}
}
