* { margin: 0; padding: 0; box-sizing: border-box; }

    body {
      background: #0d1208;
      color: #e8dcc8;
      font-family: 'Lora', Georgia, serif;
      min-height: 100vh;
      padding: 40px 20px;
    }

    .container { max-width: 600px; margin: 0 auto; }

    h1 {
      font-family: 'Cinzel', serif;
      font-size: 28px;
      font-weight: 600;
      letter-spacing: 4px;
      color: #c9a84c;
      margin-bottom: 8px;
    }

    .subtitle {
      font-family: 'Lora', serif;
      font-size: 13px;
      color: #6b5f4a;
      font-style: italic;
      margin-bottom: 40px;
    }

    .card {
      background: #12201a;
      border: 1px solid #2a3a2e;
      border-radius: 12px;
      padding: 24px;
      margin-bottom: 20px;
      transition: transform 0.25s ease, border-color 0.25s ease;
    }
    .card:hover {
      transform: translateY(-2px);
      border-color: #3d5442;
    }

    .card h2 {
      font-family: 'Cinzel', serif;
      font-size: 11px;
      letter-spacing: 2px;
      text-transform: uppercase;
      color: #6b5f4a;
      margin-bottom: 20px;
    }

    /* Przyciski wody */
    .water-btns { display: flex; flex-direction: column; gap: 10px; }

    .water-btn {
      background: #1a2e1e;
      border: 1px solid #c9a84c;
      color: #c9a84c;
      padding: 14px 28px;
      border-radius: 8px;
      font-family: 'Lora', serif;
      font-size: 15px;
      cursor: pointer;
      width: 100%;
      transition: all 0.25s ease;
    }
    .water-btn:hover {
      background: #223828;
      box-shadow: 0 0 14px rgba(201, 168, 76, 0.2);
      transform: scale(1.02);
    }
    .water-btn:active { transform: scale(0.97); }
    .water-btn:disabled { opacity: 0.4; cursor: not-allowed; transform: none; box-shadow: none; }

    .water-btn-stanley {
      background: #1e2a14;
      border-color: #d4822a;
      color: #d4822a;
    }
    .water-btn-stanley:hover {
      background: #263620;
      box-shadow: 0 0 14px rgba(212, 130, 42, 0.2);
    }

    /* Sekcja głosowa */
    .voice-section {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 16px;
    }

    .mic-btn {
      width: 80px;
      height: 80px;
      border-radius: 50%;
      background: #12201a;
      border: 2px solid #c9a84c;
      color: #c9a84c;
      font-size: 28px;
      cursor: pointer;
      transition: background 0.3s ease, border-color 0.3s ease;
      display: flex;
      align-items: center;
      justify-content: center;
      animation: breathe 3s ease-in-out infinite;
    }
    .mic-btn:hover {
      background: #1a2e1e;
      box-shadow: 0 0 18px rgba(201, 168, 76, 0.25);
    }

    /* Idle: spokojny oddech */
    @keyframes breathe {
      0%, 100% { box-shadow: 0 0 0 0 rgba(201, 168, 76, 0.08); }
      50%       { box-shadow: 0 0 0 8px rgba(201, 168, 76, 0); }
    }

    /* Listening: amber pulsacja */
    .mic-btn.listening {
      background: #2a1e0e;
      border-color: #d4822a;
      color: #d4822a;
      animation: amber-pulse 1s ease-in-out infinite;
    }
    @keyframes amber-pulse {
      0%, 100% { box-shadow: 0 0 0 0 rgba(212, 130, 42, 0.45); }
      50%       { box-shadow: 0 0 0 16px rgba(212, 130, 42, 0); }
    }

    /* Processing: magiczny obrót */
    .mic-btn.processing {
      background: #1a1228;
      border-color: #8a6fa8;
      color: #8a6fa8;
      animation: magic-spin 1.8s linear infinite;
    }
    @keyframes magic-spin {
      0%   { box-shadow: 0 0 0 0 rgba(138, 111, 168, 0.4); transform: rotate(0deg); }
      50%  { box-shadow: 0 0 0 12px rgba(138, 111, 168, 0); }
      100% { box-shadow: 0 0 0 0 rgba(138, 111, 168, 0); transform: rotate(360deg); }
    }

    /* Speaking: fala dźwięku */
    .mic-btn.speaking {
      background: #142614;
      border-color: #4a7c59;
      color: #4a7c59;
      animation: wave-pulse 0.9s ease-in-out infinite alternate;
    }
    @keyframes wave-pulse {
      from { box-shadow: 0 0 4px rgba(74, 124, 89, 0.3); transform: scale(1); }
      to   { box-shadow: 0 0 18px rgba(74, 124, 89, 0.55); transform: scale(1.05); }
    }

    .transcript {
      font-family: 'Lora', serif;
      font-size: 14px;
      color: #6b5f4a;
      text-align: center;
      min-height: 20px;
      font-style: italic;
      transition: color 0.3s;
    }

    .ai-response {
      background: #0d1a10;
      border: 1px solid #2a3a2e;
      border-radius: 8px;
      padding: 16px;
      font-family: 'Lora', serif;
      font-size: 14px;
      color: #e8dcc8;
      line-height: 1.75;
      min-height: 60px;
      width: 100%;
      display: none;
    }
    .ai-response.visible { display: block; }

    .brief-btn {
      background: linear-gradient(90deg, #d4822a, #c9a84c);
      border: none;
      color: #14241a;
      padding: 14px 28px;
      border-radius: 8px;
      font-family: 'Cinzel', serif;
      font-size: 15px;
      font-weight: 600;
      letter-spacing: 0.5px;
      cursor: pointer;
      width: 100%;
      margin-top: 4px;
      transition: all 0.25s ease;
    }
    .brief-btn:hover {
      box-shadow: 0 0 16px rgba(201, 168, 76, 0.3);
      transform: scale(1.01);
    }
    .brief-btn:active { transform: scale(0.98); }
    .brief-btn:disabled { opacity: 0.5; cursor: not-allowed; transform: none; box-shadow: none; }

    /* Nieobecności (przycisk w „Dziś") */
    .absence-status { font-family: 'Lora', serif; font-size: 13px; color: #c9d4c0; margin-bottom: 10px; line-height: 1.5; }
    .absence-picker { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
    .absence-day-btn {
      flex: 1 1 auto; min-width: 64px;
      background: rgba(201, 168, 76, 0.12);
      border: 1px solid rgba(201, 168, 76, 0.4);
      color: #e6d9a8;
      padding: 12px 10px; border-radius: 8px;
      font-family: 'Cinzel', serif; font-size: 14px; cursor: pointer;
      transition: all 0.2s ease;
    }
    .absence-day-btn:hover { background: rgba(201, 168, 76, 0.25); }
    .absence-cancel { background: linear-gradient(90deg, #8a6a3a, #7a6336); }
    .absence-back {
      background: none; border: none; color: #8a9a82;
      font-family: 'Lora', serif; font-size: 12.5px; cursor: pointer;
      padding: 8px 0 2px; text-decoration: underline; width: 100%;
    }

    .briefing-output {
      background: #0d1a10;
      border: 1px solid #2a3a2e;
      border-radius: 8px;
      padding: 18px;
      margin-top: 14px;
      font-family: 'Lora', serif;
      font-size: 15px;
      color: #e8dcc8;
      line-height: 1.75;
      white-space: pre-wrap;
      display: none;
    }
    .briefing-output.visible { display: block; }
    .briefing-stamp {
      font-family: 'Lora', serif;
      font-size: 12px;
      color: #6e7d6a;
      white-space: normal;
      margin-bottom: 12px;
      padding-bottom: 10px;
      border-bottom: 1px solid #2a3a2e;
    }
    /* Wskaźnik świeżości: gdy po ~8:00 cron nie złożył dziś Mapy (cicha awaria → jawny komunikat). */
    .briefing-stale {
      display: none;
      font-family: 'Lora', serif;
      font-size: 12.5px;
      color: #d4822a;
      background: rgba(212, 130, 42, 0.08);
      border: 1px solid rgba(212, 130, 42, 0.35);
      border-radius: 6px;
      padding: 8px 12px;
      margin-bottom: 12px;
    }
    .briefing-stale.visible { display: block; }

    .status {
      margin-top: 12px;
      font-family: 'Lora', serif;
      font-size: 13px;
      color: #6b5f4a;
      text-align: center;
      min-height: 20px;
      font-style: italic;
    }
    .status.success { color: #4a7c59; font-style: normal; }
    .status.error   { color: #7c2a2a; font-style: normal; }

    .counter {
      font-family: 'Cinzel', serif;
      font-size: 48px;
      font-weight: 400;
      color: #c9a84c;
      text-align: center;
      margin: 10px 0 4px;
    }

    .counter-label {
      font-family: 'Lora', serif;
      text-align: center;
      font-size: 12px;
      color: #6b5f4a;
      font-style: italic;
    }

    .history { margin-top: 16px; }
    .history-item {
      display: flex;
      justify-content: space-between;
      padding: 10px 0;
      border-bottom: 1px solid #1e2e22;
      font-family: 'Lora', serif;
      font-size: 13px;
      color: #6b5f4a;
    }
    .history-item:last-child { border-bottom: none; }

    /* Dokumentacja */
    .docs-item {
      display: flex;
      align-items: flex-start;
      gap: 14px;
      padding: 14px 0;
      border-bottom: 1px solid #1e2e22;
      cursor: pointer;
      transition: opacity 0.2s;
    }
    .docs-item:last-child { border-bottom: none; }
    .docs-item:hover { opacity: 0.75; }
    .docs-item-num {
      font-family: 'Cinzel', serif;
      font-size: 11px;
      color: #c9a84c;
      border: 1px solid #3d5442;
      border-radius: 4px;
      padding: 3px 7px;
      white-space: nowrap;
      margin-top: 3px;
    }
    .docs-item-title {
      font-family: 'Lora', serif;
      font-size: 15px;
      color: #e8dcc8;
      margin-bottom: 4px;
    }
    .docs-item-desc {
      font-family: 'Lora', serif;
      font-size: 12.5px;
      color: #6b5f4a;
      line-height: 1.5;
    }
    .docs-back {
      font-family: 'Lora', serif;
      font-size: 13px;
      color: #4a7c59;
      cursor: pointer;
      display: inline-block;
      margin-bottom: 20px;
      transition: color 0.2s;
    }
    .docs-back:hover { color: #c9a84c; }

    /* Markdown content */
    .docs-content h1 {
      font-family: 'Cinzel', serif;
      font-size: 17px;
      color: #c9a84c;
      letter-spacing: 1px;
      margin-bottom: 20px;
      padding-bottom: 12px;
      border-bottom: 1px solid #2a3a2e;
    }
    .docs-content h2 {
      font-family: 'Cinzel', serif;
      font-size: 11px;
      letter-spacing: 2px;
      text-transform: uppercase;
      color: #8a9a82;
      margin: 28px 0 10px;
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .docs-content h3 {
      font-family: 'Lora', serif;
      font-size: 14px;
      font-style: italic;
      color: #c9a84c;
      margin: 18px 0 8px;
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .section-num {
      font-family: 'Cinzel', serif;
      font-size: 9px;
      color: #4a3e2e;
      border: 1px solid #2a3a2e;
      border-radius: 3px;
      padding: 1px 5px;
      letter-spacing: 0.5px;
      flex-shrink: 0;
    }
    .docs-content p {
      font-family: 'Lora', serif;
      font-size: 14px;
      color: #c8bfaf;
      line-height: 1.75;
      margin-bottom: 12px;
    }
    .docs-content code {
      font-family: 'Courier New', monospace;
      font-size: 12px;
      background: #0a1208;
      color: #4a7c59;
      padding: 2px 6px;
      border-radius: 4px;
      border: 1px solid #1e2e22;
    }
    .docs-content pre {
      background: #0a1208;
      border: 1px solid #1e2e22;
      border-radius: 8px;
      padding: 16px;
      overflow-x: auto;
      margin: 12px 0;
    }
    .docs-content pre code {
      background: none;
      border: none;
      padding: 0;
      color: #8ab89a;
      font-size: 12px;
      line-height: 1.6;
    }
    .docs-content ul, .docs-content ol {
      padding-left: 20px;
      margin-bottom: 12px;
    }
    .docs-content li {
      font-family: 'Lora', serif;
      font-size: 14px;
      color: #c8bfaf;
      line-height: 1.7;
      margin-bottom: 4px;
    }
    .docs-content table {
      width: 100%;
      border-collapse: collapse;
      margin: 12px 0;
    }
    .docs-content th {
      background: #0a1208;
      color: #6b5f4a;
      font-family: 'Cinzel', serif;
      font-size: 9px;
      font-weight: normal;
      letter-spacing: 1px;
      text-transform: uppercase;
      padding: 8px 10px;
      border: 1px solid #1e2e22;
      text-align: left;
    }
    .docs-content td {
      font-family: 'Lora', serif;
      font-size: 13px;
      color: #c8bfaf;
      padding: 8px 10px;
      border: 1px solid #1e2e22;
    }
    .docs-content strong { color: #e8dcc8; font-weight: 600; }
    .docs-content a { color: #4a7c59; }
    .docs-content hr {
      border: none;
      border-top: 1px solid #1e2e22;
      margin: 24px 0;
    }
    .docs-content blockquote {
      border-left: 2px solid #3d5442;
      padding: 4px 0 4px 14px;
      margin: 12px 0;
      color: #6b5f4a;
      font-style: italic;
    }
    .docs-loading {
      font-family: 'Lora', serif;
      font-style: italic;
      color: #4a3e2e;
      text-align: center;
      padding: 24px 0;
    }
    /* fix: pre nie rozszerza strony poza viewport na mobile */
    #docs-detail .card { overflow: hidden; }
    .docs-content { max-width: 100%; }

    /* Przycisk kopiowania przy blokach kodu */
    .code-block { position: relative; }
    .copy-btn {
      position: absolute;
      top: 8px;
      right: 8px;
      background: #0d1208;
      border: 1px solid #2a3a2e;
      border-radius: 4px;
      color: #4a5a4e;
      font-family: 'Lora', serif;
      font-size: 10px;
      letter-spacing: 0.5px;
      padding: 3px 8px;
      cursor: pointer;
      transition: color 0.2s, border-color 0.2s;
    }
    .copy-btn:hover { color: #c9a84c; border-color: #c9a84c; }
    .copy-btn.copied { color: #4a7c59; border-color: #4a7c59; }

    /* Health sync status */
    .sync-section {
      margin-top: 14px;
      border-top: 1px solid #1e2e22;
      padding-top: 10px;
    }
    .sync-toggle {
      font-family: 'Lora', serif;
      font-size: 12px;
      color: #4a7c59;
      cursor: pointer;
      list-style: none;
      user-select: none;
    }
    .sync-toggle::-webkit-details-marker { display: none; }
    .sync-body { margin-top: 10px; }
    .sync-header {
      display: flex;
      justify-content: space-between;
      font-family: 'Lora', serif;
      font-size: 10px;
      color: #4a3e2e;
      text-transform: uppercase;
      letter-spacing: 1px;
      margin-bottom: 5px;
      padding: 0 2px;
    }
    .sync-row {
      display: flex;
      justify-content: space-between;
      padding: 5px 2px;
      font-family: 'Lora', serif;
      font-size: 12px;
      border-bottom: 1px solid #131f16;
    }
    .sync-row:last-child { border-bottom: none; }
    .sync-day { color: #6b5f4a; min-width: 72px; }
    .sync-day.today { color: #c9a84c; }
    .sync-supabase { color: #8a9a82; min-width: 60px; text-align: center; }
    .sync-health { min-width: 80px; text-align: right; }

    .dot {
      width: 6px;
      height: 6px;
      background: #4a7c59;
      border-radius: 50%;
      display: inline-block;
      margin-right: 8px;
    }

    .connection-status {
      font-family: 'Lora', serif;
      font-size: 11px;
      color: #6b5f4a;
      text-align: right;
      margin-bottom: 20px;
      font-style: italic;
    }
    .connection-status.connected { color: #4a7c59; }

    .voice-hint {
      font-family: 'Lora', serif;
      font-size: 12px;
      color: #4a3e2e;
      text-align: center;
      font-style: italic;
    }
    .memory-clear {
      display: block;
      margin: 10px auto 0;
      background: none;
      border: none;
      cursor: pointer;
      font-family: 'Lora', serif;
      font-size: 11px;
      color: #8a7a5e;
      font-style: italic;
      text-decoration: underline;
      opacity: 0.7;
    }
    .memory-clear:hover { opacity: 1; color: #c9a84c; }

    /* Ekran logowania */
    #loginScreen {
      position: fixed;
      inset: 0;
      background: #0d1208;
      display: flex;
      align-items: center;
      justify-content: center;
      z-index: 1000;
    }
    #loginScreen.hidden { display: none; }

    .login-card {
      background: #12201a;
      border: 1px solid #2a3a2e;
      border-radius: 12px;
      padding: 40px 32px;
      width: 100%;
      max-width: 340px;
      text-align: center;
    }

    .login-title {
      font-family: 'Cinzel', serif;
      font-size: 28px;
      font-weight: 600;
      letter-spacing: 4px;
      color: #c9a84c;
      margin-bottom: 6px;
    }

    .login-subtitle {
      font-family: 'Lora', serif;
      font-size: 12px;
      color: #6b5f4a;
      font-style: italic;
      margin-bottom: 32px;
    }

    .login-input {
      width: 100%;
      background: #0d1208;
      border: 1px solid #2a3a2e;
      border-radius: 8px;
      color: #e8dcc8;
      font-family: 'Lora', serif;
      font-size: 15px;
      padding: 12px 16px;
      margin-bottom: 12px;
      outline: none;
      letter-spacing: 2px;
      text-align: center;
      transition: border-color 0.2s;
    }
    .login-input:focus { border-color: #c9a84c; }

    .login-btn {
      width: 100%;
      background: #1a2e1e;
      border: 1px solid #c9a84c;
      color: #c9a84c;
      padding: 12px;
      border-radius: 8px;
      font-family: 'Cinzel', serif;
      font-size: 13px;
      letter-spacing: 2px;
      text-transform: uppercase;
      cursor: pointer;
      transition: all 0.25s ease;
    }
    .login-btn:hover {
      background: #223828;
      box-shadow: 0 0 14px rgba(201, 168, 76, 0.2);
    }
    .login-btn:disabled { opacity: 0.4; cursor: not-allowed; }

    .login-error {
      margin-top: 12px;
      font-family: 'Lora', serif;
      font-size: 13px;
      color: #7c2a2a;
      min-height: 20px;
      font-style: italic;
    }

    /* Szlak Gandalfa — command center */
    .quest-headline {
      text-align: center;
      margin-bottom: 6px;
    }
    .quest-pct {
      font-family: 'Cinzel', serif;
      font-size: 40px;
      font-weight: 600;
      color: #c9a84c;
      display: block;
      line-height: 1.1;
    }
    .quest-sub {
      font-family: 'Lora', serif;
      font-size: 12px;
      color: #6b5f4a;
      font-style: italic;
    }
    .quest-overall {
      height: 4px;
      background: #1e2e22;
      border-radius: 2px;
      overflow: hidden;
      margin: 14px 0 22px;
    }
    .quest-overall-fill {
      height: 100%;
      width: 0;
      background: linear-gradient(90deg, #d4822a, #c9a84c);
      border-radius: 2px;
      transition: width 1.1s cubic-bezier(.2,.8,.2,1);
    }

    .quest-item {
      padding: 11px 12px;
      border-radius: 8px;
      margin-bottom: 8px;
      border: 1px solid transparent;
      cursor: pointer;
      transition: background 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
    }
    .quest-item:hover {
      background: #16271c;
      transform: translateX(2px);
    }
    .quest-item-head {
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .quest-icon { font-size: 14px; width: 16px; text-align: center; }
    .quest-title {
      font-family: 'Lora', serif;
      font-size: 14px;
      color: #e8dcc8;
      flex: 1;
    }
    .quest-tag {
      font-family: 'Lora', serif;
      font-size: 11px;
      font-style: italic;
      color: #6b5f4a;
    }
    .quest-bar {
      height: 6px;
      background: #1e2e22;
      border-radius: 3px;
      overflow: hidden;
      margin-top: 9px;
    }
    .quest-fill {
      height: 100%;
      width: 0;
      border-radius: 3px;
      transition: width 1s cubic-bezier(.2,.8,.2,1);
    }

    /* Stany */
    .quest-item.done .quest-icon { color: #c9a84c; }
    .quest-item.done .quest-fill { background: linear-gradient(90deg, #9a7d34, #c9a84c); }
    .quest-item.done .quest-title { color: #c9a84c; }

    .quest-item.teraz {
      background: #1c160c;
      border-color: #d4822a;
      animation: quest-glow 2.4s ease-in-out infinite;
    }
    .quest-item.teraz .quest-icon { color: #d4822a; }
    .quest-item.teraz .quest-fill { background: linear-gradient(90deg, #d4822a, #e8a04a); }
    @keyframes quest-glow {
      0%, 100% { box-shadow: 0 0 0 0 rgba(212, 130, 42, 0); }
      50%       { box-shadow: 0 0 14px 0 rgba(212, 130, 42, 0.22); }
    }

    .quest-item.todo { opacity: 0.62; }
    .quest-item.todo .quest-icon { color: #4a5a4e; }
    .quest-item.todo .quest-fill { background: #3d5442; }

    .quest-detail {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.35s ease, margin 0.35s ease;
      font-family: 'Lora', serif;
      font-size: 12.5px;
      line-height: 1.6;
      color: #8a9a82;
    }
    .quest-detail.open {
      max-height: 400px;
      margin-top: 10px;
    }

    /* Action points w milestone */
    .quest-actions { margin: 10px 0 0; padding: 0; list-style: none; }
    .quest-actions li {
      font-family: 'Lora', serif; font-size: 12.5px; color: #b8c4ae;
      padding: 4px 0 4px 16px; position: relative; line-height: 1.5;
    }
    .quest-actions li::before { content: '◦'; position: absolute; left: 2px; color: #d4822a; }
    .quest-actions li.done { color: #6e7d63; text-decoration: line-through; text-decoration-color: #4a7c59; }
    .quest-actions li.done::before { content: '✓'; color: #4a7c59; }
    .quest-actions li.you::after {
      content: 'Ty'; margin-left: 8px; font-size: 10px; font-style: italic;
      color: #d4822a; border: 1px solid #6a4420; border-radius: 4px; padding: 1px 5px;
    }

    /* Nawigacja zakładek */
    .nav {
      display: flex;
      gap: 4px;
      margin-bottom: 24px;
      border-bottom: 1px solid #1e2e22;
    }
    .nav-btn {
      background: none;
      border: none;
      border-bottom: 2px solid transparent;
      color: #6b5f4a;
      font-family: 'Cinzel', serif;
      font-size: 12px;
      letter-spacing: 1px;
      text-transform: uppercase;
      padding: 8px 14px;
      cursor: pointer;
      transition: color 0.2s, border-color 0.2s;
    }
    .nav-btn:hover { color: #c9a84c; }
    .nav-btn.active { color: #c9a84c; border-bottom-color: #c9a84c; }
    /* Badge licznika „czeka na rękę" — pokazywany tylko gdy >0 (klasa .visible). */
    .nav-badge {
      display: none; margin-left: 6px; padding: 1px 6px; border-radius: 9px;
      background: #c9a84c; color: #0d1a10; font-family: 'Lora', serif;
      font-size: 10px; letter-spacing: 0; font-weight: 600; vertical-align: middle;
    }
    .nav-badge.visible { display: inline-block; }

    .view { display: none; }
    .view.active { display: block; animation: fade-in 0.4s ease; }
    @keyframes fade-in {
      from { opacity: 0; transform: translateY(4px); }
      to   { opacity: 1; transform: none; }
    }

    /* TODO dnia */
    .todo-row {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 12px 0;
      border-bottom: 1px solid #1e2e22;
    }
    .todo-row:last-child { border-bottom: none; }
    .todo-label {
      font-family: 'Cinzel', serif;
      font-size: 10px;
      letter-spacing: 1px;
      text-transform: uppercase;
      width: 64px;
      flex-shrink: 0;
    }
    .todo-project .todo-label { color: #c9a84c; }
    .todo-private .todo-label { color: #7ec9a8; }
    .todo-work .todo-label { color: #d4822a; }
    .todo-text { flex: 1; font-family: 'Lora', serif; font-size: 14px; color: #e8dcc8; }
    .todo-link {
      font-family: 'Lora', serif; font-size: 12px; color: #c9a84c;
      text-decoration: none; border: 1px solid #c9a84c; border-radius: 6px;
      padding: 4px 10px; transition: background 0.2s; white-space: nowrap;
    }
    .todo-link:hover { background: #1a2e1e; }
    .todo-badge {
      font-family: 'Lora', serif; font-size: 10px; font-style: italic;
      color: #4a5a4e; border: 1px dashed #3d5442; border-radius: 6px;
      padding: 3px 8px; white-space: nowrap;
    }

    /* Briefy */
    .brief-intro {
      font-family: 'Lora', serif; font-style: italic; font-size: 13px;
      color: #6b5f4a; margin-bottom: 16px;
    }
    .brief-card {
      display: block; text-decoration: none;
      background: #0d1a10; border: 1px solid #2a3a2e; border-radius: 8px;
      padding: 16px; transition: border-color 0.2s, transform 0.15s;
    }
    .brief-card:hover { border-color: #c9a84c; transform: translateY(-2px); }
    .brief-card-head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
    .brief-id { font-family: 'Cinzel', serif; font-size: 13px; color: #c9a84c; }
    .brief-status {
      font-family: 'Lora', serif; font-size: 10px; font-style: italic;
      padding: 2px 8px; border-radius: 4px;
    }
    .brief-status.do-wypelnienia { color: #d4822a; border: 1px solid #6a4420; }
    .brief-status.zrobione { color: #7aa86a; border: 1px solid #2f5a3a; }
    .brief-title { font-family: 'Lora', serif; font-size: 15px; color: #e8dcc8; margin-bottom: 4px; }
    .brief-desc { font-family: 'Lora', serif; font-size: 12.5px; color: #8a9a82; line-height: 1.5; }

    /* === Skrzynka === */
    .inbox-intro { font-family: 'Lora', serif; font-size: 12.5px; color: #8a9a82; line-height: 1.5; margin-bottom: 12px; }
    .inbox-capture { display: flex; gap: 8px; }
    .inbox-input {
      flex: 1; background: #0d1a10; border: 1px solid #2a3a2e; border-radius: 8px;
      padding: 12px 14px; color: #e8dcc8; font-family: 'Lora', serif; font-size: 15px;
    }
    .inbox-input:focus { outline: none; border-color: #c9a84c; }
    .inbox-input::placeholder { color: #5a6a52; font-style: italic; }
    .inbox-add-btn {
      background: #1a2e1e; border: 1px solid #c9a84c; color: #c9a84c;
      padding: 0 22px; border-radius: 8px; font-family: 'Lora', serif; font-size: 15px;
      cursor: pointer; transition: all 0.2s ease;
    }
    .inbox-add-btn:hover { background: #223828; box-shadow: 0 0 12px rgba(201,168,76,0.2); }
    .inbox-add-btn:active { transform: scale(0.97); }
    .inbox-add-btn:disabled { opacity: 0.4; cursor: not-allowed; }
    .inbox-status { font-family: 'Lora', serif; font-size: 12px; font-style: italic; color: #8a9a82; min-height: 16px; margin-top: 8px; }

    /* Import z WhatsAppa (zwijany) */
    .wa-import > summary {
      font-family: 'Cinzel', serif; font-size: 14px; color: #c9a84c; cursor: pointer;
      list-style: none; padding: 2px 0;
    }
    .wa-import > summary::-webkit-details-marker { display: none; }
    .wa-import > summary::before { content: '▸ '; color: #8a9a82; }
    .wa-import[open] > summary::before { content: '▾ '; }
    .wa-import[open] > summary { margin-bottom: 10px; }
    .wa-import code { background: #0d1a10; padding: 1px 5px; border-radius: 4px; color: #c9a84c; font-size: 11px; }
    /* Nieobecność: zwinięta na dole „Dziś" — używana kilka razy w roku, nie zasłania codziennej Mapy. */
    .absence-details > summary {
      font-family: 'Cinzel', serif; font-size: 14px; color: #c9a84c; cursor: pointer;
      list-style: none; padding: 2px 0;
    }
    .absence-details > summary::-webkit-details-marker { display: none; }
    .absence-details > summary::before { content: '▸ '; color: #8a9a82; }
    .absence-details[open] > summary::before { content: '▾ '; }
    .absence-details[open] > summary { margin-bottom: 10px; }
    .wa-file { display: block; margin-bottom: 10px; font-family: 'Lora', serif; font-size: 12.5px; color: #8a9a82; }
    .wa-text {
      width: 100%; box-sizing: border-box; background: #0d1a10; border: 1px solid #2a3a2e;
      border-radius: 8px; padding: 12px 14px; color: #e8dcc8; font-family: 'Lora', serif;
      font-size: 13px; resize: vertical; margin-bottom: 10px;
    }
    .wa-text:focus { outline: none; border-color: #c9a84c; }
    .wa-text::placeholder { color: #5a6a52; font-style: italic; }
    .wa-catalog { display: block; width: 100%; box-sizing: border-box; margin-bottom: 10px; font-size: 13px; }

    .inbox-section { margin-bottom: 18px; }
    .inbox-section-head {
      font-family: 'Cinzel', serif; font-size: 13px; letter-spacing: 0.5px;
      display: flex; align-items: center; gap: 8px; margin-bottom: 10px;
    }
    .inbox-section-count { font-family: 'Lora', serif; font-size: 11px; color: #6e7d63; }
    .inbox-sec-decision .inbox-section-head { color: #d4822a; }
    .inbox-sec-info .inbox-section-head { color: #c9a84c; }
    .inbox-sec-ready .inbox-section-head { color: #7aa86a; }
    .inbox-sec-done .inbox-section-head { color: #6e7d63; }
    .inbox-sec-failed .inbox-section-head { color: #b05a4a; }

    .inbox-item {
      background: #0d1a10; border: 1px solid #2a3a2e; border-left-width: 3px;
      border-radius: 8px; padding: 13px 15px; margin-bottom: 9px;
    }
    .inbox-sec-decision .inbox-item { border-left-color: #d4822a; }
    .inbox-sec-info .inbox-item { border-left-color: #c9a84c; }
    .inbox-sec-ready .inbox-item { border-left-color: #4a7c59; }
    .inbox-sec-done .inbox-item { border-left-color: #3a4a36; opacity: 0.72; }
    .inbox-sec-failed .inbox-item { border-left-color: #b05a4a; }
    /* Edycja zadania inline (Do zrobienia) */
    .task-edit-title {
      width: 100%; box-sizing: border-box; background: #0d1a10; border: 1px solid #2a3a2e;
      border-radius: 8px; padding: 9px 12px; color: #e8dcc8; font-family: 'Lora', serif;
      font-size: 14px; margin-bottom: 8px;
    }
    .task-edit-title:focus { outline: none; border-color: #c9a84c; }
    .task-edit-row { display: flex; gap: 8px; margin-bottom: 4px; }
    .task-edit-date, .task-edit-prio {
      background: #0d1a10; border: 1px solid #2a3a2e; border-radius: 8px;
      padding: 8px 10px; color: #e8dcc8; font-family: 'Lora', serif; font-size: 13px;
    }
    .task-edit-date { flex: 1; }
    .task-edit-date:focus, .task-edit-prio:focus { outline: none; border-color: #c9a84c; }
    .inbox-item-meta { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; flex-wrap: wrap; }
    .inbox-tag {
      font-family: 'Cinzel', serif; font-size: 10px; color: #c9a84c;
      border: 1px solid #4a3e2e; border-radius: 4px; padding: 1px 7px;
    }
    /* Katalog = dom rzeczy (wyróżniony), fasety = czym to jest (stonowane) */
    .inbox-tag.catalog { color: #0d1a10; background: #c9a84c; border-color: #c9a84c; }
    .inbox-tag.facet { color: #8a9a82; border-color: #2a3a2e; }
    .inbox-summary.note { color: #a8b89e; }
    .inbox-conf { font-family: 'Lora', serif; font-size: 10.5px; color: #6e7d63; }
    .inbox-time { font-family: 'Lora', serif; font-size: 10.5px; color: #5a6a52; margin-left: auto; }
    .inbox-raw { font-family: 'Lora', serif; font-size: 14.5px; color: #e8dcc8; line-height: 1.45; word-break: break-word; }
    .inbox-raw a { color: #7aa86a; }
    .inbox-summary { font-family: 'Lora', serif; font-size: 12.5px; color: #8a9a82; font-style: italic; margin-top: 5px; }
    .inbox-question { font-family: 'Lora', serif; font-size: 12.5px; color: #d4822a; margin-top: 5px; }
    .inbox-actions { display: flex; gap: 8px; margin-top: 10px; }
    .inbox-act {
      background: transparent; border: 1px solid #2a3a2e; color: #8a9a82;
      padding: 5px 12px; border-radius: 6px; font-family: 'Lora', serif; font-size: 12px;
      cursor: pointer; transition: all 0.18s ease;
    }
    .inbox-act:hover { border-color: #c9a84c; color: #c9a84c; }
    .inbox-act.done:hover { border-color: #4a7c59; color: #7aa86a; }
    .inbox-act.danger:hover { border-color: #b05a4a; color: #c97a6a; }
    .inbox-empty { font-family: 'Lora', serif; font-size: 13px; font-style: italic; color: #5a6a52; text-align: center; padding: 24px 0; }
    .inbox-reply { display: flex; gap: 8px; margin-top: 8px; }
    .inbox-reply-input {
      flex: 1; background: #0f1a12; border: 1px solid #2e4030; border-radius: 7px;
      padding: 7px 10px; color: #e8dcc8; font-family: 'Lora', serif; font-size: 13px;
    }
    .inbox-reply-input:focus { outline: none; border-color: #c9a84c; }
    .inbox-reply-input::placeholder { color: #5a6a52; font-style: italic; }
    .inbox-reply-input:disabled { opacity: 0.5; }
    .inbox-act.promote:hover { border-color: #7aa86a; color: #7aa86a; }
    .inbox-act:disabled { opacity: 0.55; cursor: default; }
    .inbox-act:disabled:hover { border-color: #2a3a2e; color: #8a9a82; }

    /* === Praca (M5.3 — widok radaru) === */
    .radar-fresh { font-family: 'Lora', serif; font-size: 12px; color: #6e7d63; margin-top: 2px; }
    .radar-fresh.stale { color: #d4822a; }
    .signal-overdue { color: #c97a6a; }
    .inbox-tag.returned { color: #d4822a; border-color: #d4822a; }
    .signal-note { font-family: 'Lora', serif; font-size: 12px; color: #6e7d63; font-style: italic; margin-top: 5px; }
    /* Link do wątku jako kotwica w stroju przycisku akcji */
    a.signal-link { text-decoration: none; display: inline-block; line-height: normal; box-sizing: border-box; }

    /* === Pomysły (Krok 4) === */
    .idea-badge {
      font-family: 'Cinzel', serif; font-size: 10px; color: #0d1a10;
      background: #7aa86a; border-radius: 4px; padding: 1px 7px;
    }
    .idea-link { font-family: 'Lora', serif; font-size: 11px; color: #7aa86a; text-decoration: none; }
    .idea-link:hover { color: #c9a84c; }
    .idea-toast {
      font-family: 'Lora', serif; font-size: 12.5px; color: #0d1a10;
      background: #c9a84c; border-radius: 8px; padding: 9px 14px; margin-bottom: 12px;
    }
    .lib-idea-btn { color: #7aa86a; }
    .lib-idea-btn:hover { border-color: #7aa86a; color: #9ec98a; }
    .idea-edit {
      width: 100%; margin-top: 8px; box-sizing: border-box; resize: vertical;
      background: #0f1a12; border: 1px solid #2e4030; border-radius: 7px;
      padding: 8px 10px; color: #e8dcc8; font-family: 'Lora', serif; font-size: 13px; line-height: 1.45;
    }
    .idea-edit:focus { outline: none; border-color: #c9a84c; }
    .idea-edit::placeholder { color: #5a6a52; font-style: italic; }

    /* === Biblioteka (Krok 2) === */
    .lib-search { width: 100%; margin-top: 12px; }
    /* Panel sortowni — „co czeka na rękę" */
    .lib-progress { margin-top: 12px; }
    .lib-progress:empty { display: none; }
    .lib-prog-clean { font-family: 'Lora', serif; font-size: 12px; color: #6e7d63; padding: 2px; }
    .lib-prog-head {
      display: flex; align-items: center; gap: 10px; width: 100%;
      background: rgba(212, 130, 42, 0.06); border: 1px solid #3a3324;
      border-radius: 10px; padding: 9px 14px; cursor: pointer;
      font-family: 'Lora', serif; color: #c9a84c; transition: all 0.18s ease;
    }
    .lib-prog-head:hover { border-color: #c9a84c; background: rgba(212, 130, 42, 0.1); }
    .lib-prog-title { font-size: 12.5px; font-weight: 600; }
    .lib-prog-sum { flex: 1; text-align: left; font-size: 11.5px; color: #8a9a82; }
    .lib-prog-caret { font-size: 11px; color: #8a9a82; }
    .lib-prog-body {
      border: 1px solid #243024; border-top: none;
      border-radius: 0 0 10px 10px; margin-top: -1px; padding: 4px 0;
    }
    .lib-prog-row {
      display: flex; align-items: center; gap: 10px;
      padding: 7px 14px; border-top: 1px solid #1c281e;
    }
    .lib-prog-row:first-child { border-top: none; }
    .lib-prog-room { font-family: 'Lora', serif; font-size: 12.5px; color: #cfd8c4; flex: 1; }
    .lib-prog-detail { font-family: 'Lora', serif; font-size: 11px; color: #8a9a82; white-space: nowrap; }
    .lib-prog-go {
      background: transparent; border: 1px solid #2a3a2e; color: #8a9a82;
      padding: 3px 12px; border-radius: 12px; font-family: 'Lora', serif;
      font-size: 11.5px; cursor: pointer; transition: all 0.15s ease; white-space: nowrap;
    }
    .lib-prog-go:hover { border-color: #c9a84c; color: #c9a84c; }
    .lib-needs-banner {
      font-family: 'Lora', serif; font-size: 12px; color: #cbb87a;
      border-left: 3px solid #c9a84c; padding: 10px 14px; margin-bottom: 14px;
    }
    .lib-needs-banner b { color: #e0c97a; }
    .lib-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
    .lib-tagfilters { margin-top: 8px; }
    .lib-tagchip { border-radius: 6px; font-size: 11.5px; padding: 3px 9px; }
    .lib-tagchip.active { background: #4a7c59; border-color: #4a7c59; color: #0d1a10; }
    .lib-chip {
      background: transparent; border: 1px solid #2a3a2e; color: #8a9a82;
      padding: 5px 12px; border-radius: 14px; font-family: 'Lora', serif; font-size: 12.5px;
      cursor: pointer; transition: all 0.18s ease;
    }
    .lib-chip:hover { border-color: #c9a84c; color: #c9a84c; }
    .lib-chip.active { background: #c9a84c; border-color: #c9a84c; color: #0d1a10; }
    .lib-chip-count { font-size: 10.5px; opacity: 0.75; }
    /* „Nowe" — tryb chronologiczny, wyróżniony zielonym akcentem (odróżnia od złotych katalogów). */
    .lib-chip-new { border-color: #3e6e4a; color: #7fae84; }
    .lib-chip-new:hover { border-color: #7fae84; color: #9fce9a; }
    .lib-chip-new.active { background: #3e6e4a; border-color: #3e6e4a; color: #eaf6ea; }
    .lib-section { margin-bottom: 18px; }
    .lib-section-sort .inbox-section-head { color: #d4822a; }
    .lib-grid {
      display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
      gap: 12px; margin-top: 12px;
    }
    .lib-card {
      background: #0f1a12; border: 1px solid #243024; border-radius: 9px;
      overflow: hidden; display: flex; flex-direction: column;
      transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
    }
    .lib-card:hover {
      transform: translateY(-3px); border-color: #4a7c59;
      box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
    }
    .lib-card-main { text-decoration: none; display: flex; flex-direction: column; }
    .lib-card-foot {
      display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
      padding: 8px 12px 10px; border-top: 1px solid #1c281e;
    }
    .lib-card-tags { display: flex; gap: 6px; flex-wrap: wrap; flex: 1; }
    .lib-card-date { color: #5a6a52; font-family: 'Lora', serif; font-size: 10px; white-space: nowrap; }
    .lib-bulk { display: flex; justify-content: flex-end; margin-top: 6px; }
    .lib-bulk:empty { display: none; }
    .lib-bulk-btn {
      background: transparent; border: none; color: #5a6a52;
      font-family: 'Lora', serif; font-size: 11px; cursor: pointer;
      padding: 2px 4px; text-decoration: underline dotted; transition: color 0.15s ease;
    }
    .lib-bulk-btn:hover { color: #c9a84c; }
    .lib-edit-btn {
      background: transparent; border: 1px solid #2a3a2e; color: #6e7d63;
      padding: 3px 10px; border-radius: 6px; font-family: 'Lora', serif; font-size: 11px;
      cursor: pointer; transition: all 0.15s ease; white-space: nowrap;
    }
    .lib-edit-btn:hover { border-color: #c9a84c; color: #c9a84c; }
    .lib-edit { padding: 10px 12px; border-top: 1px solid #1c281e; display: flex; flex-direction: column; gap: 4px; }
    .lib-edit-lbl { font-family: 'Cinzel', serif; font-size: 9.5px; color: #6e7d63; letter-spacing: 0.5px; margin-top: 4px; }
    .lib-edit-input {
      background: #0a140d; border: 1px solid #2e4030; border-radius: 6px;
      padding: 6px 9px; color: #e8dcc8; font-family: 'Lora', serif; font-size: 12.5px;
    }
    .lib-edit-input:focus { outline: none; border-color: #c9a84c; }
    .lib-tagsel-row, .lib-tagsugg-row { display: flex; gap: 6px; flex-wrap: wrap; margin: 2px 0 2px; }
    .lib-edit-hint { color: #5a6a52; font-family: 'Lora', serif; font-size: 11px; font-style: italic; }
    .lib-tagsel {
      background: #2a3320; border: 1px solid #5d7a3a; color: #b9d18a;
      padding: 3px 8px; border-radius: 12px; font-family: 'Lora', serif; font-size: 11px;
      cursor: pointer; transition: all 0.15s ease;
    }
    .lib-tagsel:hover { border-color: #c97a6a; color: #e0b0a4; }
    .lib-tagsel .x { opacity: 0.6; font-size: 9px; }
    .lib-tagsugg {
      background: transparent; border: 1px dashed #2a3a2e; color: #6e7d63;
      padding: 3px 8px; border-radius: 12px; font-family: 'Lora', serif; font-size: 11px;
      cursor: pointer; transition: all 0.15s ease;
    }
    .lib-tagsugg:hover { border-color: #c9a84c; color: #c9a84c; border-style: solid; }
    .lib-edit-actions { display: flex; gap: 8px; margin-top: 8px; align-items: center; }
    .lib-edit-icons { margin-left: auto; display: flex; gap: 6px; }
    .lib-icon-btn {
      background: transparent; border: 1px solid #2a3a2e; color: #6e7d63;
      width: 30px; height: 30px; border-radius: 6px; cursor: pointer;
      display: inline-flex; align-items: center; justify-content: center;
      transition: all 0.15s ease;
    }
    .lib-icon-btn:hover { border-color: #c9a84c; color: #c9a84c; }
    .lib-icon-btn.danger:hover { border-color: #b05a4a; color: #c97a6a; }
    .lib-icon-btn:disabled { opacity: 0.5; cursor: default; }
    .lib-thumb {
      width: 100%; aspect-ratio: 4 / 5; object-fit: cover; display: block;
      background-color: #16221a; border-bottom: 1px solid #243024;
    }
    .lib-thumb-empty {
      display: flex; align-items: center; justify-content: center;
      font-family: 'Cinzel', serif; font-size: 13px; color: #5a6a52;
      text-transform: uppercase; letter-spacing: 1px;
    }
    .lib-card-body { padding: 10px 12px; display: flex; flex-direction: column; gap: 6px; }
    .lib-card-src { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
    .lib-source {
      font-family: 'Cinzel', serif; font-size: 9.5px; letter-spacing: 0.5px;
      color: #c9a84c; border: 1px solid #4a3e2e; border-radius: 4px; padding: 1px 7px;
    }
    .lib-account { font-family: 'Lora', serif; font-size: 11px; color: #6e7d63; font-style: italic; }
    /* Badge katalogu w trybie „Nowe" — „gdzie wylądowało" (wypełniony, zielony, odróżnia od źródła linku). */
    .lib-cat-badge {
      font-family: 'Cinzel', serif; font-size: 9.5px; letter-spacing: 0.5px;
      color: #eaf6ea; background: #3e6e4a; border-radius: 4px; padding: 1px 7px;
    }
    .lib-card-desc { font-family: 'Lora', serif; font-size: 13px; color: #e8dcc8; line-height: 1.4; word-break: break-word; }
    .lib-card-note { font-family: 'Lora', serif; font-size: 12px; color: #a8b89e; font-style: italic; }