/* 관리 화면 — 공개 사이트와 같은 토큰을 쓰되 밀도를 높인다.
   읽는 화면이 아니라 조작하는 화면이므로 정보 밀도 > 여백. */

body.admin { font-size:14px; }

.admin-bar { border-bottom:1px solid var(--rule); background:var(--panel); }
.admin-bar .wrap { display:flex; flex-wrap:wrap; gap:9px 22px; align-items:center;
                   justify-content:space-between; padding-top:12px; padding-bottom:12px; }
.admin-bar .brand { font-size:14px; font-weight:680; }
.admin-bar ul { display:flex; flex-wrap:wrap; gap:16px; list-style:none; margin:0; padding:0;
                font-size:13px; }
.admin-bar a { color:var(--mut); text-decoration:none; }
.admin-bar a:hover { color:var(--accent); }
.admin-main { padding-top:22px; padding-bottom:48px; }
.admin-foot { border-top:1px solid var(--rule); }
.admin-foot .wrap { padding:12px 28px; font-size:12px; color:var(--mut); }

.flash { background:var(--accent-soft); color:var(--accent); border:1px solid var(--accent);
         border-radius:6px; padding:9px 12px; font-size:13px; margin:0 0 18px; }
.err { background:#fdecec; color:#9a2436; border:1px solid #e8b4bd; border-radius:6px;
       padding:9px 12px; font-size:13px; margin:0 0 14px; }
