[hidden] { display: none !important; }
.auth-page { min-height:100dvh; display:grid; grid-template-columns:minmax(320px,1fr) minmax(360px,480px); align-items:center; gap:80px; max-width:1120px; margin:auto; padding:64px 40px; }
.auth-intro { max-width:440px; }
.auth-brand { display:flex; align-items:center; gap:12px; color:var(--accent); margin-bottom:36px; font-size:16px; font-weight:600; }
.auth-brand svg { width:28px; height:28px; }
.auth-intro h1 { font-size:38px; line-height:1.35; margin-bottom:20px; font-weight:600; }
.auth-intro p { color:var(--muted); max-width:38ch; }
.auth-process { padding:24px 0 0; list-style:none; margin:0; display:grid; gap:12px; color:var(--muted); }
.auth-process li { padding-bottom:12px; border-bottom:1px solid var(--line); }
.auth-form-panel { background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:32px; }
.auth-form-panel .field { margin-top:18px; }
.auth-form-panel h2 { font-size:24px; }
.auth-submit { width:100%; margin-top:8px; min-height:44px; }
.auth-links { display:flex; justify-content:space-between; gap:16px; margin-top:24px; }
.text-button { background:none; border:0; padding:4px 0; color:var(--accent); font:inherit; text-align:left; text-underline-offset:4px; }
.text-button:hover { text-decoration:underline; }
.text-button:focus-visible { outline:2px solid var(--accent); outline-offset:4px; border-radius:3px; }
.code-input { display:flex; gap:8px; }
.code-input input { min-width:0; }
.code-input button { flex:none; }
.inline-message { font-size:13px; color:var(--red); min-height:20px; margin:16px 0 0; overflow-wrap:anywhere; }
.inline-message.success { color:var(--green); }
.platform-bar { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px 20px; margin:0 var(--workspace-gutter) 16px; align-items:center; }
.project-controls,.account-controls { display:flex; align-items:center; gap:10px; min-width:0; flex-wrap:wrap; }
.project-controls .btn:first-child { max-width:320px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.account-email { color:var(--muted); font-size:12px; max-width:170px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.task-count { padding:1px 6px; border-radius:5px; color:var(--bg); background:var(--accent); font-size:11px; }
.project-create { display:flex; align-items:flex-end; gap:12px; padding-bottom:28px; margin-bottom:20px; border-bottom:1px solid var(--line); }
.project-create .field { width:min(100%,440px); margin:0; }
.project-list,.task-list,.member-list { border-top:1px solid var(--line); }
.project-row { width:100%; border:0; border-bottom:1px solid var(--line); padding:20px 12px; display:flex; align-items:center; justify-content:space-between; gap:24px; background:transparent; color:var(--text); text-align:left; }
.project-row:hover { background:var(--panel); }
.project-row:focus-visible { outline:2px solid var(--accent); outline-offset:-2px; }
.project-row strong,.project-row small,.member-row strong,.member-row small { display:block; overflow-wrap:anywhere; }
.project-row small { margin-top:6px; }
.project-open { display:flex; align-items:center; gap:12px; color:var(--accent); flex:none; font-size:12px; }
.task-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:12px 24px; padding:20px 0; border-bottom:1px solid var(--line); }
.task-info { display:flex; flex-direction:column; align-items:flex-start; gap:5px; min-width:0; }
.task-info strong,.task-info small,.task-error { overflow-wrap:anywhere; }
.task-error { grid-column:1/-1; color:var(--red); font-size:13px; margin:0; }
.acknowledge-form { grid-column:1/-1; display:flex; flex-wrap:wrap; align-items:center; gap:12px; font-size:12px; color:var(--muted); }
.acknowledge-form label { display:flex; gap:8px; align-items:center; }
.member-row { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:16px 0; border-bottom:1px solid var(--line); }
.permission-note { margin:0 var(--workspace-gutter) 16px; }
@media(max-width:900px) { .auth-page { gap:32px; padding:32px 24px; grid-template-columns:1fr minmax(320px,1fr); } .auth-intro h1 { font-size:30px; } .account-email { display:none; } }
@media(max-width:680px) { .auth-page { display:block; max-width:480px; padding:24px 16px; } .auth-intro { margin-bottom:24px; } .auth-brand { margin-bottom:20px; } .auth-intro h1,.auth-intro p,.auth-process { display:none; } .auth-form-panel { padding:24px; } .platform-bar { margin:0 16px 12px; } .project-create { flex-wrap:wrap; } .project-create .field { width:100%; } .project-row { gap:12px; padding:18px 0; } .project-open { font-size:0; } .member-row { align-items:flex-start; flex-wrap:wrap; } .task-row { gap:12px; } }
@media(prefers-reduced-motion:no-preference) { .auth-form-panel { animation:auth-arrival 260ms cubic-bezier(.16,1,.3,1); } @keyframes auth-arrival { from { transform:translateY(8px); } to { transform:translateY(0); } } }