:root{--bg:#f5f7fb;--card:#fff;--ink:#182239;--muted:#7d879a;--line:#e9edf4;--blue:#4568df;--blue2:#6d86ee;--navy:#263c89;--shadow:0 12px 32px rgba(39,55,95,.08);--safe-bottom:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box}html{background:var(--bg);-webkit-text-size-adjust:100%}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,Arial,sans-serif;color:var(--ink);background:var(--bg);min-height:100vh}button,input,textarea{font:inherit}button{cursor:pointer}.hidden{display:none!important}.app-shell{max-width:760px;min-height:100vh;margin:0 auto;padding:0 18px calc(96px + var(--safe-bottom))}.topbar{height:72px;display:flex;align-items:center;justify-content:space-between}.brand-lockup{display:flex;align-items:center;gap:11px}.brand-mark,.login-logo{display:grid;place-items:center;background:linear-gradient(145deg,#4668df,#8499f8);color:#fff;font-weight:800;box-shadow:0 8px 16px #526ee43b}.brand-mark{width:39px;height:39px;border-radius:14px;font-size:19px}.brand-name{font-size:15px;font-weight:800;letter-spacing:-.3px}.brand-subtitle{font-size:11px;color:var(--muted);margin-top:2px}.avatar-button{width:38px;height:38px;border:0;border-radius:50%;background:#e8edff;color:#4568df;font-weight:800}.welcome-row{display:flex;justify-content:space-between;align-items:center;padding:20px 2px 18px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:1.45px;color:#8a94a8}.welcome-row h1,.page-title-row h1{font-size:29px;letter-spacing:-1px;margin:7px 0 4px}.muted{color:var(--muted);font-size:13px;line-height:1.5;margin:0}.weatherless-icon{width:49px;height:49px;border-radius:18px;background:#e9edff;color:#506fe0;display:grid;place-items:center;font-size:26px}.hero-card{position:relative;overflow:hidden;padding:21px;border-radius:25px;color:#fff;background:linear-gradient(130deg,#364fa9,#627ce7 72%,#91a2f4);box-shadow:0 15px 32px #4c66d531}.hero-card:after{content:"";position:absolute;width:190px;height:190px;border-radius:50%;border:1px solid #ffffff20;right:-75px;top:-70px;box-shadow:0 0 0 22px #ffffff0b,0 0 0 48px #ffffff09}.hero-card-head{display:flex;justify-content:space-between;align-items:center}.hero-kicker{font-size:10px;font-weight:800;letter-spacing:1.4px;color:#e1e7ff}.week-pill{background:#ffffff25;border:1px solid #ffffff35;border-radius:20px;padding:6px 10px;font-size:10px}.hero-date{margin:17px 0 12px;font-size:19px;font-weight:800;letter-spacing:-.3px}.hero-schedule{position:relative;z-index:1;white-space:pre-wrap;font-size:13px;line-height:1.55;color:#f2f4ff;max-height:112px;overflow:hidden}.text-button{border:0;background:transparent;color:var(--blue);font-size:12px;font-weight:800;padding:8px 0}.text-button.light{color:#fff;position:relative;z-index:1;margin-top:12px}.text-button span{font-size:16px;margin-left:4px}.section-heading{display:flex;align-items:end;justify-content:space-between;margin:27px 2px 13px}.section-heading h2{font-size:18px;letter-spacing:-.4px;margin:6px 0 0}.quick-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.quick-card{border:0;border-radius:19px;padding:15px;text-align:left;min-height:119px;display:flex;flex-direction:column;align-items:flex-start;box-shadow:0 6px 18px #34466b0a}.quick-card strong{font-size:14px;margin-top:11px}.quick-card small{font-size:11px;color:#7e879a;margin-top:4px}.quick-icon{width:31px;height:31px;border-radius:11px;display:grid;place-items:center;background:#ffffffb0;font-size:18px;font-weight:700}.quick-blue{background:#eaf0ff;color:#3557c2}.quick-violet{background:#f0ebff;color:#7857c9}.quick-mint{background:#e7f7f1;color:#319477}.quick-peach{background:#fff0e7;color:#c17b4b}.section-block{margin-bottom:20px}.stack-list{display:grid;gap:9px}.event-mini,.list-card,.data-card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:15px;box-shadow:0 5px 16px #34466b06}.event-mini{display:flex;gap:12px;align-items:center}.event-date-box{width:45px;height:49px;border-radius:13px;background:#edf1ff;color:#4767d7;display:grid;place-items:center;flex:none;font-size:11px;font-weight:800}.event-mini strong{font-size:13px}.event-mini small{display:block;color:var(--muted);font-size:11px;margin-top:4px}.bottom-nav{position:fixed;z-index:20;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,760px);padding:9px 10px calc(9px + var(--safe-bottom));background:#ffffffed;backdrop-filter:blur(18px);border-top:1px solid #e9edf4;display:flex;justify-content:space-around}.nav-item{border:0;background:transparent;color:#9aa3b5;display:flex;flex-direction:column;align-items:center;gap:3px;min-width:54px;font-size:9px;font-weight:700}.nav-icon{font-size:20px;line-height:1.2}.nav-item.active{color:#4c68d7}.page-title-row{display:flex;justify-content:space-between;align-items:center;padding:22px 2px 18px}.round-button{border:0;background:#fff;border:1px solid var(--line);width:40px;height:40px;border-radius:14px;color:#5c6fd0;font-size:23px}.date-strip{display:flex;gap:7px;overflow-x:auto;padding:1px 0 13px;scrollbar-width:none}.date-strip::-webkit-scrollbar{display:none}.date-chip{flex:none;border:1px solid var(--line);background:#fff;border-radius:14px;padding:9px 11px;color:#7e8798;min-width:48px}.date-chip span{display:block;font-size:10px}.date-chip strong{display:block;font-size:14px;margin-top:4px}.date-chip.active{background:#4968dd;border-color:#4968dd;color:#fff;box-shadow:0 7px 15px #4968dd33}.day-card{background:#fff;border:1px solid var(--line);border-radius:19px;padding:15px;margin-bottom:10px}.day-card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.day-card-head strong{font-size:14px}.day-card-head small{color:#8892a5;font-size:10px}.day-text{font-size:13px;white-space:pre-wrap;line-height:1.65;color:#44516a}.empty-note{background:#fff;border:1px dashed #dce2ee;border-radius:17px;padding:24px;text-align:center;color:#939caf;font-size:13px;line-height:1.55}.edit-toggle{margin-left:auto;border:0;background:#edf1ff;color:#4968d8;border-radius:11px;padding:8px 11px;font-size:11px;font-weight:800}.edit-panel{display:grid;gap:9px;margin-top:12px}.edit-panel textarea,.profile-input{width:100%;border:1px solid #dfe5f0;border-radius:13px;padding:12px;background:#fbfcff;color:var(--ink);outline:none;resize:vertical;min-height:100px}.primary-button,.secondary-button,.response-button{border:0;border-radius:13px;padding:12px 15px;background:var(--blue);color:#fff;font-weight:800;font-size:12px;text-decoration:none;display:inline-flex;justify-content:center;align-items:center}.secondary-button{background:#edf1ff;color:#4968d8}.response-row{display:flex;gap:8px;margin-top:13px}.response-button{flex:1;background:#eef1f7;color:#647087}.response-button.selected{background:#e7f6ef;color:#26946d}.journal-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}.stat-card{background:#fff;border:1px solid var(--line);border-radius:17px;padding:15px}.stat-card span{display:block;font-size:10px;color:#8b95a8}.stat-card strong{display:block;font-size:23px;margin-top:7px;letter-spacing:-.7px}.list-card{margin-bottom:9px}.list-card-head{display:flex;justify-content:space-between;gap:10px}.list-card strong{font-size:13px}.list-card p{margin:7px 0 0;color:#818ba0;font-size:11px;line-height:1.5}.grade-value{color:#4e68d3;font-weight:900;font-size:17px}.profile-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px}.profile-head{display:flex;align-items:center;gap:13px;margin-bottom:16px}.profile-avatar{width:48px;height:48px;display:grid;place-items:center;border-radius:16px;background:#e9edff;color:#4c69db;font-size:19px;font-weight:900}.profile-head strong{display:block;font-size:15px}.profile-head small{display:block;color:var(--muted);margin-top:4px;font-size:11px}.profile-row{display:flex;justify-content:space-between;padding:12px 0;border-top:1px solid var(--line);font-size:12px;gap:16px}.profile-row span{color:var(--muted)}.profile-row strong{text-align:right}.danger-button{border:1px solid #f0d6d6;background:#fff;color:#b75a5a;border-radius:12px;padding:11px 14px;font-weight:700;font-size:12px;margin-top:15px}.login-view{min-height:calc(100vh - 90px);display:grid;place-items:center;position:relative;overflow:hidden}.login-card{position:relative;z-index:2;background:#fff;border:1px solid var(--line);border-radius:28px;padding:28px 23px;width:100%;box-shadow:var(--shadow)}.login-logo{width:58px;height:58px;border-radius:20px;font-size:25px;margin-bottom:24px}.login-card h1{font-size:33px;line-height:1.06;letter-spacing:-1.2px;margin:10px 0 13px}.login-card h1 span{color:#617ce3}.login-card>.muted{max-width:300px}.login-action{margin-top:24px;min-height:45px}.login-footnote{font-size:10px;line-height:1.5;color:#9aa3b1;margin-top:17px}.hero-orb{position:absolute;border-radius:50%;filter:blur(1px);opacity:.6}.orb-a{width:210px;height:210px;background:#e1e8ff;top:3%;right:-100px}.orb-b{width:170px;height:170px;background:#e3f5ed;bottom:2%;left:-100px}.error-text{font-size:12px;color:#b44b55;margin-top:10px;line-height:1.5}.empty-state{padding:48px 17px;text-align:center}.empty-icon{width:66px;height:66px;border-radius:22px;margin:0 auto 18px;background:#e9edff;color:#4a68db;display:grid;place-items:center;font-size:29px}.empty-state h2{font-size:22px;letter-spacing:-.7px}.empty-state p{font-size:13px;line-height:1.6;color:var(--muted);max-width:330px;margin:0 auto 21px}.toast{position:fixed;z-index:30;bottom:calc(90px + var(--safe-bottom));left:50%;transform:translate(-50%,15px);opacity:0;pointer-events:none;background:#1f2d4a;color:white;padding:11px 16px;border-radius:13px;font-size:12px;box-shadow:var(--shadow);transition:.25s;max-width:calc(100vw - 30px);text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}.skeleton{height:72px;background:linear-gradient(90deg,#edf0f6,#f8f9fc,#edf0f6);border-radius:16px}.loading{padding:23px;text-align:center;color:#8d97a9;font-size:12px}
@media(min-width:600px){.app-shell{padding-left:28px;padding-right:28px}.quick-grid{grid-template-columns:repeat(4,1fr)}.hero-card{padding:27px}.login-card{max-width:420px;padding:34px}}

.login-divider{display:flex;align-items:center;gap:12px;margin:15px 0;color:#9aa3b1;font-size:11px;font-weight:700}
.login-divider:before,.login-divider:after{content:"";height:1px;background:var(--line);flex:1}
.vk-login-button{width:100%;min-height:45px;border:0;border-radius:13px;background:#0077ff;color:#fff;font-weight:800;font-size:12px;text-decoration:none;display:flex;justify-content:center;align-items:center;margin-top:10px;box-shadow:0 7px 15px #0077ff20}
.vk-login-button:active{transform:translateY(1px)}

/* PREMIUM TELEGRAM LOGIN */
.login-action {
    width: 100%;
    margin-top: 27px;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 62px;
    padding: 3px;
    border-radius: 20px;
    background: linear-gradient(120deg,#229ED9,#4778F5,#665FEA);
    box-shadow: 0 10px 25px rgba(35,145,220,.23);
    transition: transform .2s, box-shadow .2s;
}

.login-action:active {
    transform: scale(.975);
    box-shadow: 0 4px 12px rgba(35,145,220,.2);
}

#telegram-login {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 17px;
    min-height: 56px;
}

#telegram-login iframe {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 56px !important;
    border: 0 !important;
    border-radius: 17px !important;
    overflow: hidden !important;
}

.login-divider {
    margin: 22px 0;
    color: #a0a9bc;
    letter-spacing: 1px;
}

.vk-login-button {
    min-height: 58px;
    margin-top: 0;
    border-radius: 18px;
    background: linear-gradient(110deg,#2787ff,#3864ed);
    box-shadow: 0 10px 25px rgba(48,112,245,.20);
    font-size: 15px;
    transition: transform .2s, box-shadow .2s;
}

.vk-login-button:active {
    transform: scale(.975);
    box-shadow: 0 4px 12px rgba(48,112,245,.2);
}

.login-footnote {
    font-size: 11px;
    line-height: 1.7;
    margin-top: 23px;
}

/* FIX TELEGRAM WIDGET */
.login-action {
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
    padding: 0 !important;
    min-height: 56px;
    justify-content: center;
}

#telegram-login {
    background: transparent !important;
    overflow: hidden;
    width: 100%;
    min-height: 56px;
    justify-content: center;
}

#telegram-login iframe {
    width: 228px !important;
    max-width: 100% !important;
    height: 48px !important;
    border: 0 !important;
    background: transparent !important;
    border-radius: 12px !important;
}


/* CUSTOM PREMIUM TELEGRAM BUTTON */
.login-action {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 64px;
    margin-top: 25px;
    background: transparent !important;
    box-shadow: none !important;
}

.tg-custom-wrap {
    position: relative;
    width: 100%;
    max-width: 100%;
    height: 62px;
    display: flex;
    justify-content: center;
}

.tg-custom-button {
    position: absolute;
    inset: 0;
    width: 100%;
    border: 0;
    border-radius: 19px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    padding: 0 19px;
    color: #fff;
    background: linear-gradient(115deg,#27a5e7 0%,#3988f5 48%,#5368ed 100%);
    box-shadow: 0 10px 25px rgba(45,133,239,.25),
                inset 0 1px 0 rgba(255,255,255,.25);
    font-size: 15px;
    font-weight: 750;
    letter-spacing: -.25px;
    transition: transform .18s, filter .18s;
    pointer-events: none;
}

.tg-custom-icon {
    width: 35px;
    height: 35px;
    flex: none;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.19);
}

.tg-custom-icon svg {
    width: 22px;
    height: 22px;
}

.tg-custom-label {
    flex: 1;
    text-align: center;
}

.tg-custom-arrow {
    font-size: 21px;
    opacity: .8;
}

.tg-widget-overlay {
    position: absolute;
    inset: 0;
    z-index: 5;
    width: 100%;
    height: 62px;
    overflow: hidden;
}

.tg-widget-overlay iframe {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 62px !important;
    opacity: 0 !important;
    border: 0 !important;
    cursor: pointer !important;
}

.tg-custom-wrap:active .tg-custom-button {
    transform: scale(.975);
    filter: brightness(.94);
}

@media (max-width: 380px) {
    .tg-custom-button {
        padding: 0 13px;
        gap: 10px;
        font-size: 14px;
    }
}

/* ===== PREMIUM VK LOGIN BUTTON ===== */
.vk-login-button {
  width:100%;
  min-height:76px;
  padding:0 22px 0 20px;
  margin-top:10px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:25px;
  background:linear-gradient(110deg,#2789ed 0%,#4269ed 55%,#5260e8 100%);
  color:#fff;
  text-decoration:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  box-shadow:
    0 14px 30px rgba(55,105,225,.19),
    inset 0 1px 1px rgba(255,255,255,.25);
  transition:transform .2s ease,box-shadow .2s ease;
  -webkit-tap-highlight-color:transparent;
}

.vk-login-button:active {
  transform:scale(.975);
  box-shadow:0 6px 15px rgba(55,105,225,.18);
}

.vk-brand-icon {
  width:52px;
  height:52px;
  flex:none;
  display:grid;
  place-items:center;
  border-radius:17px;
  background:rgba(255,255,255,.19);
  border:1px solid rgba(255,255,255,.17);
}

.vk-button-text {
  flex:1;
  text-align:center;
  font-size:15px;
  font-weight:800;
  letter-spacing:-.3px;
}

.vk-button-arrow {
  font-size:31px;
  line-height:1;
  font-weight:400;
  color:rgba(255,255,255,.85);
  flex:none;
}

@media(max-width:380px) {
  .vk-login-button {
    padding:0 15px;
    gap:9px;
  }
  .vk-button-text {
    font-size:13px;
  }
}

/* ===================================
   PREMIUM BUTTON INTERACTIONS
=================================== */

button,
a.primary-button,
a.secondary-button,
a.vk-login-button,
.quick-card,
.date-chip,
.nav-item,
.round-button,
.response-button,
.danger-button,
.text-button,
.avatar-button {
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    transition:
        transform .18s cubic-bezier(.2,.8,.2,1),
        box-shadow .2s ease,
        filter .2s ease,
        background-color .2s ease,
        color .2s ease;
}

/* Эффект нажатия */
button:active,
a.primary-button:active,
a.secondary-button:active,
a.vk-login-button:active,
.quick-card:active,
.date-chip:active,
.nav-item:active,
.round-button:active,
.response-button:active,
.danger-button:active,
.text-button:active,
.avatar-button:active {
    transform: scale(.96);
    filter: brightness(.96);
}

/* Основные кнопки */
.primary-button:active,
.vk-login-button:active {
    box-shadow: 0 5px 13px rgba(60,100,220,.2);
}

/* Карточки */
.quick-card:active {
    transform: scale(.975);
    box-shadow: 0 3px 10px rgba(39,55,95,.08);
}

/* Нижняя навигация */
.nav-item:active {
    transform: scale(.88);
}

/* Кнопки дат */
.date-chip:active {
    transform: scale(.92);
}

/* Кнопки выбора ответа */
.response-button:active {
    transform: scale(.95);
}

/* Плавное появление фокуса */
button:focus-visible,
a:focus-visible {
    outline: 3px solid rgba(76,108,225,.35);
    outline-offset: 3px;
}

/* Анимация при наведении на компьютере */
@media (hover: hover) and (pointer: fine) {
    .primary-button:hover,
    .vk-login-button:hover {
        filter: brightness(1.06);
        box-shadow: 0 12px 28px rgba(55,105,225,.25);
    }

    .quick-card:hover {
        transform: translateY(-3px);
    }

    .round-button:hover,
    .avatar-button:hover {
        transform: scale(1.06);
    }
}

/* Уважение системных настроек */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
    }
}

