:root {
    --bg: #F5F0E8; --card: #FEFCF8; --ink: #1E1A14; --ink2: #3D362B; --muted: #8E8272;
    --accent: #D96B3A; --accent-hover: #C45E30; --accent-light: #FBE9DF;
    --line: #E2D9CA; --check: #4A9B5A; --check-light: #E8F5EA;
    --shadow-sm: 0 1px 3px rgba(30,26,20,0.06); --shadow-md: 0 4px 12px rgba(30,26,20,0.08);
    --shadow-lg: 0 8px 24px rgba(30,26,20,0.1);
    --radius: 14px; --radius-sm: 10px;
    --cal-maths: #D96B3A; --cal-science: #3D8B4F; --cal-english: #C49520; --cal-french: #7064B0;
    --cal-music: #B84D7A; --cal-art: #C46830; --cal-pdhpe: #3A7FB5; --cal-geo: #5A8E4A;
    --cal-history: #A06838; --cal-tech: #4A7E8E; --cal-sport: #358075; --cal-other: #8E8272;
  }
  html.dark {
    --bg: #1a1a1f; --card: #24242b; --ink: #e8e4de; --ink2: #c8c2b8; --muted: #7a7570;
    --accent-light: rgba(217,107,58,0.15); --line: #333338; --check-light: rgba(74,155,90,0.15);
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.2); --shadow-md: 0 4px 12px rgba(0,0,0,0.3);
    --shadow-lg: 0 8px 24px rgba(0,0,0,0.4);
  }
  * { margin:0; padding:0; box-sizing:border-box; }
  html { height:100%; }
  body { background:var(--bg); color:var(--ink); font-family:'Palatino Linotype','Book Antiqua',Palatino,Georgia,serif; min-height:100vh; display:flex; flex-direction:column; transition: background 0.3s, color 0.3s; }
  .page { width:100%; max-width:1200px; margin:0 auto; padding:32px 48px 80px; flex:1; }
  .sf { font-family:system-ui,-apple-system,sans-serif; }
  header { display:flex; align-items:baseline; justify-content:space-between; margin-bottom:28px; padding-bottom:20px; border-bottom:1px solid var(--line); }
  header h1 { font-size:1.8rem; font-weight:400; letter-spacing:-0.01em; }
  header .date { font-size:0.78rem; color:var(--muted); letter-spacing:0.05em; text-transform:uppercase; }
  .tabs { display:flex; gap:4px; margin-bottom:28px; background:var(--card); border-radius:var(--radius); padding:4px; box-shadow:var(--shadow-sm); border:1px solid var(--line); width:fit-content; }
  .tab { padding:9px 22px; font-size:0.8rem; font-weight:600; letter-spacing:0.03em; background:none; border:none; cursor:pointer; color:var(--muted); border-radius:var(--radius-sm); transition:all 0.2s; display:flex; align-items:center; gap:6px; }
  .tab svg { width:14px; height:14px; flex-shrink:0; }
  .tab.active { background:var(--accent); color:#fff; box-shadow:0 2px 6px rgba(217,107,58,0.3); }
  .tab:hover:not(.active) { color:var(--ink); background:rgba(128,128,128,0.08); }
  .tab.active { background:var(--accent); color:#fff; box-shadow:0 2px 6px rgba(217,107,58,0.3); }
  .tab:hover:not(.active) { color:var(--ink); background:rgba(128,128,128,0.08); }
  .ltx-editor-tools{display:flex;flex-direction:column;gap:8px;padding:10px 18px;border-bottom:1px solid var(--line);}
  .ltx-editor-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;}
  .ltx-editor-settings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
  .ltx-setting{display:flex;flex-direction:column;gap:6px;font-size:0.78rem;color:var(--muted);}
  .ltx-setting span{font-size:0.78rem;color:var(--muted);font-weight:600;}
  .ltx-setting input{width:100%;padding:10px 12px;border:1.5px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink2);}
  .ltx-setting input:focus{outline:none;border-color:var(--accent);}
  .panel { display:none; } .panel.active { display:block; }
  #calPanel.active { margin-left:calc(-50vw + 50%); margin-right:calc(-50vw + 50%); padding-left:max(32px, calc(50vw - 600px + 48px)); padding-right:max(32px, calc(50vw - 600px + 48px)); }

  /* Sidebar mode */
  .sidebar-toggle { display:none; position:fixed; top:16px; left:16px; z-index:60; width:36px; height:36px; border-radius:10px; background:var(--card); border:1.5px solid var(--line); cursor:pointer; box-shadow:var(--shadow-md); align-items:center; justify-content:center; transition:all 0.15s; }
  .sidebar-toggle:hover { border-color:var(--accent); color:var(--accent); }
  .sidebar-toggle svg { width:18px; height:18px; color:var(--ink2); }
  body.nav-sidebar .sidebar-toggle { display:flex; }
  body.nav-sidebar .tabs { display:none; }
  body.nav-sidebar header { padding-left:48px; }
  .sidebar { position:fixed; top:0; left:-260px; width:250px; height:100%; background:var(--card); border-right:1.5px solid var(--line); z-index:55; padding:60px 16px 24px; box-shadow:var(--shadow-lg); transition:left 0.25s cubic-bezier(.4,0,.2,1); display:flex; flex-direction:column; gap:4px; overflow-y:auto; }
  .sidebar.open { left:0; }
  .sidebar-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.2); z-index:54; }
  .sidebar-overlay.open { display:block; }
  .sidebar .sb-tab { display:flex; align-items:center; gap:10px; padding:11px 16px; font-size:0.82rem; font-weight:600; border:none; background:none; border-radius:var(--radius-sm); cursor:pointer; color:var(--muted); transition:all 0.15s; width:100%; text-align:left; }
  .sidebar .sb-tab:hover { color:var(--ink); background:rgba(128,128,128,0.08); }
  .sidebar .sb-tab.active { background:var(--accent-light); color:var(--accent); }
  .sidebar .sb-tab svg { width:16px; height:16px; flex-shrink:0; }
  .sidebar .sb-label { font-size:0.62rem; color:var(--muted); text-transform:uppercase; letter-spacing:0.06em; font-weight:700; padding:16px 16px 6px; }
  body.nav-sidebar .page { padding-left:32px; }

  /* Current class bar */
  .class-info-bar { margin-bottom:20px; display:flex; align-items:stretch; gap:8px; }
  .current-class-bar { background:linear-gradient(135deg,var(--card),var(--accent-light)); border:1.5px solid var(--accent); border-radius:var(--radius); padding:14px 20px; display:flex; align-items:center; gap:14px; font-size:0.88rem; box-shadow:0 2px 8px rgba(217,107,58,0.12); cursor:default; transition:transform 0.2s,box-shadow 0.2s; flex:1; min-width:0; }
  .current-class-bar:hover { transform:translateY(-1px); box-shadow:0 4px 16px rgba(217,107,58,0.18); }
  .current-class-bar .ccb-dot { width:12px; height:12px; border-radius:50%; animation:pulse 2s ease-in-out infinite; flex-shrink:0; }
  @keyframes pulse { 0%,100%{opacity:1;transform:scale(1);} 50%{opacity:0.4;transform:scale(0.85);} }
  .current-class-bar .ccb-label { color:var(--accent); font-size:0.65rem; font-weight:700; text-transform:uppercase; letter-spacing:0.08em; }
  .current-class-bar .ccb-name { font-weight:700; color:var(--ink); font-size:0.95rem; transition:color 0.15s; }
  .current-class-bar:hover .ccb-name { color:var(--accent); }
  .current-class-bar .ccb-room { color:var(--muted); margin-left:auto; font-size:0.78rem; white-space:nowrap; }
  .upcoming-bar { background:var(--card); border:1.5px solid var(--line); border-radius:var(--radius); padding:10px 16px; display:flex; align-items:center; gap:8px; cursor:pointer; transition:transform 0.15s,box-shadow 0.15s; flex-shrink:0; max-width:220px; position:relative; z-index:10; }
  .upcoming-bar:hover { transform:translateY(-1px); box-shadow:var(--shadow-md); }
  .upcoming-bar .up-dot { width:6px; height:6px; border-radius:50%; flex-shrink:0; opacity:.6; }
  .upcoming-bar .up-label { color:var(--muted); font-size:0.58rem; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; }
  .upcoming-bar .up-name { font-weight:600; color:var(--ink2); font-size:0.78rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .upcoming-bar .up-time { color:var(--muted); font-size:0.68rem; white-space:nowrap; }
  .up-details { display:none; position:absolute; top:100%; right:0; margin-top:6px; background:var(--card); border:1.5px solid var(--line); border-radius:var(--radius-sm); padding:12px 16px; box-shadow:var(--shadow-lg); z-index:100; min-width:220px; font-size:0.75rem; line-height:1.6; color:var(--ink2); animation:dropIn 0.15s ease-out; }
  .upcoming-bar.expanded .up-details { display:block; }
  .up-details .upd-row { display:flex; gap:8px; padding:2px 0; }
  .up-details .upd-lbl { color:var(--muted); min-width:48px; font-size:0.65rem; text-transform:uppercase; letter-spacing:0.04em; font-weight:600; }
  .up-details .upd-val { font-weight:600; }

  /* Input */
  .input-row { display:flex; gap:8px; margin-bottom:16px; }
  .input-row input, .input-row select { padding:12px 16px; font-family:inherit; font-size:0.92rem; border:1.5px solid var(--line); border-radius:var(--radius-sm); background:var(--card); color:var(--ink); outline:none; transition:border-color 0.2s,box-shadow 0.2s; }
  .input-row input:focus, .input-row select:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(217,107,58,0.12); }
  .input-row input { flex:1; } .input-row input::placeholder { color:var(--muted); font-style:italic; }
  .input-row select { width:170px; cursor:pointer; -webkit-appearance:none; appearance:none; font-size:0.82rem; padding-right:36px; background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%238E8272' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; }
  .input-row button, .btn { padding:12px 24px; font-size:0.85rem; font-weight:700; letter-spacing:0.03em; background:var(--accent); color:#fff; border:none; border-radius:var(--radius-sm); cursor:pointer; transition:transform 0.12s,background 0.15s; white-space:nowrap; box-shadow:0 2px 6px rgba(217,107,58,0.25); }
  .input-row button:hover, .btn:hover { background:var(--accent-hover); }
  .input-row button:active, .btn:active { transform:scale(0.97); }
  .btn-outline { background:var(--card); color:var(--ink2); border:1.5px solid var(--line); box-shadow:none; font-weight:600; }
  .btn-outline:hover { border-color:var(--accent); color:var(--accent); background:var(--card); }
  .btn-sm { padding:8px 16px; font-size:0.78rem; }
  .btn-danger { background:#c0392b; box-shadow:0 2px 6px rgba(192,57,43,0.25); }
  .btn-danger:hover { background:#a93226; }

  /* Sort + filter row (single line) */
  .sort-row { display:flex; gap:6px; align-items:center; margin-bottom:16px; flex-wrap:nowrap; overflow-x:auto; white-space:nowrap; }
  .sort-row .sort-label { font-size:0.72rem; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:0.04em; flex-shrink:0; }
  .sort-row .spacer { flex:1; min-width:8px; }
  .sort-btn { padding:4px 12px; font-size:0.72rem; font-weight:600; border:1.5px solid var(--line); border-radius:16px; background:var(--card); color:var(--muted); cursor:pointer; transition:all 0.15s; flex-shrink:0; }
  .sort-btn.active { background:var(--accent); border-color:var(--accent); color:#fff; }
  .sort-btn:hover:not(.active) { border-color:var(--accent); color:var(--accent); }
  .filter-chip { padding:4px 12px; font-size:0.72rem; font-weight:600; border:1.5px solid var(--line); border-radius:16px; background:var(--card); color:var(--muted); cursor:pointer; transition:all 0.2s cubic-bezier(.4,0,.2,1); flex-shrink:0; }
  .filter-chip:hover { border-color:var(--accent); color:var(--accent); }
  .filter-chip.active { background:var(--accent); border-color:var(--accent); color:#fff; }

  /* Tasks */
  .list { display:flex; flex-direction:column; gap:6px; }
  .item { display:flex; align-items:center; gap:14px; padding:14px 18px; background:var(--card); border-radius:var(--radius-sm); box-shadow:var(--shadow-sm); border:1px solid transparent; animation:slideIn 0.3s ease-out backwards; transition:box-shadow 0.2s,border-color 0.2s,transform 0.15s; }
  .item:hover { box-shadow:var(--shadow-md); border-color:var(--line); transform:translateY(-1px); }
  @keyframes slideIn { from{opacity:0;transform:translateY(-6px);} to{opacity:1;transform:translateY(0);} }
  .item.removing { opacity:0; transform:translateX(40px); transition:all 0.25s; }
  .checkbox { width:22px; height:22px; border:2px solid var(--line); border-radius:6px; cursor:pointer; display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:all 0.2s; }
  .checkbox:hover { border-color:var(--check); background:var(--check-light); }
  .checkbox.checked { background:var(--check); border-color:var(--check); }
  .checkbox svg { width:13px; height:13px; opacity:0; transition:opacity 0.2s,transform 0.3s cubic-bezier(.34,1.56,.64,1); transform:scale(0) rotate(-45deg); }
  .checkbox.checked svg { opacity:1; transform:scale(1) rotate(0deg); }
  .checkbox.checked { animation:checkPop 0.35s cubic-bezier(.34,1.56,.64,1); }
  @keyframes checkPop { 0%{transform:scale(1);} 40%{transform:scale(1.25);} 100%{transform:scale(1);} }
  .item-content { flex:1; min-width:0; }
  .item-text { font-size:1rem; line-height:1.4; word-break:break-word; color:var(--ink2); }
  .item.done .item-text { text-decoration:line-through; color:var(--muted); }
  .item-subject { display:inline-block; font-size:0.65rem; padding:3px 10px; border-radius:10px; letter-spacing:0.04em; font-weight:700; text-transform:uppercase; white-space:nowrap; }
  .item-priority { display:inline-block; font-size:0.6rem; padding:2px 8px; border-radius:8px; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; }
  .item-subj-slot { width:100px; flex-shrink:0; display:flex; justify-content:flex-end; }
  .item-prio-slot { width:62px; flex-shrink:0; display:flex; justify-content:flex-end; }
  .prio-high { background:#fecaca; color:#dc2626; } .prio-medium { background:#fef3c7; color:#d97706; } .prio-low { background:#d1fae5; color:#059669; }
  html.dark .prio-high { background:rgba(220,38,38,.18); color:#f87171; }
  html.dark .prio-medium { background:rgba(217,119,6,.18); color:#fbbf24; }
  html.dark .prio-low { background:rgba(5,150,105,.18); color:#34d399; }
  .item-actions { display:flex; gap:2px; flex-shrink:0; }
  .edit-btn { background:none; border:none; cursor:pointer; color:var(--muted); font-size:0.82rem; padding:5px 6px; opacity:0; transition:all 0.15s; flex-shrink:0; border-radius:6px; }
  .item:hover .edit-btn { opacity:0.5; }
  .edit-btn:hover { opacity:1!important; color:var(--accent); background:var(--accent-light); }
  .delete-btn { background:none; border:none; cursor:pointer; color:var(--muted); font-size:0.9rem; padding:6px; opacity:0; transition:all 0.15s; flex-shrink:0; border-radius:6px; }
  .item:hover .delete-btn { opacity:0.5; }
  .delete-btn:hover { opacity:1!important; color:#c0392b; background:rgba(192,57,43,0.08); }
  .empty-state { text-align:center; padding:60px 24px; color:var(--muted); font-style:italic; font-size:1.05rem; line-height:1.7; }
  .counter { text-align:center; margin-top:24px; font-size:0.78rem; color:var(--muted); letter-spacing:0.04em; }

  /* Calendar toolbar */
  .cal-toolbar { display:flex; align-items:center; gap:6px; margin-bottom:16px; flex-wrap:wrap; }
  .cal-toolbar button { padding:8px 14px; font-size:0.78rem; font-weight:600; background:var(--card); border:1.5px solid var(--line); border-radius:var(--radius-sm); cursor:pointer; color:var(--ink2); transition:all 0.15s; }
  .cal-toolbar button:hover { border-color:var(--accent); color:var(--accent); }
  .cal-toolbar .week-label { font-size:1rem; font-weight:400; text-align:center; }
  .cal-toolbar .spacer { flex:1; }
  .layout-icons { display:flex; gap:2px; background:var(--card); border:1.5px solid var(--line); border-radius:8px; padding:2px; }
  .layout-icon { width:30px; height:26px; display:flex; align-items:center; justify-content:center; background:none; border:none; border-radius:6px; cursor:pointer; color:var(--muted); font-size:0.7rem; transition:all 0.15s; }
  .layout-icon.active { background:var(--accent); color:#fff; }
  .layout-icon:hover:not(.active) { color:var(--ink); background:rgba(128,128,128,0.08); }
  .layout-icon svg { width:14px; height:14px; }

  /* Calendar grid */
  .cal-grid { display:grid; gap:8px; }
  .cal-day { background:var(--card); border-radius:var(--radius); border:1.5px solid var(--line); overflow:hidden; box-shadow:var(--shadow-sm); transition:box-shadow 0.2s,transform 0.15s; min-width:0; }
  .cal-day:hover { box-shadow:var(--shadow-md); transform:translateY(-2px); }
  .cal-day.today { border-color:var(--accent); box-shadow:0 2px 10px rgba(217,107,58,0.15); }
  .cal-day-header { padding:12px 14px; font-size:0.75rem; font-weight:700; color:var(--muted); letter-spacing:0.06em; text-transform:uppercase; border-bottom:1px solid var(--line); text-align:center; }
  .cal-day.today .cal-day-header { color:#fff; background:var(--accent); }
  .cal-day-body { display:flex; flex-direction:column; gap:4px; padding:6px; }
  .cal-event { padding:9px 12px 9px 14px; border-radius:8px; font-size:0.74rem; line-height:1.4; color:var(--ink2); font-weight:500; display:flex; flex-direction:column; overflow:hidden; cursor:pointer; position:relative; transition:transform 0.12s,box-shadow 0.15s; background:var(--card); border:1px solid var(--line); border-left:4px solid var(--muted); }
  .cal-event:hover { transform:translateY(-1px); box-shadow:var(--shadow-md); }
  .cal-event.now-active { box-shadow:0 0 0 2px var(--accent); }
  .cal-event .ev-name { font-weight:700; font-size:0.8rem; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .cal-event .ev-time { font-size:0.68rem; color:var(--muted); margin-top:2px; }
  .cal-event .ev-meta { font-size:0.65rem; color:var(--muted); margin-top:1px; }
  .ev-dropdown { display:none; background:var(--bg); border:1px solid var(--line); border-radius:8px; padding:10px 12px; margin-top:8px; font-size:0.72rem; line-height:1.6; color:var(--ink2); }
  .ev-dropdown .ev-row { display:flex; gap:8px; padding:2px 0; }
  .ev-dropdown .ev-lbl { color:var(--muted); min-width:52px; font-size:0.65rem; text-transform:uppercase; letter-spacing:0.04em; font-weight:600; }
  .ev-dropdown .ev-val { font-weight:600; color:var(--ink2); }
  .ev-dropdown .ev-actions { display:flex; gap:6px; margin-top:8px; padding-top:8px; border-top:1px solid var(--line); }
  .ev-dropdown .ev-actions button { padding:5px 12px; font-size:0.68rem; font-weight:700; border:none; border-radius:6px; cursor:pointer; color:#fff; transition:transform 0.1s; }
  .ev-dropdown .ev-actions button:active { transform:scale(0.96); }
  .cal-event.expanded .ev-dropdown { display:block; animation:dropIn 0.15s ease-out; }
  @keyframes dropIn { from{opacity:0;transform:translateY(-4px);} to{opacity:1;transform:translateY(0);} }
  .cal-empty { padding:28px 8px; text-align:center; font-size:0.75rem; color:var(--muted); font-style:italic; }
  .ics-upload-area { display:flex; align-items:center; gap:12px; margin-top:20px; padding-top:16px; border-top:1px solid var(--line); flex-wrap:wrap; }
  .ics-upload-btn { padding:9px 18px; font-size:0.8rem; font-weight:600; background:var(--card); border:1.5px solid var(--line); border-radius:var(--radius-sm); cursor:pointer; color:var(--ink2); transition:all 0.15s; }
  .ics-upload-btn:hover { border-color:var(--accent); color:var(--accent); }
  .ics-status { font-size:0.78rem; color:var(--check); }
  .ics-clear-btn { padding:7px 14px; font-size:0.75rem; font-weight:600; background:none; border:1.5px solid var(--line); border-radius:var(--radius-sm); cursor:pointer; color:var(--muted); transition:all 0.15s; margin-left:auto; }
  .ics-clear-btn:hover { border-color:#c0392b; color:#c0392b; }

  /* Modal */
  .modal-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.4); backdrop-filter:blur(3px); z-index:900; align-items:center; justify-content:center; }
  .modal-overlay.open { display:flex; }
  .modal { background:var(--card); border-radius:var(--radius); padding:28px 32px; max-width:440px; width:90%; box-shadow:var(--shadow-lg); border:1px solid var(--line); animation:modalIn 0.25s cubic-bezier(.34,1.56,.64,1); }
  @keyframes modalIn { from{opacity:0;transform:scale(0.92) translateY(10px);} to{opacity:1;transform:scale(1) translateY(0);} }
  .modal h3 { font-size:1.1rem; font-weight:400; margin-bottom:20px; }
  .modal label { display:block; font-size:0.75rem; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:0.04em; margin-bottom:4px; margin-top:12px; }
  .modal label:first-of-type { margin-top:0; }
  .modal input, .modal select { width:100%; padding:10px 14px; font-family:inherit; font-size:0.88rem; border:1.5px solid var(--line); border-radius:var(--radius-sm); background:var(--bg); color:var(--ink); outline:none; }
  .modal input:focus, .modal select:focus { border-color:var(--accent); }
  .modal .modal-actions { display:flex; gap:8px; margin-top:20px; justify-content:flex-end; }
  .subj-picker-list { display:flex; flex-direction:column; gap:4px; max-height:280px; overflow-y:auto; margin-top:8px; }
  .subj-picker-item { display:flex; align-items:center; gap:10px; padding:10px 14px; border-radius:var(--radius-sm); border:1.5px solid var(--line); background:var(--card); cursor:pointer; transition:all 0.15s; }
  .subj-picker-item:hover { border-color:var(--accent); background:var(--accent-light); transform:translateY(-1px); }
  .subj-picker-item.active { border-color:var(--accent); background:var(--accent-light); }
  .subj-picker-dot { width:12px; height:12px; border-radius:50%; flex-shrink:0; }
  .subj-picker-name { font-size:0.85rem; font-weight:600; color:var(--ink2); }
  .confirm-text { font-size:0.92rem; color:var(--ink2); line-height:1.5; margin-bottom:4px; white-space:pre-wrap; max-height:300px; overflow-y:auto; }
  .prio-picker { display:flex; gap:6px; margin-top:8px; }
  .prio-opt { padding:8px 16px; border-radius:var(--radius-sm); border:1.5px solid var(--line); background:var(--card); cursor:pointer; font-size:0.8rem; font-weight:600; transition:all 0.15s; }
  .prio-opt:hover { transform:translateY(-1px); }
  .prio-opt.active { border-color:var(--accent); }
  .prio-opt.p-high { color:#dc2626; } .prio-opt.p-medium { color:#d97706; } .prio-opt.p-low { color:#059669; } .prio-opt.p-none { color:var(--muted); }
  .prio-opt.active.p-high { background:#fecaca; } .prio-opt.active.p-medium { background:#fef3c7; } .prio-opt.active.p-low { background:#d1fae5; } .prio-opt.active.p-none { background:var(--bg); }

  /* Timer */
  .timer-wrap { display:flex; flex-direction:column; align-items:center; padding:40px 20px; }
  .timer-display { font-size:5rem; font-weight:300; letter-spacing:-2px; font-variant-numeric:tabular-nums; color:var(--ink); transition:color 0.3s; margin-bottom:8px; }
  .timer-display.running { color:var(--accent); }
  .timer-display.done { color:var(--check); }
  .timer-label { font-size:0.82rem; color:var(--muted); margin-bottom:28px; text-transform:uppercase; letter-spacing:0.06em; font-weight:600; }
  .timer-controls { display:flex; gap:10px; margin-bottom:32px; }
  .timer-controls button { padding:10px 28px; font-size:0.85rem; font-weight:700; border:none; border-radius:var(--radius-sm); cursor:pointer; transition:all 0.15s; }
  .timer-controls button:hover { transform:translateY(-1px); }
  .timer-controls button:active { transform:scale(0.97); }
  .timer-presets { display:flex; gap:8px; flex-wrap:wrap; justify-content:center; margin-bottom:28px; }
  .timer-preset { padding:8px 18px; font-size:0.78rem; font-weight:600; border:1.5px solid var(--line); border-radius:20px; background:var(--card); color:var(--muted); cursor:pointer; transition:all 0.15s; }
  .timer-preset:hover { border-color:var(--accent); color:var(--accent); transform:translateY(-1px); }
  .timer-preset.active { background:var(--accent); border-color:var(--accent); color:#fff; }
  .timer-custom { display:flex; gap:8px; align-items:center; margin-bottom:20px; }
  .timer-custom input { width:70px; padding:8px 12px; font-size:0.88rem; border:1.5px solid var(--line); border-radius:var(--radius-sm); background:var(--card); color:var(--ink); text-align:center; outline:none; }
  .timer-custom input:focus { border-color:var(--accent); }
  .timer-custom span { font-size:0.75rem; color:var(--muted); }
  .timer-modes { display:flex; gap:4px; background:var(--card); border-radius:var(--radius); padding:3px; border:1px solid var(--line); margin-bottom:24px; }
  .timer-mode { padding:7px 18px; font-size:0.75rem; font-weight:600; border:none; background:none; border-radius:8px; cursor:pointer; color:var(--muted); transition:all 0.15s; }
  .timer-mode.active { background:var(--accent); color:#fff; }
  .timer-progress-ring { margin-bottom:20px; }
  .timer-mini { display:none; position:fixed; top:12px; right:12px; background:var(--card); border:1.5px solid var(--accent); border-radius:var(--radius); padding:8px 16px; box-shadow:var(--shadow-lg); z-index:80; cursor:pointer; transition:transform 0.15s,box-shadow 0.15s; animation:dropIn 0.2s ease-out; }
  .timer-mini:hover { transform:translateY(-1px); box-shadow:0 6px 20px rgba(217,107,58,0.2); }
  .timer-mini.visible { display:flex; align-items:center; gap:10px; }
  .timer-mini .tm-time { font-size:1.1rem; font-weight:700; font-variant-numeric:tabular-nums; color:var(--accent); }
  .timer-mini .tm-label { font-size:0.65rem; color:var(--muted); text-transform:uppercase; letter-spacing:0.04em; font-weight:600; }

  /* Settings */
  .settings-section { background:var(--card); border-radius:var(--radius); border:1px solid var(--line); padding:24px 28px; margin-bottom:16px; }
  .settings-section h3 { font-size:0.95rem; font-weight:400; margin-bottom:16px; padding-bottom:12px; border-bottom:1px solid var(--line); }
  .setting-row { display:flex; align-items:center; justify-content:space-between; padding:10px 0; border-bottom:1px solid var(--line); }
  .setting-row:last-child { border-bottom:none; }
  .setting-row .setting-label { font-size:0.85rem; color:var(--ink2); }
  .setting-row .setting-desc { font-size:0.72rem; color:var(--muted); margin-top:2px; }
  .color-swatches { display:flex; gap:6px; }
  .color-swatch { width:28px; height:28px; border-radius:50%; cursor:pointer; border:2.5px solid transparent; transition:all 0.15s; }
  .color-swatch:hover { transform:scale(1.15); }
  .color-swatch.active { border-color:var(--ink); box-shadow:0 0 0 2px var(--bg); }
  .toggle { width:44px; height:24px; border-radius:12px; background:var(--line); cursor:pointer; position:relative; transition:background 0.2s; border:none; padding:0; }
  .toggle.on { background:var(--accent); }
  .toggle::after { content:''; position:absolute; width:18px; height:18px; border-radius:50%; background:#fff; top:3px; left:3px; transition:transform 0.2s; box-shadow:0 1px 3px rgba(0,0,0,0.15); }
  .toggle.on::after { transform:translateX(20px); }
  .sys-info { font-size:0.78rem; color:var(--ink2); background:var(--bg); padding:14px 18px; border-radius:var(--radius-sm); border:1px solid var(--line); font-family:'SF Mono',Menlo,monospace; line-height:1.7; }
  .sys-info b { color:var(--ink); font-size:0.7rem; text-transform:uppercase; letter-spacing:0.04em; display:inline-block; margin-top:4px; }

  /* Login */
  .login-screen { position:fixed; inset:0; background:var(--bg); display:flex; align-items:center; justify-content:center; z-index:1000; }

  /* Resources */
  .res-subjects { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:12px; }
  .res-subj-btn { padding:8px 18px; font-size:0.78rem; font-weight:600; border:1.5px solid var(--line); border-radius:20px; background:var(--card); color:var(--muted); cursor:grab; transition:all 0.15s; user-select:none; }
  .res-subj-btn:hover { border-color:var(--accent); color:var(--accent); transform:translateY(-1px); }
  .res-subj-btn.active { background:var(--accent); border-color:var(--accent); color:#fff; }
  .res-subj-btn.drag-over-subj { border-color:var(--accent); box-shadow:0 0 0 2px var(--accent); }
  .res-subj-btn:active npm run build
{ cursor:grabbing; }
  .res-content { background:var(--card); border:1.5px solid var(--line); border-radius:var(--radius); padding:24px 28px; box-shadow:var(--shadow-sm); animation:slideIn 0.3s ease-out; }
  .res-content h3 { font-size:1rem; font-weight:400; margin-bottom:16px; padding-bottom:12px; border-bottom:1px solid var(--line); }
  .res-notes { width:100%; min-height:200px; border:1.5px solid var(--line); border-radius:var(--radius-sm); padding:14px; font-size:0.82rem; line-height:1.6; resize:vertical; background:var(--bg); color:var(--ink); font-family:'SF Mono',Menlo,Consolas,monospace; outline:none; tab-size:2; }
  .res-notes:focus { border-color:var(--accent); }
  .res-save-status { font-size:0.72rem; color:var(--check); text-align:right; margin-top:6px; min-height:16px; }
  /* Doc editor */
  .doc-tabs { display:flex; gap:3px; flex-wrap:wrap; align-items:center; margin-bottom:12px; }
  .doc-tab { padding:6px 14px; font-size:0.72rem; font-weight:600; border:1.5px solid var(--line); border-radius:8px 8px 0 0; background:var(--card); color:var(--muted); cursor:pointer; transition:all 0.15s; border-bottom:none; position:relative; top:1px; }
  .doc-tab.active { background:var(--bg); color:var(--ink); border-color:var(--accent); }
  .doc-tab:hover:not(.active) { color:var(--ink); }
  .doc-tab .doc-tab-x { margin-left:6px; font-size:0.65rem; opacity:0.4; }
  .doc-tab .doc-tab-x:hover { opacity:1; color:#c0392b; }
  .doc-add-tab { padding:4px 10px; font-size:0.8rem; border:1.5px dashed var(--line); border-radius:8px; background:none; color:var(--muted); cursor:pointer; transition:all 0.15s; }
  .doc-add-tab:hover { border-color:var(--accent); color:var(--accent); }
  .doc-toolbar { display:flex; gap:6px; align-items:center; margin-bottom:8px; flex-wrap:wrap; }
  .doc-toolbar button { padding:5px 12px; font-size:0.7rem; font-weight:600; border:1.5px solid var(--line); border-radius:var(--radius-sm); background:var(--card); color:var(--ink2); cursor:pointer; transition:all 0.15s; }
  .doc-toolbar button:hover { border-color:var(--accent); color:var(--accent); }
  .doc-editor-full { border:1.5px solid var(--line); border-radius:var(--radius-sm); overflow:hidden; }
  .doc-editor-full textarea { width:100%; min-height:250px; border:none; padding:16px 18px; font-size:0.88rem; line-height:1.7; resize:vertical; background:var(--bg); color:var(--ink); font-family:'Palatino Linotype','Book Antiqua',Palatino,Georgia,serif; outline:none; }
  .doc-ref { display:none; background:var(--bg); border:1px solid var(--line); border-radius:var(--radius-sm); padding:14px 18px; margin-bottom:12px; font-size:0.72rem; line-height:1.8; color:var(--ink2); max-height:300px; overflow-y:auto; }
  .doc-ref.open { display:block; }
  .doc-ref code { background:var(--card); border:1px solid var(--line); padding:1px 5px; border-radius:4px; font-size:0.68rem; font-family:'SF Mono',Menlo,monospace; }
  /* LaTeX editor overlay */
  .ltx-editor-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.5); backdrop-filter:blur(4px); z-index:900; align-items:stretch; justify-content:center; }
  .ltx-editor-overlay.open { display:flex; }
  .ltx-editor-modal { background:var(--card); width:100%; max-width:1200px; margin:20px; border-radius:var(--radius); box-shadow:var(--shadow-lg); display:flex; flex-direction:column; overflow:hidden; }
  .ltx-editor-header { display:flex; align-items:center; gap:8px; padding:12px 18px; border-bottom:1px solid var(--line); flex-wrap:wrap; }
  .ltx-editor-header h3 { font-size:0.9rem; font-weight:600; flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .ltx-editor-header .btn, .ltx-editor-header button { flex-shrink:0; }
  .ltx-editor-body { display:flex; flex:1; min-height:0; }
  .ltx-edit-pane { flex:1; display:flex; flex-direction:column; border-right:1px solid var(--line); min-width:0; min-height:0; }
  .ltx-edit-pane .pane-label { padding:6px 14px; font-size:0.58rem; font-weight:700; text-transform:uppercase; letter-spacing:0.06em; color:var(--muted); background:var(--bg); border-bottom:1px solid var(--line); }
  .line-number-wrapper { display:flex; flex:1; min-height:0; overflow:hidden; }
  .line-numbers { width:80px; padding:12px 10px; background:var(--card); border-right:1px solid var(--line); color:var(--muted); font-family:'SF Mono',Menlo,Consolas,monospace; font-size:0.78rem; line-height:1.6; text-align:right; user-select:none; white-space:pre; overflow-y:auto; pointer-events:none; }
  .ltx-edit-pane textarea { flex:1; border:none; padding:16px; font-size:0.82rem; line-height:1.7; resize:none; background:var(--bg); color:var(--ink); font-family:'SF Mono',Menlo,Consolas,monospace; outline:none; tab-size:2; min-height:0; overflow:auto; }
  .ltx-editor-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:12px; }
  .ltx-editor-actions .btn { margin:0; }
  /* File sidebar for editor */
  .ltx-file-sidebar { width:240px; border-right:1px solid var(--line); background:var(--card); display:flex; flex-direction:column; min-width:180px; max-width:340px; }
  .ltx-file-sidebar .sidebar-header{ padding:10px 12px; font-weight:700; font-size:0.78rem; border-bottom:1px solid var(--line); display:flex; align-items:center; gap:8px; }
  .ltx-file-sidebar .sidebar-list{ padding:8px; overflow:auto; flex:1; }
  .ltx-file-item{ padding:8px 10px; border-radius:6px; cursor:pointer; display:flex; gap:8px; align-items:center; font-family:system-ui,Segoe UI,Arial; font-size:0.85rem; }
  .ltx-file-item:hover{ background:var(--accent-light); }
  .ltx-file-item .fi-name{ flex:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .ltx-preview-pane { flex:1; display:flex; flex-direction:column; min-width:0; }
  .ltx-preview-pane .pane-label { padding:6px 14px; font-size:0.58rem; font-weight:700; text-transform:uppercase; letter-spacing:0.06em; color:var(--muted); background:var(--card); border-bottom:1px solid var(--line); }
  .ltx-preview-pane .ltx-preview-content { flex:1; overflow-y:auto; padding:24px 28px; }
  @media(max-width:700px){ .ltx-editor-body{flex-direction:column;} .ltx-edit-pane{border-right:none;border-bottom:1px solid var(--line);flex:none;height:40%;} }
  /* Autocomplete */
  .ltx-autocomplete { position:absolute; z-index:999; background:var(--card); border:1.5px solid var(--line); border-radius:8px; box-shadow:var(--shadow-lg); max-height:220px; overflow-y:auto; min-width:240px; display:none; }
  .ltx-autocomplete.open { display:block; }
  .ltx-ac-item { padding:6px 12px; font-size:0.78rem; cursor:pointer; display:flex; align-items:center; gap:8px; transition:background 0.08s; font-family:'SF Mono',Menlo,Consolas,monospace; }
  .ltx-ac-item:hover, .ltx-ac-item.active { background:var(--accent-light); }
  .ltx-ac-item.active { color:var(--accent); }
  .ltx-ac-cmd { font-weight:600; color:var(--ink); }
  .ltx-ac-desc { font-size:0.65rem; color:var(--muted); margin-left:auto; font-family:system-ui,sans-serif; }
  .ltx-ac-cat { font-size:0.58rem; color:var(--accent); background:var(--accent-light); padding:1px 6px; border-radius:4px; font-weight:600; text-transform:uppercase; letter-spacing:0.03em; font-family:system-ui,sans-serif; }
  /* Rendered LaTeX styles — Computer Modern */
  .ltx { font-family:'CMU Serif','Computer Modern Serif','Times New Roman',serif; color:#1a1a1a; line-height:1.9; max-width:700px; margin:0 auto; font-size:11pt; }
  .ltx .ltx-title { font-size:17pt; font-weight:700; text-align:center; margin-bottom:4px; }
  .ltx .ltx-author { font-size:12pt; text-align:center; color:#333; margin-bottom:2px; }
  .ltx .ltx-date { font-size:11pt; text-align:center; color:#555; margin-bottom:28px; }
  .ltx h2 { font-size:14pt; font-weight:700; margin:30px 0 12px; padding-bottom:0; border-bottom:none; }
  .ltx h3 { font-size:12pt; font-weight:700; margin:22px 0 8px; }
  .ltx p { margin:6px 0; text-align:justify; text-indent:1.5em; }
  .ltx p:first-child, .ltx h2+p, .ltx h3+p, .ltx h4+p, .ltx div+p, .ltx ul+p, .ltx ol+p, .ltx table+p, .ltx blockquote+p, .ltx hr+p, .ltx pre+p { text-indent:0; }
  .ltx ul, .ltx ol { margin:8px 0 8px 24px; }
  .ltx li { margin:3px 0; }
  .ltx hr { border:none; border-top:0.5pt solid #aaa; margin:20px 0; }
  .ltx table { border-collapse:collapse; margin:14px auto; }
  .ltx table th, .ltx table td { border:0.5pt solid #999; padding:6px 14px; text-align:left; }
  .ltx table th { font-weight:700; border-bottom:1pt solid #333; }
  .ltx blockquote { border-left:2pt solid #999; padding:8px 18px; margin:12px 20px; font-style:italic; color:#444; }
  .ltx .ltx-box { border:0.8pt solid #333; padding:14px 18px; margin:14px 0; }
  .ltx .ltx-box-title { font-weight:700; margin-bottom:6px; }
  /* tcolorbox-style boxes */
  .ltx .ltx-tbox { border-left:4px solid #999; padding:14px 20px; margin:16px 0; background:#fafafa; border-radius:0 4px 4px 0; }
  .ltx .ltx-tbox-title { font-weight:700; font-size:11pt; margin-bottom:6px; display:flex; align-items:center; gap:6px; font-family:'CMU Serif','Computer Modern Serif','Times New Roman',serif; font-style:italic; }
  .ltx .ltx-tbox-def { border-left-color:#2563eb; background:#eff6ff; }
  .ltx .ltx-tbox-def .ltx-tbox-title { color:#1d4ed8; }
  .ltx .ltx-tbox-note { border-left-color:#dc2626; background:#fef2f2; }
  .ltx .ltx-tbox-note .ltx-tbox-title { color:#b91c1c; }
  .ltx .ltx-tbox-theorem { border-left-color:#16a34a; background:#f0fdf4; }
  .ltx .ltx-tbox-theorem .ltx-tbox-title { color:#15803d; }
  .ltx code { font-family:'Courier New',monospace; font-size:0.9em; background:#f0f0f0; padding:1px 4px; border-radius:2px; }
  .ltx pre { font-family:'Courier New',monospace; font-size:0.88em; }
  /* Math */
  .ltx .ltx-math { font-family:'CMU Serif','Computer Modern Serif','Times New Roman',serif; font-style:italic; padding:0 1px; letter-spacing:0.02em; }
  .ltx .ltx-math-block { font-family:'CMU Serif','Computer Modern Serif','Times New Roman',serif; font-style:italic; text-align:center; margin:20px 0; font-size:1.15em; padding:10px 0; line-height:2.4; letter-spacing:0.02em; }
  .ltx .ltx-frac { display:inline-flex; flex-direction:column; align-items:center; vertical-align:middle; margin:0 3px; line-height:1; }
  .ltx .ltx-frac-num { border-bottom:0.8pt solid currentColor; padding:0 6px 3px; font-size:0.88em; min-width:1em; text-align:center; }
  .ltx .ltx-frac-den { padding:3px 6px 0; font-size:0.88em; min-width:1em; text-align:center; }
  .ltx .ltx-align { text-align:center; }
  .ltx .ltx-align-table { margin:0 auto; border-collapse:collapse; border:none; }
  .ltx .ltx-align-table td { border:none; padding:5px 8px; font-family:'CMU Serif','Computer Modern Serif','Times New Roman',serif; font-style:italic; line-height:2; }
  .ltx .ltx-cases { display:inline-flex; align-items:center; vertical-align:middle; }
  .ltx .ltx-cases-brace { font-size:2.8em; font-weight:100; margin-right:6px; font-family:'CMU Serif','Computer Modern Serif','Times New Roman',serif; line-height:0.8; }
  .ltx .ltx-cases-table { border-collapse:collapse; border:none; }
  .ltx .ltx-cases-table td { border:none; padding:3px 8px; font-family:'CMU Serif','Computer Modern Serif','Times New Roman',serif; font-style:italic; }
  .ltx .ltx-matrix-wrap { display:inline-flex; align-items:center; vertical-align:middle; font-size:1.1em; font-family:'CMU Serif','Computer Modern Serif','Times New Roman',serif; }
  .ltx .ltx-matrix { border-collapse:collapse; border:none; margin:0 4px; }
  .ltx .ltx-matrix td { border:none; padding:3px 10px; text-align:center; font-family:'CMU Serif','Computer Modern Serif','Times New Roman',serif; font-style:italic; }
  .ltx .ltx-matrix.ltx-small td { padding:1px 4px; font-size:0.75em; }
  .ltx .ltx-stack { display:inline-flex; flex-direction:column; align-items:center; vertical-align:middle; line-height:1; }
  .ltx .ltx-over { font-size:0.7em; margin-bottom:-2px; }
  .ltx .ltx-under { font-size:0.7em; margin-top:-2px; }
  /* Table of Contents */
  .ltx .ltx-toc { margin:20px 0 30px; }
  .ltx .ltx-toc-title { font-size:14pt; font-weight:700; text-align:center; margin-bottom:16px; }
  .ltx .ltx-toc-entry { display:flex; align-items:baseline; gap:0; margin:3px 0; cursor:default; }
  .ltx .ltx-toc-entry.ltx-toc-sec { font-weight:700; margin-top:6px; }
  .ltx .ltx-toc-entry.ltx-toc-subsec { padding-left:20px; }
  .ltx .ltx-toc-entry.ltx-toc-subsubsec { padding-left:40px; font-size:0.95em; }
  .ltx .ltx-toc-num { flex-shrink:0; margin-right:6px; }
  .ltx .ltx-toc-text { flex-shrink:0; }
  .ltx .ltx-toc-dots { flex:1; border-bottom:1px dotted #999; margin:0 4px; min-width:20px; position:relative; top:-3px; }
  .ltx .ltx-toc-page { flex-shrink:0; font-variant-numeric:tabular-nums; }

  /* Periodic table */
  .ptable { display:grid; grid-template-columns:repeat(18,1fr); gap:2px; margin-top:20px; margin-bottom:8px; font-size:0.62rem; }
  .ptable-el { background:var(--card); border:1.5px solid var(--line); border-radius:6px; padding:4px 2px; text-align:center; cursor:pointer; transition:all 0.15s; position:relative; line-height:1.2; min-height:44px; display:flex; flex-direction:column; align-items:center; justify-content:center; }
  .ptable-el:hover { transform:scale(1.15); z-index:10; box-shadow:var(--shadow-lg); border-color:var(--accent); }
  .ptable-el .el-num { font-size:0.48rem; color:var(--muted); }
  .ptable-el .el-sym { font-size:0.88rem; font-weight:700; line-height:1.1; }
  .ptable-el .el-name { font-size:0.4rem; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
  .ptable-el.cat-nonmetal { background:#c8e6c9; color:#1b5e20; border-color:#a5d6a7; }
  .ptable-el.cat-noble { background:#bbdefb; color:#0d47a1; border-color:#90caf9; }
  .ptable-el.cat-alkali { background:#ffcc80; color:#bf360c; border-color:#ffb74d; }
  .ptable-el.cat-alkaline { background:#fff176; color:#f57f17; border-color:#ffee58; }
  .ptable-el.cat-transition { background:#f8bbd0; color:#880e4f; border-color:#f48fb1; }
  .ptable-el.cat-post { background:#ce93d8; color:#4a148c; border-color:#ba68c8; }
  .ptable-el.cat-metalloid { background:#80cbc4; color:#004d40; border-color:#4db6ac; }
  .ptable-el.cat-halogen { background:#ffab91; color:#b71c1c; border-color:#ff8a65; }
  .ptable-el.cat-lanthanide { background:#aed581; color:#33691e; border-color:#9ccc65; }
  .ptable-el.cat-actinide { background:#ef9a9a; color:#b71c1c; border-color:#e57373; }
  html.dark .ptable-el.cat-nonmetal { background:rgba(46,125,50,.28); color:#81c784; border-color:rgba(46,125,50,.4); }
  html.dark .ptable-el.cat-noble { background:rgba(21,101,192,.28); color:#64b5f6; border-color:rgba(21,101,192,.4); }
  html.dark .ptable-el.cat-alkali { background:rgba(230,81,0,.28); color:#ffb74d; border-color:rgba(230,81,0,.4); }
  html.dark .ptable-el.cat-alkaline { background:rgba(249,168,37,.28); color:#fff176; border-color:rgba(249,168,37,.4); }
  html.dark .ptable-el.cat-transition { background:rgba(198,40,40,.28); color:#f48fb1; border-color:rgba(198,40,40,.4); }
  html.dark .ptable-el.cat-post { background:rgba(106,27,154,.28); color:#ce93d8; border-color:rgba(106,27,154,.4); }
  html.dark .ptable-el.cat-metalloid { background:rgba(0,105,92,.28); color:#80cbc4; border-color:rgba(0,105,92,.4); }
  html.dark .ptable-el.cat-halogen { background:rgba(191,54,12,.28); color:#ffab91; border-color:rgba(191,54,12,.4); }
  html.dark .ptable-el.cat-lanthanide { background:rgba(85,139,47,.28); color:#aed581; border-color:rgba(85,139,47,.4); }
  html.dark .ptable-el.cat-actinide { background:rgba(216,67,21,.28); color:#ef9a9a; border-color:rgba(216,67,21,.4); }
  .ptable-legend { display:flex; gap:10px; flex-wrap:wrap; margin-top:10px; margin-bottom:20px; font-size:0.65rem; padding:10px 0; border-bottom:1px solid var(--line); }
  .ptable-legend span { display:flex; align-items:center; gap:4px; }
  .ptable-legend .leg-dot { width:10px; height:10px; border-radius:3px; flex-shrink:0; }

  /* Element detail modal (full screen) */
  .el-modal-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.5); backdrop-filter:blur(4px); z-index:1000; align-items:center; justify-content:center; }
  .el-modal-overlay.open { display:flex; }
  .el-modal { background:var(--card); border-radius:var(--radius); padding:0; max-width:720px; width:92%; box-shadow:var(--shadow-lg); border:1px solid var(--line); animation:modalIn 0.3s cubic-bezier(.34,1.56,.64,1); max-height:88vh; overflow-y:auto; }
  .el-modal-header { display:flex; align-items:stretch; border-bottom:1px solid var(--line); }
  .el-modal-bohr { width:240px; min-height:240px; display:flex; align-items:center; justify-content:center; background:var(--bg); border-right:1px solid var(--line); border-radius:var(--radius) 0 0 0; flex-shrink:0; position:relative; }
  .el-modal-bohr canvas { display:block; }
  .el-modal-identity { flex:1; padding:28px 28px 20px; display:flex; flex-direction:column; justify-content:center; }
  .el-modal-identity .em-num { font-size:0.72rem; color:var(--muted); text-transform:uppercase; letter-spacing:0.06em; font-weight:600; }
  .el-modal-identity .em-sym { font-size:3.2rem; font-weight:700; line-height:1; margin:4px 0; }
  .el-modal-identity .em-name { font-size:1.3rem; font-weight:400; }
  .el-modal-identity .em-cat-badge { display:inline-block; padding:4px 12px; border-radius:12px; font-size:0.68rem; font-weight:700; text-transform:uppercase; letter-spacing:0.04em; margin-top:8px; }
  .el-modal-body { padding:24px 28px 28px; }
  .el-modal-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(130px,1fr)); gap:8px; margin-bottom:24px; }
  .el-modal-stat { background:var(--bg); border:1px solid var(--line); border-radius:var(--radius-sm); padding:10px 12px; }
  .el-modal-stat .ems-label { font-size:0.6rem; color:var(--muted); text-transform:uppercase; letter-spacing:0.05em; font-weight:700; margin-bottom:2px; }
  .el-modal-stat .ems-value { font-size:0.88rem; font-weight:600; color:var(--ink); }
  .el-modal-shells { margin-top:0; padding-top:16px; border-top:1px solid var(--line); }
  .el-modal-shells .shell-row { display:flex; align-items:center; gap:10px; padding:5px 0; font-size:0.8rem; }
  .el-modal-shells .shell-label { width:56px; font-size:0.66rem; color:var(--muted); font-weight:600; text-transform:uppercase; flex-shrink:0; }
  .el-modal-shells .shell-dots { display:flex; gap:3px; }
  .el-modal-shells .shell-dot { width:8px; height:8px; border-radius:50%; background:var(--accent); }
  .el-modal-shells .shell-count { font-size:0.72rem; color:var(--ink2); font-weight:600; margin-left:4px; flex-shrink:0; }
  .el-modal-close { position:absolute; top:14px; right:16px; background:var(--card); border:1.5px solid var(--line); width:32px; height:32px; border-radius:50%; cursor:pointer; font-size:1.1rem; display:flex; align-items:center; justify-content:center; color:var(--muted); z-index:10; transition:all 0.15s; }
  .el-modal-close:hover { border-color:var(--accent); color:var(--accent); }
  @media(max-width:600px){ .el-modal-header{flex-direction:column;} .el-modal-bohr{width:100%;min-height:200px;border-right:none;border-bottom:1px solid var(--line);border-radius:var(--radius) var(--radius) 0 0;} }

  /* Resource file uploads */
  .res-files { margin-top:12px; }
  .res-file-item { display:flex; align-items:center; gap:10px; padding:10px 14px; background:var(--bg); border:1px solid var(--line); border-radius:var(--radius-sm); margin-bottom:5px; transition:all 0.15s; }
  .res-file-item:hover { border-color:var(--accent); transform:translateY(-1px); box-shadow:var(--shadow-sm); }
  .res-file-icon { width:32px; height:32px; border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:0.85rem; flex-shrink:0; font-weight:700; }
  .res-file-info { flex:1; min-width:0; }
  .res-file-name { font-size:0.82rem; font-weight:600; color:var(--ink2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .res-file-size { font-size:0.65rem; color:var(--muted); }
  .res-file-actions { display:flex; gap:4px; }
  .res-file-actions button { background:none; border:none; cursor:pointer; padding:4px 6px; border-radius:6px; font-size:0.78rem; color:var(--muted); transition:all 0.15s; }
  .res-file-actions button:hover { color:var(--accent); background:var(--accent-light); }
  .res-file-actions .del-file:hover { color:#c0392b; background:rgba(192,57,43,0.08); }
  .res-upload-zone { border:2px dashed var(--line); border-radius:var(--radius-sm); padding:18px; text-align:center; cursor:pointer; transition:all 0.2s; margin-top:8px; }
  .res-upload-zone:hover { border-color:var(--accent); background:var(--accent-light); }
  .res-upload-zone.drag-over { border-color:var(--accent); background:var(--accent-light); transform:scale(1.01); }
  .res-upload-zone .uz-icon { font-size:1.5rem; margin-bottom:4px; }
  .res-upload-zone .uz-text { font-size:0.78rem; color:var(--muted); }
  .res-upload-zone .uz-hint { font-size:0.65rem; color:var(--muted); margin-top:2px; }
  .res-breadcrumb { display:flex; align-items:center; gap:4px; margin-bottom:12px; font-size:0.75rem; flex-wrap:wrap; padding:8px 12px; background:var(--bg); border:1px solid var(--line); border-radius:var(--radius-sm); }
  .res-breadcrumb button { background:none; border:none; cursor:pointer; color:var(--accent); font-weight:600; font-size:0.75rem; padding:2px 4px; border-radius:4px; transition:all 0.12s; }
  .res-breadcrumb button:hover { background:var(--accent-light); }
  .res-breadcrumb .bc-sep { color:var(--muted); font-size:0.65rem; }
  .res-breadcrumb .bc-current { color:var(--ink2); font-weight:600; padding:2px 4px; }
  .res-folder-item { display:flex; align-items:center; gap:10px; padding:10px 14px; background:var(--bg); border:1px solid var(--line); border-radius:var(--radius-sm); margin-bottom:6px; transition:all 0.15s; cursor:pointer; }
  .res-folder-item:hover { border-color:var(--accent); transform:translateY(-1px); box-shadow:var(--shadow-sm); }
  .res-folder-item.drag-over-item,.res-file-item.drag-over-item { border-color:var(--accent); box-shadow:0 0 0 2px var(--accent); }
  .res-folder-item[draggable]:active,.res-file-item[draggable]:active { cursor:grabbing; opacity:0.6; }
  .res-folder-icon { width:32px; height:32px; border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:1.1rem; flex-shrink:0; background:var(--accent-light); }
  .res-toolbar { display:flex; gap:8px; margin-bottom:12px; margin-top:4px; align-items:center; flex-wrap:wrap; }
  .res-toolbar button { padding:6px 14px; font-size:0.72rem; font-weight:600; border:1.5px solid var(--line); border-radius:var(--radius-sm); background:var(--card); color:var(--ink2); cursor:pointer; transition:all 0.15s; display:flex; align-items:center; gap:4px; }
  .res-toolbar button:hover { border-color:var(--accent); color:var(--accent); }
  .res-add-subj-row { display:flex; gap:8px; align-items:center; }
  .res-add-subj-row input { flex:1; padding:8px 14px; font-size:0.8rem; border:1.5px solid var(--line); border-radius:var(--radius-sm); background:var(--card); color:var(--ink); outline:none; }
  .res-add-subj-row input:focus { border-color:var(--accent); }
  .res-del-subj { margin-left:auto; font-size:0.7rem; color:var(--muted); cursor:pointer; background:none; border:1px solid var(--line); padding:4px 10px; border-radius:8px; transition:all 0.15s; }
  .res-del-subj:hover { color:#c0392b; border-color:#c0392b; }
  .upload-progress { position:fixed; bottom:20px; right:20px; background:var(--card); border:1.5px solid var(--accent); border-radius:var(--radius); padding:14px 20px; box-shadow:var(--shadow-lg); z-index:200; display:none; align-items:center; gap:12px; animation:dropIn 0.2s ease-out; min-width:220px; }
  .upload-progress.visible { display:flex; }
  .upload-progress .up-spinner { width:18px; height:18px; border:2.5px solid var(--line); border-top-color:var(--accent); border-radius:50%; animation:spin 0.7s linear infinite; flex-shrink:0; }
  @keyframes spin { to{transform:rotate(360deg);} }
  .upload-progress .up-text { font-size:0.8rem; color:var(--ink2); font-weight:600; }
  .upload-progress .up-detail { font-size:0.65rem; color:var(--muted); }
  .login-screen.hidden { display:none; }
  .login-box { background:var(--card); border-radius:var(--radius); padding:48px 40px; box-shadow:var(--shadow-lg); border:1px solid var(--line); text-align:center; max-width:380px; width:90%; }
  .login-box h2 { font-size:1.6rem; font-weight:400; margin-bottom:6px; }
  .login-box p { font-size:0.82rem; color:var(--muted); margin-bottom:24px; }
  .login-box input { width:100%; padding:13px 18px; font-size:0.92rem; border:1.5px solid var(--line); border-radius:var(--radius-sm); background:var(--bg); color:var(--ink); outline:none; text-align:center; margin-bottom:14px; }
  .login-box input:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(217,107,58,0.12); }
  .login-box button { width:100%; padding:13px; font-size:0.88rem; font-weight:700; background:var(--accent); color:#fff; border:none; border-radius:var(--radius-sm); cursor:pointer; box-shadow:0 2px 6px rgba(217,107,58,0.25); transition:transform 0.15s,box-shadow 0.15s; }
  .login-box button:hover { transform:translateY(-1px); box-shadow:0 4px 12px rgba(217,107,58,0.35); }
  .login-box button:active { transform:scale(0.98); }
  .login-error { font-size:0.78rem; color:#c0392b; margin-top:12px; display:none; }
  .page.locked { display:none; }

  @media(max-width:800px){ .page{padding:20px 20px 80px;} .cal-grid{grid-template-columns:repeat(3,1fr)!important;} #calPanel.active{padding-left:16px;padding-right:16px;} header{flex-direction:column;gap:4px;} }
  @media(max-width:500px){ .cal-grid{grid-template-columns:1fr;} .input-row{flex-wrap:wrap;} .input-row select{width:100%;} .tab{padding:9px 16px;font-size:0.75rem;} .tab svg{display:none;} }
  /* What's New */
  .whats-new-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.45); backdrop-filter:blur(4px); z-index:950; align-items:center; justify-content:center; }
  .whats-new-overlay.open { display:flex; }
  .whats-new { background:var(--card); border-radius:var(--radius); padding:32px 36px; max-width:480px; width:90%; box-shadow:var(--shadow-lg); border:1px solid var(--line); animation:modalIn 0.3s cubic-bezier(.34,1.56,.64,1); max-height:80vh; overflow-y:auto; }
  .whats-new h2 { font-size:1.3rem; font-weight:400; margin-bottom:6px; }
  .whats-new .wn-version { font-size:0.72rem; color:var(--muted); margin-bottom:20px; text-transform:uppercase; letter-spacing:0.05em; }
  .whats-new ul { padding-left:18px; margin:0; }
  .whats-new li { font-size:0.85rem; color:var(--ink2); line-height:1.6; margin-bottom:8px; }
  .whats-new li b { color:var(--ink); }
  .whats-new .wn-footer { margin-top:20px; text-align:right; }

  @media print { .input-row,.filter-row,.delete-btn,.tabs,.cal-toolbar button,.ics-upload-area,.sort-row{display:none;} .item{box-shadow:none;border:1px solid var(--line);} .panel{display:block!important;} }