:root{
  --blue:#1a73e8; --blue-d:#1557b0; --bg:#f0f2f5; --line:#e3e7ee;
  --ok:#137333; --danger:#d93025; --text:#202124;
}
*{ box-sizing:border-box; }
body{ margin:0; font-family:system-ui,Segoe UI,Arial,sans-serif; background:var(--bg); color:var(--text); }
a{ color:var(--blue); }

.topbar{ position:fixed; top:0; left:0; right:0; height:52px; background:var(--blue); color:#fff;
  display:flex; align-items:center; justify-content:space-between; padding:0 18px; z-index:100;
  box-shadow:0 2px 6px rgba(0,0,0,.2); }
.topbar .brand{ font-weight:600; font-size:16px; }
.topbar .right{ display:flex; align-items:center; gap:12px; font-size:13px; }
.topbar button{ background:rgba(255,255,255,.15); color:#fff; border:1px solid rgba(255,255,255,.4);
  padding:6px 12px; border-radius:7px; cursor:pointer; font-size:13px; }
.topbar button:hover{ background:rgba(255,255,255,.28); }

.sidebar{ position:fixed; top:52px; left:0; bottom:0; width:212px; background:#fff;
  border-right:1px solid var(--line); overflow-y:auto; z-index:90; }
.menu{ list-style:none; margin:0; padding:8px 0; }
.menu li{ padding:11px 18px; cursor:pointer; font-size:14px; color:#333; border-left:3px solid transparent; }
.menu li:hover{ background:#f0f4ff; }
.menu li.active{ background:#e8f0fe; color:var(--blue); font-weight:600; border-left-color:var(--blue); }

.main{ margin-left:212px; margin-top:52px; padding:22px 24px; }
h1.page{ font-size:20px; margin:0 0 16px; }

.toolbar{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:14px; }
.toolbar input[type=text]{ padding:7px 10px; border:1px solid #d6dbe5; border-radius:7px; font-size:13px; }

.btn{ padding:7px 13px; border:none; border-radius:7px; cursor:pointer; font-size:13px; }
.btn-primary{ background:var(--blue); color:#fff; } .btn-primary:hover{ background:var(--blue-d); }
.btn-secondary{ background:#e6e9ef; color:#333; } .btn-secondary:hover{ background:#dadfe8; }
.btn-danger{ background:none; color:var(--danger); font-size:15px; padding:2px 6px; cursor:pointer; border:none; }

.tbl-wrap{ background:#fff; border-radius:10px; box-shadow:0 1px 6px rgba(0,0,0,.07);
  overflow:auto; max-height:calc(100vh - 200px); }
table{ width:100%; border-collapse:separate; border-spacing:0; font-size:13px; }
th{ position:sticky; top:0; background:var(--blue); color:#fff; padding:7px 9px; text-align:left;
  white-space:nowrap; cursor:pointer; z-index:1; }
td{ padding:5px 9px; border-bottom:1px solid var(--line); vertical-align:top; }
tr:nth-child(even) td{ background:#f7f9ff; }
tr:hover td{ background:#eef4ff; }
td[contenteditable]{ cursor:text; min-width:60px; }
td[contenteditable]:focus{ outline:2px solid var(--blue); background:#fff; }
tr.done td{ color:#9aa0a6; }
tr.done td:not(:last-child){ text-decoration:line-through; }
input.cell-date{ border:1px solid #d6dbe5; border-radius:5px; padding:3px; font-size:12px; }

.form-row{ background:#fff; border-radius:10px; padding:14px; box-shadow:0 1px 6px rgba(0,0,0,.07);
  margin-bottom:14px; display:none; }
.form-row.show{ display:block; }
.form-row .fields{ display:flex; gap:10px; flex-wrap:wrap; align-items:flex-end; }
.field{ display:flex; flex-direction:column; font-size:12px; color:#555; gap:3px; }
.field input{ padding:7px; border:1px solid #d6dbe5; border-radius:6px; font-size:13px; }

.toast{ position:fixed; bottom:22px; left:50%; transform:translateX(-50%); background:#323232; color:#fff;
  padding:11px 18px; border-radius:8px; font-size:13px; z-index:9999; opacity:0; transition:opacity .2s; pointer-events:none; }
.toast.show{ opacity:1; }
.toast.err{ background:var(--danger); }

.muted{ color:#5f6368; }
.tiles{ display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:14px; max-width:760px; }
.tile{ background:#fff; border-radius:10px; padding:18px; box-shadow:0 1px 6px rgba(0,0,0,.07);
  cursor:pointer; text-decoration:none; color:#333; display:block; }
.tile:hover{ box-shadow:0 3px 12px rgba(0,0,0,.13); }
.tile.disabled{ opacity:.5; cursor:default; }
.tile .ic{ font-size:26px; } .tile .t{ margin-top:8px; font-weight:600; font-size:14px; }