:root{--bg:#07111f;--card:#0f1b2d;--card-2:#14243a;--ink:#f5f8ff;--muted:#9cadc3;--line:#263a54;--mine:#ff6b81;--friend:#36d7c3;--amber:#ffc857;--work:#6689c5;--plans:#a878df;--family:#ef8d68;--other:#8994a6;--shadow:0 18px 55px rgba(0,0,0,.28)}
body{min-height:100vh;background:radial-gradient(circle at 12% 0%,#173153 0,transparent 35%),radial-gradient(circle at 90% 18%,#173946 0,transparent 30%),var(--bg)}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.22;background-image:radial-gradient(circle,#fff 0 1px,transparent 1.5px);background-size:37px 37px;mask-image:linear-gradient(to bottom,#000,transparent 55%)}
.shell{position:relative;max-width:1240px;padding-top:38px}header{padding:8px 4px 18px}h1{font-size:clamp(2.3rem,6vw,4.2rem);line-height:.9;letter-spacing:-.06em}h2{letter-spacing:-.02em}.lede{max-width:570px;margin-top:13px;font-size:1.04rem;line-height:1.55}.kicker{color:#7edaca}.badge{border:1px solid var(--line);background:rgba(15,27,45,.82);backdrop-filter:blur(12px)}
.card,.person{background:linear-gradient(145deg,rgba(20,36,58,.96),rgba(12,24,40,.96));border-color:var(--line);box-shadow:var(--shadow)}.card{border-radius:20px;padding:22px}.people{gap:16px}.person{position:relative;overflow:hidden;border-radius:20px;padding:20px}.person:after{content:"";position:absolute;width:150px;height:150px;border:1px solid currentColor;border-radius:50%;right:-75px;top:-75px;opacity:.09;box-shadow:0 0 0 18px currentColor,0 0 0 38px currentColor}.person.me{color:var(--mine)}.person.friend{color:var(--friend)}.person input,.person select,.person small{color:var(--muted)}.person strong{font-size:2rem;color:var(--ink);letter-spacing:-.06em}
input,select,button{border-color:var(--line);background:#0b1728;color:var(--ink)}input:focus,select:focus,button:focus-visible{outline:2px solid #5edbcf;outline-offset:2px}button{border-radius:10px}button:hover{filter:brightness(1.12)}button.primary{background:linear-gradient(135deg,#37cabb,#2b8fd9);border-color:transparent;color:#04121c}.next{background:linear-gradient(110deg,rgba(29,72,83,.96),rgba(19,39,67,.96))}.next h2{font-size:1.35rem}.kind-tabs{padding:5px;background:#0a1525;border:1px solid var(--line);border-radius:13px;width:max-content;max-width:100%}.kind-tabs button{border:0;background:transparent}
.inline-check{flex-direction:row;align-items:center;margin-top:14px;width:max-content;padding:8px 11px;border:1px solid var(--line);border-radius:10px;background:#0a1626}.inline-check input{width:auto;accent-color:var(--friend)}.calendar-card{padding-bottom:18px}.calendar-scroll{border:1px solid var(--line);border-radius:15px;background:#0b1728}.cal-head{background:#13233a;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font:600 .68rem "DM Mono";border-color:var(--line)}.slot{border-color:#1d3048}.time{padding-right:8px;text-align:right}.slot.both{background:rgba(255,200,87,.88)}
.month-grid{display:grid;grid-template-columns:repeat(7,minmax(105px,1fr));min-width:760px}.month-grid .cal-head{padding:12px}.month-day{position:relative;min-height:125px;padding:9px;border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;background:#0d1a2c;text-align:left;overflow:hidden}.month-day:hover{background:#13243a}.month-day.outside{background:#091421;color:#5d7089}.month-day.today{background:linear-gradient(145deg,#142b43,#10263d);box-shadow:inset 0 0 0 2px var(--friend)}.month-day-number{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.month-day-number strong{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;font:600 .78rem "DM Mono"}.month-day.today .month-day-number strong{background:var(--friend);color:#07111f}.month-day-number small{font-size:.63rem;color:var(--friend);text-transform:uppercase;letter-spacing:.08em}.month-events{display:grid;gap:4px}.month-event{display:flex;align-items:center;gap:5px;min-width:0;padding:4px 6px;border-left:3px solid var(--other);border-radius:4px;background:rgba(137,148,166,.14);font-size:.69rem;color:var(--ink)}.month-event.available{border-color:var(--friend);background:rgba(54,215,195,.12)}.month-event.work{border-color:var(--work);background:rgba(102,137,197,.14)}.month-event.plans{border-color:var(--plans);background:rgba(168,120,223,.14)}.month-event.family{border-color:var(--family);background:rgba(239,141,104,.14)}.month-event-time{font:500 .61rem "DM Mono";color:var(--muted)}.month-event-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.month-more{padding-left:6px;color:var(--muted);font-size:.66rem}.month-empty{padding:4px 6px;color:#53667e;font-size:.68rem}
.legend{padding-top:3px}.legend span{color:var(--muted)}.window,.entry{border-color:var(--line)}.window{padding:14px 4px}.window strong{color:var(--amber)}#toast{background:#e9fff9;color:#07231d;box-shadow:var(--shadow)}
@media(max-width:680px){.shell{padding-top:22px}.card{padding:16px;border-radius:16px}.month-grid{min-width:700px}.month-day{min-height:112px}.calendar-card .actions.compact{width:100%}.calendar-card .actions.compact select{flex:1}.form-grid{grid-template-columns:1fr}.kind-tabs{width:100%}}
.header-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.clock-format{min-width:112px}.clock-format select{padding:7px 9px}
.composer input[type=datetime-local]{cursor:pointer;color-scheme:dark}.time-picker{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:18px}.time-picker[hidden]{display:none}.picker-scrim{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:0;background:rgba(2,8,18,.78);backdrop-filter:blur(10px)}.picker-panel{position:relative;width:min(560px,100%);min-height:510px;padding:24px;border:1px solid #33506f;border-radius:24px;background:linear-gradient(145deg,#162a43,#0c192a);box-shadow:0 32px 90px rgba(0,0,0,.55);overflow:hidden}.picker-panel:before{content:"";position:absolute;width:240px;height:240px;border-radius:50%;right:-130px;top:-140px;background:radial-gradient(circle,rgba(54,215,195,.22),transparent 68%)}.picker-top,.picker-actions{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px}.picker-close{width:40px;height:40px;padding:0;font-size:1.5rem}.picker-summary{position:relative;margin:18px 0;padding:15px 17px;border:1px solid var(--line);border-radius:14px;background:#091625;font:600 1.25rem "DM Mono";color:var(--friend)}.picker-steps{display:flex;gap:7px;margin-bottom:18px}.picker-step{height:4px;flex:1;border-radius:99px;background:#273b54}.picker-step.done,.picker-step.active{background:var(--friend)}.picker-options{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:9px;max-height:280px;overflow:auto;padding:2px}.picker-options.months{grid-template-columns:repeat(3,1fr)}.picker-options.days{grid-template-columns:repeat(7,1fr)}.picker-options.period{grid-template-columns:1fr 1fr}.picker-option{min-height:52px;padding:9px;border-radius:12px;background:#101f33}.picker-option strong,.picker-option small{display:block}.picker-option small{margin-top:3px;color:var(--muted);font-size:.7rem}.picker-option.selected{border-color:var(--friend);background:rgba(54,215,195,.16);color:#8ff4e7}.picker-weekday{text-align:center;color:var(--muted);font:.7rem "DM Mono"}.picker-spacer{min-height:1px}.picker-actions{margin-top:20px}.picker-actions button{min-width:100px}.picker-actions .primary{margin-left:auto}@media(max-width:540px){.picker-panel{min-height:540px;padding:18px}.picker-options.months{grid-template-columns:repeat(2,1fr)}.picker-options{grid-template-columns:repeat(3,1fr)}}
.picker-options.combined{display:grid;grid-template-columns:1.1fr .9fr;gap:22px;max-height:none;overflow:visible}.date-pane,.time-pane{padding:15px;border:1px solid var(--line);border-radius:17px;background:#0a1728}.picker-month{display:grid;grid-template-columns:38px 1fr 38px;align-items:center;gap:8px;margin-bottom:14px;text-align:center}.picker-month button{padding:7px}.mini-week,.mini-days{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.mini-week{margin-bottom:5px;text-align:center;color:var(--muted);font:.68rem "DM Mono"}.mini-day{min-height:32px;padding:4px;border:0;border-radius:8px;background:transparent}.mini-day:hover{background:#17314b}.mini-day.selected{background:var(--friend);color:#061620}.time-pane{display:grid;place-items:center;align-content:center}.clock-face{position:relative;width:150px;height:150px;border:5px solid #d8e6ed;border-radius:50%;background:radial-gradient(circle,#fff 0 4px,transparent 5px),repeating-conic-gradient(from -1deg,#8fa1ab 0 1deg,transparent 1deg 6deg),#f6fbfd;color:#142337;box-shadow:inset 0 0 0 5px #b8c9d2,0 10px 25px rgba(0,0,0,.25)}.clock-face i{position:absolute;font:600 .68rem "DM Mono";font-style:normal}.clock-face .twelve{top:9px;left:50%;transform:translateX(-50%)}.clock-face .three{right:12px;top:50%;transform:translateY(-50%)}.clock-face .six{bottom:9px;left:50%;transform:translateX(-50%)}.clock-face .nine{left:12px;top:50%;transform:translateY(-50%)}.clock-hand{position:absolute;left:calc(50% - 2px);bottom:50%;width:4px;border-radius:99px;background:#142337;transform-origin:50% 100%}.clock-hand.hour{height:43px}.clock-hand.minute{height:57px;width:2px;left:calc(50% - 1px)}.clock-dot{position:absolute;z-index:2;left:calc(50% - 5px);top:calc(50% - 5px);width:10px;height:10px;border-radius:50%;background:#142337}.digital-time{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:16px}.digital-time>div:not(.period-toggle){display:grid;grid-template-columns:44px;text-align:center}.digital-time button{padding:3px 7px}.digital-time strong{font:600 1.3rem "DM Mono"}.digital-time small{margin-top:3px;color:var(--muted);font-size:.66rem}.period-toggle{display:grid;gap:4px;margin-left:4px}.period-toggle button.selected{border-color:var(--friend);background:rgba(54,215,195,.18);color:var(--friend)}
@media(max-width:620px){.picker-options.combined{grid-template-columns:1fr}.clock-face{width:125px;height:125px}.clock-hand.hour{height:35px}.clock-hand.minute{height:47px}.picker-panel{max-height:95vh;overflow:auto}}
@media(prefers-reduced-motion:no-preference){.card,.person{animation:rise .4s both}.picker-panel{animation:pickerIn .2s both}@keyframes rise{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}@keyframes pickerIn{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}}
.clock-face{border-width:4px;background:radial-gradient(circle at 38% 28%,#fff,#e9f2f6 72%);box-shadow:inset 0 0 0 3px #b8c9d2,inset 0 -8px 18px rgba(50,77,91,.13),0 10px 25px rgba(0,0,0,.25)}.clock-ring{position:absolute;inset:8px;border-radius:50%;background:repeating-conic-gradient(#5f7682 0 1.3deg,transparent 1.3deg 30deg);-webkit-mask:radial-gradient(circle,transparent 0 85%,#000 86%);mask:radial-gradient(circle,transparent 0 85%,#000 86%)}.clock-hand{z-index:1}.clock-face i{z-index:2}.time-number{width:44px;padding:3px 2px;border:1px solid transparent;background:transparent;text-align:center;font:600 1.3rem "DM Mono";color:var(--ink);appearance:textfield}.time-number:hover,.time-number:focus{border-color:var(--friend);background:#0a1728}.time-number::-webkit-inner-spin-button{display:none}
