html,body{margin:0;padding:0;height:100%;overflow:hidden}.app-container{display:flex;height:100vh;width:100vw;overflow:hidden}.sidebar{background-color:#1f2937;color:#fff;padding:20px;width:200px;display:flex;flex-direction:column;height:100vh;position:fixed;top:0;left:0;z-index:30;transition:transform .3s ease-in-out}.sidebar-hidden{transform:translate(-100%)}.sidebar-visible{transform:translate(0)}.nav-links,.auth-links{list-style-type:none;padding-left:0}.nav-links li,.auth-links li{color:#fff}.nav-links li a,.auth-links li a{color:#fff;text-decoration:none}.nav-links li a:hover,.auth-links li a:hover{text-decoration:underline}.main-content{width:100%;flex:1;padding:40px 60px;background-color:transparent;overflow-y:auto;display:flex;flex-direction:column;align-items:center;box-sizing:border-box;margin-left:200px}@media (max-width: 767px){.main-content{margin-left:0;padding:20px 20px 120px;min-height:calc(100vh + 120px)}html,body{height:auto;min-height:100vh;overflow-x:hidden;overflow-y:auto}}.page-title{text-align:center;margin-bottom:30px;font-size:2rem;color:#1f2937}.journal-entry{width:100%;max-width:800px;display:flex;flex-direction:column;align-items:center}.journal-entry textarea{width:100%;min-height:250px;padding:25px;font-size:1.1em;border:1px solid #ccc;border-radius:8px;margin-bottom:30px;resize:none;flex:auto}.journal-entry{max-width:800px;margin:auto;padding:2rem;text-align:center}textarea{width:100%;height:150px;padding:10px;font-size:1rem;margin-top:1rem;border-radius:5px;border:1px solid #ccc;background-color:#fff0;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.options{display:flex;justify-content:center;gap:10px;margin:1rem 0}.options button{padding:10px 16px;border:2px solid #ccc;background-color:#fff;border-radius:8px;cursor:pointer;font-weight:700;transition:.2s ease;justify-content:center}.options button:hover{border-color:#1f2937}.options button.active{background-color:#1f2937;color:#fff;border-color:#1f2937}.submit-button{margin-top:1rem;margin-right:1rem;padding:10px 24px;font-size:1rem;background-color:#1f2937;color:#fff;border:none;border-radius:8px;cursor:pointer;justify-content:center}.flash-popup{display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#1f2937;color:#fff;padding:1rem 2rem;border-radius:8px;box-shadow:0 4px 8px #0003;width:80%;max-width:400px;margin:20px auto;text-align:center;z-index:1000}.flash-popup p{margin:0 0 4px}.previous-entries{max-width:600px;width:100%;margin:1rem auto;padding:1rem;border:1px solid transparent;border-radius:12px;background-color:transparent;word-wrap:break-word;overflow-wrap:break-word}h1{color:#1f2937;text-align:center;margin-bottom:30px;font-size:3rem;font-weight:700;letter-spacing:2px}.entry{border:1px solid #ccc;padding:15px;margin:10px 0;border-radius:5px;background-color:#fff0;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);flex:auto}.entry h3{margin-top:0}.entry p{margin:5px 0}.background-selection{display:flex;justify-content:center;gap:20px;flex-wrap:wrap}.background-option img{width:50px;height:50px;object-fit:cover;border-radius:6px;transition:transform .3s ease;border:1px solid #ccc}.background-option img:hover{transform:scale(1.1)}.background-preview{margin-top:20px;padding:20px;background-size:cover;background-position:center;height:300px;border-radius:8px}.background-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(50px,1fr));gap:10px;max-width:300px;margin:auto}.background-thumbnail{width:50px;height:50px;object-fit:cover;border-radius:4px;cursor:pointer;border:1px solid #ccc;transition:transform .2s ease}.background-thumbnail:hover{transform:scale(1.1)}.background-cloudy{background-image:url(/CustomBackgrounds/Cloudy.png);background-size:cover;background-position:center;background-repeat:no-repeat}.background-pink-water{background-image:url(/CustomBackgrounds/PinkWater.png);background-size:cover;background-position:center;background-repeat:no-repeat}.background-stary-whale{background-image:url(/CustomBackgrounds/StaryWhale.png);background-size:cover;background-position:center;background-repeat:no-repeat}.sidebar-logo{width:100px;height:100px;object-fit:contain}
