/* Atori 달력 사이트 v0 — 기능 확인용 최소 스타일. 디자인은 GPT 요청 예정 */
:root{--bg:#f4f3ef;--fg:#1f2024;--muted:#6b6e76;--line:#d9d7cf;--card:#fff;--accent:#2f6f9f;--ev:#2f6f9f;--bd:#c2573a;--hd:#5b8a4a}
*{box-sizing:border-box}
body{margin:0;font-family:"Noto Sans KR",system-ui,sans-serif;background:var(--bg);color:var(--fg);font-size:14px}
.top{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line);background:var(--card)}
.sp{flex:1}.muted{color:var(--muted)}.small{font-size:12px}
.btn{display:inline-block;border:1px solid var(--accent);background:var(--accent);color:#fff;border-radius:6px;padding:6px 12px;text-decoration:none;cursor:pointer;font:inherit}
.btn.ghost{background:transparent;color:var(--fg);border-color:var(--line)}
.btn.small{padding:3px 8px;font-size:12px}
main{max-width:960px;margin:0 auto;padding:16px;display:flex;flex-direction:column;gap:16px}
.intro{max-width:960px;margin:24px auto;padding:0 16px;color:var(--muted)}
.keybox{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:12px}
.keybox code{font-size:13px;background:var(--bg);padding:3px 6px;border-radius:4px;margin-right:6px}
.cal{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:12px}
.calhd{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.calhd h2{margin:0;font-size:16px}
.grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.dow{text-align:center;font-size:11px;color:var(--muted)}
.cell{border:1px solid var(--line);border-radius:6px;min-height:84px;padding:4px;display:flex;flex-direction:column;gap:2px;cursor:pointer;background:var(--card)}
.cell.out{opacity:.4}.cell.today{border-color:var(--accent)}
.cell .d{font-size:12px;color:var(--muted)}
.cell .e{font-size:11px;padding:1px 4px;border-radius:3px;color:#fff;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;cursor:pointer}
.cell .e.ev{background:var(--ev)}.cell .e.bd{background:var(--bd)}.cell .e.hd{background:var(--hd)}
.cell .e.img::before{content:"▣ "}
dialog{border:1px solid var(--line);border-radius:10px;padding:16px;width:min(520px,95vw)}
dialog::backdrop{background:rgba(0,0,0,.35)}
form{display:flex;flex-direction:column;gap:10px}
label{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--muted);flex:1}
label.chk{flex-direction:row;align-items:center;gap:6px}
input,select,textarea{font:inherit;font-size:14px;color:var(--fg);border:1px solid var(--line);border-radius:6px;padding:6px 8px;background:var(--card)}
.row{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap}
.row.end{justify-content:flex-end}
fieldset{border:1px solid var(--line);border-radius:6px;padding:8px 10px}
legend{font-size:12px;color:var(--muted)}
.cropwrap{display:flex;gap:12px;align-items:flex-start;margin-top:8px}
.cropwrap canvas{border:1px solid var(--line);border-radius:4px;max-width:150px;height:auto}
@media (max-width:600px){.cell{min-height:60px}.cell .e{display:none}.cell .d::after{content:attr(data-n)}}

/* hidden 속성이 위의 display 규칙에 덮이지 않게 한다 (2026-10-01 수정) */
[hidden]{display:none!important}
