@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap');
*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#f0f0f8;--surface:#fff;--surface2:#f5f5fc;--surface3:#eeeef8;
  --border:#e4e4f0;--border2:#d0d0e8;
  --accent:#6c6fc4;--accent-light:#eeeef8;--accent-mid:#9b9dd8;--accent-dark:#4a4d9e;
  --text:#1a1a2e;--text2:#5a5a7a;--text3:#9898b8;
  --map:#5b8dee;--map-bg:#edf3fd;--map-t:#2355a0;
  --tix:#a36bc7;--tix-bg:#f4ecfb;--tix-t:#6a3490;
  --evt:#4bb89e;--evt-bg:#e8f8f4;--evt-t:#276b5a;
  --red:#e05c7a;--red-bg:#fdedf1;--red-t:#9c2a42;
  --amber:#e09a3a;--amber-bg:#fdf3e3;--amber-t:#8a5a10;
  --green:#4caf7d;--green-bg:#e8f7ef;--green-t:#276640;
  --r:12px;--rsm:8px;
}
body{font-family:'Plus Jakarta Sans',system-ui,sans-serif;background:var(--bg);color:var(--text);font-size:14px;line-height:1.5;min-height:100vh}

/* AUTH */
.auth-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg)}
.auth-card{background:var(--surface);border:1px solid var(--border);border-radius:20px;padding:2rem;width:420px;max-width:95vw;box-shadow:0 8px 40px rgba(108,111,196,.1)}
.auth-logo{display:flex;align-items:center;gap:12px;margin-bottom:1.75rem}
.auth-avatar{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#8b8fd4,#6c6fc4);display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:#fff;flex-shrink:0}
.auth-title{font-size:16px;font-weight:700;color:var(--text)}
.auth-sub{font-size:12px;color:var(--text3)}
.auth-error{background:var(--red-bg);color:var(--red-t);border:1px solid #f5c0cc;border-radius:var(--rsm);padding:10px 12px;font-size:13px;margin-bottom:1rem}
.auth-btn{width:100%;padding:10px;border-radius:var(--rsm);border:none;background:var(--accent);color:#fff;font-size:14px;font-weight:600;cursor:pointer;font-family:inherit;transition:opacity .12s;margin-top:.25rem}
.auth-btn:hover{opacity:.88}
.auth-btn:disabled{opacity:.6;cursor:not-allowed}
.auth-switch{text-align:center;font-size:12.5px;color:var(--text3);margin-top:1rem}
.auth-switch span{color:var(--accent);cursor:pointer;font-weight:600}
.auth-switch span:hover{text-decoration:underline}

/* APP LAYOUT */
.app{display:grid;grid-template-columns:220px 1fr;min-height:100vh}

/* SIDEBAR */
.sb{background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;height:100vh;position:sticky;top:0}
.sb-logo{padding:1.25rem 1.25rem 1rem;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--border);flex-shrink:0}
.sb-avatar{width:32px;height:32px;border-radius:10px;background:linear-gradient(135deg,#8b8fd4,#6c6fc4);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#fff;flex-shrink:0}
.sb-name{font-size:13px;font-weight:700;color:var(--text)}
.sb-role{font-size:11px;color:var(--text3)}
.sb-body{flex:1;overflow-y:auto;padding:.875rem .875rem 0}
.sb-sec{margin-bottom:1.125rem}
.sb-sec-lbl{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text3);padding:0 .5rem;margin-bottom:4px;display:block}
.ni{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:var(--rsm);cursor:pointer;color:var(--text2);font-size:12.5px;font-weight:500;border:none;background:none;width:100%;text-align:left;transition:all .12s;font-family:inherit}
.ni:hover{background:var(--surface2);color:var(--text)}
.ni.active{color:var(--accent-dark);background:var(--accent-light)}
.ni.a-map{background:var(--map-bg);color:var(--map-t)}
.ni.a-tix{background:var(--tix-bg);color:var(--tix-t)}
.ni.a-evt{background:var(--evt-bg);color:var(--evt-t)}
.ni.a-rem{background:var(--red-bg);color:var(--red-t)}
.ni.a-cal{background:var(--accent-light);color:var(--accent-dark)}
.ni i{font-size:15px;width:17px;flex-shrink:0}
.ni .pill{margin-left:auto;font-size:10px;font-weight:600;padding:1px 6px;border-radius:20px;background:var(--surface3);color:var(--text3);flex-shrink:0;min-width:18px;text-align:center}
.ni.a-map .pill{background:var(--map);color:#fff}
.ni.a-tix .pill{background:var(--tix);color:#fff}
.ni.a-evt .pill{background:var(--evt);color:#fff}
.ni.a-rem .pill{background:var(--red);color:#fff}
.ni.a-cal .pill{background:var(--accent);color:#fff}
.sb-footer{padding:.875rem;border-top:1px solid var(--border);flex-shrink:0;display:flex;flex-direction:column;gap:6px}
.sb-add-btn{display:flex;align-items:center;justify-content:center;gap:7px;padding:9px;border-radius:var(--rsm);cursor:pointer;color:#fff;font-size:13px;font-weight:600;border:none;background:var(--accent);width:100%;transition:opacity .12s;font-family:inherit}
.sb-add-btn:hover{opacity:.88}
.signout-btn{display:flex;align-items:center;justify-content:center;gap:7px;padding:7px;border-radius:var(--rsm);cursor:pointer;color:var(--text3);font-size:12.5px;font-weight:500;border:1px solid var(--border);background:none;width:100%;transition:all .12s;font-family:inherit}
.signout-btn:hover{background:var(--red-bg);color:var(--red-t);border-color:#f5c0cc}

/* MAIN */
.main{display:flex;flex-direction:column;min-height:100vh;overflow:hidden}
.topbar{background:var(--surface);border-bottom:1px solid var(--border);padding:.875rem 1.5rem;display:flex;align-items:center;gap:10px;flex-shrink:0}
.topbar-title{font-size:16px;font-weight:700;flex:1;color:var(--text)}
.topbar-badge{font-size:11px;font-weight:700;padding:3px 10px;border-radius:20px}
.tb-map{background:var(--map-bg);color:var(--map-t)}
.tb-tix{background:var(--tix-bg);color:var(--tix-t)}
.tb-evt{background:var(--evt-bg);color:var(--evt-t)}
.tb-rem{background:var(--red-bg);color:var(--red-t)}
.tb-cal{background:var(--accent-light);color:var(--accent-dark)}
.abtn{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:var(--rsm);font-size:13px;font-weight:600;cursor:pointer;border:none;font-family:inherit;transition:opacity .12s;color:#fff}
.abtn:hover{opacity:.88}
.abtn-map{background:var(--map)}
.abtn-tix{background:var(--tix)}
.abtn-evt{background:var(--evt)}
.abtn-acc{background:var(--accent)}
.content{padding:1.25rem 1.5rem;display:flex;flex-direction:column;gap:1rem;flex:1;overflow-y:auto}

/* STATS */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.sc{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:.875rem 1rem}
.sc-lbl{font-size:10px;color:var(--text3);font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px}
.sc-val{font-size:22px;font-weight:700;color:var(--text);line-height:1.2}
.sc-sub{font-size:11px;color:var(--text3);margin-top:2px}

/* CARDS */
.items{display:flex;flex-direction:column;gap:8px}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;transition:border-color .12s,box-shadow .12s}
.card:hover{border-color:var(--border2)}
.card.od{border-color:#f0b8c8}
.card-head{display:flex;align-items:flex-start;gap:10px;padding:.9rem 1.1rem;cursor:pointer;user-select:none}
.chev{color:var(--text3);font-size:13px;transition:transform .15s;flex-shrink:0;margin-top:2px}
.chev.open{transform:rotate(90deg)}
.card-title{font-size:13.5px;font-weight:600;color:var(--text)}
.card-title.done{text-decoration:line-through;color:var(--text3)}
.card-meta{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-top:5px}
.tag{display:inline-flex;align-items:center;gap:3px;padding:2px 8px;border-radius:20px;font-size:11px;font-weight:600;white-space:nowrap}
.tag-map{background:var(--map-bg);color:var(--map-t)}
.tag-tix{background:var(--tix-bg);color:var(--tix-t)}
.tag-evt-up{background:var(--evt-bg);color:var(--evt-t)}
.tag-past{background:var(--surface2);color:var(--text3)}
.tag-n{background:var(--surface2);color:var(--text2)}
.tag-od{background:var(--red-bg);color:var(--red-t)}
.tag-done{background:var(--green-bg);color:var(--green-t)}
.card-date{font-size:11px;color:var(--text3);display:flex;align-items:center;gap:3px}
.card-actions{display:flex;gap:2px;margin-left:auto;opacity:0;transition:opacity .12s;flex-shrink:0}
.card:hover .card-actions{opacity:1}
.ib{width:28px;height:28px;border-radius:var(--rsm);border:none;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text3);transition:all .12s}
.ib:hover{background:var(--surface2);color:var(--text)}
.ib i{font-size:14px}

/* EXPAND */
.eb{display:none;border-top:1px solid var(--border)}
.eb-sec{padding:.9rem 1.1rem}
.eb-sec+.eb-sec{border-top:1px solid var(--border)}
.eb-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--text3);margin-bottom:8px}

/* PIPELINE */
.stages{display:flex;flex-wrap:wrap;gap:4px}
.stage{display:inline-flex;align-items:center;gap:4px;padding:5px 10px;border-radius:var(--rsm);font-size:11px;font-weight:600;cursor:pointer;white-space:nowrap;border:1px solid var(--border);background:var(--surface2);color:var(--text3);transition:all .12s;font-family:inherit}
.stage:hover{border-color:var(--border2);color:var(--text2)}
.stage.s-done{border-color:#7dcca8;background:var(--green-bg);color:var(--green-t)}
.stage.s-cur-map{border-color:var(--map);background:var(--map-bg);color:var(--map-t)}
.stage.s-cur-tix{border-color:var(--tix);background:var(--tix-bg);color:var(--tix-t)}

/* DATES */
.dates-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.d-lbl{font-size:11px;color:var(--text3);margin-bottom:3px;display:block;font-weight:500}
.d-inp{width:100%;border:1px solid var(--border2);border-radius:var(--rsm);padding:7px 10px;font-size:12.5px;color:var(--text);background:var(--surface);font-family:inherit;outline:none}
.d-inp:focus{border-color:var(--accent)}
.d-inp:disabled{opacity:.5;cursor:not-allowed}

/* NOTES */
.note-inp{width:100%;border:none;outline:none;background:none;font-size:12.5px;color:var(--text2);font-family:inherit;resize:none;line-height:1.6;min-height:36px}
.note-inp::placeholder{color:var(--text3)}

/* SUBTASKS */
.st-row{display:flex;align-items:center;gap:9px;padding:7px 0;border-bottom:1px solid var(--border)}
.st-row:last-child{border-bottom:none}
.cb{width:16px;height:16px;border-radius:4px;border:2px solid var(--border2);flex-shrink:0;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .12s;background:none}
.cb:hover{border-color:var(--evt)}
.cb.chk{background:var(--evt);border-color:var(--evt)}
.cb.chk::after{content:'';width:4px;height:7px;border:2px solid #fff;border-top:none;border-left:none;transform:rotate(45deg) translate(-0.5px,-1px);display:block}
.st-txt{font-size:13px;color:var(--text2);flex:1}
.st-txt.chk{text-decoration:line-through;color:var(--text3)}
.st-del{opacity:0;transition:opacity .12s}
.st-row:hover .st-del{opacity:1}
.st-add-row{display:flex;align-items:center;gap:8px;margin-top:10px}
.st-inp{flex:1;border:1px solid var(--border2);border-radius:var(--rsm);padding:8px 10px;font-size:13px;color:var(--text);background:var(--surface);font-family:inherit;outline:none}
.st-inp:focus{border-color:var(--evt)}
.st-add-btn{padding:8px 13px;font-size:12.5px;font-weight:600;border-radius:var(--rsm);border:1px solid var(--border2);background:none;color:var(--text2);cursor:pointer;font-family:inherit;white-space:nowrap;transition:all .12s}
.st-add-btn:hover{background:var(--surface2);color:var(--text)}
.prog-bar{height:3px;background:var(--surface3);border-radius:2px;overflow:hidden;margin-top:5px}
.prog-fill{height:100%;background:var(--evt);border-radius:2px;transition:width .3s}

/* EMPTY */
.empty{text-align:center;padding:3rem 1rem;color:var(--text3)}
.empty i{font-size:36px;display:block;margin-bottom:10px;color:var(--accent-mid)}
.empty-t{font-size:14px;font-weight:600;margin-bottom:4px;color:var(--text2)}

/* REMINDER */
.rem-card{background:var(--surface);border:1px solid #f0b8c8;border-radius:var(--r);padding:1rem 1.1rem;display:flex;gap:12px}
.rem-ico{width:36px;height:36px;border-radius:50%;background:var(--red-bg);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.rem-ico i{font-size:17px;color:var(--red)}

/* CALENDAR */
.cal-wrap{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);overflow:hidden}
.cal-header{display:flex;align-items:center;justify-content:space-between;padding:.9rem 1.1rem;border-bottom:1px solid var(--border)}
.cal-nav{display:flex;align-items:center;gap:8px}
.cal-nav-btn{width:30px;height:30px;border-radius:var(--rsm);border:1px solid var(--border2);background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text2);transition:all .12s;font-family:inherit}
.cal-nav-btn:hover{background:var(--surface2)}
.cal-month{font-size:15px;font-weight:700;color:var(--text);min-width:130px;text-align:center}
.cal-legend{display:flex;gap:10px;flex-wrap:wrap}
.leg-item{display:flex;align-items:center;gap:5px;font-size:11px;font-weight:500;color:var(--text2)}
.leg-dot{width:8px;height:8px;border-radius:50%}
.cal-filters{display:flex;flex-wrap:wrap;gap:6px;padding:.75rem 1.1rem;border-bottom:1px solid var(--border);align-items:center}
.cal-filter-lbl{font-size:11px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;margin-right:4px}
.cal-chip{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:20px;font-size:11px;font-weight:600;cursor:pointer;border:1px solid var(--border);background:var(--surface2);color:var(--text2);transition:all .12s;user-select:none}
.cal-chip.on-map{border-color:var(--map);background:var(--map-bg);color:var(--map-t)}
.cal-chip.on-tix{border-color:var(--tix);background:var(--tix-bg);color:var(--tix-t)}
.cal-chip.on-evt{border-color:var(--evt);background:var(--evt-bg);color:var(--evt-t)}
.cal-grid-head{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-bottom:1px solid var(--border)}
.cal-day-lbl{text-align:center;padding:6px 4px;font-size:11px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.05em}
.cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.cal-cell{min-height:80px;padding:6px 5px 4px;border-right:1px solid var(--border);border-bottom:1px solid var(--border)}
.cal-cell:nth-child(7n){border-right:none}
.cal-cell.other-month .cal-dn{color:var(--text3)}
.cal-cell.today-cell{background:var(--accent-light)}
.cal-cell.today-cell .cal-dn{background:var(--accent);color:#fff;border-radius:50%;width:22px;height:22px;display:flex;align-items:center;justify-content:center;font-weight:700}
.cal-dn{font-size:12px;font-weight:600;color:var(--text2);margin-bottom:3px;line-height:22px}
.cal-event{font-size:10px;font-weight:600;padding:2px 5px;border-radius:4px;margin-bottom:2px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;cursor:default;line-height:1.4}
.ce-map{background:var(--map-bg);color:var(--map-t)}
.ce-tix{background:var(--tix-bg);color:var(--tix-t)}
.ce-evt{background:var(--evt-bg);color:var(--evt-t)}
.more-pill{font-size:10px;color:var(--text3);font-weight:500;padding:1px 4px}

/* MODAL */
.modal-wrap{background:rgba(26,26,46,.35);display:none;align-items:center;justify-content:center;position:fixed;inset:0;z-index:100}
.modal-wrap.open{display:flex}
.modal{background:var(--surface);border-radius:16px;padding:1.5rem;width:490px;max-width:95vw;border:1px solid var(--border);box-shadow:0 20px 60px rgba(0,0,0,.15)}
.mh{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.25rem}
.mt{font-size:15px;font-weight:700}
.fg{margin-bottom:.875rem}
.fl{font-size:12px;font-weight:600;color:var(--text2);margin-bottom:4px;display:block}
.fi{width:100%;padding:8px 11px;border:1px solid var(--border2);border-radius:var(--rsm);font-family:inherit;font-size:13px;color:var(--text);background:var(--surface);outline:none;transition:border-color .12s}
.fi:focus{border-color:var(--accent)}
.fr{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mf{display:flex;justify-content:flex-end;gap:8px;margin-top:1rem}
.cancel-btn{padding:8px 16px;font-size:13px;font-weight:600;border-radius:var(--rsm);border:1px solid var(--border2);background:none;color:var(--text2);cursor:pointer;font-family:inherit;transition:all .12s}
.cancel-btn:hover{background:var(--surface2)}

/* SPINNER */
@keyframes spin{to{transform:rotate(360deg)}}
