:root{--font-family-base:"Plus Jakarta Sans", system-ui, -apple-system, sans-serif;--font-family-serif:"Playfair Display", Georgia, serif;--primary-color:#c06c52;--primary-hover:#a85338;--primary-light:#fbefea;--primary-pill:#bd5d38;--gold-accent:#e5a962;--bg-app:#faf7f2;--bg-card:#fff;--bg-muted:#f3ece4;--bg-input:#f8f5f0;--text-main:#242220;--text-muted:#7d7872;--text-light:#a49f98;--status-pending-bg:#f7efe9;--status-pending-text:#b4644b;--status-success-bg:#eaf5ed;--status-success-text:#2d8a4e;--status-info-bg:#ebf3fb;--status-info-text:#2a72b8;--status-warn-bg:#fef7ea;--status-warn-text:#bd7f1e;--border-subtle:#efe8df;--border-focus:#c06c52;--shadow-sm:0 2px 8px #5c3c2d0a;--shadow-md:0 4px 16px #5c3c2d12;--shadow-lg:0 10px 25px #5c3c2d1a;--radius-sm:10px;--radius-md:16px;--radius-lg:24px;--radius-full:9999px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html,body,#root{width:100%;height:100%;margin:0;padding:0;overflow:hidden}body{font-family:var(--font-family-base);color:var(--text-main);min-height:100dvh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#ede8e1;justify-content:center;align-items:center;min-height:-webkit-fill-available;line-height:1.45;display:flex}.app-container{background-color:var(--bg-app);flex-direction:row;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.app-viewport-wrapper{background-color:var(--bg-app);flex-direction:column;flex:1;min-width:0;height:100%;display:flex;position:relative;overflow:hidden}.app-container.welcome-screen-mode{background:linear-gradient(#faf7f2 0%,#f5ece1 100%)}.app-main-content{-webkit-overflow-scrolling:touch;flex-direction:column;flex:1;width:100%;height:100%;display:flex;overflow:hidden auto}.desktop-sidebar{display:none}@media (width>=840px){.desktop-sidebar{z-index:40;background-color:#fff;border-right:1px solid #ece4da;flex-direction:column;flex-shrink:0;width:280px;height:100%;padding:24px 18px;display:flex;box-shadow:4px 0 24px #462d1e08}.sidebar-brand{border-bottom:1px solid #f5efeb;align-items:center;gap:12px;margin-bottom:24px;padding-bottom:16px;display:flex}.brand-icon-wrapper{background:#faf0eb;border-radius:14px;justify-content:center;align-items:center;width:44px;height:44px;display:flex;box-shadow:0 4px 12px #c06c521f}.brand-title{color:var(--primary-color);letter-spacing:-.3px;margin:0;font-size:1.25rem;font-weight:800;line-height:1.2}.brand-subtitle{color:#8a8279;text-transform:uppercase;letter-spacing:.8px;font-size:.72rem;font-weight:600}.sidebar-couple-card{background:#faf6f1;border:1px solid #efe6dd;border-radius:16px;margin-bottom:24px;padding:14px}.couple-avatar-row{align-items:center;gap:10px;display:flex}.avatar-circle{background:#fff;border:1px solid #ebddd0;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.couple-names h4{color:#272320;margin:0;font-size:.88rem;font-weight:800;line-height:1.2}.couple-names span{color:#c06c52;font-size:.72rem;font-weight:600}.sidebar-menu{flex-direction:column;flex:1;gap:6px;display:flex;overflow-y:auto}.menu-group-label{text-transform:uppercase;letter-spacing:1px;color:#9e968d;margin-bottom:6px;padding-left:10px;font-size:.68rem;font-weight:700}.sidebar-menu-item{color:#615951;cursor:pointer;text-align:left;background:0 0;border:none;border-radius:14px;align-items:center;gap:12px;padding:12px 14px;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.sidebar-menu-item:hover{color:#c06c52;background:#faf2ec}.sidebar-menu-item.active{color:#c06c52;background:linear-gradient(135deg,#faf0eb 0%,#f5e4da 100%);border:1px solid #eed7cc;font-weight:700;box-shadow:0 4px 12px #c06c5214}.menu-icon-box{background:#fff;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;display:flex;box-shadow:0 2px 6px #00000008}.sidebar-menu-item.active .menu-icon-box{color:#fff;background:#c06c52}.menu-text-box{flex-direction:column;display:flex}.menu-item-title{font-size:.88rem;font-weight:700}.menu-item-desc{color:#8c847b;margin-top:1px;font-size:.7rem}.sidebar-footer{border-top:1px solid #f3ede7;flex-direction:column;gap:10px;padding-top:16px;display:flex}.sidebar-pair-badge{color:#5c5248;background:#faf3ec;border:1px solid #eeddd2;border-radius:10px;align-items:center;gap:6px;padding:8px 12px;font-size:.78rem;display:flex}.sidebar-logout-btn{color:#c24d38;cursor:pointer;background:#fff8f5;border:1px solid #ead8ce;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:10px 14px;font-size:.8rem;font-weight:700;transition:background .2s;display:flex}.sidebar-logout-btn:hover{background:#feece7}nav.app-bottom-nav,.app-viewport-wrapper>nav,.mobile-only-header{display:none!important}.view-content{width:100%!important;max-width:1180px!important;margin:0 auto!important;padding:28px 36px!important}.desktop-beranda-grid{grid-template-columns:1.15fr 1fr!important;align-items:start!important;gap:24px!important;display:grid!important}}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-thumb{background:#c4b9ad;border-radius:4px}.dropdown-category-menu::-webkit-scrollbar{width:7px}.dropdown-category-menu::-webkit-scrollbar-track{background:#f4efea;border-radius:4px}.dropdown-category-menu::-webkit-scrollbar-thumb{background:#c06c52;border-radius:4px}h1,h2,h3,h4,h5,h6{color:var(--text-main);font-weight:700}.text-primary{color:var(--primary-color)}.text-muted{color:var(--text-muted)}.text-xs{font-size:.75rem}.text-sm{font-size:.85rem}.text-base{font-size:.95rem}.text-lg{font-size:1.15rem}.text-xl{font-size:1.35rem}.text-2xl{font-size:1.75rem}.font-bold{font-weight:700}.font-semibold{font-weight:600}.card-soft{background:var(--bg-card);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);border:1px solid var(--border-subtle);padding:16px;transition:transform .15s,box-shadow .15s}.card-soft:hover{box-shadow:var(--shadow-md)}.pill-badge{border-radius:var(--radius-full);align-items:center;gap:4px;padding:4px 10px;font-size:.75rem;font-weight:600;display:inline-flex}.pill-primary{background:var(--primary-light);color:var(--primary-color)}.pill-pending{background:var(--status-pending-bg);color:var(--status-pending-text)}.pill-success{background:var(--status-success-bg);color:var(--status-success-text)}button{cursor:pointer;background:0 0;border:none;font-family:inherit;transition:all .2s cubic-bezier(.16,1,.3,1)}.btn-primary{background:var(--primary-color);color:#fff;border-radius:var(--radius-full);justify-content:center;align-items:center;gap:8px;padding:10px 18px;font-weight:600;display:inline-flex;box-shadow:0 4px 12px #c06c524d}.btn-primary:hover{background:var(--primary-hover);transform:translateY(-1px)}.btn-primary:active{transform:scale(.98)}.btn-icon{width:32px;height:32px;color:var(--text-muted);border-radius:50%;justify-content:center;align-items:center;display:flex}.btn-icon:hover{background:var(--bg-muted);color:var(--text-main)}input,select,textarea{background:var(--bg-input);border:1px solid var(--border-subtle);color:var(--text-main);border-radius:12px;outline:none;width:100%;padding:10px 14px;font-family:inherit;font-size:.9rem;transition:border-color .2s,background .2s}input:focus,select:focus,textarea:focus{border-color:var(--border-focus);background:#fff}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.view-content{padding-bottom:24px;animation:.25s ease-out fadeIn}