:root{
  --bg:#0f172a;
  --bg-2:#111827;
  --surface:#172033;
  --surface-2:#1e293b;
  --surface-3:#263449;
  --primary:#3b82f6;
  --primary-strong:#2563eb;
  --success:#10b981;
  --warning:#f59e0b;
  --danger:#ef4444;
  --text:#f8fafc;
  --muted:#94a3b8;
  --border:rgba(255,255,255,.08);
  --shadow:0 18px 50px rgba(0,0,0,.22);
  --radius-sm:12px;
  --radius-md:18px;
  --radius-lg:26px;
}

*{box-sizing:border-box}
html{background:var(--bg);color-scheme:dark}
body{margin:0;min-height:100vh;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:radial-gradient(circle at 10% 0%,#18284a 0,transparent 28%),var(--bg);color:var(--text);padding-bottom:calc(92px + env(safe-area-inset-bottom))}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
a{color:inherit;text-decoration:none}
.material-symbols-rounded{font-size:21px;line-height:1;vertical-align:middle}
.muted{color:var(--muted);margin:0;font-size:14px;line-height:1.55}
.eyebrow{text-transform:uppercase;letter-spacing:.1em;font-size:11px;font-weight:700;color:var(--muted)}

.app-shell{max-width:1480px;margin:0 auto;padding:28px 24px 40px}
.app-header{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;margin-bottom:22px}
.brand-mark{width:58px;height:58px;border-radius:20px;display:grid;place-items:center;background:linear-gradient(145deg,#263b61,#19243a);border:1px solid var(--border);box-shadow:var(--shadow)}
.brand-mark .material-symbols-rounded{font-size:30px;color:#93c5fd}
.header-copy h1{font-size:clamp(28px,4vw,40px);line-height:1.05;margin:5px 0 7px;letter-spacing:-.035em}
.header-copy p{margin:0;color:var(--muted);font-size:15px}
.header-copy strong{color:var(--text)}
.notification-setup{display:flex;align-items:center;gap:9px;border:1px solid rgba(59,130,246,.35);background:rgba(59,130,246,.13);color:#dbeafe;border-radius:16px;padding:11px 14px;font-weight:700}
.notification-setup[hidden]{display:none}

.summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:22px}
.summary-card{display:flex;align-items:center;gap:14px;min-height:92px;padding:17px 18px;border-radius:var(--radius-md);background:rgba(23,32,51,.86);border:1px solid var(--border);box-shadow:0 10px 26px rgba(0,0,0,.12)}
.summary-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:14px;background:rgba(59,130,246,.12);color:#93c5fd}
.summary-card div{display:flex;flex-direction:column;gap:3px}
.summary-card strong{font-size:26px;letter-spacing:-.04em}
.summary-card span:last-child{font-size:13px;color:var(--muted)}

.workspace{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(360px,.65fr);gap:22px;align-items:start}
.tasks-panel,.calendar-card{background:rgba(17,24,39,.72);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow);backdrop-filter:blur(18px)}
.tasks-panel{padding:22px}
.calendar-panel{position:sticky;top:20px}
.calendar-card{padding:20px}
.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:18px}
.section-heading h2,.calendar-month-wrap h2,.day-agenda__header h3{margin:4px 0 0;letter-spacing:-.025em}
.section-heading h2{font-size:24px}
.filter-tabs{display:flex;gap:5px;padding:4px;background:var(--surface-2);border-radius:14px}
.filter-tab{padding:8px 12px;border-radius:10px;font-size:13px;font-weight:700;color:var(--muted)}
.filter-tab.is-active{background:var(--primary-strong);color:white}

.tasks-list{display:flex;flex-direction:column;gap:11px}
.task-card{position:relative;display:grid;grid-template-columns:4px minmax(0,1fr) auto;gap:15px;align-items:center;overflow:hidden;padding:16px;border:1px solid var(--border);border-radius:20px;background:linear-gradient(145deg,rgba(30,41,59,.82),rgba(22,31,48,.82));transition:.18s ease}
.task-card:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.13)}
.task-accent{align-self:stretch;border-radius:99px}
.priority-alta{background-color:var(--danger)!important}
.priority-media{background-color:var(--warning)!important}
.priority-baja{background-color:var(--success)!important}
.task-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.task-heading h3{margin:0;font-size:16px;line-height:1.45;font-weight:650;overflow-wrap:anywhere}
.priority-chip{flex:none;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;padding:5px 8px;border-radius:999px;background:transparent!important}
.priority-chip.priority-alta{color:#fca5a5;border:1px solid rgba(239,68,68,.25)}
.priority-chip.priority-media{color:#fcd34d;border:1px solid rgba(245,158,11,.24)}
.priority-chip.priority-baja{color:#6ee7b7;border:1px solid rgba(16,185,129,.25)}
.task-meta{display:flex;flex-wrap:wrap;gap:8px 13px;margin-top:10px;color:var(--muted);font-size:12px}
.task-meta>span{display:inline-flex;align-items:center;gap:5px}.task-meta .material-symbols-rounded{font-size:16px}
.task-actions{display:flex;align-items:center;gap:7px}
.icon-button{width:38px;height:38px;border:1px solid var(--border);border-radius:12px;display:grid;place-items:center;background:var(--surface-2);color:#cbd5e1;transition:.15s}
.icon-button:hover{background:var(--surface-3);color:white}.icon-button.success:hover{color:#6ee7b7}.icon-button.danger:hover{color:#fca5a5}
.task-card.is-completed{background:rgba(71,85,105,.18);border-color:rgba(148,163,184,.09)}
.task-card.is-completed .task-accent{background:#64748b!important}.task-card.is-completed h3,.task-card.is-completed .task-meta{color:#718096}.task-card.is-completed .priority-chip{opacity:.5;filter:grayscale(1)}
.completed-badge{display:inline-flex;align-items:center;gap:5px;color:#94a3b8;font-size:12px;font-weight:700}.completed-badge .material-symbols-rounded{font-size:17px}
.empty-state{text-align:center;padding:48px 20px;color:var(--muted)}.empty-state .material-symbols-rounded{font-size:46px;color:#64748b}.empty-state h3{color:var(--text);margin:10px 0 5px}

.calendar-toolbar{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;margin-bottom:18px}.calendar-month-wrap{text-align:center}.calendar-month-wrap h2{font-size:20px}
.calendar-weekdays,.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.calendar-weekdays{margin-bottom:7px}.calendar-weekdays span{text-align:center;color:#64748b;font-size:11px;font-weight:800}
.calendar-day{position:relative;aspect-ratio:1;border:1px solid transparent;border-radius:12px;background:rgba(30,41,59,.72);color:#cbd5e1;display:grid;place-items:center;padding:4px;min-width:0}.calendar-day:hover{background:var(--surface-3)}.calendar-day.is-empty{visibility:hidden}.calendar-day.is-today{border-color:rgba(59,130,246,.7);color:#bfdbfe}.calendar-day.is-selected{background:var(--primary-strong);color:white;border-color:#60a5fa}.calendar-number{font-size:12px;font-weight:700}.calendar-dots{position:absolute;left:50%;bottom:5px;transform:translateX(-50%);display:flex;gap:3px}
.legend-dot{display:inline-block;width:7px;height:7px;border-radius:50%;flex:none}.legend-dot.completed{background:#64748b}.calendar-legend{display:flex;flex-wrap:wrap;gap:9px 12px;margin:14px 2px 0;color:#64748b;font-size:11px}.calendar-legend span{display:flex;align-items:center;gap:5px}
.day-agenda{margin-top:18px;padding-top:17px;border-top:1px solid var(--border)}.day-agenda__header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:11px}.day-agenda__header h3{font-size:15px}.text-button{display:inline-flex;align-items:center;gap:4px;background:transparent;border:0;color:#93c5fd;font-weight:700;font-size:12px}.text-button .material-symbols-rounded{font-size:18px}
.day-events{display:flex;flex-direction:column;gap:7px}.day-event{width:100%;display:flex;align-items:flex-start;gap:9px;text-align:left;border:1px solid var(--border);border-radius:13px;padding:10px;background:rgba(30,41,59,.55);color:var(--text)}.day-event:hover{background:rgba(38,52,73,.8)}.day-event.is-completed{opacity:.55;filter:grayscale(.6)}.day-event__copy{display:flex;flex-direction:column;gap:3px;min-width:0}.day-event__copy strong{font-size:12px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.day-event__copy small{font-size:11px;color:var(--muted);text-transform:capitalize}

.fab{position:fixed;right:max(20px,env(safe-area-inset-right));bottom:calc(20px + env(safe-area-inset-bottom));z-index:50;width:60px;height:60px;border:0;border-radius:20px;display:grid;place-items:center;background:linear-gradient(145deg,#3b82f6,#2563eb);color:white;box-shadow:0 14px 35px rgba(37,99,235,.38)}.fab .material-symbols-rounded{font-size:30px}
.modal{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(2,6,23,.72);backdrop-filter:blur(8px)}
.modal-card{width:min(560px,100%);max-height:calc(100vh - 40px);overflow:auto;background:var(--bg-2);border:1px solid var(--border);border-radius:26px;padding:22px;box-shadow:0 28px 70px rgba(0,0,0,.45)}.modal-card--small{width:min(390px,100%);text-align:center}.modal-header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:20px}.modal-header h2{margin:4px 0 0;font-size:23px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.field{display:flex;flex-direction:column;gap:7px}.field-full{grid-column:1/-1}.field>span{font-size:12px;font-weight:700;color:var(--muted)}input,select,textarea{width:100%;border:1px solid var(--border);border-radius:14px;background:var(--surface-2);color:var(--text);padding:12px 13px;outline:none;resize:vertical}input:focus,select:focus,textarea:focus{border-color:rgba(96,165,250,.7);box-shadow:0 0 0 3px rgba(59,130,246,.1)}
.primary-button,.secondary-button,.danger-button{border:0;border-radius:14px;padding:13px 16px;font-weight:800}.primary-button{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:18px;background:var(--primary-strong);color:white}.secondary-button{background:var(--surface-2);color:var(--text)}.danger-button{background:var(--danger);color:white}.modal-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}.confirm-icon{width:54px;height:54px;margin:0 auto 12px;border-radius:18px;display:grid;place-items:center;background:rgba(239,68,68,.12);color:#fca5a5}.modal-card--small h2{margin:0 0 8px}
.toast{position:fixed;left:50%;bottom:calc(28px + env(safe-area-inset-bottom));z-index:200;transform:translate(-50%,18px);opacity:0;pointer-events:none;max-width:min(440px,calc(100% - 34px));padding:11px 16px;border-radius:13px;background:#111827;border:1px solid var(--border);box-shadow:var(--shadow);color:var(--text);font-size:13px;font-weight:700;transition:.2s}.toast.is-visible{opacity:1;transform:translate(-50%,0)}.toast.error{border-color:rgba(239,68,68,.35);color:#fecaca}
.update-banner{position:fixed;left:50%;top:14px;z-index:220;transform:translateX(-50%);display:flex;align-items:center;gap:12px;background:#1e293b;border:1px solid var(--border);border-radius:14px;padding:9px 10px 9px 14px;box-shadow:var(--shadow);font-size:12px}.update-banner[hidden]{display:none}.update-banner button{border:0;background:var(--primary-strong);color:white;border-radius:9px;padding:7px 9px;font-weight:700}

.action-shell{max-width:560px;margin:0 auto;padding:28px 20px 60px}.action-card{background:rgba(17,24,39,.85);border:1px solid var(--border);border-radius:var(--radius-lg);padding:22px;box-shadow:var(--shadow)}.action-message{margin:18px 0;padding:18px;border-radius:17px;background:var(--surface-2);font-size:18px;font-weight:650;line-height:1.5;border-left:4px solid var(--primary)}.action-info{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:18px}.info-box{padding:13px;border:1px solid var(--border);border-radius:14px;background:rgba(30,41,59,.55)}.info-box span{display:block;color:var(--muted);font-size:11px;margin-bottom:5px}.info-box strong{font-size:14px}.action-buttons{display:grid;grid-template-columns:1fr 1fr;gap:10px}.action-buttons button{border:0;border-radius:14px;padding:13px;font-weight:800}.action-buttons .complete{background:var(--success);color:white}.action-buttons .snooze{background:var(--primary-strong);color:white}.action-complete-screen{text-align:center;padding:36px 18px}.action-complete-screen .material-symbols-rounded{font-size:52px;color:#6ee7b7}

@media(max-width:1050px){.workspace{grid-template-columns:1fr}.calendar-panel{position:static}.calendar-card{max-width:none}}
@media(max-width:720px){.app-shell{padding:18px 14px 28px}.app-header{grid-template-columns:auto 1fr}.notification-setup{grid-column:1/-1;justify-content:center}.summary-grid{grid-template-columns:1fr 1fr}.summary-card:last-child{grid-column:1/-1}.section-heading{align-items:flex-start;flex-direction:column}.filter-tabs{width:100%}.filter-tab{flex:1;text-align:center}.tasks-panel{padding:14px}.task-card{grid-template-columns:4px minmax(0,1fr);}.task-actions{grid-column:2;justify-content:flex-end}.task-heading{flex-direction:column}.form-grid{grid-template-columns:1fr}.field-full{grid-column:auto}.modal{align-items:flex-end;padding:0}.modal-card{border-radius:24px 24px 0 0;max-height:88vh;padding-bottom:calc(20px + env(safe-area-inset-bottom))}.action-info{grid-template-columns:1fr}.action-buttons{grid-template-columns:1fr}}
@media(max-width:430px){.summary-grid{grid-template-columns:1fr}.summary-card:last-child{grid-column:auto}.header-copy h1{font-size:28px}.calendar-card{padding:14px}.calendar-weekdays,.calendar-grid{gap:4px}.calendar-day{border-radius:10px}.task-meta{gap:7px 10px}}


/* Ajustes v2.1: horario efectivo, edición y confirmación móvil */
.task-meta .next-notice{color:#bfdbfe;font-weight:650}
.task-meta .original-schedule{color:#64748b}
.edit-notice-info{padding:13px 14px;border:1px solid rgba(59,130,246,.22);border-radius:14px;background:rgba(59,130,246,.08)}
.edit-notice-info>span{display:block;color:var(--muted);font-size:12px;margin-bottom:5px}
.edit-notice-info>strong{display:block;font-size:16px;color:#dbeafe}
.edit-notice-info>small{display:block;margin-top:5px;color:#718096;line-height:1.35}
.action-result-detail{margin:14px auto 0;padding:11px 13px;max-width:360px;border-radius:13px;background:rgba(59,130,246,.09);color:#bfdbfe;font-weight:650}
.action-home-button{display:inline-flex!important;width:auto!important;margin-top:18px!important;padding:9px 13px!important;border-radius:11px!important;text-decoration:none;align-items:center;justify-content:center;gap:6px;font-size:13px!important;font-weight:750!important;box-shadow:none}.action-home-button .material-symbols-rounded{font-size:18px!important}
.action-redirect-note{margin-top:12px!important;font-size:12px}
