:root{--p-gray-0: #ffffff;--p-gray-50: #f7f7f8;--p-gray-100: #f1f1f3;--p-gray-200: #e4e4e8;--p-gray-400: #8a8a94;--p-gray-600: #6b6b76;--p-gray-700: #4a4a55;--p-gray-900: #1e1e24;--p-berry-50: #f8eef2;--p-berry-600: #8a2b4e;--p-red-50: #fcecea;--p-red-600: #b3261e;--p-yellow-50: #fbf3d9;--p-yellow-700: #7a5b00;--p-blue-600: #1f5fbf;--c-primary: var(--p-berry-600);--c-primary-soft: var(--p-berry-50);--c-bg-1: var(--p-gray-0);--c-bg-2: var(--p-gray-50);--c-bg-hover: var(--p-gray-100);--c-text-1: var(--p-gray-900);--c-text-2: var(--p-gray-700);--c-text-3: var(--p-gray-600);--c-text-on: var(--p-gray-0);--c-divider-1: var(--p-gray-200);--c-border-input: var(--p-gray-400);--c-focus: var(--p-blue-600);--c-error: var(--p-red-600);--c-error-bg: var(--p-red-50);--c-warning: var(--p-yellow-700);--c-warning-bg: var(--p-yellow-50);--c-overlay: rgb(0 0 0 / .2);--c-toast: var(--p-gray-900);--fs-12: 12px;--fs-14: 14px;--fs-16: 16px;--fs-20: 20px;--fw-regular: 400;--fw-semibold: 600;--lh-tight: 1.2;--lh-normal: 1.4;--font-base: "IBM Plex Sans KR", sans-serif;--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-6: 24px;--sp-8: 32px;--h-control: 36px;--h-control-sm: 28px;--h-touch: 44px;--r-card: 8px;--r-control: 6px;--r-chip: 4px;--shadow-pop: 0 4px 16px rgb(0 0 0 / .08)}*{box-sizing:border-box}body{margin:0;background:var(--c-bg-2);color:var(--c-text-1);font:var(--fw-regular) var(--fs-14)/var(--lh-normal) var(--font-base)}button,input{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}:focus-visible{outline:2px solid var(--c-focus);outline-offset:1px}.wrap{max-width:1280px;margin:0 auto;padding:var(--sp-6)}.login{max-width:400px;margin:0 auto;padding:var(--sp-8) var(--sp-4)}.stack{display:flex;flex-direction:column;gap:var(--sp-3);margin-top:var(--sp-6)}.field{display:block;font-size:var(--fs-12);color:var(--c-text-2)}.field input{display:block;width:100%;height:var(--h-control);margin-top:var(--sp-1);padding:0 var(--sp-3);border:1px solid var(--c-border-input);border-radius:var(--r-control);background:var(--c-bg-1);font-size:var(--fs-14)}.head{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--sp-4);margin-bottom:var(--sp-4)}h1{margin:0;font-size:var(--fs-20);font-weight:var(--fw-semibold);line-height:var(--lh-tight)}.sum{margin:var(--sp-1) 0 0;color:var(--c-text-2)}.sum b{font-weight:var(--fw-semibold);color:var(--c-error)}.side{display:flex;align-items:center;gap:var(--sp-3)}.status{font-size:var(--fs-12);color:var(--c-text-3);white-space:nowrap}.status.stop{padding:0 var(--sp-2);border-radius:var(--r-chip);background:var(--c-warning-bg);color:var(--c-warning);line-height:20px;white-space:normal}.err{margin:0 0 var(--sp-3);padding:var(--sp-2) var(--sp-3);border-radius:var(--r-control);background:var(--c-error-bg);color:var(--c-error)}.add{display:flex;gap:var(--sp-2);margin-bottom:var(--sp-6);align-items:flex-end}.add label{flex:1;display:block;font-size:var(--fs-12);color:var(--c-text-2)}.add input{display:block;width:100%;height:var(--h-control);margin-top:var(--sp-1);padding:0 var(--sp-3);border:1px solid var(--c-border-input);border-radius:var(--r-control);background:var(--c-bg-1);font-size:var(--fs-14);color:var(--c-text-1)}.btn{height:var(--h-control);padding:0 var(--sp-4);border:1px solid var(--c-border-input);border-radius:var(--r-control);background:var(--c-bg-1);white-space:nowrap}.btn:hover:not(:disabled){background:var(--c-bg-hover)}.btn.pri{background:var(--c-primary);border-color:var(--c-primary);color:var(--c-text-on);font-weight:var(--fw-semibold)}.btn.pri:hover:not(:disabled){background:var(--c-primary)}.btn.pri:disabled{opacity:.5}.btn.sm{height:var(--h-control-sm);padding:0 var(--sp-2);font-size:var(--fs-12)}.btn.txt{height:auto;padding:var(--sp-1) 0;border:0;background:none;color:var(--c-text-2);font-size:var(--fs-12);text-decoration:underline}.btn.txt:hover:not(:disabled){background:none}section{margin-bottom:var(--sp-6)}h2{display:flex;align-items:center;flex-wrap:wrap;gap:var(--sp-2);min-height:var(--h-control-sm);margin:0 0 var(--sp-2);font-size:var(--fs-16);font-weight:var(--fw-semibold)}h2 .n,.fold .n{font-size:var(--fs-12);font-weight:var(--fw-regular);color:var(--c-text-3)}h2 .n.bad{padding:0 var(--sp-2);border-radius:var(--r-chip);background:var(--c-error-bg);color:var(--c-error);line-height:20px}h2 .act{margin-left:auto}.note{font-size:var(--fs-12);font-weight:var(--fw-regular);color:var(--c-text-2)}.grid{display:grid;grid-template-columns:400px minmax(0,1fr);gap:var(--sp-6);align-items:start}.card{background:var(--c-bg-1);border:1px solid var(--c-divider-1);border-radius:var(--r-card)}.row{display:flex;align-items:center;gap:var(--sp-3);min-height:40px;padding:var(--sp-2) var(--sp-3);border-top:1px solid var(--c-divider-1);cursor:pointer}.row:first-child{border-top:0;border-radius:var(--r-card) var(--r-card) 0 0}.row:hover{background:var(--c-bg-hover)}.row.tall{align-items:flex-start}.row.flash{background:var(--c-primary-soft)}.chk{flex:none;position:relative;width:20px;height:20px;padding:0;border:1px solid var(--c-border-input);border-radius:var(--r-chip);background:var(--c-bg-1)}.chk:after{content:"";position:absolute;top:-12px;right:-12px;bottom:-12px;left:-12px}.chk:hover{border-color:var(--c-primary);background:var(--c-primary-soft)}.main{flex:1;min-width:0}.title{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;overflow-wrap:anywhere}.plain{padding:0;border:0;background:none;text-align:left;overflow-wrap:anywhere}.chip{display:inline-block;height:20px;padding:0 var(--sp-2);border-radius:var(--r-chip);font-size:var(--fs-12);line-height:20px;white-space:nowrap}.chip.unc{background:var(--c-warning-bg);color:var(--c-warning)}.ev{margin-top:var(--sp-1);font-size:var(--fs-12);color:var(--c-text-2);overflow-wrap:anywhere}.meta{margin-top:var(--sp-1);font-size:var(--fs-12);color:var(--c-text-3);overflow-wrap:anywhere}.meta .bad,.due.bad{color:var(--c-error);font-weight:var(--fw-semibold)}.due{flex:none;width:112px;font-size:var(--fs-12);color:var(--c-text-2);font-variant-numeric:tabular-nums}.from{flex:none;width:136px;font-size:var(--fs-12);color:var(--c-text-3);text-align:right;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.moves{display:flex;gap:var(--sp-1);margin-top:var(--sp-2)}.empty{padding:var(--sp-4);color:var(--c-text-2)}.fold{display:flex;align-items:center;gap:var(--sp-2);width:100%;min-height:var(--h-control);padding:0;border:0;background:none;text-align:left}.fold b{font-size:var(--fs-16);font-weight:var(--fw-semibold)}.fold .soon{margin-left:auto;font-size:var(--fs-12);color:var(--c-text-2)}.fold+.card{margin-top:var(--sp-2)}details>summary{cursor:pointer;padding:var(--sp-2) 0;color:var(--c-text-2)}.done .title{color:var(--c-text-3);text-decoration:line-through}.btabs{display:none}.scrim{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--c-overlay)}.panel{position:fixed;top:0;right:0;bottom:0;width:400px;max-width:100%;padding:var(--sp-6);background:var(--c-bg-1);border-left:1px solid var(--c-divider-1);box-shadow:var(--shadow-pop);overflow:auto}.panel h3{margin:0 var(--sp-8) var(--sp-4) 0;font-size:var(--fs-16);font-weight:var(--fw-semibold);overflow-wrap:anywhere}.panel .x{position:absolute;top:var(--sp-4);right:var(--sp-4);width:var(--h-control);height:var(--h-control);border:0;background:none;font-size:var(--fs-20)}.panel dl{margin:0 0 var(--sp-6)}.panel dt{margin-top:var(--sp-3);font-size:var(--fs-12);color:var(--c-text-3)}.panel dd{margin:var(--sp-1) 0 0;overflow-wrap:anywhere}.date{height:var(--h-control);padding:0 var(--sp-2);border:1px solid var(--c-border-input);border-radius:var(--r-control);background:var(--c-bg-1)}.date-now{margin:0 var(--sp-2);font-size:var(--fs-12);color:var(--c-text-2)}.note-line{margin:0 0 var(--sp-4);font-size:var(--fs-12);color:var(--c-text-2)}.foot{display:flex;gap:var(--sp-2)}.toast{position:fixed;top:var(--sp-4);right:var(--sp-6);display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-2) var(--sp-3);background:var(--c-toast);color:var(--c-text-on);border-radius:var(--r-card)}.toast button{height:var(--h-control-sm);border:0;background:none;color:var(--c-text-on);text-decoration:underline;font-weight:var(--fw-semibold)}@media(max-width:1023px){.grid{grid-template-columns:minmax(0,1fr)}}@media(max-width:767px){.wrap{padding:var(--sp-4)}.head{display:block}.side{justify-content:space-between;margin-top:var(--sp-1)}.add input,.field input{height:var(--h-touch);font-size:var(--fs-16)}.btn{height:var(--h-touch)}.btn.txt{min-height:var(--h-touch)}.row{flex-wrap:wrap;gap:var(--sp-1) var(--sp-3);padding:var(--sp-3);min-height:56px}.row .main{flex:1 1 calc(100% - 32px)}.row .due{width:auto;margin-left:var(--sp-8)}.row .from{flex:1;width:auto;min-width:0;text-align:left}.moves .btn{height:var(--h-touch);flex:1;font-size:var(--fs-14)}h2 .act .btn{height:var(--h-control)}.row>.btn.sm{height:var(--h-touch)}.btabs{display:flex;gap:var(--sp-1);margin-bottom:var(--sp-4);border-bottom:1px solid var(--c-divider-1)}.btabs button{flex:1;height:var(--h-touch);border:0;border-bottom:2px solid transparent;background:none;color:var(--c-text-2)}.btabs button[aria-selected=true]{border-color:var(--c-text-1);color:var(--c-text-1);font-weight:var(--fw-semibold)}.off{display:none}.fold{min-height:var(--h-touch)}.panel{top:auto;left:0;width:100%;max-height:85vh;border-left:0;border-top:1px solid var(--c-divider-1);border-radius:var(--r-card) var(--r-card) 0 0}.panel .foot .btn{flex:1}.date{height:var(--h-touch)}.toast{top:auto;bottom:var(--sp-4);left:var(--sp-4);right:var(--sp-4);justify-content:space-between}.toast button{height:var(--h-touch)}}
