:root{--font: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, sans-serif;--bg: #F8FAFC;--bg-glow: radial-gradient(1200px 520px at 50% -8%, rgba(37, 99, 235, .1), transparent 60%);--card: #FFFFFF;--card-2: #F1F5F9;--fg: #0F172A;--muted: #5B6B84;--border: #E3EAF3;--primary: #2563EB;--primary-deep: #1D4ED8;--primary-soft: rgba(37, 99, 235, .1);--online: #059669;--online-deep: #047857;--online-soft: rgba(5, 150, 105, .11);--ring: rgba(15, 23, 42, .55);--shadow-sm: 0 1px 2px rgba(15, 23, 42, .05);--shadow: 0 10px 30px rgba(15, 23, 42, .07);--shadow-lg: 0 24px 60px rgba(15, 23, 42, .12);--r-sm: 10px;--r: 16px;--r-lg: 24px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font);color:var(--fg);background:var(--bg);background-image:var(--bg-glow);background-repeat:no-repeat;line-height:1.55;-webkit-font-smoothing:antialiased;min-height:100dvh}button{font-family:inherit}::selection{background:#2563eb2e}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:1ms!important;transition-duration:1ms!important}}.app{min-height:100dvh;display:flex;flex-direction:column}main{flex:1}.section{max-width:1120px;margin:0 auto;padding:2.6rem 1.5rem 1rem;width:100%;position:relative;z-index:1}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.72rem 1.4rem;border-radius:999px;font-size:.92rem;font-weight:600;text-decoration:none;cursor:pointer;border:1.5px solid transparent;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.btn-primary{background:var(--primary);color:#fff;box-shadow:0 8px 24px #2563eb52}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 14px 34px #2563eb66}.btn-ghost{border-color:var(--border);color:var(--fg);background:var(--card)}.btn-ghost:hover{transform:translateY(-2px);border-color:var(--primary);color:var(--primary-deep)}.eyebrow{font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-bottom:.35rem}.text-online{color:var(--online-deep)}.text-office{color:var(--primary-deep)}.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1.25rem}.section-head h2{font-size:clamp(1.45rem,2.6vw,2rem);font-weight:800;letter-spacing:-.03em;line-height:1.15}.navbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 1.5rem;max-width:1120px;margin:0 auto;width:100%;background:#f8fafcd1;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--border)}.nav-logo{display:flex;align-items:center;gap:.5rem;font-weight:800;font-size:1.05rem;letter-spacing:-.02em;color:var(--fg)}.nav-logo svg{color:var(--primary)}.nav-links{display:flex;gap:1.4rem}.nav-link{color:var(--muted);font-size:.88rem;font-weight:600;text-decoration:none;transition:color .18s}.nav-link:hover{color:var(--primary-deep)}.status-pill{display:inline-flex;align-items:center;gap:.42rem;font-size:.78rem;font-weight:700;padding:.4rem .85rem;border-radius:999px;white-space:nowrap}.status-pill.mode-online{background:var(--online-soft);color:var(--online-deep)}.status-pill.mode-office{background:var(--primary-soft);color:var(--primary-deep)}.status-pill.mode-none{background:#eef2f7;color:var(--muted)}.status-pill .dot{width:8px;height:8px;border-radius:50%;background:var(--muted)}.live-dot{width:9px;height:9px;border-radius:50%;display:inline-block}.live-dot.mode-online{background:var(--online);box-shadow:0 0 0 4px var(--online-soft)}.live-dot.mode-office{background:var(--primary);box-shadow:0 0 0 4px var(--primary-soft)}.hero{padding-top:3.6rem;padding-bottom:1.2rem;text-align:center}.hero-badge{display:inline-flex;align-items:center;gap:.5rem;font-size:.8rem;font-weight:700;color:var(--muted);background:var(--card);border:1px solid var(--border);padding:.4rem .9rem;border-radius:999px;box-shadow:var(--shadow-sm);margin-bottom:1.4rem}.hero-title{font-size:clamp(2.3rem,6.4vw,4.4rem);font-weight:800;letter-spacing:-.045em;line-height:1.03;margin-bottom:1.1rem}.hero-sub{color:var(--muted);font-size:clamp(.98rem,1.6vw,1.12rem);max-width:620px;margin:0 auto 1.9rem}.hero-sub strong{color:var(--fg)}.hero-actions{display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap}.today-card{max-width:760px;margin:1.4rem auto 0;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1.1rem;text-align:left;padding:1.15rem 1.4rem;border-radius:var(--r-lg);border:1px solid var(--border);background:var(--card);box-shadow:var(--shadow);animation:fadeUp .55s ease both}.today-card.mode-online{border-color:#05966952}.today-card.mode-office{border-color:#2563eb52}.today-icon{width:54px;height:54px;border-radius:16px;display:grid;place-items:center}.mode-online .today-icon{background:var(--online-soft);color:var(--online-deep)}.mode-office .today-icon{background:var(--primary-soft);color:var(--primary-deep)}.today-label{font-weight:800;font-size:1.08rem;letter-spacing:-.02em}.today-range{color:var(--muted);font-size:.88rem}.today-next{text-align:right}.today-next-label{font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.today-next-value{font-weight:700;font-size:.92rem;color:var(--fg)}@keyframes fadeUp{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}.cal-wrap{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:1.5rem;align-items:start}.side-stack{display:flex;flex-direction:column;gap:1rem;position:sticky;top:84px}.legend{display:flex;gap:1rem;flex-wrap:wrap;align-items:center}.legend-item{display:inline-flex;align-items:center;gap:.4rem;font-size:.8rem;font-weight:600;color:var(--muted)}.swatch{width:12px;height:12px;border-radius:4px;display:inline-block}.swatch.mode-online{background:var(--online)}.swatch.mode-office{background:var(--primary)}.swatch.mode-none{background:#d8e0ea}.cal-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);padding:1.2rem 1.2rem 1.4rem;box-shadow:var(--shadow)}.cal-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.cal-title{display:flex;align-items:center;gap:.5rem;font-weight:800;font-size:1.05rem;letter-spacing:-.02em}.cal-title svg{color:var(--primary)}.icon-btn{width:38px;height:38px;border-radius:12px;border:1px solid var(--border);background:var(--card);color:var(--fg);cursor:pointer;display:grid;place-items:center;transition:transform .16s ease,border-color .16s ease}.icon-btn:hover{border-color:var(--primary);color:var(--primary-deep);transform:translateY(-1px)}.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.cal-dow{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);text-align:center;padding:.35rem 0 .5rem}.cal-cell{position:relative;border:none;cursor:pointer;min-height:72px;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-family:inherit;padding:4px 2px;transition:transform .15s ease,box-shadow .15s ease,filter .15s ease;animation:fadeUp .4s ease both}.cal-cell:hover{transform:translateY(-2px);box-shadow:0 8px 18px #0f172a1f}.cal-cell.empty{background:transparent;cursor:default;box-shadow:none;transform:none}.cal-cell.mode-online{background:var(--online-soft)}.cal-cell.mode-office{background:var(--primary-soft)}.cal-cell.mode-none{background:#f1f5f9}.cal-cell.weekend{filter:saturate(.55)}.cal-cell.weekend .cal-num{opacity:.55}.cal-num{font-size:.95rem;font-weight:700;line-height:1}.mode-online .cal-num{color:var(--online-deep)}.mode-office .cal-num{color:var(--primary-deep)}.mode-none .cal-num{color:#94a3b8}.cal-tag{font-size:.6rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.tag-online{color:var(--online-deep);background:#05966924;padding:1px 5px;border-radius:6px}.tag-office{color:var(--primary-deep);background:#2563eb21;padding:1px 5px;border-radius:6px}.tag-past{color:#94a3b8}.cal-cell.selected{outline:2px solid var(--ring);outline-offset:-2px}.cal-cell .today-ring{position:absolute;top:3px;right:3px;bottom:3px;left:3px;border-radius:10px;pointer-events:none;box-shadow:inset 0 0 0 2px var(--fg);opacity:.22}.cal-cell.today .cal-num{background:var(--fg);color:#fff;border-radius:999px;width:24px;height:24px;display:grid;place-items:center}.cal-cell:nth-child(n){animation-delay:0s}.detail-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);padding:1.3rem 1.4rem;box-shadow:var(--shadow);animation:fadeUp .35s ease both}.detail-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;gap:.6rem}.detail-top .eyebrow{margin-bottom:0}.detail-date{font-weight:700;font-size:.9rem;color:var(--fg)}.detail-icon{width:58px;height:58px;border-radius:18px;margin-bottom:.9rem;display:grid;place-items:center;background:#f1f5f9;color:var(--muted)}.detail-icon.icon-online{background:var(--online-soft);color:var(--online-deep)}.detail-icon.icon-office{background:var(--primary-soft);color:var(--primary-deep)}.detail-title{font-size:1.5rem;font-weight:800;letter-spacing:-.03em;margin-bottom:.5rem}.detail-copy{color:var(--muted);font-size:.94rem}.detail-copy strong{color:var(--fg)}.detail-meta{margin-top:1rem;padding-top:.85rem;border-top:1px dashed var(--border);font-size:.82rem;font-weight:600;color:var(--muted)}.hint-card{background:var(--card);border:1px dashed var(--border);border-radius:var(--r);padding:1rem 1.15rem}.hint-title{font-weight:800;font-size:.82rem;text-transform:uppercase;letter-spacing:.08em;color:var(--primary-deep);margin-bottom:.3rem}.hint-card p{color:var(--muted);font-size:.86rem}.timeline{display:flex;flex-direction:column;gap:.8rem}.week-row{display:grid;grid-template-columns:190px 210px 1fr;align-items:center;gap:1.1rem;background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:.85rem 1.1rem;box-shadow:var(--shadow-sm);transition:transform .16s ease,box-shadow .16s ease}.week-row:hover{transform:translateY(-2px);box-shadow:var(--shadow)}.week-row.current{border-color:#0f172a59}.week-badge{display:inline-flex;align-items:center;gap:.45rem;font-weight:800;font-size:.88rem}.week-badge.mode-online{color:var(--online-deep)}.week-badge.mode-office{color:var(--primary-deep)}.current-chip{font-size:.62rem;text-transform:uppercase;letter-spacing:.06em;font-weight:800;background:var(--fg);color:#fff;padding:1px 7px;border-radius:999px}.week-range{font-size:.8rem;color:var(--muted);font-weight:600}.week-strip{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.strip-day{display:flex;flex-direction:column;align-items:center;gap:1px;padding:5px 0;border-radius:9px;background:var(--card-2)}.week-row.mode-online .strip-day{background:var(--online-soft)}.week-row.mode-office .strip-day{background:var(--primary-soft)}.strip-day.weekend{opacity:.55}.strip-today{outline:2px solid var(--fg);outline-offset:-2px}.strip-dow{font-size:.6rem;font-weight:800;text-transform:uppercase;color:var(--muted)}.strip-num{font-size:.85rem;font-weight:700;color:var(--fg)}.timeline-note{display:inline-flex;align-items:center;gap:.5rem;margin-top:1rem;font-size:.86rem;color:var(--muted);font-weight:600}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.step-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:1.35rem 1.25rem;box-shadow:var(--shadow-sm);transition:transform .18s ease,box-shadow .18s ease;animation:fadeUp .5s ease both}.step-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.step-icon{width:44px;height:44px;border-radius:13px;margin-bottom:.9rem;display:grid;place-items:center;background:var(--primary-soft);color:var(--primary-deep)}.step-card:nth-child(2) .step-icon{background:var(--online-soft);color:var(--online-deep)}.step-card:nth-child(4) .step-icon{background:var(--online-soft);color:var(--online-deep)}.step-card h3{font-size:1rem;font-weight:800;letter-spacing:-.02em;margin-bottom:.4rem}.step-card p{color:var(--muted);font-size:.87rem}.footer{border-top:1px solid var(--border);background:#f1f5f999;margin-top:3rem}.footer-inner{max-width:1120px;margin:0 auto;padding:1.8rem 1.5rem;display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}.footer-brand{font-weight:800;letter-spacing:-.02em}.footer-sub{color:var(--muted);font-size:.84rem;margin-top:.2rem}.footer-note{font-size:.8rem;font-weight:600;color:var(--muted)}@media (max-width: 980px){.cal-wrap{grid-template-columns:1fr}.side-stack{position:static}.steps{grid-template-columns:repeat(2,1fr)}.week-row{grid-template-columns:1fr 1fr}.week-strip{grid-column:1 / -1}}@media (max-width: 680px){.navbar{padding:.65rem 1rem}.nav-links{display:none}.section{padding-left:1rem;padding-right:1rem}.hero{padding-top:2.4rem}.today-card{grid-template-columns:auto 1fr;text-align:left}.today-next{grid-column:1 / -1;text-align:left;padding-left:66px}.cal-cell{min-height:52px}.cal-tag{display:none}.steps{grid-template-columns:1fr}.cal-card{padding:.9rem .7rem 1rem}.cal-grid{gap:4px}.week-row{grid-template-columns:1fr;gap:.7rem}.week-strip{grid-column:auto}}