html{background-color:#0d1b2e;scrollbar-gutter:stable;scrollbar-color:#785A28 #0D1B2E;scrollbar-width:thin}html::-webkit-scrollbar{width:6px}html::-webkit-scrollbar-track{background:#0d1b2e}html::-webkit-scrollbar-thumb{background:#785a28;border-radius:3px}html::-webkit-scrollbar-thumb:hover{background:#c89b3c}.page{min-height:100vh;background-color:#0f1b30;color:#c8d6e5;font-family:Pretendard,Noto Sans KR,sans-serif}.app-header{position:sticky;top:0;z-index:100;background:#0f1b30eb;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid rgba(200,155,60,.8);transition:top .2s ease}.has-popup-banner .app-header{top:44px}.app-header__inner{max-width:1100px;margin:0 auto;padding:0 24px;height:60px;display:flex;align-items:center;gap:32px}@media(max-width:768px){.app-header__inner{padding:0 16px;position:relative}}.app-header__logo{display:flex;align-items:center;gap:10px;text-decoration:none;cursor:pointer}.app-header__logo-icon{font-size:20px;color:#c89b3c}.app-header__logo-text{font-size:18px;font-weight:800;color:#c8d6e5;letter-spacing:.5px;margin:0}.app-header__logo-text span{color:#c89b3c}.app-header__nav{display:flex;align-items:center;gap:4px;flex:1}.app-header__nav-link{padding:6px 14px;font-size:14px;font-weight:500;color:#a9b4c2;text-decoration:none;border-radius:4px;transition:color .2s,background .2s}.app-header__nav-link:hover{color:#c8d6e5;background:#c89b3c14}.app-header__nav-link--active{color:#c89b3c;background:#c89b3c1f}.app-header__login-btn{margin-left:auto;padding:6px 16px;font-size:13px;font-weight:700;color:#c89b3c;border:1px solid rgba(200,155,60,.4);border-radius:6px;text-decoration:none;transition:border-color .15s,background .15s}.app-header__login-btn:hover{background:#c89b3c1a;border-color:#c89b3c}.app-header__right{display:flex;align-items:center;gap:0;margin-left:auto}@media(max-width:768px){.app-header__right{position:absolute;right:10px;margin-left:0}}.app-header__user{position:relative;display:flex;align-items:center}.app-header__user-badge{display:flex;align-items:center;gap:7px;padding:5px 12px 5px 6px;background:#c89b3c1a;border:1px solid rgba(200,155,60,.35);border-radius:20px;cursor:pointer;transition:background .15s,border-color .15s}.app-header__user-badge:hover,.app-header__user-badge--open{background:#c89b3c2e;border-color:#c89b3c99}.app-header__user-name{font-size:13px;font-weight:700;color:#c8d6e5;white-space:nowrap}.app-header__popup{position:absolute;top:calc(100% + 10px);right:0;min-width:240px;width:max-content;background:#0d1b2e;border:1px solid rgba(200,155,60,.35);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:12px;box-shadow:0 8px 32px #00000080;z-index:200}.app-header__popup:before{content:"";position:absolute;top:-6px;right:16px;width:10px;height:10px;background:#0d1b2e;border-left:1px solid rgba(200,155,60,.35);border-top:1px solid rgba(200,155,60,.35);transform:rotate(45deg)}.app-header__popup-top{display:flex;align-items:center;justify-content:space-between}.app-header__popup-name{font-size:16px;font-weight:800;color:#c8d6e5;white-space:nowrap}.app-header__popup-logout{flex-shrink:0;margin-left:12px;font-size:12px;font-weight:600;color:#a9b4c280;background:none;border:1px solid rgba(169,180,194,.2);border-radius:5px;padding:3px 10px;cursor:pointer;transition:color .12s,border-color .12s}.app-header__popup-logout:hover{color:#e84057;border-color:#e8405766}.app-header__popup-points{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:#1e2d3e80;border:1px solid rgba(200,155,60,.12);border-radius:8px}.app-header__popup-points-label{font-size:12px;color:#a9b4c299;font-weight:600}.app-header__popup-points-value{font-size:13px;font-weight:700;color:#c89b3c}.app-header__popup-mypage{width:100%;padding:10px;background:linear-gradient(135deg,#785a28,#c89b3c);border:none;border-radius:8px;color:#0f1b30;font-size:14px;font-weight:800;cursor:pointer;transition:filter .15s}.app-header__popup-mypage:hover{filter:brightness(1.1)}body.has-popup-banner{padding-top:44px}.app-avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#785a28,#c89b3c);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#0f1b30;cursor:pointer}.app-header__hamburger{display:none;flex-direction:column;justify-content:center;gap:5px;width:36px;height:36px;padding:6px;background:none;border:none;cursor:pointer;margin-left:4px}.app-header__hamburger span{display:block;width:100%;height:2px;background:#c8d6e5;border-radius:2px;transition:background .15s}.app-header__hamburger:hover span{background:#c89b3c}.app-header__noti-wrapper{position:relative}.app-header__noti{position:relative;display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:none;border:none;cursor:pointer;color:#c8d6e5;font-size:18px;transition:color .15s}.app-header__noti:hover{color:#c89b3c}.app-header__noti-icon--active{color:#c89b3c;filter:drop-shadow(0 0 4px rgba(200,155,60,.7))}.app-header__noti-badge{position:absolute;top:3px;right:3px;min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:#e84057;color:#fff;font-size:9px;font-weight:800;line-height:16px;text-align:center;pointer-events:none}.app-drawer-overlay{position:fixed;inset:0;background:#0009;z-index:300;animation:fadeIn .2s ease}.app-drawer{position:fixed;top:0;left:0;width:280px;height:100dvh;background:#0d1b2e;border-right:1px solid rgba(200,155,60,.3);z-index:301;display:flex;flex-direction:column;transform:translate(-100%);transition:transform .25s ease}.app-drawer--open{transform:translate(0)}.app-drawer__header{display:flex;align-items:center;justify-content:space-between;padding:0 20px;height:60px;border-bottom:1px solid rgba(200,155,60,.2);flex-shrink:0}.app-drawer__title{font-size:17px;font-weight:800;color:#c8d6e5}.app-drawer__title span{color:#c89b3c}.app-drawer__close{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:none;border:none;color:#a9b4c299;font-size:16px;cursor:pointer;border-radius:6px;transition:color .15s,background .15s}.app-drawer__close:hover{color:#c8d6e5;background:#c89b3c1a}.app-drawer__login-area{padding:16px 16px 0;flex-shrink:0}.app-drawer__nav{display:flex;flex-direction:column;padding:12px 12px 0;flex:1}.app-drawer__nav-link{padding:13px 16px;font-size:15px;font-weight:600;color:#a9b4c2;text-decoration:none;border-radius:8px;transition:color .15s,background .15s}.app-drawer__nav-link:hover{color:#c8d6e5;background:#c89b3c14}.app-drawer__nav-link--active{color:#c89b3c;background:#c89b3c1f}.app-drawer__footer{padding:16px;border-top:1px solid rgba(200,155,60,.15);flex-shrink:0}.app-drawer__login-btn{display:block;width:100%;padding:12px;text-align:center;font-size:14px;font-weight:700;color:#c89b3c;border:1px solid rgba(200,155,60,.4);border-radius:8px;text-decoration:none;transition:background .15s,border-color .15s}.app-drawer__login-btn:hover{background:#c89b3c1a;border-color:#c89b3c}.app-drawer__user{display:flex;flex-direction:column;gap:10px}.app-drawer__user-info{display:flex;align-items:center;gap:12px;padding:12px;background:#1e2d3e80;border:1px solid rgba(200,155,60,.15);border-radius:10px}.app-drawer__user-name{font-size:14px;font-weight:700;color:#c8d6e5}.app-drawer__user-points{font-size:12px;font-weight:600;color:#c89b3c;margin-top:2px}.app-drawer__mypage{width:100%;padding:11px;background:linear-gradient(135deg,#785a28,#c89b3c);border:none;border-radius:8px;color:#0f1b30;font-size:14px;font-weight:800;cursor:pointer;transition:filter .15s}.app-drawer__mypage:hover{filter:brightness(1.1)}.app-drawer__logout{width:100%;padding:10px;background:none;border:1px solid rgba(169,180,194,.2);border-radius:8px;color:#a9b4c280;font-size:13px;font-weight:600;cursor:pointer;transition:color .15s,border-color .15s}.app-drawer__logout:hover{color:#e84057;border-color:#e8405766}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media(max-width:768px){.app-header__inner{justify-content:center}.app-header__nav{display:none}.app-header__hamburger{display:flex;position:absolute;left:16px;margin-left:0}.app-header__login-btn--desktop,.app-header__user{display:none}}.user-avatar{border-radius:50%;background:#c8d2e659;display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}.user-avatar__crown{width:100%;height:100%;object-fit:contain;display:block;margin-bottom:3px}.noti-popup{position:absolute;top:calc(100% + 10px);right:0;width:320px;max-height:480px;display:flex;flex-direction:column;background:#0d1b2e;border:1px solid rgba(200,155,60,.35);border-radius:12px;box-shadow:0 8px 32px #0000008c;z-index:200;overflow:hidden;animation:notiSlideIn .18s ease}.noti-popup:before{content:"";position:absolute;top:-6px;right:14px;width:10px;height:10px;background:#0d1b2e;border-left:1px solid rgba(200,155,60,.35);border-top:1px solid rgba(200,155,60,.35);transform:rotate(45deg)}.noti-popup__header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px 12px;border-bottom:1px solid rgba(200,155,60,.15);flex-shrink:0}.noti-popup__title{font-size:14px;font-weight:800;color:#c8d6e5;letter-spacing:.3px}.noti-popup__read-all{font-size:11px;font-weight:600;color:#a9b4c280;background:none;border:none;cursor:pointer;padding:3px 6px;border-radius:4px;transition:color .15s,background .15s}.noti-popup__read-all:hover{color:#c89b3c;background:#c89b3c14}.noti-popup__list{flex:1;overflow-y:auto}.noti-popup__list::-webkit-scrollbar{width:4px}.noti-popup__list::-webkit-scrollbar-track{background:transparent}.noti-popup__list::-webkit-scrollbar-thumb{background:#c89b3c33;border-radius:2px}.noti-popup__empty{padding:40px 16px;text-align:center;font-size:13px;color:#a9b4c266}.noti-popup__item{width:100%;display:flex;align-items:flex-start;gap:10px;padding:12px 16px;background:none;border:none;border-bottom:1px solid rgba(200,155,60,.06);cursor:pointer;text-align:left;transition:background .12s}.noti-popup__item:last-child{border-bottom:none}.noti-popup__item:hover{background:#c89b3c0f}.noti-popup__item--unread{background:#c89b3c0d}.noti-popup__item--unread:hover{background:#c89b3c1a}.noti-popup__item--no-link{cursor:default}.noti-popup__item-icon{font-size:16px;line-height:1;flex-shrink:0;margin-top:1px;width:20px;text-align:center}.noti-popup__item-content{flex:1;min-width:0}.noti-popup__item-title{font-size:12px;font-weight:700;color:#c8d6e5;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.noti-popup__item-body{font-size:12px;font-weight:500;color:#a9b4c2;margin-bottom:4px;line-height:1.4}.noti-popup__item-time{font-size:11px;color:#a9b4c266}.noti-popup__item-dot{flex-shrink:0;width:6px;height:6px;border-radius:50%;background:#c89b3c;margin-top:6px;box-shadow:0 0 6px #c89b3c99}.noti-popup__loading{display:flex;justify-content:center;padding:16px}.noti-popup__spinner{display:block;width:18px;height:18px;border:2px solid rgba(200,155,60,.2);border-top-color:#c89b3c;border-radius:50%;animation:notiSpin .7s linear infinite}.noti-popup__load-more{width:100%;padding:11px;font-size:12px;font-weight:600;color:#a9b4c280;background:#1e2d3e66;border:none;border-top:1px solid rgba(200,155,60,.1);cursor:pointer;transition:color .15s,background .15s;flex-shrink:0}.noti-popup__load-more:hover{color:#c89b3c;background:#c89b3c0f}@media(max-width:768px){.noti-popup{width:calc(100vw - 20px);right:-10px}}@keyframes notiSlideIn{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}@keyframes notiSpin{to{transform:rotate(360deg)}}.flex-center{display:flex;align-items:center;justify-content:center}.flex-between{display:flex;align-items:center;justify-content:space-between}.custom-scrollbar::-webkit-scrollbar{width:8px;height:8px}.custom-scrollbar::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.custom-scrollbar::-webkit-scrollbar-thumb{background:#888;border-radius:4px;transition:background .2s ease-in-out}.custom-scrollbar::-webkit-scrollbar-thumb:hover{background:#555}.d-none-pc{display:none}@media(max-width:768px){.d-none-pc{display:block}}
