@import "https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap";
:root{--bg-primary:#003;--bg-secondary:#006;--bg-card:#306;--bg-card-hover:#408;--bg-input:#103;--bg-glass:#205;--hot-pink:#f0c;--neon-pink:#ff69b4;--electric-blue:#0cf;--lime-green:#0f0;--neon-yellow:#ff0;--neon-orange:#f60;--cyber-purple:#c0f;--bright-red:red;--aqua:#0fc;--text-primary:#fff;--text-secondary:#0cf;--text-muted:#99c;--text-accent:#ff69b4;--border-subtle:#63c;--border-active:#f0c;--shadow-glow:0 0 10px #f0c,0 0 20px #f0c,0 0 40px #f0c;--shadow-blue-glow:0 0 10px #0cf,0 0 20px #0cf;--shadow-card:4px 4px 0px #000;--shadow-lg:6px 6px 0px #000;--radius-sm:0px;--radius-md:0px;--radius-lg:0px;--radius-xl:0px;--radius-full:0px;--transition-fast:.1s;--transition-base:.2s;--transition-slow:.3s}*{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--bg-primary);height:100%;color:var(--text-primary);cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Ctext x='0' y='16' font-size='16'%3E💖%3C/text%3E%3C/svg%3E"),auto;background-image:radial-gradient(circle at 20% 80%,#ff00cc14 0%,#0000 50%),radial-gradient(circle at 80% 20%,#00ccff14 0%,#0000 50%),url("data:image/svg+xml,%3Csvg width='40' height='40' xmlns='http://www.w3.org/2000/svg'%3E%3Ctext x='12' y='28' font-size='16' fill='%23ffffff08'%3E✦%3C/text%3E%3C/svg%3E");font-family:Comic Sans MS,Comic Sans,Chalkboard SE,cursive}body:before{content:"";pointer-events:none;z-index:0;background-image:radial-gradient(1px 1px at 10% 15%,#fff 50%,#0000 100%),radial-gradient(1px 1px at 25% 45%,#fff 50%,#0000 100%),radial-gradient(1px 1px at 40% 25%,#ff69b4 50%,#0000 100%),radial-gradient(1px 1px at 55% 65%,#fff 50%,#0000 100%),radial-gradient(1px 1px at 70% 35%,#0cf 50%,#0000 100%),radial-gradient(1px 1px at 85% 75%,#fff 50%,#0000 100%),radial-gradient(1px 1px at 15% 85%,#ff69b4 50%,#0000 100%),radial-gradient(1px 1px at 50% 10%,#fff 50%,#0000 100%),radial-gradient(1px 1px at 90%,#0cf 50%,#0000 100%),radial-gradient(1px 1px at 33% 90%,#fff 50%,#0000 100%),radial-gradient(2px 2px at 5%,#ff0 50%,#0000 100%),radial-gradient(2px 2px at 60% 5%,#f0c 50%,#0000 100%),radial-gradient(2px 2px at 95% 90%,#0f0 50%,#0000 100%);animation:4s ease-in-out infinite alternate twinkle;position:fixed;inset:0}@keyframes twinkle{0%{opacity:.6}to{opacity:1}}@keyframes rainbow{0%{color:red}16%{color:#f60}33%{color:#ff0}50%{color:#0f0}66%{color:#0cf}83%{color:#c0f}to{color:red}}@keyframes blink{0%,49%{opacity:1}50%,to{opacity:0}}@keyframes sparkle-rotate{0%{transform:rotate(0)scale(1)}25%{transform:rotate(90deg)scale(1.3)}50%{transform:rotate(180deg)scale(1)}75%{transform:rotate(270deg)scale(1.3)}to{transform:rotate(360deg)scale(1)}}h1,h2,h3,h4{letter-spacing:1px;text-shadow:2px 2px #000,0 0 10px;font-family:"Press Start 2P",Comic Sans MS,cursive}a{color:var(--electric-blue);text-decoration:underline}a:hover{color:var(--hot-pink);text-shadow:0 0 10px var(--hot-pink)}a:visited{color:var(--cyber-purple)}::selection{background:var(--hot-pink);color:var(--neon-yellow)}.app-layout{z-index:1;min-height:100vh;display:flex;position:relative}.main-content{flex:1;max-width:900px;margin-left:260px;padding:32px 40px}@media (max-width:768px){.main-content{margin-left:0;padding:80px 16px 32px}}.sidebar{border-right:3px solid var(--hot-pink);z-index:100;background:linear-gradient(#006,#306,#003);flex-direction:column;width:260px;height:100vh;padding:16px 12px;transition:transform .3s;display:flex;position:fixed;top:0;left:0;overflow-y:auto;box-shadow:3px 0 20px #ff00cc4d}.sidebar-brand{border:2px dashed var(--neon-yellow);text-align:center;background:#0000004d;justify-content:center;align-items:center;gap:10px;margin-bottom:8px;padding:12px;display:flex}.sidebar-brand-icon{font-size:24px;animation:2s linear infinite sparkle-rotate}.sidebar-brand-text{color:var(--hot-pink);text-shadow:0 0 10px var(--hot-pink),2px 2px 0 #000;font-family:"Press Start 2P",cursive;font-size:11px;animation:3s linear infinite rainbow}.sidebar-nav{flex-direction:column;flex:1;gap:4px;display:flex}.sidebar-link{color:var(--electric-blue);cursor:pointer;text-align:left;background:0 0;border:2px solid #0000;align-items:center;gap:10px;width:100%;padding:10px 14px;font-family:Comic Sans MS,cursive;font-size:13px;font-weight:700;text-decoration:none;transition:all .1s;display:flex}.sidebar-link:hover{color:var(--neon-yellow);border-color:var(--hot-pink);text-shadow:0 0 8px var(--neon-yellow);background:#f0c3}.sidebar-link.active{color:var(--neon-yellow);border:2px solid var(--hot-pink);text-shadow:0 0 10px var(--neon-yellow);background:#ff00cc4d;box-shadow:inset 0 0 10px #ff00cc4d,0 0 10px #f0c3}.sidebar-link svg{flex-shrink:0;width:18px;height:18px}.sidebar-footer{border-top:2px dashed var(--cyber-purple);margin-top:8px;padding-top:12px}.sidebar-user{align-items:center;gap:10px;padding:10px;display:flex}.sidebar-avatar{background:linear-gradient(135deg,var(--hot-pink),var(--cyber-purple));color:#fff;border:2px solid var(--neon-yellow);width:36px;height:36px;box-shadow:var(--shadow-card);justify-content:center;align-items:center;font-size:14px;font-weight:700;display:flex}.sidebar-user-name{color:var(--neon-pink);font-size:12px;font-weight:700}.sidebar-user-email{color:var(--text-muted);font-size:10px}.mobile-header{border-bottom:3px solid var(--hot-pink);z-index:200;background:linear-gradient(90deg,#006,#306);align-items:center;height:60px;padding:0 16px;display:none;position:fixed;top:0;left:0;right:0}.mobile-menu-btn{border:2px solid var(--electric-blue);color:var(--electric-blue);cursor:pointer;background:0 0;padding:6px 10px}.mobile-brand{color:var(--hot-pink);margin-left:12px;font-family:"Press Start 2P",cursive;font-size:12px;animation:3s linear infinite rainbow}.sidebar-overlay{z-index:99;background:#003c;display:none;position:fixed;inset:0}@media (max-width:768px){.mobile-header{display:flex}.sidebar{transform:translate(-100%)}.sidebar.open{transform:translate(0)}.sidebar-overlay.open{display:block}}.card{border:2px solid var(--border-subtle);box-shadow:var(--shadow-card);background:linear-gradient(135deg,#205,#306);padding:20px;transition:all .15s}.card:hover{border-color:var(--hot-pink);box-shadow:var(--shadow-glow),var(--shadow-card)}.btn{cursor:pointer;text-transform:uppercase;border:3px outset #96c;justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-family:Comic Sans MS,cursive;font-size:13px;font-weight:700;transition:all .1s;display:inline-flex}.btn-primary{color:#fff;text-shadow:1px 1px #603;background:linear-gradient(#f6c,#c09);border-color:#f9d}.btn-primary:hover{box-shadow:0 0 15px var(--hot-pink);background:linear-gradient(#f9d,#f0c)}.btn-primary:active{border-style:inset}.btn-ghost{color:var(--electric-blue);background:linear-gradient(#338,#226);border-color:#44a}.btn-ghost:hover{color:var(--neon-yellow);background:linear-gradient(#44a,#338);box-shadow:0 0 10px #00ccff4d}.btn-icon{color:var(--electric-blue);cursor:pointer;background:0 0;border:2px solid #0000;justify-content:center;align-items:center;padding:6px;transition:all .1s;display:inline-flex}.btn-icon:hover{color:var(--hot-pink);border-color:var(--hot-pink);background:#f0c3}.btn-icon.liked{color:var(--bright-red);text-shadow:0 0 10px var(--bright-red)}.btn-sm{padding:6px 12px;font-size:11px}.input,.textarea{width:100%;color:var(--lime-green);background:#102;border:2px inset #63c;outline:none;padding:10px 14px;font-family:Comic Sans MS,cursive;font-size:14px}.input:focus,.textarea:focus{border-color:var(--hot-pink);color:var(--neon-yellow);box-shadow:0 0 10px #f0c6}.input::placeholder,.textarea::placeholder{color:#669;font-style:italic}.textarea{resize:vertical;min-height:80px}.post-card{border:2px solid var(--border-subtle);box-shadow:var(--shadow-card);background:linear-gradient(135deg,#1a0044,#2a0066);padding:0;transition:all .15s;overflow:hidden}.post-card:hover{border-color:var(--hot-pink);box-shadow:0 0 15px #ff00cc4d}.post-header{align-items:center;gap:12px;padding:16px 20px 0;display:flex}.post-avatar{background:linear-gradient(135deg,var(--hot-pink),var(--electric-blue));color:#fff;border:2px solid var(--neon-yellow);flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;font-size:16px;font-weight:700;display:flex;box-shadow:2px 2px #000}.post-author{color:var(--hot-pink);text-shadow:0 0 5px #ff00cc80;font-size:14px;font-weight:700}.post-time{color:var(--text-muted);font-size:11px}.post-content{color:var(--text-primary);padding:14px 20px;font-size:15px;line-height:1.6}.post-image{object-fit:cover;border-top:2px solid var(--border-subtle);border-bottom:2px solid var(--border-subtle);width:100%;max-height:500px}.post-actions{border-top:2px dashed var(--border-subtle);background:#0003;align-items:center;gap:12px;padding:10px 20px;display:flex}.post-action-btn{color:var(--electric-blue);cursor:pointer;background:0 0;border:none;align-items:center;gap:6px;padding:6px 10px;font-family:Comic Sans MS,cursive;font-size:13px;font-weight:700;transition:all .1s;display:inline-flex}.post-action-btn:hover{color:var(--neon-yellow);text-shadow:0 0 8px var(--neon-yellow)}.post-action-btn.liked{color:var(--bright-red);text-shadow:0 0 10px var(--bright-red);animation:1s step-end infinite blink}.post-action-btn.liked svg{fill:var(--bright-red)}.comments-section{border-top:1px dashed var(--border-subtle);padding:0 20px 16px}.comment-item{border-bottom:1px dotted #336;gap:10px;padding:8px 0;display:flex}.comment-avatar{background:linear-gradient(135deg,var(--cyber-purple),var(--electric-blue));color:#fff;border:1px solid var(--neon-yellow);flex-shrink:0;justify-content:center;align-items:center;width:26px;height:26px;font-size:10px;font-weight:700;display:flex}.comment-body{flex:1}.comment-author{color:var(--neon-pink);margin-right:8px;font-size:12px;font-weight:700}.comment-text{color:var(--electric-blue);font-size:12px;line-height:1.4}.comment-time{color:var(--text-muted);margin-top:2px;font-size:10px}.comment-input-row{gap:8px;margin-top:8px;display:flex}.comment-input-row .input{flex:1;padding:8px 10px;font-size:12px}.create-post{border:3px double var(--hot-pink);box-shadow:var(--shadow-card);background:linear-gradient(135deg,#1a0044,#2a0066);margin-bottom:24px;padding:20px;position:relative}.create-post:before{content:"✧ new post ✧";background:var(--bg-primary);color:var(--neon-yellow);text-transform:uppercase;padding:0 8px;font-family:"Press Start 2P",cursive;font-size:10px;position:absolute;top:-10px;left:16px}.create-post-header{align-items:center;gap:12px;margin-bottom:12px;display:flex}.create-post-actions{justify-content:space-between;align-items:center;margin-top:12px;display:flex}.image-preview{margin-top:12px;display:inline-block;position:relative}.image-preview img{border:3px solid var(--cyber-purple);max-height:200px}.image-preview-remove{background:var(--bright-red);color:#fff;cursor:pointer;border:2px outset #f66;justify-content:center;align-items:center;width:24px;height:24px;font-size:12px;display:flex;position:absolute;top:4px;right:4px}.page-header{margin-bottom:24px}.page-title{color:var(--neon-yellow);text-shadow:2px 2px 0px #000,0 0 20px var(--neon-yellow),0 0 40px var(--hot-pink);margin-bottom:8px;font-family:"Press Start 2P",cursive;font-size:16px;line-height:1.6}.page-subtitle{color:var(--neon-pink);font-family:Comic Sans MS,cursive;font-size:13px;font-style:italic}.calendar-grid{border:3px solid var(--cyber-purple);background:#102;grid-template-columns:repeat(7,1fr);gap:2px;display:grid}.calendar-header-cell{text-align:center;color:var(--neon-yellow);text-transform:uppercase;letter-spacing:.1em;background:linear-gradient(#408,#306);border:1px solid #63c;padding:10px 6px;font-family:"Press Start 2P",cursive;font-size:10px;font-weight:700}.calendar-cell{cursor:pointer;background:#0a0022;border:1px solid #225;min-height:90px;padding:6px;transition:background .1s;position:relative}.calendar-cell:hover{border-color:var(--hot-pink);background:#ff00cc1a}.calendar-cell.today{border:2px solid var(--hot-pink);background:#ff00cc26;box-shadow:inset 0 0 15px #f0c3}.calendar-cell.other-month{opacity:.3}.calendar-day-number{color:var(--electric-blue);margin-bottom:4px;font-size:12px;font-weight:700}.calendar-cell.today .calendar-day-number{color:var(--neon-yellow);text-shadow:0 0 8px var(--neon-yellow);font-weight:700}.calendar-event-dot{color:#fff;text-overflow:ellipsis;white-space:nowrap;border:1px solid #ffffff4d;max-width:100%;margin-bottom:2px;padding:2px 5px;font-size:9px;font-weight:700;display:inline-block;overflow:hidden}.calendar-nav{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.calendar-month-title{color:var(--hot-pink);text-shadow:0 0 10px var(--hot-pink);font-size:14px;font-weight:700}.letter-envelope{border:2px solid var(--border-subtle);cursor:pointer;box-shadow:var(--shadow-card);background:linear-gradient(135deg,#204,#1a0033);padding:20px;transition:all .15s;position:relative;overflow:hidden}.letter-envelope:before{content:"💌";opacity:.1;font-size:60px;position:absolute;top:-20px;right:-20px;transform:rotate(15deg)}.letter-envelope:hover{border-color:var(--hot-pink);box-shadow:var(--shadow-glow);transform:translate(-2px,-2px)}.letter-unread{border-color:var(--neon-yellow);animation:2s step-end infinite blink}.letter-unread:after{content:"✧ NEW ✧";color:var(--neon-yellow);text-shadow:0 0 10px var(--neon-yellow);font-family:"Press Start 2P",cursive;font-size:9px;animation:1s step-end infinite blink;position:absolute;top:8px;right:8px}.letter-from{color:var(--text-muted);margin-bottom:6px;font-size:11px}.letter-title{color:var(--hot-pink);text-shadow:0 0 5px #ff00cc4d;margin-bottom:6px;font-family:Comic Sans MS,cursive;font-size:16px;font-weight:700}.letter-preview{color:var(--electric-blue);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:12px;line-height:1.5;display:-webkit-box;overflow:hidden}.letter-date{color:var(--text-muted);margin-top:10px;font-size:10px}.letter-full{border:3px double var(--hot-pink);max-width:700px;box-shadow:var(--shadow-lg);background:linear-gradient(135deg,#1a0044,#205);margin:0 auto;padding:32px;position:relative}.letter-full:before{content:"♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥";text-align:center;color:var(--hot-pink);letter-spacing:4px;opacity:.5;margin-bottom:20px;font-size:10px;display:block}.letter-full:after{content:"♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥ ♥";text-align:center;color:var(--hot-pink);letter-spacing:4px;opacity:.5;margin-top:20px;font-size:10px;display:block}.letter-full-title{color:var(--neon-yellow);text-shadow:0 0 10px var(--neon-yellow),2px 2px 0 #000;margin-bottom:8px;font-size:18px}.letter-full-from{color:var(--text-muted);margin-bottom:20px;font-size:12px}.letter-full-content{color:var(--neon-pink);white-space:pre-wrap;font-family:Comic Sans MS,cursive;font-size:15px;font-style:italic;line-height:1.8}.gallery-grid{columns:3;column-gap:12px}@media (max-width:768px){.gallery-grid{columns:2}}.gallery-item{break-inside:avoid;cursor:pointer;border:3px solid var(--cyber-purple);box-shadow:var(--shadow-card);margin-bottom:12px;transition:all .15s;position:relative;overflow:hidden}.gallery-item:hover{border-color:var(--hot-pink);box-shadow:var(--shadow-glow);transform:rotate(-1deg)scale(1.02)}.gallery-item img{width:100%;display:block}.gallery-item-overlay{opacity:0;background:linear-gradient(#0000,#000033e6);padding:12px;transition:opacity .2s;position:absolute;bottom:0;left:0;right:0}.gallery-item:hover .gallery-item-overlay{opacity:1}.gallery-caption{color:var(--neon-yellow);font-size:12px;font-weight:700}.lightbox{z-index:1000;background:#000014f2;justify-content:center;align-items:center;padding:40px;display:flex;position:fixed;inset:0}.lightbox img{object-fit:contain;border:4px solid var(--hot-pink);max-width:90%;max-height:85vh;box-shadow:0 0 30px #f0c6}.lightbox-close{background:var(--bright-red);color:#fff;cursor:pointer;border:3px outset #f66;justify-content:center;align-items:center;width:40px;height:40px;font-size:18px;font-weight:700;display:flex;position:absolute;top:16px;right:16px}.lightbox-caption{color:var(--neon-yellow);text-align:center;text-shadow:0 0 10px var(--neon-yellow);font-size:14px;position:absolute;bottom:30px;left:50%;transform:translate(-50%)}.bucket-item{border:2px solid var(--border-subtle);box-shadow:var(--shadow-card);background:linear-gradient(135deg,#1a0044,#205);align-items:flex-start;gap:14px;padding:16px 20px;transition:all .15s;display:flex}.bucket-item:hover{border-color:var(--hot-pink)}.bucket-item.completed{opacity:.5;border-style:dashed}.bucket-checkbox{border:3px inset var(--cyber-purple);cursor:pointer;color:#0000;background:#102;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;margin-top:2px;transition:all .1s;display:flex}.bucket-checkbox:hover{border-color:var(--hot-pink);box-shadow:0 0 10px #f0c6}.bucket-checkbox.checked{background:linear-gradient(135deg,var(--hot-pink),var(--cyber-purple));border:3px outset var(--hot-pink);color:var(--neon-yellow)}.bucket-title{color:var(--electric-blue);font-size:14px;font-weight:700}.bucket-item.completed .bucket-title{color:var(--text-muted);text-decoration:line-through}.bucket-desc{color:var(--neon-pink);margin-top:4px;font-size:12px}.bucket-meta{color:var(--text-muted);margin-top:6px;font-size:10px}.modal-overlay{z-index:500;background:#00001ed9;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modal{border:3px double var(--hot-pink);width:100%;max-width:500px;max-height:90vh;box-shadow:0 0 40px #ff00cc4d,var(--shadow-lg);background:linear-gradient(135deg,#006,#306);padding:28px;overflow-y:auto}.modal-title{color:var(--neon-yellow);text-shadow:0 0 10px var(--neon-yellow);margin-bottom:16px;font-family:"Press Start 2P",cursive;font-size:13px}.modal-actions{justify-content:flex-end;gap:12px;margin-top:20px;display:flex}.form-group{margin-bottom:14px}.form-label{color:var(--neon-pink);text-transform:uppercase;margin-bottom:4px;font-size:12px;font-weight:700;display:block}.login-page{z-index:1;justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex;position:relative}.login-card{border:4px double var(--hot-pink);width:100%;max-width:420px;box-shadow:0 0 40px #ff00cc4d,var(--shadow-lg);text-align:center;background:linear-gradient(135deg,#006,#306);padding:40px 32px;position:relative}.login-card:before{content:"*.·:·.✧ ✦ ✧.·:·.*";color:var(--neon-yellow);text-shadow:0 0 10px var(--neon-yellow);margin-bottom:16px;font-size:14px;animation:3s linear infinite rainbow;display:block}.login-card:after{content:"*.·:·.✧ ✦ ✧.·:·.*";color:var(--neon-yellow);text-shadow:0 0 10px var(--neon-yellow);margin-top:16px;font-size:14px;animation:3s linear infinite rainbow;display:block}.login-heart{margin-bottom:12px;font-size:40px;animation:3s linear infinite sparkle-rotate;display:inline-block}.login-title{color:var(--hot-pink);text-shadow:0 0 20px var(--hot-pink),2px 2px 0 #000;margin-bottom:8px;font-family:"Press Start 2P",cursive;font-size:14px;line-height:1.6}.login-subtitle{color:var(--electric-blue);margin-bottom:24px;font-size:14px;font-style:italic}.login-form{text-align:left;flex-direction:column;gap:14px;display:flex}.login-error{border:2px solid var(--bright-red);color:var(--neon-yellow);background:#f003;padding:8px 12px;font-size:12px;font-weight:700}.empty-state{text-align:center;color:var(--text-muted);border:2px dashed var(--border-subtle);padding:50px 20px}.empty-state-icon{margin-bottom:12px;font-size:40px}.empty-state-title{color:var(--neon-pink);margin-bottom:8px;font-size:14px;font-weight:700}.empty-state-text{max-width:300px;color:var(--electric-blue);margin:0 auto;font-size:13px}.filter-tabs{gap:6px;margin-bottom:20px;display:flex}.filter-tab{cursor:pointer;color:var(--electric-blue);background:linear-gradient(#226,#114);border:2px outset #44a;padding:8px 14px;font-family:Comic Sans MS,cursive;font-size:12px;font-weight:700;transition:all .1s}.filter-tab:hover{color:var(--neon-yellow);background:linear-gradient(#338,#226)}.filter-tab.active{border-color:var(--hot-pink);color:var(--neon-yellow);text-shadow:0 0 8px var(--neon-yellow);background:linear-gradient(#609,#406)}@keyframes confetti-fall{0%{opacity:1;transform:translateY(-100px)rotate(0)}to{opacity:0;transform:translateY(100vh)rotate(720deg)}}.celebration{pointer-events:none;z-index:9999;position:fixed;inset:0}.confetti{width:10px;height:10px;animation:3s forwards confetti-fall;position:absolute}.loading-spinner{border:3px solid var(--border-subtle);border-top-color:var(--hot-pink);border-radius:0;width:18px;height:18px;animation:.6s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.flex-between{justify-content:space-between;align-items:center;display:flex}.gap-sm{gap:8px}.gap-md{gap:16px}.gap-lg{gap:24px}.grid-list{flex-direction:column;gap:14px;display:flex}.letters-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;display:grid}.color-picker-row{gap:8px;display:flex}.color-dot{cursor:pointer;border:3px outset #ffffff4d;width:28px;height:28px;transition:all .1s}.color-dot:hover,.color-dot.selected{border-style:inset;transform:scale(1.2);box-shadow:0 0 10px}::-webkit-scrollbar{width:12px}::-webkit-scrollbar-track{border-left:1px solid var(--border-subtle);background:#102}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--hot-pink),var(--cyber-purple));border:2px outset #96c}::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,var(--neon-yellow),var(--hot-pink))}.y2k-marquee{border:2px solid var(--cyber-purple);background:linear-gradient(90deg,#003,#306,#003);margin-bottom:20px;padding:8px 0;font-family:"Press Start 2P",cursive;font-size:10px;overflow:hidden}.y2k-marquee-text{white-space:nowrap;color:var(--neon-yellow);text-shadow:0 0 8px var(--neon-yellow);animation:20s linear infinite marquee;display:inline-block}@keyframes marquee{0%{transform:translate(100%)}to{transform:translate(-100%)}}.visitor-counter{text-align:center;border:2px inset var(--border-subtle);color:var(--lime-green);background:#001;margin-top:12px;padding:12px;font-size:10px}.visitor-counter span{color:var(--neon-yellow);text-shadow:0 0 5px var(--neon-yellow);font-family:"Press Start 2P",cursive;font-size:12px}.under-construction{background:repeating-linear-gradient(45deg,#ff0,#ff0 10px,#000 10px 20px);margin-bottom:16px;padding:4px}.under-construction-inner{text-align:center;color:var(--neon-yellow);background:#003;justify-content:center;align-items:center;gap:10px;padding:8px 16px;font-family:"Press Start 2P",cursive;font-size:9px;display:flex}.under-construction-inner span{animation:1s step-end infinite blink}@media (max-width:768px){.main-content{max-width:100%;margin-left:0;padding:72px 12px 24px}.page-title{font-size:12px;line-height:1.8}.page-subtitle{font-size:12px}.page-header{margin-bottom:16px}.flex-between{flex-wrap:wrap;gap:12px}.btn{min-height:44px;padding:12px 18px;font-size:12px}.btn-sm{min-height:40px;padding:10px 14px;font-size:11px}.btn-icon{min-width:40px;min-height:40px;padding:10px}.input,.textarea{padding:12px 14px;font-size:16px}.card{padding:14px}.create-post{margin-bottom:16px;padding:16px}.create-post:before{font-size:8px;top:-8px}.create-post-actions{flex-wrap:wrap;gap:8px}.post-header{padding:12px 14px 0}.post-content{padding:10px 14px;font-size:14px}.post-actions{gap:8px;padding:10px 14px}.post-action-btn{padding:8px 12px;font-size:12px}.post-avatar{width:34px;height:34px;font-size:14px}.comments-section{padding:0 14px 14px}.comment-input-row{flex-direction:column;gap:8px}.comment-input-row .btn{width:100%}.image-preview img{max-width:100%;max-height:150px}.calendar-grid{border-width:2px;gap:1px}.calendar-header-cell{letter-spacing:0;padding:6px 2px;font-size:7px}.calendar-cell{min-height:52px;padding:3px}.calendar-day-number{font-size:10px}.calendar-event-dot{padding:1px 3px;font-size:7px}.calendar-nav{margin-bottom:12px}.calendar-month-title{font-size:11px}.letters-grid{grid-template-columns:1fr}.letter-envelope{padding:14px}.letter-title{font-size:14px}.letter-full{padding:20px}.letter-full:before,.letter-full:after{content:"♥ ♥ ♥ ♥ ♥ ♥ ♥";letter-spacing:3px;font-size:8px}.letter-full-title{font-size:14px}.letter-full-content{font-size:13px;line-height:1.7}.gallery-grid{columns:2;column-gap:8px}.gallery-item{border-width:2px;margin-bottom:8px}.gallery-item-overlay{opacity:1;padding:8px}.gallery-caption{font-size:10px}.lightbox{padding:16px}.lightbox img{border-width:2px;max-width:100%;max-height:75vh}.lightbox-close{width:36px;height:36px;top:10px;right:10px}.lightbox-caption{max-width:90%;font-size:12px;bottom:16px}.bucket-item{gap:10px;padding:12px 14px}.bucket-title{font-size:13px}.bucket-checkbox{width:28px;height:28px}.filter-tabs{flex-wrap:wrap}.filter-tab{text-align:center;flex:1;min-height:40px;padding:10px 8px;font-size:11px}.modal-overlay{align-items:flex-end;padding:12px}.modal{border-width:2px;max-width:100%;max-height:85vh;padding:20px}.modal-title{font-size:11px}.modal-actions{flex-direction:column;gap:8px}.modal-actions .btn{width:100%}.login-card{border-width:3px;padding:28px 20px}.login-card:before,.login-card:after,.login-title{font-size:11px}.login-heart{font-size:32px}.empty-state{padding:32px 16px}.empty-state-icon{font-size:32px}.empty-state-title{font-size:13px}.empty-state-text{font-size:12px}.sidebar{width:280px;transform:translate(-100%)}.sidebar.open{transform:translate(0)}.mobile-header{height:56px;display:flex}.sidebar-overlay.open{display:block}.y2k-marquee{padding:6px 0;font-size:8px}.visitor-counter{padding:8px;font-size:9px}.visitor-counter span{font-size:10px}.under-construction-inner{gap:6px;padding:6px 10px;font-size:7px}::-webkit-scrollbar{width:4px}}@media (max-width:374px){.main-content{padding:68px 8px 20px}.page-title{font-size:10px}.gallery-grid{columns:1}.calendar-header-cell{font-size:6px}.calendar-cell{min-height:42px}.login-card{padding:20px 14px}.login-title{font-size:9px}.btn{padding:10px 14px;font-size:11px}.filter-tab{padding:8px 6px;font-size:10px}}