@font-face{font-family:"Fraunces";font-style:normal;font-weight:400 500;font-display:swap;src:url("../fonts/font-1.woff2") format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"Fraunces";font-style:normal;font-weight:400 500;font-display:swap;src:url("../fonts/font-2.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Fraunces";font-style:normal;font-weight:400 500;font-display:swap;src:url("../fonts/font-3.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Manrope";font-style:normal;font-weight:400 800;font-display:swap;src:url("../fonts/font-4.woff2") format("woff2");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}
@font-face{font-family:"Manrope";font-style:normal;font-weight:400 800;font-display:swap;src:url("../fonts/font-5.woff2") format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Manrope";font-style:normal;font-weight:400 800;font-display:swap;src:url("../fonts/font-6.woff2") format("woff2");unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}
@font-face{font-family:"Manrope";font-style:normal;font-weight:400 800;font-display:swap;src:url("../fonts/font-7.woff2") format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"Manrope";font-style:normal;font-weight:400 800;font-display:swap;src:url("../fonts/font-8.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Manrope";font-style:normal;font-weight:400 800;font-display:swap;src:url("../fonts/font-9.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
#main[aria-busy="true"] .pg{opacity:.55}
:root{--bg:#fbfaf8;--sf:#fff;--sf2:#f4f2ee;--tx:#17151c;--mt:#7a7685;--ln:#ece8e1;--ac:#5a46d6;--ac2:#efecfd;--ok:#2f8f6b;--er:#c4493f;--r:18px;--sh:0 1px 1px rgba(23,21,28,.04),0 14px 34px -10px rgba(60,40,140,.14);color-scheme:light}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#16141a;--sf:#201d27;--sf2:#2a2633;--tx:#f2eff6;--mt:#a39eae;--ln:#35303f;--ac:#a99cf5;--ac2:#2d2848;--sh:0 8px 24px rgba(0,0,0,.4);color-scheme:dark}}
:root[data-theme=dark]{--bg:#16141a;--sf:#201d27;--sf2:#2a2633;--tx:#f2eff6;--mt:#a39eae;--ln:#35303f;--ac:#a99cf5;--ac2:#2d2848;--sh:0 8px 24px rgba(0,0,0,.4);color-scheme:dark}
*{box-sizing:border-box;margin:0}
html,body{height:100%}
:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{font:500 15px/1.5 Manrope,system-ui,sans-serif;background:var(--bg);color:var(--tx);overflow-x:hidden}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none}
:focus-visible{outline:2px solid var(--ac);outline-offset:2px}
h1,h2,h3{font-family:Fraunces,Georgia,serif;font-weight:500;letter-spacing:-.01em}
h1{font-size:clamp(30px,5vw,46px);line-height:1.1}h2{font-size:26px}h3{font-size:18px}
.mt{color:var(--mt)}.sm{font-size:13px}
svg.i{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 18px;border-radius:12px;font-weight:600;background:linear-gradient(180deg,#6a57e6,#5240cc);color:#fff;box-shadow:0 1px 0 rgba(255,255,255,.25) inset,0 8px 18px -6px rgba(90,70,214,.55);transition:transform .15s,box-shadow .15s}.btn:hover{box-shadow:0 1px 0 rgba(255,255,255,.25) inset,0 12px 24px -6px rgba(90,70,214,.6)}
:root[data-theme=dark] .btn,:root:not([data-theme=light]) .btn{color:#17131f}
.btn:active{transform:scale(.97)}.btn.s{background:var(--sf);color:var(--tx);border:1px solid var(--ln);box-shadow:0 1px 2px rgba(23,21,28,.05)}.btn.d{background:var(--er);color:#fff;box-shadow:none}.btn.g{background:none;color:var(--mt);box-shadow:none}
.ib{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;color:var(--mt)}.ib:hover{background:var(--sf2);color:var(--tx)}
input,select,textarea{width:100%;padding:12px 14px;border-radius:12px;border:1px solid var(--ln);background:var(--sf)}
label{display:block;font-size:13px;font-weight:600;margin:14px 0 6px}
.err{color:var(--er);font-size:12px;margin-top:4px}
.card{background:var(--sf);border:1px solid var(--ln);border-radius:var(--r);box-shadow:var(--sh)}
#app{display:flex;height:100%}
#side{width:248px;border-right:1px solid var(--ln);padding:24px 14px;display:flex;flex-direction:column;gap:4px;transition:width .25s;background:var(--bg);flex:none}
#side.c{width:72px}#side.c .lb{display:none}
.logo{font:500 24px Fraunces,serif;padding:6px 10px 18px;display:flex;align-items:center;gap:10px}
.nav{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;color:var(--mt);font-weight:600;width:100%;text-align:left}
.nav:hover{background:var(--sf2)}.nav.on{background:var(--ac2);color:var(--ac)}
#main{flex:1;min-width:0;overflow-y:auto;position:relative}
.pg{max-width:1040px;margin:0 auto;padding:28px 28px 90px;animation:in .35s ease}
@keyframes in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px}
#bn{display:none}
.av{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:13px;color:#fff;border:2px solid var(--bg);flex:none}
.av.a{background:#6d5bd0}.av.b{background:#c07a5a;margin-left:-10px}
.grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.mc{border-radius:var(--r);overflow:hidden;position:relative;cursor:pointer;background:var(--sf);border:1px solid var(--ln);text-align:left;transition:transform .2s,box-shadow .2s}
.mc{border-color:transparent;box-shadow:0 1px 2px rgba(23,21,28,.06)}.mc:hover{transform:translateY(-4px);box-shadow:0 18px 36px -12px rgba(60,40,140,.25)}.art{border-radius:var(--r) var(--r) 0 0}.chip{box-shadow:0 1px 2px rgba(23,21,28,.04)}.nav.on{box-shadow:inset 0 0 0 1px rgba(90,70,214,.15)}
.art{aspect-ratio:4/3;position:relative;display:grid;place-items:center;overflow:hidden}
.art svg.sc{position:absolute;inset:0;width:100%;height:100%}
.art.t3{aspect-ratio:3/4}.art.t1{aspect-ratio:1}
.pl{position:relative;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.85);display:grid;place-items:center;color:#222}
.mi{padding:10px 12px}.mi b{display:block;font-size:14px}
.wf{display:flex;align-items:center;gap:3px;height:44px}.wf i{width:3px;border-radius:2px;background:var(--ac);opacity:.35}.wf i.p{opacity:1}
.play .wf i{animation:wv .9s ease-in-out infinite alternate}@keyframes wv{to{transform:scaleY(.4)}}
.note{padding:16px;background:var(--ac2);min-height:130px;display:flex;flex-direction:column;gap:6px}
.note p{font:400 16px/1.5 Fraunces,serif;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px}
.chip{padding:8px 14px;border-radius:99px;border:1px solid var(--ln);background:var(--sf);font-weight:600;font-size:13px;white-space:nowrap}.chip.on{background:var(--tx);color:var(--bg);border-color:var(--tx)}
.dsep{font:500 20px Fraunces,serif;margin:26px 0 12px;display:flex;align-items:baseline;gap:10px}.dsep span{font:500 13px Manrope;color:var(--mt)}
.hero{border-radius:28px;padding:36px;background:radial-gradient(120% 140% at 100% 0,#e4defc 0,rgba(228,222,252,0) 55%),radial-gradient(90% 100% at 0 100%,#fdeee3 0,rgba(253,238,227,0) 60%),#fff;border:1px solid var(--ln);box-shadow:var(--sh);display:grid;gap:22px}
.stats{display:flex;gap:26px;flex-wrap:wrap}.stats b{font:500 28px Fraunces,serif;display:block}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center}
.cal .h{font-size:12px;color:var(--mt);padding:6px 0}
.day{aspect-ratio:1;border-radius:12px;position:relative;font-weight:600;transition:background .15s}.day:hover{background:var(--sf2)}
.day.has::after{content:"";position:absolute;bottom:6px;left:50%;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--ac)}
.day.td{border:1px solid var(--ac)}.day.sel{background:var(--ac);color:#fff;animation:pop .25s}.day.sel::after{background:#fff}.day.o{opacity:.25;pointer-events:none}
@keyframes pop{50%{transform:scale(1.12)}}
.split{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:24px}
.ov{position:fixed;inset:0;background:rgba(15,12,20,.55);display:grid;place-items:center;z-index:50;animation:fd .2s;padding:16px}
@keyframes fd{from{opacity:0}}
.md{background:var(--sf);border-radius:20px;width:min(520px,100%);max-height:92vh;overflow:auto;padding:24px;animation:in .25s;box-shadow:var(--sh)}
.vw{background:#0d0b11;color:#fff;place-items:stretch;padding:0}
.vw .in{display:flex;flex-direction:column;height:100%;padding:max(14px,env(safe-area-inset-top)) 16px max(14px,env(safe-area-inset-bottom))}
.vw .stg{flex:1;display:grid;place-items:center;min-height:0;position:relative}
.vw .stg .art{width:min(760px,100%);max-height:62vh;border-radius:14px}
.vw .ib{color:#ddd}.vw .ib:hover{background:#ffffff1f;color:#fff}
.bar{height:5px;border-radius:3px;background:#ffffff33;overflow:hidden}.bar i{display:block;height:100%;background:#fff;width:0}
.tabs{display:flex;gap:6px;overflow-x:auto;margin-bottom:20px;border-bottom:1px solid var(--ln)}
.tab{padding:10px 14px;font-weight:600;color:var(--mt);border-bottom:2px solid transparent;white-space:nowrap}.tab.on{color:var(--ac);border-color:var(--ac)}
.row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 0;border-bottom:1px solid var(--ln)}.row:last-child{border:0}
.tg{width:44px;height:26px;border-radius:99px;background:var(--ln);position:relative;transition:background .2s;flex:none}.tg::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:transform .2s}.tg[aria-checked=true]{background:var(--ac)}.tg[aria-checked=true]::after{transform:translateX(18px)}
#toasts{position:fixed;bottom:84px;left:50%;transform:translateX(-50%);display:grid;gap:8px;z-index:90;width:max-content;max-width:92vw}
.toast{background:var(--tx);color:var(--bg);padding:11px 16px;border-radius:12px;font-weight:600;font-size:14px;animation:in .25s}
.drop{border:1.5px dashed var(--ln);border-radius:16px;padding:28px;text-align:center;background:var(--sf2);cursor:pointer}.drop.h{border-color:var(--ac);background:var(--ac2)}
.sk{background:linear-gradient(90deg,var(--sf2),var(--ln),var(--sf2));background-size:200% 100%;animation:sh 1.2s infinite;border-radius:var(--r);aspect-ratio:4/3}@keyframes sh{to{background-position:-200% 0}}
.empty{text-align:center;padding:50px 20px;color:var(--mt)}.empty h3{color:var(--tx);margin:12px 0 4px}
.full{min-height:100%;display:grid;place-items:center;padding:24px}.fb{width:min(420px,100%);animation:in .4s}
.code{font:700 26px/1 Manrope;letter-spacing:.2em;padding:16px;border-radius:14px;background:var(--sf2);text-align:center}
.ban{background:var(--ac2);color:var(--ac);padding:8px 14px;font-size:13px;font-weight:600;text-align:center}
.ban[hidden]{display:none}
.ban .btn{margin-left:8px}
@media(max-width:760px){#side{display:none}.pg{padding:18px 16px 110px}.split{grid-template-columns:1fr}.grid{grid-template-columns:repeat(2,1fr)}
#bn{display:flex;position:fixed;bottom:0;left:0;right:0;background:var(--bg);border-top:1px solid var(--ln);padding:6px 6px calc(6px + env(safe-area-inset-bottom,0px));z-index:40;justify-content:space-around}
#bn .nav{flex-direction:column;gap:2px;font-size:11px;padding:6px 10px;width:auto;border-radius:10px}#toasts{bottom:96px}.hero{padding:22px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
a.logo,a.nav,a.tab,a.chip,a.btn,a.day{text-decoration:none}a.logo,a.day,a.chip{color:inherit}a.day{display:grid;place-items:center}a.day.sel{color:#fff}
button.mc{width:100%;padding:0;border:0;font:inherit;color:inherit;background:var(--sf)}
.art img{width:100%;height:100%;object-fit:cover}
.art .pl{position:absolute}
.bdg{margin-left:auto;min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:var(--ac);color:#fff;font:700 11px/18px Manrope;display:inline-grid;place-items:center}
.bdg[hidden]{display:none}
#side.c .bdg{min-width:8px;width:8px;height:8px;padding:0;color:transparent;overflow:hidden}
#bn .nav{position:relative}#bn .bdg{position:absolute;top:0;right:6px;margin:0}