:root {
  color-scheme: dark;
  --ink:#f4f0fa; --soft:#bfb2cc; --muted:#a99ab9; --gold:#f1ce7c; --line:#3e3050;
  --bg:#0b0812; --deep:#241036; --violet:#6d28a8; --panel:#171120;
  --shadow:0 20px 45px #05030766, inset 0 1px 0 #ffffff0c;
  font: 16px/1.5 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:var(--bg); color:var(--ink);
}
* { box-sizing:border-box }
body { margin:0; min-height:100vh; background:radial-gradient(ellipse at 59% -12%,#241432 0%,transparent 52%) }
a { color:var(--gold); text-decoration:none }
a:hover { text-decoration:underline; text-underline-offset:.22em }
button,input,select { font:inherit }
button { cursor:pointer }
:focus-visible { outline:2px solid #f8db92; outline-offset:4px }
::selection { background:#f1ce7c; color:#241036 }
h1,h2,h3,p { margin:0 }
h1,h2,h3,strong,small,p,dt,dd,a { overflow-wrap:anywhere }
h1 { font-size:clamp(2.25rem,5vw,4rem); letter-spacing:-.045em; line-height:1.06 }
h2 { font-size:1.35rem; line-height:1.2; letter-spacing:-.035em }
h3 { font-size:1rem; line-height:1.3 }
p { color:var(--soft) }
em { color:var(--gold); font-style:normal }
img { max-width:100%; display:block }
form { margin:0 }
.icon { flex:none; vertical-align:middle; width:20px; height:20px }
.skip { position:absolute; z-index:5; top:-5rem; left:1rem; background:#21152c; padding:.7rem }
.skip:focus { top:1rem }
.sr-only { position:absolute; height:1px; width:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap }
.shell,.top-inner { max-width:1328px; width:calc(100% - 80px); margin-inline:auto }
.shell { margin-top:34px }
.top { background:#100c18ed; border-bottom:1px solid #ffffff12 }
.top-inner { min-height:77px; display:flex; align-items:center; justify-content:space-between; gap:22px }
.brand { display:flex; flex:none; align-items:center; gap:12px; color:var(--ink); font-size:1.15rem; font-weight:800; letter-spacing:-.03em; line-height:1.15 }
.brand:hover,.profile-link:hover { text-decoration:none }
.brand img { filter:drop-shadow(0 4px 9px #0008) }
.brand b { color:var(--gold) }
.brand small { display:block; color:var(--muted); font-size:.56rem; margin-top:6px; letter-spacing:.15em; font-weight:750 }
nav,.userbar,.profile-link { display:flex; align-items:center; gap:8px }
nav a,.profile-link { padding:9px 12px; border-radius:9px; color:var(--soft); font-weight:650; white-space:nowrap; font-size:.91rem }
nav a { border:1px solid transparent; display:flex; align-items:center; gap:6px; min-height:43px }
nav a:hover,nav a[aria-current],.profile-link[aria-current],.profile-link:hover { text-decoration:none; background:#291c39; border-color:#503664; color:var(--gold) }
.profile-link { padding:5px 8px }
.profile-link span:not(.avatar) { overflow:hidden; text-overflow:ellipsis; max-width:14ch }
.avatar { width:37px; height:37px; border:1px solid #c09e615e; border-radius:50%; object-fit:cover; flex:none; background:#2d1c40; display:inline-grid; place-items:center }
.avatar.initial { color:var(--gold); font-weight:750 }
.avatar.mini { width:27px; height:27px; font-size:.75rem }
.avatar.big { width:63px; height:63px; font-size:1.4rem }
.card { border:1px solid var(--line); border-radius:18px; background:linear-gradient(145deg,#1c1427,#140f1e); box-shadow:var(--shadow) }
.hero { position:relative; min-height:274px; overflow:hidden; display:flex; align-items:center; justify-content:space-between; padding:35px clamp(24px,5vw,63px); background:radial-gradient(ellipse at 77% 45%,#4e2576 0%,transparent 53%),linear-gradient(120deg,#1b1228,#28153d 62%,#20132f) }
.hero::after,.welcome::after { content:""; position:absolute; inset:0; background-image:radial-gradient(#ead5fc 1px,transparent 1px); background-size:22px 22px; opacity:.11; mask-image:linear-gradient(90deg,transparent 36%,#000); pointer-events:none }
.hero-copy { position:relative; z-index:1 }
.eyebrow { display:flex; align-items:center; gap:9px; color:var(--gold); font-weight:800; letter-spacing:.18em; font-size:.67rem; margin-bottom:10px }
.gold-dot { width:8px; height:8px; background:var(--gold); border-radius:50%; box-shadow:0 0 12px #f1ce7c88 }
.hero p,.page-head p { margin:.75rem 0 0; font-size:1rem }
.hero .button { margin-top:23px }
.date-art { flex:0 0 34%; min-width:150px; min-height:190px; position:relative; display:grid; place-items:center; isolation:isolate }
.orbit { position:absolute; width:235px; height:235px; border:1px solid #f1ce7c34; border-radius:50%; transform:rotate(-22deg) scaleY(.65) }
.orbit::after { content:""; position:absolute; inset:17px; border:1px dashed #d8abff46; border-radius:50% }
.date-tile { text-align:center; position:relative; display:grid; place-items:center; align-content:center; min-width:135px; min-height:156px; background:linear-gradient(150deg,#5b347d,#2b1745 75%); border-radius:19px; border:1px solid #b58cc875; border-top:5px solid var(--gold); color:var(--gold); transform:perspective(600px) rotateX(7deg) rotateY(-16deg) rotateZ(8deg); box-shadow:10px 15px 0 #150d2488,12px 22px 28px #0a0712a8,inset 0 1px 1px #fff3 }
.date-tile span,.date-tile small { font-size:.69rem; letter-spacing:.17em; font-weight:800; text-transform:uppercase }
.date-tile strong { font-size:4.2rem; letter-spacing:-.08em; line-height:1.12; color:#fff1cd }
.date-tile small { color:#d5bcea }
.button,.icon-btn { display:inline-flex; min-height:42px; align-items:center; justify-content:center; gap:7px; border:1px solid #554364; border-radius:9px; padding:.54rem .87rem; background:#281d34; color:var(--ink); font-weight:700; text-decoration:none; line-height:1.2; transition:background .15s,transform .15s }
.button:hover,.icon-btn:hover { background:#392849; text-decoration:none }
.button:active,.icon-btn:active { transform:translateY(1px) }
.primary { background:linear-gradient(180deg,#f4d58f,#d3a952); color:#251a2e; border-color:#f7d98f; box-shadow:0 3px 0 #8f652e,0 6px 15px #0a071766 }
.primary:hover { background:#ffe0a1 }
.compact { min-height:38px; padding:.44rem .65rem; font-size:.82rem }
.icon-btn { width:40px; padding:0; min-height:39px; color:var(--soft) }
.userbar .icon-btn { background:transparent; border-color:transparent }
.userbar .icon-btn:hover { background:#32223e; color:var(--gold) }
.stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin:17px 0 }
.stat { display:flex; min-height:90px; align-items:center; color:var(--ink); gap:13px; padding:12px 16px }
.stat:hover { text-decoration:none; border-color:#775987 }
.stat-icon { flex:none; display:grid; place-items:center; width:42px; height:42px; color:var(--gold); background:#38234a; border:1px solid #57436b; border-radius:10px }
.stat small { display:block; font-size:.78rem; color:var(--soft); font-weight:650 }
.stat strong { display:block; font-size:1.62rem; line-height:1.12; font-variant-numeric:tabular-nums }
.stat-arrow { margin-left:auto; color:#a395b4; width:17px }
.workspace { display:grid; gap:16px; grid-template-columns:minmax(0,1fr) minmax(255px,29%); align-items:start }
.schedule,.upcoming { padding:18px }
.panel-head { display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:17px }
.panel-head .eyebrow { margin-bottom:5px }
.tools,.period,.segment { display:flex; align-items:center; gap:4px }
.tools { gap:8px; flex-wrap:wrap }
.segment { border:1px solid #4c385e; border-radius:10px; background:#140e1c; padding:3px }
.segment a { font-size:.84rem; padding:5px 10px; border-radius:6px; color:var(--soft); font-weight:750 }
.segment a[aria-current] { background:#38244b; color:var(--gold) }
.weekdays,.month-list { display:none }
.day-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); border:1px solid #382946; border-radius:11px; background:#120d1a; overflow:hidden }
.day { padding:7px 5px; min-height:96px; border-right:1px solid #382946; border-bottom:1px solid #382946; min-width:0 }
.weekly .day { min-height:169px; border-bottom:0 }
.day:nth-child(7n) { border-right:0 }
.monthly .day:nth-last-child(-n+7) { border-bottom:0 }
.day.outside { background:#1c1421; color:var(--muted) }
.day.is-today { background:#24182f }
.day h3 { display:flex; align-items:center; gap:4px; flex-wrap:wrap; font-weight:650; font-size:.69rem; margin-bottom:5px; color:var(--soft) }
.day-number { display:inline-grid; place-items:center; min-width:24px; min-height:24px; border-radius:5px; font-size:.88rem; color:var(--ink) }
.day-number:hover { background:#4c3264; text-decoration:none }
.is-today .day-number { background:var(--gold); color:#241634; font-weight:850 }
.event-chip { display:block; color:var(--ink); font-size:.73rem; line-height:1.23; background:#33204a; border-radius:5px; border-left:2px solid #d3a65a; margin:5px 0; padding:5px }
.event-chip small { display:block; color:var(--gold); margin-bottom:2px }
.no-event { color:var(--muted); display:block; text-align:center; font-size:.85rem; padding:7px }
.agenda-item,.account-row { display:flex; align-items:center; gap:11px; color:var(--ink); border-bottom:1px solid var(--line); padding:12px 0 }
.agenda-item:hover,.account-row:hover { color:var(--gold); text-decoration:none }
.agenda-item:last-child,.account-row:last-child { border:0 }
.agenda-time { color:var(--gold); font-size:.81rem; font-weight:800; background:#39274b; border:1px solid #513b61; border-radius:7px; padding:5px 6px }
.agenda-item small,.account-row small { display:block; font-size:.77rem; color:var(--soft) }
.agenda-item .icon { width:13px; height:13px }
.empty { margin-top:15px; padding:17px 13px; border:1px dashed #594369; border-radius:10px; color:var(--soft); text-align:center }
.empty > .icon { color:var(--gold); width:24px; height:24px }
.empty p { margin:.45rem 0 }
.empty a { display:inline-block; font-size:.84rem; font-weight:700 }
.empty a .icon { width:15px }
.footer { display:flex; justify-content:space-between; gap:15px; border-top:1px solid #ffffff12; margin-top:27px; padding:16px 0 25px; color:var(--muted); font-size:.73rem }
.login-layout { display:grid; grid-template-columns:1.2fr 1fr; gap:18px; max-width:1030px; margin:clamp(32px,7vw,90px) auto }
.welcome { position:relative; isolation:isolate; overflow:hidden; min-height:420px; padding:clamp(26px,4vw,52px); background:radial-gradient(ellipse at 83% 65%,#50267a,transparent 60%),linear-gradient(120deg,#20112f,#251238) }
.welcome h1 { font-size:clamp(2.4rem,4.5vw,3.65rem); position:relative; z-index:1 }
.welcome p { max-width:26ch; margin-top:16px; position:relative; z-index:1 }
.welcome-art { position:absolute; bottom:26px; right:30px; transform:perspective(420px) rotateX(13deg) rotateY(-22deg) rotateZ(11deg) }
.welcome-art img { box-shadow:8px 11px 0 #0f0918aa,14px 21px 28px #0a0712a8; border-radius:29px; position:relative }
.welcome-art span { position:absolute; inset:-29px; border-radius:50%; border:1px solid #dbb3fa62 }
.form-card { padding:clamp(19px,3vw,31px) }
.form-card h1,.page-head h1 { font-size:clamp(2rem,4.3vw,3.3rem) }
.form-card > p { margin:.65rem 0 1.15rem }
.login-form { align-self:center }
.login-form h2 { font-size:1.85rem }
.stack { display:grid; gap:14px; margin-top:16px }
.stack > .button { justify-self:start; margin-top:4px }
.stack label:not(.choice,.avatar-choice) { display:grid; gap:5px; color:var(--ink); font-weight:650; font-size:.9rem; min-width:0 }
input:not([type=checkbox],[type=radio],[type=hidden]),select { width:100%; min-width:0; min-height:44px; background:#100c17; color:var(--ink); border:1px solid #574467; border-radius:8px; padding:.55rem .65rem }
input[type=checkbox],input[type=radio] { accent-color:#f1ce7c; width:17px; height:17px; flex:none }
fieldset { margin:0; padding:10px; border:1px solid #473554; border-radius:8px; min-width:0 }
legend { padding:0 5px; font-weight:700; font-size:.87rem }
.muted { color:var(--soft) }
.narrow { max-width:730px; margin-inline:auto }
.two-cols,.split,.choices { display:grid; gap:14px; grid-template-columns:repeat(2,minmax(0,1fr)) }
.split { grid-template-columns:minmax(0,1.27fr) minmax(0,1fr); align-items:start }
.choices { gap:7px }
.choice { display:flex; align-items:center; gap:7px; min-height:40px; padding:4px 6px; border-radius:7px; color:var(--soft); cursor:pointer }
.choice:hover { background:#2f2140 }
.choice small { color:var(--muted) }
.back { display:inline-flex; align-items:center; gap:6px; color:var(--soft); font-weight:700; margin-bottom:13px }
.notice { max-width:730px; color:#f4e2ff; border:1px solid #77568c; background:#2d1c3c; border-radius:9px; padding:11px 15px; margin:0 auto 16px }
.notice.error { border-color:#a75a77; background:#371a2b; color:#ffdae8 }
.page-head { margin-bottom:20px }
.details { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:18px 0 }
.details div { padding:11px; background:#21162b; border:1px solid #493657; border-radius:8px }
dt { color:var(--soft); font-size:.8rem; font-weight:700 }
dd { margin:5px 0 0 }
dd .icon { color:var(--gold); width:17px }
.people { list-style:none; display:flex; flex-wrap:wrap; gap:10px; margin:14px 0 20px; padding:0 }
.people li { display:flex; align-items:center; gap:7px; padding:5px 8px; border-radius:8px; background:#2c1f37; color:var(--soft) }
.tag { display:inline-block; padding:2px 7px; border-radius:6px; font-size:.72rem; letter-spacing:0; color:#ecd3ff; background:#3c2750; vertical-align:middle; font-weight:700 }
.tag.late { color:#ffdce5; background:#592b41 }
.task { padding:13px 0; border-bottom:1px solid var(--line) }
.task:last-child { border:0 }
.task-main { display:flex; align-items:center; justify-content:space-between; gap:10px }
.task h3 { margin:.35rem 0 }
.task small,details { color:var(--soft) }
.task details { margin-top:6px; font-size:.79rem }
.task summary { cursor:pointer; width:fit-content; padding:4px 0 }
.account-row > span:nth-child(2) { flex:1; min-width:0 }
.profile-head { display:flex; flex-wrap:wrap; align-items:center; gap:15px }
.profile-head .button { margin-left:auto }
.profile-head .eyebrow { margin-bottom:4px }
.avatar-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(83px,1fr)); gap:8px }
.avatar-choice { position:relative; cursor:pointer }
.avatar-choice input { position:absolute; opacity:0 }
.avatar-choice span:not(.avatar) { display:grid; place-items:center; gap:5px; padding:8px 3px; border:1px solid #4b3759; background:#1e1428; border-radius:9px; color:var(--soft) }
.avatar-choice:hover span:not(.avatar),.avatar-choice input:checked + span { background:#3d2852; border-color:#deb96d; color:var(--gold) }
.avatar-choice input:focus-visible + span { outline:2px solid var(--gold); outline-offset:2px }
@media(max-width:1120px) {
  .shell,.top-inner { width:calc(100% - 44px) }
  .workspace { grid-template-columns:minmax(0,1fr) }
}
@media(max-width:760px) {
  .shell,.top-inner { width:calc(100% - 28px) }
  .shell { margin-top:20px }
  .top-inner { flex-wrap:wrap; gap:6px; padding-top:10px }
  .top-inner nav { order:3; flex:1 0 100%; padding-bottom:6px; gap:4px }
  nav a { min-height:44px; padding:5px 8px }
  .profile-link span:not(.avatar) { display:none }
  .hero { min-height:220px; padding:23px 20px }
  .date-art { min-width:115px; min-height:145px }
  .date-tile { min-width:95px; min-height:115px }
  .date-tile strong { font-size:3rem }
  .date-tile span,.date-tile small { font-size:.58rem }
  .orbit { width:155px; height:155px }
  .stats { gap:7px }
  .stat { min-height:78px; padding:8px; gap:7px }
  .stat-icon { width:32px; height:32px }
  .stat-icon .icon { width:16px }
  .stat-arrow { display:none }
  .stat strong { font-size:1.3rem }
  .stat small { font-size:.72rem }
  .schedule,.upcoming { padding:12px }
  .weekly { grid-template-columns:1fr }
  .weekly .day { display:grid; align-content:start; grid-template-columns:minmax(90px,29%) minmax(0,1fr); min-height:48px; padding:5px 8px; border-right:0; border-bottom:1px solid #382946 }
  .weekly .day:last-child { border:0 }
  .weekly .day h3 { grid-column:1; grid-row:1 / span 1; margin:0 }
  .weekly .day > :not(h3) { grid-column:2; align-self:center }
  .weekly .day-number,.monthly .day-number { min-height:36px; min-width:29px }
  .monthly .day h3 span { display:none }
  .weekdays { display:grid; grid-template-columns:repeat(7,1fr); text-align:center; color:var(--soft); font-size:.72rem; margin-bottom:5px }
  .month-list { display:block; margin-top:16px }
  .month-list p { margin-top:7px; font-size:.85rem }
  .monthly .day { padding:3px 2px; min-height:62px }
  .monthly .event-chip { padding:3px 2px; font-size:.68rem }
  .no-event { padding:3px }
  .login-layout,.split { grid-template-columns:1fr }
  .login-layout { margin:20px auto }
  .welcome { min-height:245px }
  .welcome-art img { width:69px; height:69px; border-radius:15px }
  .welcome-art { bottom:20px; right:16px }
  .login-form { grid-row:1 }
}
@media(max-width:460px) {
  .date-art { display:none }
  .stats { gap:5px }
  .stat { display:grid; grid-template-columns:1fr }
  .stat-icon { display:none }
  .monthly .day-number { min-width:30px }
  .monthly .event-chip b { display:block; white-space:nowrap; text-overflow:ellipsis; overflow:hidden }
  .monthly .event-chip small { white-space:nowrap; text-overflow:ellipsis; overflow:hidden }
  .choices,.two-cols,.details { grid-template-columns:1fr }
  .footer { flex-wrap:wrap }
  .profile-head .button { margin-left:0 }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none!important } }

.text-links { display:flex; gap:10px 18px; flex-wrap:wrap; margin-top:18px; font-size:.9rem }
.text-links a { padding:5px 0; font-weight:650 }
.nav-count { display:grid; place-items:center; min-width:19px; padding:0 4px; border-radius:20px; background:#f1ce7c; color:#251a2e; font-size:.72rem }
.calendar-help { margin:-5px 0 11px; font-size:.8rem }
.day.is-off { box-shadow:inset 0 2px #ba975b }
.day-off-form { margin:4px 0 6px }
.off-button { color:var(--soft); background:#20162b; border:1px solid #533b65; border-radius:6px; padding:2px 5px; font-size:.71rem; min-height:28px; max-width:100% }
.off-button:hover { background:#38244b; color:var(--ink) }
.off-button[aria-pressed=true] { background:#4d3b23; border-color:#ae8850; color:#ffdf96; font-weight:750 }
.absence-box { border-top:1px solid var(--line); margin-top:16px; padding-top:15px }
.absence-box h2 { font-size:1.12rem }
.absence-box ul,.mail-preview ul { padding-inline-start:1.25rem; margin:.45rem 0 0; color:var(--soft) }
.absence-box p { margin:.5rem 0 0; font-size:.9rem }
.account-status { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:4px; max-width:45% }
.management-block { border-top:1px solid var(--line); margin-top:18px; padding-top:16px }
.management-block > p { margin:.5rem 0 }
.danger { border-color:#9e5474; color:#ffdeea; background:#472438 }
.danger:hover { background:#5c2c47 }
.reset-code { display:inline-block; background:#100c17; border:1px solid #574467; border-radius:8px; padding:.55rem .65rem; color:var(--gold); font-size:1.02rem; overflow-wrap:anywhere }
.digest-actions { display:flex; flex-wrap:wrap; align-items:end; gap:9px; margin:16px 0 }
.digest-actions label { font-size:.87rem; color:var(--soft) }
.mail-preview { padding:15px; border:1px solid var(--line); border-radius:10px }
.mail-preview section { margin-top:16px }
@media(max-width:760px) {
  .weekly .day > .day-off-form { grid-column:2; grid-row:1; justify-self:end; margin:0 }
  .weekly .day .event-chip { grid-column:1 / -1 }
  .weekly .day .no-event { display:none }
  .off-button { min-height:34px }
  .monthly .off-button { font-size:.6rem; padding:1px 2px; width:100%; letter-spacing:-.02em }
  .monthly .day-off-form { margin:1px 0 3px }
}
@media(max-width:760px) {
  .top-inner nav { flex-wrap:wrap }
}