Separate theme and quick login; remove login button

Add a visual divider between theme and quick login, remove the header login button, and prevent end-users from seeing the login config modal by default.

Co-authored-by: Cursor <cursoragent@cursor.com>

index.html

@@ -70,6 +70,7 @@
           <button class="btn" id="btnTheme" type="button" aria-pressed="false" title="테마 전환">
             테마
           </button>
+          <span class="divider" aria-hidden="true"></span>
           <div class="user" id="user" hidden>
             <span class="user-dot" aria-hidden="true"></span>
             <span class="user-text" id="userText"></span>
@@ -88,7 +89,6 @@
               </button>
             </div>
           </div>
-          <button class="btn" id="btnLogin" type="button">로그인</button>
           <button class="btn" id="btnLogout" type="button" hidden>로그아웃</button>
         </div>
       </div>

script.js

@@ -20,7 +20,6 @@
     btnTheme: document.getElementById("btnTheme"),
     user: document.getElementById("user"),
     userText: document.getElementById("userText"),
-    btnLogin: document.getElementById("btnLogin"),
     btnLogout: document.getElementById("btnLogout"),
     snsLogin: document.getElementById("snsLogin"),
     btnGoogle: document.getElementById("btnGoogle"),
@@ -388,9 +387,11 @@
 
   function getAuthConfig() {
     const cfg = globalThis.AUTH_CONFIG && typeof globalThis.AUTH_CONFIG === "object" ? globalThis.AUTH_CONFIG : {};
+    const allowEndUserConfig = Boolean(cfg.allowEndUserConfig);
     const auth0 = cfg.auth0 && typeof cfg.auth0 === "object" ? cfg.auth0 : {};
     const allowedEmails = Array.isArray(cfg.allowedEmails) ? cfg.allowedEmails : [];
     const base = {
+      allowEndUserConfig,
       auth0: {
         domain: String(auth0.domain || "").trim(),
         clientId: String(auth0.clientId || "").trim(),
@@ -406,6 +407,7 @@
     if (!override) return base;
     // override가 있으면 우선 적용 (서버 재배포 없이 테스트 가능)
     return {
+      allowEndUserConfig,
       auth0: {
         domain: override.auth0.domain || base.auth0.domain,
         clientId: override.auth0.clientId || base.auth0.clientId,
@@ -448,13 +450,8 @@
       else el.user.removeAttribute("data-auth");
     }
 
-    // 로그인 기능이 활성(enabled)일 때만 로그인/로그아웃 버튼을 의미 있게 노출
-    const enabled = auth.mode === "enabled";
-    el.btnLogin.hidden = enabled ? Boolean(auth.user) : false;
     // 로그아웃은 로그인 된 이후에만 노출
     el.btnLogout.hidden = !auth.user;
-    // 설정/SDK 문제 상태에서도 버튼은 "클릭 가능"하게 두고, 클릭 시 토스트로 안내합니다.
-    el.btnLogin.disabled = false;
     el.btnLogout.disabled = false;
 
     // 간편 로그인 버튼 노출
@@ -502,17 +499,13 @@
     const hasSdk = typeof globalThis.createAuth0Client === "function";
 
     if (!hasAuth0) {
-      // 설정이 없으면: 로그인은 비활성(안내만), 관리 기능은 잠그지 않음
+      // 설정이 없으면: 로그인 비활성(운영자 설정 필요), 관리 기능은 잠그지 않음
       auth.client = null;
       auth.user = null;
       auth.authorized = false;
       auth.mode = "misconfigured";
       updateAuthUi();
       applyManageLock();
-      toastOnce(
-        "authcfg",
-        "로그인 설정이 비어있습니다. index.html의 AUTH_CONFIG(auth0.domain/clientId, allowedEmails)를 채워주세요."
-      );
       return;
     }
 
@@ -639,6 +632,12 @@
   }
 
   function openAuthModal() {
+    // 운영자만 설정하도록: 기본값은 end-user 설정 비활성
+    const cfg = getAuthConfig();
+    if (!cfg.allowEndUserConfig) {
+      toast("로그인 설정은 관리자만 할 수 있습니다. 관리자에게 문의하세요.");
+      return;
+    }
     if (!el.authModal || !el.authForm) {
       toast("로그인 설정 UI를 찾지 못했습니다. 새로고침 후 다시 시도하세요.");
       return;
@@ -971,7 +970,6 @@
       applyTheme(cur === "dark" ? "light" : "dark");
     });
 
-    if (el.btnLogin) el.btnLogin.addEventListener("click", () => login().catch(() => toast("로그인에 실패했습니다.")));
     if (el.btnLogout) el.btnLogout.addEventListener("click", () => logout().catch(() => toast("로그아웃에 실패했습니다.")));
     if (el.btnGoogle)
       el.btnGoogle.addEventListener("click", () => {

styles.css

@@ -143,6 +143,15 @@ html[data-theme="light"] .topbar {
   justify-content: flex-end;
 }
 
+.divider {
+  width: 1px;
+  height: 34px;
+  align-self: center;
+  background: var(--border);
+  border-radius: 999px;
+  margin: 0 2px;
+}
+
 .sr-only {
   position: absolute !important;
   width: 1px !important;