@media (prefers-color-scheme:dark){
  .err { background:#2b1418; color:#f0a9b4; border-color:#5c2630; }
}

/* ── 로그인·초대 등 인증 화면 ── */
.authbox { max-width:340px; margin:9vh auto 0; padding:0 22px 60px; }
.authbox h1 { font-size:21px; margin:0 0 4px; }
.authbox .sub { color:var(--mut); font-size:13px; margin:0 0 22px; }
.authbox form { display:flex; flex-direction:column; gap:13px; }
.authbox .alt { font-size:12.5px; color:var(--mut); margin:16px 0 0; }
.authbox .ok { background:var(--accent-soft); color:var(--accent); border:1px solid var(--accent);
               border-radius:6px; padding:11px 13px; font-size:13px; }

label { display:flex; flex-direction:column; gap:5px; font-size:12.5px; color:var(--mut); }
input[type=text], input[type=email], input[type=password], input[type=number],
select, textarea {
  font:inherit; font-size:14px; color:var(--ink); background:var(--paper);
  border:1px solid var(--rule); border-radius:6px; padding:9px 11px; width:100%;
}
textarea { min-height:66px; resize:vertical; line-height:1.5; }
input:focus, select:focus, textarea:focus { outline:2px solid var(--accent); outline-offset:1px; }

button, .btn {
  font:inherit; font-size:13.5px; font-weight:560; cursor:pointer;
  background:var(--accent); color:#fff; border:1px solid var(--accent);
  border-radius:6px; padding:9px 15px; text-decoration:none; display:inline-block;
}
button.ghost, .btn.ghost { background:transparent; color:var(--mut); border-color:var(--rule); }
button.danger { background:transparent; color:#a3283c; border-color:#e0b3bb; }
button.sm, .btn.sm { font-size:12px; padding:5px 10px; }

/* ── 대시보드 ── */
.cards { display:flex; flex-wrap:wrap; gap:11px; margin-bottom:24px; }
.card { flex:1 1 118px; border:1px solid var(--rule); border-radius:7px; padding:11px 13px;
        background:var(--panel); }
.card .k { font-size:10.5px; letter-spacing:.07em; text-transform:uppercase; color:var(--mut); }
.card .v { font-size:24px; font-weight:660; font-variant-numeric:tabular-nums; line-height:1.15; }
.card .s { font-size:11.5px; color:var(--mut); }
.card a { text-decoration:none; }

.warn { border:1px solid #d9a441; background:#fff8ea; color:#7a5410; border-radius:6px;
        padding:10px 13px; font-size:13px; margin-bottom:16px; }
@media (prefers-color-scheme:dark){
  .warn { background:#2a2109; color:#e8c37a; border-color:#5c4a1c; }
}

/* ── 편집 표 ── */
.editor { display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:26px; align-items:start; }
@media (max-width:900px){ .editor { grid-template-columns:1fr; } }

table.adm { width:100%; border-collapse:collapse; font-size:13px; }
table.adm th { text-align:left; white-space:nowrap; font-size:10.5px; letter-spacing:.07em; text-transform:uppercase;
               color:var(--mut); font-weight:600; padding:8px 8px; border-bottom:1px solid var(--rule); }
table.adm td { padding:9px 8px; border-bottom:1px solid var(--rule); vertical-align:top; }
table.adm tr:hover { background:var(--panel); }
table.adm .num { text-align:right; font-variant-numeric:tabular-nums;
                 font-family:var(--mono); font-size:12.5px; }
table.adm .num.none { color:var(--mut); }
table.adm .ttl { font-weight:560; line-height:1.4; }
table.adm .meta { font-size:11.5px; color:var(--mut); margin-top:2px; }
table.adm .acts { white-space:nowrap; text-align:right; }
.tag { display:inline-block; font-size:10.5px; padding:2px 6px; border-radius:4px;
       background:var(--accent-soft); color:var(--accent); font-weight:600; margin-left:5px; }
.tag.grey { background:var(--panel); color:var(--mut); }

.panel-form { border:1px solid var(--rule); border-radius:8px; padding:15px 16px;
              background:var(--panel); position:sticky; top:16px; }
.panel-form h2 { margin:0 0 13px; font-size:15px; }
.panel-form .fields { display:flex; flex-direction:column; gap:11px; }
.panel-form .row2 { display:flex; gap:10px; }
.panel-form .row2 > * { flex:1; min-width:0; }
.panel-form .chk { flex-direction:row; align-items:center; gap:7px; color:var(--ink);
                   font-size:13px; }
.panel-form .chk input { width:auto; }
.panel-form .actions { display:flex; gap:8px; align-items:center; margin-top:15px; }
.panel-form .hint { font-size:11.5px; color:var(--mut); margin:6px 0 0; }

.doi-row { display:flex; gap:7px; align-items:end; }
.doi-row button { flex:0 0 auto; }

@media (max-width:640px){
  .authbox{ margin-top:5vh; max-width:none; }
  .authbox button{ min-height:44px; width:100%; }
  .authbox .alt a{ display:inline-block; padding:7px 0; }
  .admin-bar ul{ gap:12px 14px; }
  .editor{ gap:18px; }
  .panel-form{ position:static; }
  table.adm .acts .btn, table.adm .acts button{ min-height:36px; }
}

/* ── 강의 편집기 — 왼쪽 원문, 오른쪽 미리보기 ── */
.lec-edit { display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:start; }
.lec-edit .pane { min-width:0; }
.pane-bar { display:flex; flex-wrap:wrap; gap:6px; align-items:center;
            justify-content:space-between; font-size:11px; letter-spacing:.06em;
            text-transform:uppercase; color:var(--mut); font-weight:650; margin-bottom:6px; }
.pane-bar .tools { display:flex; flex-wrap:wrap; gap:5px; text-transform:none;
                   letter-spacing:0; font-weight:450; }
.pane-bar .tools button { padding:3px 8px; font-size:11.5px; min-height:0; }
.lec-edit textarea { width:100%; min-height:62vh; font-family:var(--mono); font-size:13px;
                     line-height:1.65; resize:vertical; tab-size:2; }
.lec-edit .prev { border:1px solid var(--rule); border-radius:7px; padding:16px 18px;
                  min-height:62vh; max-height:80vh; overflow:auto; background:var(--paper);
                  font-size:15px; }
.lec-edit .prev > :first-child { margin-top:0; }

@media (max-width:900px){
  .lec-edit { grid-template-columns:1fr; }
  .lec-edit textarea { min-height:44vh; }
  .lec-edit .prev { min-height:36vh; max-height:60vh; }
}
