:root{
      --primary:#4F46E5;
      --primary-dark:#4338CA;
      --primary-light:#818CF8;
      --secondary:#0EA5E9;
      --gray-50:#F9FAFB;
      --gray-100:#F3F4F6;
      --gray-200:#E5E7EB;
      --gray-300:#D1D5DB;
      --gray-400:#9CA3AF;
      --gray-500:#6B7280;
      --gray-600:#4B5563;
      --gray-700:#374151;
      --gray-800:#1F2937;
      --gray-900:#111827;
      --white:#fff;
      --success:#10B981;
      --warning:#F59E0B;
      --danger:#EF4444;
      --shadow-sm:0 1px 2px 0 rgb(0 0 0 / .05);
      --shadow:0 1px 3px 0 rgb(0 0 0 / .1),0 1px 2px -1px rgb(0 0 0 / .1);
      --shadow-md:0 4px 6px -1px rgb(0 0 0 / .1),0 2px 4px -2px rgb(0 0 0 / .1);
      --shadow-lg:0 10px 15px -3px rgb(0 0 0 / .1),0 4px 6px -4px rgb(0 0 0 / .1);
      --shadow-xl:0 20px 25px -5px rgb(0 0 0 / .1),0 8px 10px -6px rgb(0 0 0 / .1);
      --radius-sm:6px;
      --radius:8px;
      --radius-md:12px;
      --radius-lg:16px;
      --radius-xl:24px;
    }
    *{box-sizing:border-box}
    body{
      margin:0;
      font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
      background:linear-gradient(135deg,var(--gray-50),var(--gray-100));
      color:var(--gray-800);
      line-height:1.6;
      min-height:100vh;
      -webkit-font-smoothing:antialiased;
    }
    input,textarea,select,button{font-family:inherit}
    .container{max-width:1320px;margin:0 auto;padding:0 24px}

    .topbar{position:sticky;top:0;z-index:40;padding:12px 0;background:linear-gradient(135deg,var(--gray-50),var(--gray-100))}
    .topbar-inner{
      display:flex;align-items:center;gap:10px;padding:14px 18px;flex-wrap:wrap;
      background:rgba(255,255,255,.95);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
      border:1px solid var(--gray-200);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);
    }
    .logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--gray-900);font-weight:800;font-size:1.2rem;margin-right:auto;letter-spacing:-.01em}
    .logo-icon{width:38px;height:38px;border-radius:var(--radius-md);background:linear-gradient(135deg,var(--primary),var(--secondary));display:flex;align-items:center;justify-content:center;color:#fff}
    .logo-icon svg{width:22px;height:22px}
    .btn{
      height:46px;padding:0 14px;border-radius:var(--radius);border:1px solid var(--gray-300);
      background:var(--white);color:var(--gray-700);font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:8px;
      text-decoration:none;font-size:.875rem;transition:all .2s ease;
    }
    .btn:hover{border-color:var(--gray-400);background:var(--gray-50);color:var(--gray-900)}
    .btn.primary{border:none;background:linear-gradient(135deg,var(--primary),var(--secondary));color:var(--white);box-shadow:0 6px 20px rgba(79,70,229,.28)}
    .btn.ghost{border-color:rgba(79,70,229,.36);background:rgba(79,70,229,.08);color:var(--primary-dark)}
    .btn.danger{border-color:rgba(239,68,68,.35);background:rgba(239,68,68,.07);color:#991B1B}
    .user-email{font-size:.82rem;color:var(--gray-500);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:240px}

    .page{padding:14px 0 34px}
    .headline{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;flex-wrap:wrap;margin-bottom:16px}
    .headline-actions{display:flex;gap:10px;flex-wrap:wrap}
    .headline h1{margin:0 0 6px;font-size:2rem;letter-spacing:-.02em;line-height:1.12}
    .headline p{margin:0;color:var(--gray-500);font-size:1rem}

    .layout{display:grid;grid-template-columns:340px 1fr;gap:16px}
    .panel{background:var(--white);border:1px solid var(--gray-200);border-radius:var(--radius-lg);box-shadow:var(--shadow)}
    .panel-head{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:16px 20px;border-bottom:1px solid var(--gray-200)}
    .panel-title{font-size:1.02rem;font-weight:800;letter-spacing:-.01em;color:var(--gray-900)}
    .panel-body{padding:16px 20px}

    .field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}
    .field label{font-size:.76rem;font-weight:700;color:var(--gray-700);text-transform:uppercase;letter-spacing:.06em}
    .input{height:46px;border:1px solid var(--gray-300);border-radius:var(--radius-md);padding:0 14px;font-size:1rem;line-height:1.25;background:var(--white);color:var(--gray-900);font-family:inherit;-webkit-appearance:none;appearance:none}
    .textarea{min-height:96px;border:1px solid var(--gray-300);border-radius:var(--radius-md);padding:12px 14px;font-size:1rem;line-height:1.55;resize:vertical;background:var(--white);color:var(--gray-900);font-family:inherit}
    .input::placeholder,.textarea::placeholder{font-family:inherit;color:var(--gray-400)}
    .input:focus,.textarea:focus{outline:none;border-color:rgba(79,70,229,.6);box-shadow:0 0 0 3px rgba(79,70,229,.12)}
    .muted{font-size:.84rem;color:var(--gray-500);line-height:1.5}

    .input-icon-wrap{position:relative}
    .input-icon-wrap .input{padding-right:42px}
    .input-icon{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:20px;height:20px;color:var(--gray-500);pointer-events:none}

    .app-select{position:relative}
    .app-select-button{
      width:100%;height:46px;display:flex;align-items:center;justify-content:space-between;gap:8px;
      border:1px solid var(--gray-300);border-radius:var(--radius-md);padding:0 12px;font-size:1rem;
      color:var(--gray-900);background:var(--white);cursor:pointer;transition:all .2s ease;
    }
    .app-select-button:hover{border-color:var(--gray-400)}
    .app-select-button.open{border-color:rgba(79,70,229,.6);box-shadow:0 0 0 3px rgba(79,70,229,.12)}
    .app-select-button svg{width:16px;height:16px;color:var(--gray-500);transition:transform .2s ease}
    .app-select-button.open svg{transform:rotate(180deg)}
    .app-select-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
    .app-select-menu{
      display:none;position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:120;
      background:var(--white);border:1px solid rgba(79,70,229,.18);border-radius:var(--radius-md);box-shadow:0 18px 34px rgba(15,23,42,.16);
      max-height:260px;overflow:auto;padding:6px;
    }
    .app-select-menu.visible{display:block;animation:dropdownOpen .2s ease-out}
    .app-select-item{
      width:100%;border:none;background:var(--white);text-align:left;padding:9px 10px;border-radius:var(--radius-sm);
      font-size:.92rem;color:var(--gray-700);cursor:pointer;transition:all .15s ease;
    }
    .app-select-item:hover{background:var(--gray-50)}
    .app-select-item.active{background:linear-gradient(135deg,rgba(79,70,229,.16),rgba(14,165,233,.14));color:var(--primary-dark);font-weight:700}

    .disabled-row{opacity:.6}
    .field.disabled-row{pointer-events:none}

    .week-controls{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-bottom:12px}
    .week-title-wrap{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
    .week-title{font-size:1.08rem;font-weight:800;color:var(--gray-900);letter-spacing:-.01em}
    .week-subtitle{font-size:.82rem;color:var(--gray-400);font-weight:600}

    .week-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}
    .day-col{
      border:1px solid var(--gray-200);border-radius:var(--radius-md);min-height:430px;
      background:linear-gradient(180deg,#fff,#fbfdff);display:flex;flex-direction:column;overflow:hidden;
      box-shadow:var(--shadow-sm);
    }
    .day-head{padding:12px;border-bottom:1px solid var(--gray-200);background:var(--gray-50)}
    .day-name{font-size:.75rem;color:var(--gray-500);font-weight:800;text-transform:uppercase;letter-spacing:.06em}
    .day-date{font-size:1rem;font-weight:800;color:var(--gray-900);margin-top:1px}
    .day-col.today .day-head{background:linear-gradient(135deg,rgba(79,70,229,.11),rgba(14,165,233,.11));border-bottom-color:rgba(79,70,229,.2)}
    .day-events{padding:10px;display:flex;flex-direction:column;gap:8px;min-height:0;overflow:auto}
    .event-card{border:1px solid rgba(79,70,229,.2);background:linear-gradient(135deg,rgba(79,70,229,.08),rgba(14,165,233,.06));border-radius:var(--radius);padding:9px 10px}
    .event-title{font-size:.84rem;font-weight:700;color:var(--gray-900);line-height:1.3}
    .event-meta{font-size:.75rem;color:var(--gray-600);margin-top:4px;display:flex;gap:8px;flex-wrap:wrap}
    .event-actions{margin-top:7px;display:flex;gap:6px;flex-wrap:wrap}
    .mini-btn{
      border:1px solid var(--gray-300);background:#fff;border-radius:var(--radius-sm);padding:4px 8px;
      font-size:.72rem;font-weight:700;color:var(--gray-700);cursor:pointer;transition:all .2s ease;
    }
    .mini-btn:hover{border-color:var(--gray-400);background:var(--gray-50)}
    .mini-btn.primary{border-color:rgba(79,70,229,.35);background:rgba(79,70,229,.08);color:var(--primary-dark)}
    .mini-btn.danger{border-color:rgba(239,68,68,.35);background:rgba(239,68,68,.08);color:#991B1B}
    .empty-day{font-size:.76rem;color:var(--gray-400);padding:4px 2px}

    .overlay{display:none;position:fixed;inset:0;z-index:120;background:rgba(17,24,39,.45);align-items:center;justify-content:center;padding:20px}
    .overlay.visible{display:flex;animation:fadeIn .2s ease-out}
    .modal{
      width:min(860px,100%);max-height:92vh;overflow:auto;background:var(--white);border:1px solid var(--gray-200);
      border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);padding:22px;animation:modalIn .2s ease-out;
    }
    .modal-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:12px}
    .modal-title{font-size:1.08rem;font-weight:800;color:var(--gray-900);letter-spacing:-.01em}
    .modal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
    .modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:14px;flex-wrap:wrap}

    .toast{
      position:fixed;left:50%;bottom:18px;transform:translateX(-50%) translateY(12px);padding:12px 16px;border-radius:var(--radius-md);
      background:linear-gradient(135deg,rgba(79,70,229,.96),rgba(14,165,233,.96));color:var(--white);
      font-size:.88rem;font-weight:600;opacity:0;pointer-events:none;transition:opacity .25s ease,transform .25s ease;
      z-index:160;box-shadow:var(--shadow-lg);
    }
    .toast.visible{opacity:1;transform:translateX(-50%) translateY(0)}
    .toast.error{background:linear-gradient(135deg,#DC2626,#EF4444)}

    .flatpickr-calendar{
      border:1px solid rgba(79,70,229,.2)!important;
      border-radius:16px!important;
      box-shadow:0 22px 40px rgba(15,23,42,.2)!important;
      font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif!important;
      overflow:hidden!important;
    }
    .flatpickr-months{background:linear-gradient(135deg,rgba(79,70,229,.1),rgba(14,165,233,.09));padding:6px 6px 2px}
    .flatpickr-current-month{font-size:1rem!important;font-weight:700!important;padding-top:6px!important}
    .flatpickr-monthDropdown-months,.numInput{font-family:inherit!important}
    .flatpickr-weekdays{background:var(--gray-50)}
    .flatpickr-weekday{font-weight:700!important;color:var(--gray-500)!important}
    .flatpickr-day{border-radius:10px!important;font-weight:500!important}
    .flatpickr-day.selected,.flatpickr-day.startRange,.flatpickr-day.endRange,.flatpickr-day.selected:hover,.flatpickr-day.startRange:hover,.flatpickr-day.endRange:hover{
      background:linear-gradient(135deg,var(--primary),var(--secondary))!important;
      border-color:transparent!important;
    }
    .flatpickr-day.today{border-color:var(--primary-light)!important;background:rgba(79,70,229,.06)!important}
    .flatpickr-day:hover{background:rgba(79,70,229,.11)!important}
    .flatpickr-time{border-top:1px solid var(--gray-200)!important}
    .flatpickr-time input{
      font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif!important;
      font-size:1.08rem!important;
      font-weight:600!important;
      color:var(--gray-900)!important;
    }
    .flatpickr-input,.flatpickr-input[readonly]{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif!important;letter-spacing:0}

    @keyframes modalIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
    @keyframes fadeIn{from{opacity:0}to{opacity:1}}
    @keyframes dropdownOpen{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}

    @media(max-width:1160px){
      .layout{grid-template-columns:1fr}
      .week-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    }
    @media(max-width:760px){
      .modal-grid{grid-template-columns:1fr}
      .modal{padding:18px}
    }
    @media(max-width:640px){
      .container{padding:0 12px}
      .topbar-inner{flex-wrap:wrap}
      .user-email{max-width:none;width:100%}
      .headline-actions{width:100%}
      .week-title-wrap{align-items:flex-start}
      .week-grid{grid-template-columns:1fr}
    }