*{box-sizing:border-box}:root{--green:#176b57;--dark:#102d26;--bg:#f2f5f4;--line:#dce5e1;--text:#22312c;--muted:#71807a;--danger:#c33c3c}
body{margin:0;font-family:Arial,"Noto Sans KR",sans-serif;color:var(--text);background:var(--bg)}a{text-decoration:none;color:inherit}button,input,select,textarea{font:inherit}
.admin-layout{min-height:100vh;display:grid;grid-template-columns:250px 1fr}.sidebar{position:fixed;left:0;top:0;bottom:0;width:250px;padding:24px 18px;background:var(--dark);color:#fff}.admin-brand{display:flex;align-items:center;gap:11px;padding:5px 8px 27px}.admin-brand span{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:var(--green);font-size:21px}.sidebar nav{display:flex;flex-direction:column;gap:7px}.sidebar nav a{padding:12px 14px;border-radius:10px;color:rgba(255,255,255,.78);font-size:14px}.sidebar nav a:hover{background:rgba(255,255,255,.08);color:#fff}
.admin-main{grid-column:2;min-width:0}.admin-topbar{height:70px;padding:0 30px;display:flex;align-items:center;justify-content:space-between;background:#fff;border-bottom:1px solid var(--line)}.admin-topbar>div{display:flex;align-items:center;gap:12px}.admin-topbar span{font-size:13px;color:var(--muted)}.sidebar-toggle{display:none;border:0;background:transparent;font-size:23px}.admin-content{padding:28px}
.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:24px}.stat{padding:24px;background:#fff;border:1px solid var(--line);border-radius:17px}.stat span{display:block;color:var(--muted);font-size:14px}.stat strong{display:block;margin-top:8px;color:var(--green);font-size:34px}
.panel{margin-bottom:24px;padding:25px;background:#fff;border:1px solid var(--line);border-radius:17px}.narrow-panel{max-width:700px}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:21px}.panel-head h2{margin:0;font-size:22px}.panel-head p{margin:5px 0 0;color:var(--muted);font-size:13px}
.admin-button,.secondary-button{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 18px;border:0;border-radius:10px;font-weight:bold;cursor:pointer}.admin-button{background:var(--green);color:#fff}.secondary-button{background:#edf3f1;color:#35574e}.full{width:100%}.text-link{color:var(--green);font-weight:bold;font-size:13px}
.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.quick-grid a{padding:19px;border:1px solid var(--line);border-radius:12px;font-weight:bold}.quick-grid a:hover{border-color:var(--green);color:var(--green)}
.table-wrap{width:100%;overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:13px}th{padding:12px 10px;text-align:left;color:var(--muted);background:#f7f9f8;border-bottom:1px solid var(--line);white-space:nowrap}td{padding:14px 10px;border-bottom:1px solid #edf1ef;vertical-align:middle}.actions{display:flex;align-items:center;gap:12px;white-space:nowrap}.actions form{margin:0}.danger-link{border:0;background:transparent;color:var(--danger);font-weight:bold;cursor:pointer;padding:0;font-size:13px}.badge{display:inline-block;padding:5px 9px;border-radius:999px;font-size:11px;font-weight:bold}.badge.active{background:#e7f5ee;color:#20714f}.badge.inactive{background:#eff1f0;color:#777}
.admin-form{display:flex;flex-direction:column;gap:19px}.admin-form label{display:flex;flex-direction:column;gap:7px;font-size:14px;font-weight:bold}.admin-form small{font-weight:normal;color:var(--muted)}.admin-form input[type=text],.admin-form input[type=email],.admin-form input[type=url],.admin-form input[type=number],.admin-form input[type=password],.admin-form select,.admin-form textarea{width:100%;padding:11px 13px;border:1px solid #ccd8d3;border-radius:10px;outline:none}.admin-form textarea{resize:vertical;line-height:1.65}.admin-form input:focus,.admin-form select:focus,.admin-form textarea:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(23,107,87,.09)}.form-grid{display:grid;gap:17px}.form-grid.two{grid-template-columns:1fr 1fr}.form-actions{display:flex;gap:10px}.check-label{flex-direction:row!important;align-items:center}.check-label input{width:18px;height:18px}.inline-check{justify-content:center;padding-top:30px}
fieldset{border:1px solid var(--line);border-radius:11px;padding:15px}legend{padding:0 7px;font-size:13px;font-weight:bold}.radio-row{display:flex;gap:24px}.radio-row label{flex-direction:row;align-items:center}.editor-toolbar{display:flex;flex-wrap:wrap;gap:6px;padding:9px;background:#f4f7f6;border:1px solid var(--line);border-bottom:0;border-radius:10px 10px 0 0}.editor-toolbar button{border:1px solid #cedad5;background:#fff;padding:6px 9px;border-radius:7px;cursor:pointer;font-size:12px}#content-editor{border-radius:0 0 10px 10px;font-family:Consolas,monospace}
.alert{margin-bottom:17px;padding:13px 15px;border-radius:10px;font-size:13px}.alert-success{background:#e8f5ee;color:#1e704d}.alert-error{background:#fff0f0;color:#9b3030}
.login-body{min-height:100vh;display:grid;place-items:center;padding:20px;background:linear-gradient(135deg,#eaf4f0,#fff8eb)}.login-card{width:min(420px,100%);padding:37px;background:#fff;border-radius:23px;box-shadow:0 25px 70px rgba(20,61,50,.15)}.login-mark{width:58px;height:58px;display:grid;place-items:center;margin:auto;border-radius:18px;background:var(--green);color:#fff;font-size:29px}.login-card h1{text-align:center;margin:17px 0 5px}.login-card>p{text-align:center;margin:0 0 24px;color:var(--muted);font-size:13px}.login-card form{display:flex;flex-direction:column;gap:15px}.login-card label{display:flex;flex-direction:column;gap:7px;font-size:13px;font-weight:bold}.login-card input{padding:12px;border:1px solid #ccd8d3;border-radius:10px}.back-link{display:block;text-align:center;margin-top:21px;color:var(--muted);font-size:12px}
@media(max-width:900px){.admin-layout{display:block}.sidebar{transform:translateX(-100%);z-index:100;transition:.25s}.sidebar-open .sidebar{transform:translateX(0)}.admin-main{grid-column:auto}.sidebar-toggle{display:block}.stat-grid,.quick-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.admin-content{padding:17px 11px}.admin-topbar{padding:0 15px}.stat-grid,.quick-grid,.form-grid.two{grid-template-columns:1fr}.panel{padding:18px 14px}.panel-head{align-items:flex-start;flex-direction:column}.inline-check{padding-top:0;justify-content:flex-start}}


/* 7색 관리자 디자인 보강 */
:root{
  --rainbow:linear-gradient(90deg,#ff5b6e,#ff8a3d,#f4c542,#36b86b,#22b7b2,#4a79ff,#8c5cff);
}
.sidebar{
  background:
    radial-gradient(circle at 20% 10%,rgba(255,91,110,.18),transparent 22%),
    radial-gradient(circle at 80% 85%,rgba(140,92,255,.20),transparent 24%),
    #202432;
}
.admin-brand span{
  background:conic-gradient(#ff5b6e,#ff8a3d,#f4c542,#36b86b,#22b7b2,#4a79ff,#8c5cff,#ff5b6e);
}
.admin-topbar{
  position:relative;
}
.admin-topbar::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:3px;
  background:var(--rainbow);
}
.admin-button{
  background:linear-gradient(90deg,#4a79ff,#8c5cff);
  box-shadow:0 10px 22px rgba(74,121,255,.18);
}
.stat:nth-child(1){border-top:5px solid #ff5b6e}
.stat:nth-child(2){border-top:5px solid #36b86b}
.stat:nth-child(3){border-top:5px solid #4a79ff}
.quick-grid a:nth-child(1){border-left:5px solid #ff5b6e}
.quick-grid a:nth-child(2){border-left:5px solid #ff8a3d}
.quick-grid a:nth-child(3){border-left:5px solid #22b7b2}
.quick-grid a:nth-child(4){border-left:5px solid #8c5cff}
/* ---------------------------------------------------------------
   WYSIWYG 본문 편집기
---------------------------------------------------------------- */
.editor-field{display:flex;flex-direction:column;gap:8px}
.editor-label-row{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:14px}
.editor-label-row span{color:var(--muted);font-size:12px;font-weight:400}

.rich-editor{
  overflow:hidden;
  border:1px solid #cdd8d4;
  border-radius:14px;
  background:#fff;
  box-shadow:0 8px 25px rgba(31,37,48,.05);
}
.rich-editor:focus-within{
  border-color:#4a79ff;
  box-shadow:0 0 0 3px rgba(74,121,255,.10),0 12px 30px rgba(31,37,48,.06);
}
.editor-toolbar{
  position:sticky;
  top:70px;
  z-index:20;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:7px;
  padding:11px;
  border:0;
  border-bottom:1px solid #dfe5e8;
  border-radius:0;
  background:linear-gradient(180deg,#ffffff,#f5f7fa);
}
.toolbar-group{
  display:flex;
  align-items:center;
  gap:5px;
  padding-right:7px;
  border-right:1px solid #dfe4e8;
}
.toolbar-group:last-child{border-right:0;padding-right:0}
.toolbar-group>span{font-size:11px;color:var(--muted);white-space:nowrap}

.editor-toolbar button,
.editor-toolbar select{
  min-height:34px;
  border:1px solid #d7dde2;
  border-radius:7px;
  background:#fff;
  color:#303744;
  padding:6px 9px;
  cursor:pointer;
  font-size:12px;
  font-weight:600;
}
.editor-toolbar button:hover,
.editor-toolbar select:hover{
  border-color:#8c5cff;
  background:#f8f6ff;
}
.editor-toolbar button:active{transform:translateY(1px)}
.editor-toolbar button[title="가운데 정렬"]{text-align:center}
.editor-toolbar button[title="오른쪽 정렬"]{text-align:right}
.editor-toolbar .danger-tool{color:#b62f3f;border-color:#f0bdc4}
.editor-toolbar .danger-tool:hover{background:#fff0f2;border-color:#df6d7b}

.color-control{
  position:relative;
  width:36px;
  height:34px;
  display:grid!important;
  place-items:center;
  border:1px solid #d7dde2;
  border-radius:7px;
  background:#fff;
  cursor:pointer;
  overflow:hidden;
}
.color-control span{font-size:16px;font-weight:900;line-height:1}
.color-control input{
  position:absolute;
  left:0;right:0;bottom:0;
  width:100%!important;
  height:8px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  cursor:pointer;
}
.color-control.highlight span{
  padding:1px 4px;
  background:#fff3a6;
}

.editor-status{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  min-height:37px;
  padding:7px 13px;
  border-bottom:1px solid #e7ebee;
  background:#fbfcfd;
  color:var(--muted);
  font-size:11px;
}
.editor-message{color:#4a79ff;font-size:12px}
.editor-message.success{color:#188651}
.editor-message.error{color:#bf3042}

.visual-editor{
  min-height:520px;
  max-height:850px;
  overflow:auto;
  padding:34px 38px;
  outline:none;
  background:#fff;
  color:#252c36;
  font-size:16px;
  line-height:1.8;
}
.visual-editor:empty::before{
  content:"본문 내용을 입력하세요.";
  color:#a1a9b2;
  pointer-events:none;
}
.visual-editor h2{
  margin:32px 0 14px;
  padding-left:15px;
  border-left:5px solid #8c5cff;
  font-size:29px;
  line-height:1.35;
}
.visual-editor h3{
  margin:26px 0 12px;
  font-size:22px;
}
.visual-editor p{margin:0 0 16px}
.visual-editor ul,
.visual-editor ol{padding-left:27px}
.visual-editor blockquote{
  margin:24px 0;
  padding:18px 22px;
  border-left:5px solid #ff8a3d;
  border-radius:0 12px 12px 0;
  background:#fff8ee;
  color:#4d5560;
}
.visual-editor a{color:#3168de;text-decoration:underline}
.visual-editor hr{margin:30px 0;border:0;border-top:2px solid #e2e6ea}
.visual-editor img{
  display:inline-block;
  max-width:100%;
  height:auto;
  border-radius:12px;
  cursor:pointer;
  transition:outline .15s,box-shadow .15s;
}
.visual-editor img:hover{box-shadow:0 0 0 3px rgba(74,121,255,.16)}
.visual-editor img.editor-selected-image{
  outline:4px solid rgba(74,121,255,.65);
  outline-offset:3px;
  box-shadow:0 12px 35px rgba(74,121,255,.18);
}
.visual-editor .editor-image-block{
  margin:24px 0;
  text-align:center;
}

.source-editor{
  width:100%;
  min-height:570px;
  max-height:850px;
  padding:22px;
  border:0!important;
  border-radius:0!important;
  outline:none!important;
  resize:vertical;
  background:#202431;
  color:#e9edf5;
  font:14px/1.7 Consolas,"Courier New",monospace!important;
  box-shadow:none!important;
}
.selected-image-tools[hidden]{display:none!important}
.selected-image-tools{
  padding:5px 7px;
  border:1px solid #b9ccff;
  border-radius:9px;
  background:#eef3ff;
}

@media(max-width:900px){
  .editor-toolbar{top:70px}
  .visual-editor{padding:27px 23px;min-height:460px}
}
@media(max-width:620px){
  .editor-label-row{align-items:flex-start;flex-direction:column;gap:3px}
  .editor-toolbar{
    position:relative;
    top:auto;
    max-height:240px;
    overflow:auto;
  }
  .toolbar-group{border-right:0;padding-right:0}
  .editor-status{align-items:flex-start;flex-direction:column;gap:2px}
  .visual-editor{min-height:420px;padding:22px 17px}
}
/* 편집기 도형 도구 */
.shape-tools button{white-space:nowrap}
.shape-color-control{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;height:34px;
  padding:3px;
  border:1px solid #d7dde2;
  border-radius:7px;
  background:#fff;
}
.shape-color-control input{
  width:28px!important;
  height:24px!important;
  padding:0!important;
  border:0!important;
}
.selected-shape-tools[hidden]{display:none!important}
.selected-shape-tools{
  padding:5px 7px;
  border:1px solid #c6b9ff;
  border-radius:9px;
  background:#f5f1ff;
}

.visual-editor .editor-shape-block{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:70px;
  margin:24px 0;
  padding:14px;
  text-align:center;
}
.visual-editor .editor-shape{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  user-select:none;
  transition:.2s;
}
.visual-editor .editor-shape-selected{
  outline:4px solid rgba(74,121,255,.45);
  outline-offset:5px;
  box-shadow:0 12px 30px rgba(74,121,255,.16);
}
.visual-editor .editor-oval{
  min-width:260px;
  min-height:110px;
  padding:24px 38px;
  border:4px solid #4a79ff;
  border-radius:50%;
  color:#222;
  font-size:22px;
  font-weight:800;
  white-space:pre-wrap;
  user-select:text;
}
.visual-editor .editor-line-horizontal{
  width:70%;
  height:5px;
  min-width:120px;
  border-radius:999px;
}
.visual-editor .editor-line-vertical{
  width:5px;
  height:150px;
  min-height:80px;
  border-radius:999px;
}
.visual-editor .editor-arrow{
  width:220px;
  height:60px;
}
.visual-editor .editor-arrow::before{
  content:"";
  position:absolute;
  top:50%;
  left:10px;
  right:38px;
  height:5px;
  margin-top:-2.5px;
  border-radius:999px;
  background:currentColor;
}
.visual-editor .editor-arrow::after{
  content:"";
  position:absolute;
  top:50%;
  right:10px;
  width:24px;
  height:24px;
  margin-top:-12px;
  border-top:5px solid currentColor;
  border-right:5px solid currentColor;
  transform:rotate(45deg);
}
.visual-editor .editor-arrow-left{transform:rotate(180deg)}
.visual-editor .editor-arrow-down{transform:rotate(90deg)}

.visual-editor .editor-shape.shape-small.editor-oval{
  min-width:180px;min-height:80px;padding:16px 26px;font-size:17px
}
.visual-editor .editor-shape.shape-medium.editor-oval{
  min-width:260px;min-height:110px;padding:24px 38px;font-size:22px
}
.visual-editor .editor-shape.shape-large.editor-oval{
  min-width:380px;min-height:155px;padding:34px 55px;font-size:30px
}
.visual-editor .editor-shape.shape-small.editor-line-horizontal{width:40%;height:3px}
.visual-editor .editor-shape.shape-medium.editor-line-horizontal{width:70%;height:5px}
.visual-editor .editor-shape.shape-large.editor-line-horizontal{width:95%;height:8px}
.visual-editor .editor-shape.shape-small.editor-line-vertical{height:90px;width:3px}
.visual-editor .editor-shape.shape-medium.editor-line-vertical{height:150px;width:5px}
.visual-editor .editor-shape.shape-large.editor-line-vertical{height:230px;width:8px}
.visual-editor .editor-shape.shape-small.editor-arrow{width:140px;height:45px}
.visual-editor .editor-shape.shape-medium.editor-arrow{width:220px;height:60px}
.visual-editor .editor-shape.shape-large.editor-arrow{width:340px;height:80px}

@media(max-width:620px){
  .visual-editor .editor-oval{
    min-width:170px;
    max-width:100%;
    min-height:78px;
    padding:16px 22px;
    font-size:17px;
  }
  .visual-editor .editor-arrow{max-width:100%}
}
