/* 와이데이(Y-Day) v1 — 앱 스타일. 에디션: body.ed-pro / .ed-kids / .ed-senior */
:root{
  --font:'NSN','NanumSquare Neo','Apple SD Gothic Neo','Malgun Gothic',sans-serif;
  --p:#4f6df5; --p2:#3b57d6; --pl:#eaeefe; --acc:#ffb703;
  --bg:#f4f6fb; --sf:#ffffff; --sf2:#f8f9fc; --line:#e3e6ef; --tx:#1f2430; --mu:#6b7280; --mu2:#9aa3b5;
  --ok:#2bb673; --warn:#f59e0b; --bad:#e5484d; --r:12px; --r2:18px; --fs:15px; --pad:16px;
  --sh:0 1px 2px rgba(20,30,60,.06),0 4px 16px rgba(20,30,60,.06);
}
body.ed-kids{ --p:#ff7a59; --p2:#f0603f; --pl:#ffeae3; --acc:#ffd166; --bg:#fff8ec; --sf:#fff; --sf2:#fffaf2; --line:#f3e3cf; --tx:#3b2f2a; --mu:#8a7266; --r:18px; --r2:26px; --fs:17px; --pad:18px; }
body.ed-senior{ --p:#1f5fbf; --p2:#174a96; --pl:#e3ecfa; --acc:#f6b400; --bg:#ffffff; --sf:#ffffff; --sf2:#f3f5f9; --line:#c9d0dc; --tx:#111418; --mu:#3f4753; --mu2:#6b7380; --r:10px; --r2:14px; --fs:19px; --pad:18px; }
*{box-sizing:border-box} html,body{margin:0;height:100%}
body{font-family:var(--font);font-size:var(--fs);color:var(--tx);background:var(--bg);-webkit-font-smoothing:antialiased;line-height:1.45}
a{color:inherit;text-decoration:none} button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none;padding:0}
input,select,textarea{border:1px solid var(--line);border-radius:var(--r);background:var(--sf);padding:9px 12px;outline:none;width:100%}
input:focus,select:focus,textarea:focus{border-color:var(--p);box-shadow:0 0 0 3px var(--pl)}
textarea{resize:vertical;min-height:80px}
.boot{padding:60px 20px;text-align:center;color:var(--mu)}
.btn{display:inline-flex;align-items:center;gap:6px;border-radius:var(--r);padding:9px 14px;font-weight:700;background:var(--sf2);border:1px solid var(--line);white-space:nowrap;transition:.12s}
.btn:hover{background:var(--pl);border-color:var(--p)}
.btn.p{background:var(--p);color:#fff;border-color:var(--p)} .btn.p:hover{background:var(--p2)}
.btn.sm{padding:5px 10px;font-size:.88em;border-radius:9px} .btn.ghost{background:transparent;border-color:transparent;color:var(--mu)} .btn.ghost:hover{color:var(--p);background:var(--pl)}
.btn.bad{color:var(--bad)} .btn.bad:hover{background:#fdecec;border-color:var(--bad)}
.btn.full{width:100%;justify-content:center;padding:12px}
.ed-senior .btn{padding:12px 18px} .ed-kids .btn{border-radius:999px}
.chip{display:inline-block;border-radius:999px;padding:2px 9px;font-size:.78em;font-weight:700;background:var(--sf2);color:var(--mu);border:1px solid var(--line)}
.chip.p{background:var(--pl);color:var(--p);border-color:transparent}
.chip.bad{background:#fdecec;color:var(--bad);border-color:transparent} .chip.warn{background:#fff4dc;color:#b26b00;border-color:transparent} .chip.ok{background:#e6f7ee;color:#1d7f4f;border-color:transparent}
.avatar{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;color:#fff;font-weight:800;font-size:.75em;flex:none}
.avatar.lg{width:44px;height:44px;font-size:1em}
.mu{color:var(--mu)} .sm{font-size:.86em} .b{font-weight:800} .row{display:flex;align-items:center;gap:8px} .grow{flex:1} .wrap{flex-wrap:wrap} .right{margin-left:auto}
.hide{display:none!important}
/* ───── 인증 ───── */
.auth{min-height:100%;display:flex;align-items:center;justify-content:center;padding:24px}
.auth .card{width:100%;max-width:440px;background:var(--sf);border-radius:var(--r2);box-shadow:var(--sh);padding:28px}
.auth .logo{font-size:1.6em;font-weight:900;text-align:center;margin-bottom:4px} .auth .logo b{color:var(--p)}
.auth .sub{text-align:center;color:var(--mu);margin-bottom:20px}
.tabs{display:flex;gap:4px;background:var(--sf2);border-radius:var(--r);padding:4px;margin-bottom:18px}
.tabs button{flex:1;padding:9px;border-radius:9px;font-weight:700;color:var(--mu)} .tabs button.on{background:var(--sf);color:var(--p);box-shadow:var(--sh)}
.field{margin-bottom:12px} .field label{display:block;font-weight:700;font-size:.9em;margin-bottom:5px;color:var(--mu)}
.err{background:#fdecec;color:var(--bad);border-radius:9px;padding:9px 12px;margin-bottom:12px;font-size:.92em}
.edpick{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}
.edpick label{border:2px solid var(--line);border-radius:var(--r);padding:10px 8px;text-align:center;cursor:pointer;background:var(--sf)}
.edpick input{display:none} .edpick input:checked+div{color:var(--p)} .edpick label:has(input:checked){border-color:var(--p);background:var(--pl)}
.edpick .ic{font-size:1.5em} .edpick .nm{font-weight:800;font-size:.9em} .edpick .ds{font-size:.72em;color:var(--mu)}
/* ───── 셸 ───── */
.shell{display:grid;grid-template-columns:240px 1fr;grid-template-rows:56px 1fr;height:100vh;height:100dvh}
.top{grid-column:1/3;display:flex;align-items:center;gap:10px;padding:0 14px;background:var(--sf);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.brand{font-weight:900;font-size:1.15em;display:flex;align-items:center;gap:6px;margin-right:6px} .brand b{color:var(--p)}
.top select{width:auto;max-width:200px;padding:7px 30px 7px 10px;font-weight:700;background:var(--sf2)}
.top .search{flex:1;max-width:420px} .top .search input{padding:7px 12px;background:var(--sf2)}
.top .edbadge{font-size:.72em;font-weight:800;color:var(--p);background:var(--pl);border-radius:999px;padding:3px 9px}
.side{background:var(--sf);border-right:1px solid var(--line);padding:12px 10px;overflow:auto}
.side a,.side .side-h{display:flex;align-items:center;gap:8px;padding:9px 10px;border-radius:10px;font-weight:700;color:var(--mu)}
.side a:hover{background:var(--sf2);color:var(--tx)} .side a.on{background:var(--pl);color:var(--p)}
.side .side-h{margin-top:10px;font-size:.78em;color:var(--mu2);text-transform:uppercase;letter-spacing:.04em}
.side .side-h button{margin-left:auto;color:var(--mu);font-weight:900;width:22px;height:22px;border-radius:6px} .side .side-h button:hover{background:var(--pl);color:var(--p)}
.side .dot{width:10px;height:10px;border-radius:50%;flex:none} .side .cnt{margin-left:auto;font-size:.75em;background:var(--sf2);border-radius:999px;padding:1px 7px;color:var(--mu)}
.main{overflow:auto;padding:22px 26px 90px}
.page-h{display:flex;align-items:center;gap:10px;margin-bottom:16px;flex-wrap:wrap} .page-h h1{margin:0;font-size:1.45em}
.page-h .sub{color:var(--mu);width:100%;margin-top:-6px}
.bottom{display:none}
@media (max-width:860px){
  .shell{grid-template-columns:1fr;grid-template-rows:56px 1fr}
  .side{display:none} .top .search{display:none} .top select{max-width:150px}
  .main{padding:16px 14px 100px}
  .bottom{display:flex;position:fixed;bottom:0;left:0;right:0;background:var(--sf);border-top:1px solid var(--line);z-index:6;padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
  .bottom a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:.7em;font-weight:700;color:var(--mu);padding:4px} .bottom a .ic{font-size:1.5em} .bottom a.on{color:var(--p)}
  .ed-kids .bottom a,.ed-senior .bottom a{font-size:.82em}
}
/* ───── 카드·그리드 ───── */
.card{background:var(--sf);border:1px solid var(--line);border-radius:var(--r2);padding:var(--pad);box-shadow:var(--sh)}
.card h3{margin:0 0 10px;font-size:1.05em;display:flex;align-items:center;gap:8px} .card h3 .right{font-weight:600;color:var(--mu);font-size:.85em}
.grid{display:grid;gap:14px} .grid.c2{grid-template-columns:1fr 1fr} .grid.c3{grid-template-columns:repeat(3,1fr)} .grid.c4{grid-template-columns:repeat(4,1fr)}
@media (max-width:860px){.grid.c2,.grid.c3,.grid.c4{grid-template-columns:1fr 1fr}} @media (max-width:520px){.grid.c3,.grid.c4{grid-template-columns:1fr 1fr}}
.stat{background:var(--sf);border:1px solid var(--line);border-radius:var(--r2);padding:14px 16px;box-shadow:var(--sh);cursor:pointer}
.stat .n{font-size:1.9em;font-weight:900;line-height:1.1} .stat .l{color:var(--mu);font-size:.85em;font-weight:700} .stat.bad .n{color:var(--bad)} .stat.ok .n{color:var(--ok)} .stat.p .n{color:var(--p)}
.ed-kids .stat .n,.ed-senior .stat .n{font-size:2.2em}
.quick{display:flex;gap:8px;margin-bottom:18px} .quick input{padding:12px 14px;font-size:1.05em;border-radius:var(--r2)} .quick .btn{border-radius:var(--r2)}
.ed-kids .quick input{font-size:1.15em}
/* ───── 할 일 목록 ───── */
.tl{display:flex;flex-direction:column;gap:6px}
.ti{display:flex;align-items:center;gap:10px;background:var(--sf);border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;cursor:pointer;transition:.12s}
.ti:hover{border-color:var(--p);box-shadow:var(--sh)} .ti.done{opacity:.6} .ti.done .tt{text-decoration:line-through}
.ti .tt{flex:1;font-weight:700;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .ti .meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;color:var(--mu);font-size:.8em}
.ed-kids .ti,.ed-senior .ti{padding:14px 14px} .ed-kids .ti .tt{white-space:normal}
.chk{width:22px;height:22px;border-radius:50%;border:2px solid var(--line);display:inline-flex;align-items:center;justify-content:center;flex:none;background:var(--sf);color:#fff;font-size:.8em;transition:.12s}
.chk:hover{border-color:var(--ok)} .chk.on{background:var(--ok);border-color:var(--ok)}
.ed-kids .chk,.ed-senior .chk{width:28px;height:28px;font-size:1em} .ed-kids .chk{border-radius:8px}
.pdot{width:8px;height:8px;border-radius:50%;display:inline-block}
.due{font-weight:700} .due.over{color:var(--bad)} .due.today{color:var(--warn)} .due.soon{color:var(--p)}
.pr-urgent{color:var(--bad)} .pr-high{color:#e8590c} .pr-low{color:var(--mu2)}
.empty{text-align:center;color:var(--mu);padding:26px 12px;background:var(--sf2);border-radius:var(--r);border:1px dashed var(--line)}
.sec-t{font-weight:800;margin:18px 0 8px;display:flex;align-items:center;gap:8px} .sec-t .cnt{color:var(--mu);font-weight:700;font-size:.85em}
/* ───── 칸반 ───── */
.board{display:flex;gap:12px;overflow-x:auto;padding-bottom:12px;align-items:flex-start;min-height:60vh}
.col{flex:0 0 290px;background:var(--sf2);border:1px solid var(--line);border-radius:var(--r2);padding:10px;display:flex;flex-direction:column;max-height:calc(100vh - 190px)}
.col.over{outline:2px dashed var(--p);outline-offset:-2px}
.col-h{display:flex;align-items:center;gap:6px;padding:4px 6px 10px;font-weight:800} .col-h .cnt{color:var(--mu);font-weight:700;font-size:.85em} .col-h .menu{margin-left:auto;color:var(--mu2);font-weight:900;border-radius:6px;padding:0 6px} .col-h .menu:hover{background:var(--pl);color:var(--p)}
.col-b{flex:1;overflow:auto;display:flex;flex-direction:column;gap:8px;min-height:40px}
.kc{background:var(--sf);border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;cursor:grab;box-shadow:var(--sh)}
.kc:hover{border-color:var(--p)} .kc.drag{opacity:.4} .kc.done{opacity:.65} .kc.done .tt{text-decoration:line-through}
.kc .tt{font-weight:700;margin-bottom:6px} .kc .meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:.78em;color:var(--mu)}
.col-add{margin-top:8px} .col-add input{padding:8px 10px;background:var(--sf)}
.add-col{flex:0 0 220px;background:transparent;border:1px dashed var(--line);border-radius:var(--r2);padding:14px;color:var(--mu);font-weight:700;text-align:center;cursor:pointer} .add-col:hover{border-color:var(--p);color:var(--p)}
/* ───── 리스트 테이블 ───── */
.tbl{width:100%;border-collapse:collapse;background:var(--sf);border:1px solid var(--line);border-radius:var(--r2);overflow:hidden;box-shadow:var(--sh)}
.tbl th,.tbl td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle;font-size:.95em} .tbl th{background:var(--sf2);font-size:.8em;color:var(--mu)}
.tbl tr:last-child td{border-bottom:0} .tbl tr.rowc{cursor:pointer} .tbl tr.rowc:hover td{background:var(--sf2)}
.tbl-wrap{overflow:auto;border-radius:var(--r2)}
/* ───── 캘린더 ───── */
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cal .dow{text-align:center;font-size:.8em;font-weight:800;color:var(--mu);padding:4px} .cal .dow.sun{color:var(--bad)} .cal .dow.sat{color:var(--p)}
.cal .day{min-height:96px;background:var(--sf);border:1px solid var(--line);border-radius:10px;padding:5px;cursor:pointer;display:flex;flex-direction:column;gap:3px}
.cal .day:hover{border-color:var(--p)} .cal .day.dim{opacity:.45} .cal .day.today{border-color:var(--p);box-shadow:0 0 0 2px var(--pl)}
.cal .dn{font-size:.8em;font-weight:800;color:var(--mu)} .cal .day.today .dn{color:var(--p)} .cal .day.sun .dn{color:var(--bad)}
.cal .ev{font-size:.72em;font-weight:700;border-radius:6px;padding:2px 5px;background:var(--pl);color:var(--p);overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .cal .ev.done{opacity:.55;text-decoration:line-through} .cal .ev.over{background:#fdecec;color:var(--bad)}
.cal .more{font-size:.7em;color:var(--mu)}
@media (max-width:860px){.cal .day{min-height:64px;padding:3px} .cal .ev{font-size:.6em;padding:1px 3px}}
/* ───── 메모 ───── */
.memos{columns:3;column-gap:14px} @media (max-width:1100px){.memos{columns:2}} @media (max-width:600px){.memos{columns:1}}
.memo{break-inside:avoid;margin-bottom:14px;border-radius:var(--r2);padding:14px;border:1px solid rgba(0,0,0,.06);box-shadow:var(--sh);cursor:pointer;position:relative;color:#2a2a2a}
.memo .mt{font-weight:800;margin-bottom:4px} .memo .mb{white-space:pre-wrap;word-break:break-word;font-size:.95em} .memo .pin{position:absolute;top:8px;right:10px;font-size:.9em}
.memo-new{background:var(--sf);border:1px solid var(--line);border-radius:var(--r2);padding:12px;margin-bottom:16px;box-shadow:var(--sh)}
.colors{display:flex;gap:6px} .colors span{width:22px;height:22px;border-radius:50%;border:2px solid transparent;cursor:pointer} .colors span.on{border-color:var(--tx)}
/* ───── 레이어(모달·시트) ───── */
#layer:empty{display:none} #layer{position:fixed;inset:0;z-index:50;background:rgba(20,25,40,.45);display:flex;align-items:flex-start;justify-content:center;padding:40px 14px;overflow:auto}
.modal{background:var(--sf);border-radius:var(--r2);width:100%;max-width:680px;box-shadow:0 20px 60px rgba(0,0,0,.25);padding:22px;animation:pop .15s ease-out}
.modal.sm{max-width:420px}
@keyframes pop{from{transform:translateY(8px);opacity:0}to{transform:none;opacity:1}}
.modal-h{display:flex;align-items:flex-start;gap:10px;margin-bottom:12px} .modal-h .x{margin-left:auto;font-size:1.3em;color:var(--mu);width:32px;height:32px;border-radius:8px} .modal-h .x:hover{background:var(--sf2);color:var(--tx)}
.ttitle{font-size:1.25em;font-weight:900;border:0;padding:4px 6px;background:transparent;border-radius:8px} .ttitle:focus{background:var(--sf2);box-shadow:none}
.props{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0} @media (max-width:600px){.props{grid-template-columns:1fr}}
.props label{display:block;font-size:.78em;font-weight:800;color:var(--mu);margin-bottom:3px}
.props select,.props input{padding:8px 10px}
.cl{display:flex;flex-direction:column;gap:4px} .cl .it{display:flex;align-items:center;gap:8px;padding:5px 6px;border-radius:8px} .cl .it:hover{background:var(--sf2)} .cl .it.on span.t{text-decoration:line-through;color:var(--mu)} .cl .it .del{margin-left:auto;color:var(--mu2)} .cl .it .del:hover{color:var(--bad)}
.cmt{display:flex;gap:8px;margin-bottom:10px} .cmt .body{background:var(--sf2);border-radius:10px;padding:8px 12px;flex:1;white-space:pre-wrap;word-break:break-word} .cmt .who{font-size:.78em;color:var(--mu);margin-bottom:2px}
.prog{height:6px;background:var(--line);border-radius:999px;overflow:hidden} .prog i{display:block;height:100%;background:var(--ok)}
.dangerzone{border-top:1px solid var(--line);margin-top:16px;padding-top:12px;display:flex;gap:8px;flex-wrap:wrap}
.menu-pop{position:absolute;background:var(--sf);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 30px rgba(0,0,0,.15);padding:6px;z-index:60;min-width:160px}
.menu-pop button{display:block;width:100%;text-align:left;padding:8px 12px;border-radius:8px;font-weight:700} .menu-pop button:hover{background:var(--sf2)} .menu-pop button.bad{color:var(--bad)}
/* ───── 설정·팀 ───── */
.member{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)} .member:last-child{border-bottom:0}
.code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:1.3em;font-weight:900;letter-spacing:.12em;background:var(--sf2);border-radius:10px;padding:10px 14px;display:inline-block}
.act{display:flex;gap:8px;padding:7px 0;border-bottom:1px solid var(--line);font-size:.9em;align-items:flex-start} .act:last-child{border-bottom:0} .act .t{color:var(--mu2);font-size:.8em;white-space:nowrap;margin-left:auto}
#toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);z-index:99;display:flex;flex-direction:column;gap:6px;align-items:center;pointer-events:none}
#toast div{background:#1f2430;color:#fff;border-radius:999px;padding:10px 18px;font-weight:700;box-shadow:0 8px 30px rgba(0,0,0,.25);animation:pop .15s} #toast div.bad{background:var(--bad)} #toast div.ok{background:var(--ok)}
.brand-img{width:26px;height:26px} .auth-logo{width:40px;height:40px;vertical-align:-10px;margin-right:6px}
.kids-cheer{font-size:2.6em;text-align:center;animation:cheer .9s ease-out forwards} @keyframes cheer{0%{transform:scale(.6);opacity:0}30%{transform:scale(1.15);opacity:1}100%{transform:scale(1);opacity:0}}
.ed-kids .ti .meta,.ed-senior .ti .meta{font-size:.9em}
.ed-senior input,.ed-senior select,.ed-senior textarea{border-width:2px}
.hint{font-size:.82em;color:var(--mu);margin-top:4px}
.pill-row{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px} .pill-row button{border-radius:999px;padding:6px 12px;font-weight:700;background:var(--sf);border:1px solid var(--line);color:var(--mu)} .pill-row button.on{background:var(--p);color:#fff;border-color:var(--p)}
/* ───── 소셜 로그인 ───── */
.soc-row{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.btn.soc{justify-content:center;padding:12px;font-size:1em;border-radius:var(--r)}
.btn.soc.kakao{background:#fee500;border-color:#fee500;color:#191919} .btn.soc.kakao:hover{background:#f7dc00}
.btn.soc.google{background:#fff;border-color:var(--line);color:var(--tx)} .btn.soc.google:hover{background:var(--sf2);border-color:var(--mu2)}
.or{display:flex;align-items:center;gap:10px;color:var(--mu2);font-size:.8em;margin-top:6px} .or::before,.or::after{content:'';flex:1;height:1px;background:var(--line)}
/* ───── v2: 동의·법적 고지·대기 ───── */
.agree{display:flex;gap:8px;align-items:flex-start;font-size:.92em;margin:-4px 0 12px;cursor:pointer} .agree input{width:18px;height:18px;margin-top:2px;flex:none} .agree a{color:var(--p);font-weight:700;text-decoration:underline} .req{color:var(--bad)}
.legal-note{font-size:.78em;color:var(--mu2);text-align:center;margin-top:10px} .legal-note a{color:var(--mu);text-decoration:underline}
.legal-links{text-align:center;margin-top:14px} .legal-links a{color:var(--p);font-weight:700}
.edpick.two{grid-template-columns:1fr 1fr}