@import "https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap";
@import "https://fonts.googleapis.com/icon?family=Material+Icons";
:root{--bg-body:#f4f0ed;--bg-sidebar:#f4f0ed;--bg-card:#fff;--text-main:#292524;--text-secondary:#78716c;--primary:#059669;--primary-hover:#047857;--border:#e7e5e4;--radius-md:8px;--radius-lg:12px;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000001a}*{box-sizing:border-box}body{background-color:var(--bg-body);color:var(--text-main);height:100vh;margin:0;padding:0;font-family:Noto Sans KR,sans-serif;display:flex;overflow:hidden}a{color:inherit;text-decoration:none}.material-icons{text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:"liga";direction:ltr;font-family:Material Icons;font-size:24px;font-style:normal;font-weight:400;line-height:1;display:inline-block}.modal-overlay{z-index:1000;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0006;justify-content:center;align-items:center;display:none;position:fixed;inset:0}.modal-overlay.show{display:flex}.modal{background:#fff;border-radius:16px;width:90%;max-width:500px;padding:30px;position:relative;box-shadow:0 10px 25px #0000001a}.modal-close{cursor:pointer;color:var(--text-secondary);font-size:24px;position:absolute;top:24px;right:24px}.content-area{flex-direction:column;flex:1;width:100%;height:100%;padding:0;display:flex;overflow:hidden}.page-container{border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);background:#fff;border-top:1px solid #e2deda;border-bottom:1px solid #e2deda;flex-direction:column;height:calc(100% - 40px);margin:20px;padding:30px;display:flex;overflow:hidden}@media (max-width:768px){.page-container{border:none;border-radius:0;height:100%;min-height:0;margin:0;padding:16px}}input[type=text],input[type=number],input[type=password],input[type=url]{border:1px solid var(--border);background:#f5f5f4;border-radius:8px;width:100%;margin-bottom:16px;padding:10px 14px;font-family:inherit}.btn{cursor:pointer;border:none;border-radius:8px;padding:10px 18px;font-weight:600;transition:background-color .2s,color .2s}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-hover)}#app-layout{width:100%;height:100%;display:flex}aside.left-sidebar{background:var(--bg-sidebar);z-index:1001;border-right:1px solid #e2deda;flex-direction:column;flex-shrink:0;width:280px;padding:10px 30px;transition:transform .3s;display:flex;overflow-y:auto}@media (max-width:768px){aside.left-sidebar{height:100%;display:flex;position:fixed;top:0;left:0;transform:translate(-100%);box-shadow:0 4px 6px -1px #0000001a}aside.left-sidebar.show{transform:translate(0)}aside.right-sidebar{display:none}#sidebar-overlay{z-index:1000;background:#0006;display:none;position:fixed;inset:0}#sidebar-overlay.show{display:block}}main.center-column{background:var(--bg-body);flex-direction:column;flex:1;display:flex;overflow:hidden}header.top-menu{border-bottom:1px solid #e2deda;flex-shrink:0;justify-content:flex-start;align-items:center;width:calc(100% - 40px);height:70px;margin:0 20px;padding:0 10px;display:flex}.mobile-hamburger{cursor:pointer;margin-right:16px;display:none}@media (max-width:768px){.mobile-hamburger{color:var(--text-main);font-size:24px;display:block}header.top-menu{width:100%;margin:0;padding:0 16px}}header.top-menu nav{align-items:center;gap:24px;height:100%;display:flex}header.top-menu nav a{color:var(--text-secondary);border-bottom:2px solid #0000;align-items:center;height:100%;font-size:1rem;font-weight:600;display:flex;position:relative}header.top-menu nav a.active,header.top-menu nav a:hover{color:var(--text-main)}header.top-menu nav a.active{border-bottom:2px solid var(--primary);margin-bottom:-1px}header.top-menu nav a.active:after{content:none}.nav-item{color:var(--text-secondary);cursor:pointer;align-items:center;gap:6px;margin-right:24px;font-weight:600;text-decoration:none;transition:color .2s;display:flex}.nav-item:hover,.nav-item.active{color:var(--text-main)}header.top-menu nav .nav-item.active{border-bottom:2px solid var(--primary);margin-bottom:-1px}.nav-item-admin{color:#dc2626;cursor:pointer;align-items:center;gap:6px;font-weight:600;transition:color .2s;display:flex}.nav-item-admin:hover,.nav-item-admin.active{color:#b91c1c}.nav-icon-only{color:#9ca3af;cursor:pointer;align-items:center;transition:color .2s;display:flex}.nav-icon-only:hover{color:var(--text-main)}aside.right-sidebar{background:var(--bg-body);flex-direction:column;flex-shrink:0;width:350px;padding:20px 20px 20px 0;display:flex}.right-sidebar-box{border-radius:var(--radius-lg);width:100%;height:100%;box-shadow:var(--shadow-sm);background:#fff;border:1px solid #e2deda;flex-direction:column;padding:24px;display:flex;overflow:hidden}.brand-area{justify-content:center;align-items:center;gap:10px;margin-bottom:40px;display:flex}.brand-logo{color:#fff;background:#292524;border-radius:6px;justify-content:center;align-items:center;width:32px;height:32px;font-weight:700;display:flex}.btn-create{color:var(--primary);cursor:pointer;background:0 0;border:none;align-items:center;gap:8px;margin-bottom:24px;padding:0;font-size:1rem;font-weight:600;display:flex}.site-item{cursor:pointer;color:inherit;background:0 0;border-radius:8px;align-items:center;gap:8px;margin-bottom:4px;padding:10px 16px;font-weight:400;transition:background-color .2s,color .2s;display:flex}.site-item:hover{color:#059669;background-color:#ecfdf5}.site-item.active{color:#059669;background-color:#ecfdf5;font-weight:700}.view-toggle-btn{cursor:pointer;color:#9ca3af;-webkit-user-select:none;user-select:none;background:0 0;border-radius:6px;padding:6px;transition:all .2s}.view-toggle-btn:hover,.view-toggle-btn.active{color:#059669;background-color:#ecfdf5}.bookmark-list-container{flex:1;margin-top:20px;overflow-y:auto}.bookmark-group{margin-bottom:24px}.bookmark-group-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.bookmark-badge{color:var(--text-secondary);background:#f5f5f4;border-radius:99px;padding:4px 8px;font-size:.8rem;font-weight:600}.bookmark-item{border:1px solid var(--border);background:#fff;border-radius:8px;justify-content:space-between;align-items:center;margin-bottom:8px;padding:12px;transition:box-shadow .2s;display:flex}.bookmark-item:hover{box-shadow:var(--shadow-sm);border-color:var(--primary)}.icon-btn{cursor:pointer;color:#a8a29e;transition:color .2s}.icon-btn:hover{color:var(--text-main)}.dropdown-menu{border:1px solid var(--border);box-shadow:var(--shadow-md);z-index:50;background:#fff;border-radius:8px;width:max-content;min-width:140px;display:none;position:absolute;top:24px;right:0}.dropdown-menu.show{display:block}.dropdown-item{color:var(--text-main);cursor:pointer;padding:10px 16px;font-size:.9rem;transition:background .1s;display:block}.dropdown-item:hover{background:#f5f5f4}.dropdown-wrapper{position:relative}.bookmark-items{transition:max-height .3s ease-out;overflow:visible}.bookmark-items.collapsed,.mobile-only{display:none}.desktop-only{display:block}@media (max-width:1024px){.mobile-only{display:block}.desktop-only{display:none!important}aside.right-sidebar{z-index:1001;width:280px;height:100%;padding:20px;transition:transform .3s;display:flex;position:fixed;top:0;right:0;transform:translate(100%);box-shadow:0 4px 6px -1px #0000001a}aside.right-sidebar.show{transform:translate(0)}aside.left-sidebar{height:100%;display:flex;position:fixed;top:0;left:0;transform:translate(-100%);box-shadow:0 4px 6px -1px #0000001a}aside.left-sidebar.show{transform:translate(0)}#sidebar-overlay{z-index:1000;background:#0006;display:none;position:fixed;inset:0}#sidebar-overlay.show{display:block}.mobile-hamburger{margin-right:16px;display:block}header.top-menu{justify-content:space-between;width:100%;margin:0;padding:0 16px}}@media (max-width:768px){.mobile-hidden-p1{display:none!important}.mobile-header-icon{color:var(--text-main);cursor:pointer;padding:8px;font-size:24px}}@media (max-width:600px){.mobile-hidden-p2{display:none!important}}@media (max-width:480px){.mobile-hidden-p3{display:none!important}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#94a3b8}