:root{
  --wx-season-bg: #f6fbfa;
  --wx-season-surface: rgba(255,255,255,.88);
  --wx-season-surface-strong: #fff;
  --wx-season-line: #dcefed;
  --wx-season-accent: #2b9b8d;
  --wx-season-shadow: 0 18px 55px rgba(47,85,91,.11);
  --wx-radius-lg: 28px;
  --wx-radius-md: 22px;
  --wx-radius-sm: 15px;
}
:root[data-season="spring"]{
  --wx-season-bg: linear-gradient(135deg,#eef9f1 0%,#f8fcfa 55%,#e3f4ed 100%);
  --wx-season-line: #d4ece0;
  --wx-season-accent: #2f9a84;
}
:root[data-season="summer"]{
  --wx-season-bg: linear-gradient(135deg,#fff9ea 0%,#f9fcfb 52%,#e3f7f3 100%);
  --wx-season-line: #f0e4c5;
  --wx-season-accent: #c58b3f;
}
:root[data-season="autumn"]{
  --wx-season-bg: linear-gradient(135deg,#fcf2ea 0%,#fffaf6 55%,#f5e1d5 100%);
  --wx-season-line: #efdcd0;
  --wx-season-accent: #ba704c;
}
:root[data-season="winter"]{
  --wx-season-bg: linear-gradient(135deg,#edf5fb 0%,#f9fbfd 55%,#e1edf7 100%);
  --wx-season-line: #d8e6f2;
  --wx-season-accent: #698db5;
}
html,body{min-width:320px;overflow-x:hidden}
body{background:var(--wx-season-bg);transition:background-color .35s ease,background-image .35s ease}
#app{position:relative;z-index:1}
.login-shell,.app-shell{background:transparent}
.login-shell{position:relative;padding:24px;isolation:isolate}
.login-card{width:min(100%,430px);padding:40px;border:1px solid rgba(255,255,255,.82);border-radius:32px;background:rgba(255,255,255,.88);box-shadow:var(--wx-season-shadow);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.login-form input,.entry-modal input,.entry-modal select,.settings-card input,.settings-card select,.close-form input{min-height:48px;border-radius:15px;background:rgba(255,255,255,.86)}
.primary-button,.secondary-button,.ghost-button,.icon-button,.hero-arrow,.action-card,.mobile-nav button,.side-nav button{border-radius:16px}
.primary-button{background:linear-gradient(135deg,#65d2c6,#36aa9b);box-shadow:0 10px 20px rgba(50,159,145,.18)}
.app-shell{min-height:100vh;background:transparent}
.sidebar{background:rgba(255,255,255,.64);border-right:1px solid rgba(218,235,234,.88);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.main-area{background:transparent}
.topbar{background:rgba(255,255,255,.72);border-bottom:1px solid rgba(226,239,238,.9);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.page-section{position:relative;z-index:1}
.calendar-hero,.report-hero,.settings-hero{position:relative;overflow:hidden;border:1px solid var(--wx-season-line);border-radius:var(--wx-radius-lg);background:var(--wx-season-bg);box-shadow:0 12px 34px rgba(72,122,113,.08)}
.calendar-hero:after,.report-hero:after,.settings-hero:after{content:"";position:absolute;inset:auto -4% -68px;height:140px;border-radius:50%;background:rgba(255,255,255,.27);pointer-events:none}
.calendar-hero>* ,.report-hero>* ,.settings-hero>*{position:relative;z-index:1}
.summary-strip>div,.metric-grid article,.calendar-card,.selected-card,.close-card,.report-card,.settings-card,.tenant-admin-card,.member-admin-card,.role-access-card{border:1px solid rgba(233,241,240,.9);border-radius:var(--wx-radius-md);background:var(--wx-season-surface);box-shadow:var(--wx-season-shadow);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.calendar-card,.selected-card,.close-card,.report-card,.settings-card,.tenant-admin-card,.member-admin-card,.role-access-card{padding:27px}
.summary-strip>div,.metric-grid article{padding:22px}
.calendar-cell,.report-calendar-cell{border-radius:16px}
.entry-row,.current-role,.member-add-bar,.access-panel,.member-list-panel,.member-editor,.role-item,.permission-check,.role-check{border-radius:16px}
.modal-backdrop{background:rgba(22,46,57,.28)}
.entry-modal{border-radius:30px;box-shadow:0 25px 70px rgba(26,63,77,.2);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.wx-season-backdrop{position:fixed;z-index:0;inset:0;overflow:hidden;pointer-events:none;opacity:.8}
.wx-season-backdrop:before,.wx-season-backdrop:after{content:"";position:absolute;display:block;border-radius:999px;filter:blur(1px);opacity:.6}
.wx-season-backdrop:before{width:32vw;height:32vw;top:-15vw;right:-9vw;background:rgba(255,255,255,.58)}
.wx-season-backdrop:after{width:27vw;height:27vw;bottom:-16vw;left:-8vw;background:rgba(255,255,255,.45)}
.wx-particle{position:absolute;display:block;color:var(--wx-season-accent);font-size:28px;line-height:1;opacity:.32;transform:translate3d(0,0,0);animation:wx-drift 18s ease-in-out infinite}
.wx-particle:nth-child(1){top:18%;left:13%;animation-delay:-4s}
.wx-particle:nth-child(2){top:28%;right:18%;font-size:21px;animation-delay:-11s}
.wx-particle:nth-child(3){bottom:22%;left:26%;font-size:20px;animation-delay:-8s}
:root[data-season="spring"] .wx-particle:before{content:"✿"}
:root[data-season="summer"] .wx-particle:before{content:"✦"}
:root[data-season="autumn"] .wx-particle:before{content:"◒"}
:root[data-season="winter"] .wx-particle:before{content:"✧"}
:root[data-season="summer"] .wx-season-backdrop:before{background:rgba(255,231,148,.38);filter:blur(22px);animation:wx-pulse 12s ease-in-out infinite}
:root[data-season="winter"] .wx-particle{color:#6e96bd;opacity:.43}
:root[data-season="autumn"] .wx-particle{color:#b96f4c}
.wx-motion-off .wx-particle,.wx-motion-off .wx-season-backdrop:before{animation:none!important}
.wx-motion-card{margin-top:16px}
.wx-motion-row{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:18px;padding:16px 18px;border:1px solid var(--wx-season-line);border-radius:18px;background:rgba(255,255,255,.62)}
.wx-motion-copy{display:grid;gap:5px;color:#344f5b}
.wx-motion-copy small{color:#82979d;font-size:11px;line-height:1.5}
.wx-motion-toggle{position:relative;width:52px;height:32px;flex:0 0 52px;margin:0;appearance:none;border:0;border-radius:999px;background:#d8e4e4;cursor:pointer;transition:background .2s ease,box-shadow .2s ease}
.wx-motion-toggle:after{content:"";position:absolute;top:4px;left:4px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(29,63,70,.2);transition:transform .2s ease}
.wx-motion-toggle:checked{background:#35ab9b;box-shadow:0 0 0 4px rgba(53,171,155,.14)}
.wx-motion-toggle:checked:after{transform:translateX(20px)}
.wx-motion-toggle:focus-visible{outline:3px solid rgba(53,171,155,.38);outline-offset:3px}
@keyframes wx-drift{0%,100%{transform:translate3d(0,-7px,0) rotate(-6deg)}50%{transform:translate3d(12px,10px,0) rotate(8deg)}}
@keyframes wx-pulse{0%,100%{transform:scale(.94);opacity:.42}50%{transform:scale(1.08);opacity:.72}}
@media(max-width:900px){.calendar-card,.selected-card,.close-card,.report-card,.settings-card,.tenant-admin-card,.member-admin-card,.role-access-card{padding:23px}}
@media(max-width:680px){.login-shell{padding:18px}.login-card{padding:28px 22px;border-radius:26px}.topbar{background:rgba(255,255,255,.8)}.calendar-hero,.report-hero,.settings-hero{border-radius:25px}.calendar-card,.selected-card,.close-card,.report-card,.settings-card,.tenant-admin-card,.member-admin-card,.role-access-card{border-radius:22px}.wx-season-backdrop{opacity:.62}.wx-motion-row{align-items:flex-start}.wx-motion-toggle{margin-top:2px}}
@media(prefers-reduced-motion:reduce){body{transition:none}.wx-season-backdrop *,.wx-season-backdrop:before,.wx-season-backdrop:after{animation:none!important}.wx-season-backdrop{opacity:.62}}
