:root{
  --bg:#1C1B19;
  --panel:#262420;
  --accent:#D97757;
  --text:#F5F3EF;
  --muted:#b7b2a8;
  --border:#34322d;
  --radius:14px;
  /* segment colors (derived, kept warm/on-theme) */
  --seg-sport:#D97757;
  --seg-screen:#c98bb0;
  --seg-tech:#7fae9b;
  --seg-world:#d8b15a;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  font-size:16px;
  line-height:1.45;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{margin:0;font-weight:600;}
button{font-family:inherit;cursor:pointer;}
a{color:inherit;text-decoration:none;}

/* ---------- Top bar ---------- */
.topbar{
  position:sticky;top:0;z-index:30;
  display:flex;align-items:center;gap:12px;
  padding:12px 16px;
  background:var(--bg);
  border-bottom:1px solid var(--border);
}
.brand{display:flex;align-items:center;gap:8px;flex:1;}
.brand-dot{font-size:22px;}
.brand h1{font-size:18px;letter-spacing:.2px;}
.view-switch{display:flex;gap:4px;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:4px;}
.seg-btn{
  background:transparent;border:none;color:var(--muted);
  padding:8px 16px;border-radius:10px;font-size:15px;font-weight:500;
  min-height:36px;
}
.seg-btn.active{background:var(--accent);color:#1C1B19;font-weight:600;}

.icon-btn{
  background:var(--panel);border:1px solid var(--border);color:var(--text);
  width:44px;height:44px;border-radius:12px;font-size:18px;
  display:inline-flex;align-items:center;justify-content:center;
}
.icon-btn:active{transform:scale(.96);}

/* ---------- Layout ---------- */
.layout{display:flex;align-items:flex-start;}

/* ---------- Sidebar ---------- */
.sidebar{
  width:320px;flex-shrink:0;
  height:calc(100vh - 65px);
  position:sticky;top:65px;
  overflow-y:auto;
  border-right:1px solid var(--border);
  padding:16px;
}
.sidebar-head{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.sidebar-head h2{font-size:17px;flex:1;}
.on-count{
  background:var(--panel);border:1px solid var(--border);
  color:var(--accent);font-size:13px;font-weight:600;
  padding:4px 10px;border-radius:20px;white-space:nowrap;
}
.search-wrap{margin-bottom:16px;}
#search{
  width:100%;background:var(--panel);border:1px solid var(--border);
  color:var(--text);font-size:16px;padding:12px 14px;border-radius:12px;
  min-height:44px;
}
#search::placeholder{color:var(--muted);}
#search:focus{outline:none;border-color:var(--accent);}

.menu-segment{margin-bottom:20px;}
.seg-header{display:flex;align-items:center;gap:8px;margin-bottom:8px;}
.seg-title{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);flex:1;}
.seg-actions{display:flex;gap:6px;}
.mini-btn{
  background:transparent;border:1px solid var(--border);color:var(--muted);
  font-size:12px;padding:4px 8px;border-radius:8px;min-height:28px;
}
.mini-btn:active{color:var(--accent);}

.cat-row{
  display:flex;align-items:center;gap:10px;
  padding:10px 8px;border-radius:10px;min-height:44px;
}
.cat-row:hover{background:var(--panel);}
.cat-emoji{font-size:18px;width:24px;text-align:center;}
.cat-name{flex:1;font-size:15px;}

/* toggle switch */
.switch{position:relative;width:44px;height:26px;flex-shrink:0;}
.switch input{opacity:0;width:0;height:0;position:absolute;}
.slider{
  position:absolute;inset:0;background:var(--border);border-radius:20px;
  transition:background .18s;
}
.slider::before{
  content:"";position:absolute;left:3px;top:3px;width:20px;height:20px;
  background:var(--muted);border-radius:50%;transition:.18s;
}
.switch input:checked + .slider{background:var(--accent);}
.switch input:checked + .slider::before{transform:translateX(18px);background:#1C1B19;}

/* ---------- Calendar ---------- */
.calendar{flex:1;min-width:0;padding:20px 24px 60px;}
.view.hidden{display:none;}

/* Agenda */
.agenda-list{display:flex;flex-direction:column;gap:8px;max-width:760px;margin:0 auto;}
.day-group{margin-top:18px;}
.day-group:first-child{margin-top:0;}
.day-label{
  font-size:14px;font-weight:700;color:var(--accent);
  text-transform:uppercase;letter-spacing:.5px;margin:0 0 8px 2px;
}
.event-card{
  display:flex;gap:14px;align-items:flex-start;
  background:var(--panel);border:1px solid var(--border);
  border-radius:var(--radius);padding:14px 16px;
  transition:border-color .15s;
}
a.event-card:hover{border-color:var(--accent);}
.ev-time{
  font-size:14px;font-weight:600;color:var(--muted);
  width:66px;flex-shrink:0;padding-top:2px;
}
.ev-body{flex:1;min-width:0;}
.ev-title{font-size:16px;font-weight:600;margin-bottom:4px;}
.ev-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;color:var(--muted);}
.tag{
  font-size:12px;font-weight:600;padding:3px 9px;border-radius:20px;
  color:#1C1B19;white-space:nowrap;
}
.ev-loc{display:inline-flex;align-items:center;gap:4px;}
.ev-arrow{color:var(--muted);font-size:18px;align-self:center;}

/* Month grid */
.month-head{display:flex;align-items:center;justify-content:center;gap:18px;margin-bottom:16px;max-width:920px;margin-left:auto;margin-right:auto;}
.month-head h2{font-size:18px;min-width:180px;text-align:center;}
.month-grid{
  display:grid;grid-template-columns:repeat(7,1fr);gap:6px;
  max-width:920px;margin:0 auto;
}
.dow{font-size:12px;font-weight:700;color:var(--muted);text-align:center;padding:4px 0;text-transform:uppercase;}
.day-cell{
  background:var(--panel);border:1px solid var(--border);border-radius:10px;
  min-height:92px;padding:6px;display:flex;flex-direction:column;gap:3px;
}
.day-cell.empty{background:transparent;border-color:transparent;}
.day-cell.today{border-color:var(--accent);}
.day-num{font-size:13px;font-weight:600;color:var(--muted);margin-bottom:2px;}
.day-cell.today .day-num{color:var(--accent);}
.pill{
  font-size:11px;line-height:1.2;padding:3px 6px;border-radius:6px;
  color:#1C1B19;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.more-pill{font-size:11px;color:var(--muted);padding:1px 4px;}

/* ---------- Empty state ---------- */
.empty{
  text-align:center;color:var(--muted);max-width:420px;margin:60px auto;
  padding:30px;
}
.empty .big{font-size:40px;margin-bottom:12px;}
.empty h3{font-size:20px;color:var(--text);margin-bottom:8px;}
.empty p{font-size:15px;}

/* ---------- Mobile drawer ---------- */
.backdrop{display:none;}
.only-mobile{display:none;}

@media (max-width:860px){
  .only-mobile{display:inline-flex;}
  .layout{display:block;}
  .sidebar{
    position:fixed;top:0;left:0;height:100vh;width:86%;max-width:340px;
    z-index:50;background:var(--bg);transform:translateX(-100%);
    transition:transform .25s ease;border-right:1px solid var(--border);
  }
  .sidebar.open{transform:translateX(0);}
  .backdrop.show{display:block;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:40;}
  .calendar{padding:16px 14px 60px;}
  .view-switch{margin-left:auto;}
  .brand h1{font-size:16px;}
  .ev-time{width:58px;}
  .day-cell{min-height:64px;}
}