*{box-sizing:border-box}html,body,#root{width:100%;min-height:100%;margin:0}body{background:#05080c;font-family:Georgia,Times New Roman,serif}.app{width:100%;min-height:100vh;position:relative}.app:before{content:"";z-index:0;pointer-events:none;background-image:url(/assets/hogwarts-D5diDerc.png);background-position:50%;background-repeat:no-repeat;background-size:cover;position:fixed;inset:0}.background-overlay{pointer-events:none;z-index:1;background:radial-gradient(circle at 75% 20%,#c997db17,#0000 40%),radial-gradient(circle at 30% 75%,#ffc0dc0a,#0000 35%),linear-gradient(90deg,#03060b80 0%,#05070d4d 45%,#03060b3d 100%);position:fixed;inset:0}.layout{z-index:2;grid-template-columns:560px minmax(0,1fr);gap:24px;width:100%;min-height:100vh;padding:44px 56px;display:grid;position:relative}.day-list{flex-direction:column;gap:12px;width:100%;height:auto;padding-right:2px;display:flex;overflow:visible}.day-button{-webkit-backdrop-filter:blur(4px);color:#f2ddae;cursor:pointer;background:linear-gradient(120deg,#2a1e2b85,#0f121b61);border:1px solid #e7c2757a;border-radius:18px;flex-shrink:0;grid-template-columns:95px 1fr 50px;align-items:center;width:100%;height:100px;padding:0 18px 0 34px;font-family:Georgia,Times New Roman,serif;transition:border-color .18s,transform .18s,background .18s,box-shadow .18s,opacity .18s;display:grid;box-shadow:inset 0 0 24px #e8bdff09,0 5px 20px #0000002e}.day-button:hover:not(:disabled){background:linear-gradient(120deg,#4a2b4694,#17182670);border-color:#f5d38ce0;transform:translateY(-2px);box-shadow:0 0 18px #e1b5ff26,0 0 30px #ffc9e714,inset 0 0 25px #ffdcf50d}.day-button.selected{background:linear-gradient(120deg,#4e2d489e,#19192878);border-color:#f6d281f5;box-shadow:0 0 16px #ffd3ec26,0 0 36px #c29dff1c,inset 0 0 28px #ffe2f40d}.day-button.locked{opacity:.3;cursor:default}.day-button.locked:hover{transform:none}.sidebar-letter{color:#e8c978;text-shadow:0 0 8px #f4d18933,0 2px 3px #000000b3;justify-self:center;font-size:52px;font-weight:600;line-height:1}.sidebar-date{letter-spacing:.5px;color:#f0dfbd;text-align:left;text-shadow:0 2px 4px #0000008c;font-size:27px;font-weight:600}.sidebar-icon{color:#e4bd6b;text-shadow:0 0 9px #ffd5893d,0 0 16px #dab1ff24;justify-self:center;font-size:39px;font-weight:300;line-height:1}.content{align-items:flex-start;width:100%;min-width:0;display:flex}.message-card{color:#2c1b0d;-webkit-backdrop-filter:blur(8px);background:linear-gradient(120deg,#eddaadf2,#d6b87ceb);border:1px solid #e0bc75d9;border-radius:16px;width:100%;min-height:196px;padding:30px 60px 38px;position:sticky;top:44px;box-shadow:0 15px 38px #00000047,0 0 24px #e1b6ff14,inset 0 0 34px #fff4cd21}.message-date{letter-spacing:6px;text-transform:uppercase;color:#402d148c;margin-bottom:5px;margin-left:137px;font-size:17px}.message{white-space:pre-line;color:#2b1b0d;margin:0;font-size:25px;font-weight:500;line-height:1.65}.drop-cap{float:left;color:#76511b;text-shadow:0 1px #ffffff2e,0 0 10px #ab6fc214;margin-top:4px;margin-bottom:2px;margin-right:20px;font-size:109px;font-weight:500;line-height:.78}@media (width<=1100px){.layout{grid-template-columns:390px minmax(0,1fr);padding:30px}.day-button{grid-template-columns:75px 1fr 40px;height:90px;padding-left:18px}.sidebar-letter{font-size:45px}.sidebar-date{font-size:23px}.message-card{padding:28px 40px 36px;top:30px}.message-date{margin-left:118px}.drop-cap{font-size:94px}.message{font-size:22px}}@media (width<=760px){.app:before{background-position:50%}.background-overlay{background:radial-gradient(circle at 70% 20%,#c997db1a,#0000 42%),linear-gradient(#03060b57,#04060b70)}.layout{flex-direction:column;gap:20px;width:100%;min-height:100vh;padding:18px 12px 35px;display:flex}.day-list{gap:9px;width:100%;height:auto;padding-right:0;overflow:visible}.day-button{-webkit-backdrop-filter:blur(3px);background:linear-gradient(120deg,#2f20307a,#0e111a57);border-radius:16px;grid-template-columns:70px 1fr 38px;height:82px;padding:0 14px}.sidebar-letter{font-size:41px}.sidebar-date{font-size:22px}.sidebar-icon{font-size:31px}.content{width:100%}.message-card{border-radius:16px;min-height:190px;padding:24px 24px 30px;position:relative;top:auto}.message-date{letter-spacing:4px;margin-bottom:18px;margin-left:0;font-size:13px}.message{font-size:20px;line-height:1.6}.drop-cap{margin-top:5px;margin-right:12px;font-size:79px}}