@import "https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Inter:wght@400;500;600;700&display=swap";:root{--font-main:"Plus Jakarta Sans", "Inter", -apple-system, BlinkMacSystemFont, sans-serif;--bg-page:#f4f6fc;--bg-sidebar:#ffffffd9;--bg-card:#fff;--border-subtle:#e2e8f0cc;--border-glass:#ffffffb3;--text-primary:#0f172a;--text-secondary:#475569;--text-muted:#94a3b8;--primary-color:#0f172a;--primary-hover:#1e293b;--primary-accent:#dc2626;--radius-sm:8px;--radius-md:12px;--radius-lg:18px;--radius-xl:24px;--shadow-sm:0 2px 8px #0000000a;--shadow-md:0 10px 25px -5px #0000000a, 0 8px 10px -6px #00000003;--shadow-lg:0 20px 35px -10px #00000012}*{box-sizing:border-box}body{background:var(--bg-page);color:var(--text-primary);font-family:var(--font-main);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-image:radial-gradient(at 0 0,#fee2e280 0,#0000 50%),radial-gradient(at 100% 0,#fef3c766 0,#0000 50%),radial-gradient(at 50% 100%,#fee2e24d 0,#0000 50%);background-attachment:fixed;margin:0;font-size:14px}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer;background:0 0;border:0;transition:all .2s cubic-bezier(.4,0,.2,1)}button:disabled{opacity:.5;cursor:not-allowed}.app-shell{min-height:100vh;display:flex}.sidebar{background:var(--bg-sidebar);-webkit-backdrop-filter:blur(16px);border-right:1px solid var(--border-subtle);z-index:10;flex-direction:column;width:265px;padding:28px 18px 24px;display:flex;position:fixed;inset:0 auto 0 0;box-shadow:4px 0 24px #00000005}.brand{align-items:center;gap:12px;padding:0 6px;display:flex}.brand-logo{object-fit:contain;object-position:left center;width:170px;height:auto;max-height:42px;display:block}.mobile-close{color:var(--text-secondary);border-radius:var(--radius-sm);background:0 0;margin-left:auto;padding:4px;display:none}.church-switch{border-radius:var(--radius-md);background:#f1f5f9cc;border:1px solid #e2e8f0e6;align-items:center;gap:12px;margin:28px 0 24px;padding:10px 12px;transition:all .2s;display:flex}.church-switch:hover{background:#f1f5f9}.church-switch>div:nth-child(2){flex:1;min-width:0}.church-switch strong,.admin-card strong{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:700;display:block;overflow:hidden}.church-switch small,.admin-card small{color:var(--text-muted);font-size:11px;font-weight:500}.church-icon{color:#fff;background:#0f172a;border-radius:10px;place-items:center;width:32px;height:32px;font-size:14px;font-weight:800;display:grid;box-shadow:0 4px 10px #0f172a26}.sidebar nav{flex-direction:column;gap:6px;display:flex}.sidebar nav button,.sidebar-bottom>button{color:var(--text-secondary);border-radius:var(--radius-md);text-align:left;background:0 0;align-items:center;gap:12px;width:100%;padding:11px 14px;font-size:14px;font-weight:600;display:flex}.sidebar nav button:hover{color:var(--text-primary);background:#f1f5f9e6}.sidebar nav button.active{color:var(--text-primary);background:#fff;border:1px solid #e2e8f0e6;font-weight:700;box-shadow:0 4px 14px #0000000d,0 1px 3px #0000000a}.sidebar nav button span{flex:1}.sidebar nav b{color:#dc2626;background:#fef2f2;border-radius:20px;padding:2px 9px;font-size:11px;font-weight:700}.sidebar-bottom{flex-direction:column;gap:8px;margin-top:auto;display:flex}.signout{width:100%;color:var(--text-secondary);border-radius:var(--radius-md);text-align:left;background:0 0;align-items:center;gap:12px;padding:10px 14px;font-weight:600;display:flex}.signout:hover{color:#ef4444;background:#fef2f2}.admin-card{border-radius:var(--radius-md);background:#f8fafce6;border:1px solid #e2e8f0e6;align-items:center;gap:10px;margin-top:4px;padding:12px;display:flex}.admin-card>div:nth-child(2){flex:1;min-width:0}.avatar{color:#334155;background:#e2e8f0;border-radius:50%;flex:none;place-items:center;width:36px;height:36px;font-size:12px;font-weight:700;display:grid}.avatar.admin{color:#fff;background:#0f172a;box-shadow:0 3px 8px #0f172a33}main{flex:1;min-height:100vh;margin-left:265px}header{border-bottom:1px solid var(--border-subtle);-webkit-backdrop-filter:blur(12px);z-index:5;background:#ffffffb3;justify-content:space-between;align-items:center;height:72px;padding:0 40px;display:flex;position:sticky;top:0}.crumb span{color:var(--text-primary);font-size:14px;font-weight:700;display:block}.crumb small{color:var(--text-muted);font-size:12px;font-weight:500}.header-actions{align-items:center;gap:16px;display:flex}.icon-button,.hamburger{width:38px;height:38px;color:var(--text-secondary);background:#f1f5f9;border-radius:50%;place-items:center;transition:all .2s;display:grid;position:relative}.icon-button:hover,.hamburger:hover{color:var(--text-primary);background:#e2e8f0}.hamburger{display:none}.mode-switch,.text-button{color:var(--primary-accent);background:0 0;font-size:13px;font-weight:700}.content{max-width:1360px;margin:auto;padding:36px 40px 48px}.hero{justify-content:space-between;align-items:flex-end;margin-bottom:28px;display:flex}.page-hero{margin-bottom:32px}.eyebrow{text-transform:uppercase;letter-spacing:.08em;margin:0 0 6px;font-size:12px;font-weight:800;color:#dc2626!important}.hero h1{letter-spacing:-.025em;color:var(--text-primary);margin:0;font-size:30px;font-weight:800}.subcopy{color:var(--text-secondary);margin:6px 0 0;font-size:14px}.primary{border-radius:var(--radius-md);color:#fff;background:#0f172a;justify-content:center;align-items:center;gap:8px;padding:11px 20px;font-size:14px;font-weight:700;transition:all .2s cubic-bezier(.4,0,.2,1);display:inline-flex;box-shadow:0 4px 14px #0f172a26}.primary:hover{background:#1e293b;transform:translateY(-1px);box-shadow:0 6px 20px #0f172a38}.secondary{border-radius:var(--radius-md);color:var(--text-secondary);background:#f1f5f9;padding:10px 16px;font-size:13px;font-weight:700;transition:all .2s}.secondary:hover{color:var(--text-primary);background:#e2e8f0}.tasks-section{background:var(--bg-sidebar);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);padding:26px}.full-page{min-height:520px}.section-title{justify-content:space-between;align-items:flex-end;margin-bottom:20px;display:flex}.section-title h2{color:var(--text-primary);margin:0 0 4px;font-size:20px;font-weight:800}.section-title h2 span{vertical-align:middle;color:#dc2626;background:#fef2f2;border-radius:20px;margin-left:8px;padding:3px 10px;font-size:12px;font-weight:700}.section-title p{color:var(--text-muted);margin:0;font-size:13px}.task-tools{gap:10px;display:flex}.search{border-radius:var(--radius-md);color:var(--text-muted);background:#fff;border:1px solid #e2e8f0;align-items:center;gap:8px;padding:0 12px;transition:all .2s;display:flex;box-shadow:0 1px 3px #00000005}.search:focus-within{border-color:#cbd5e1;box-shadow:0 0 0 3px #e2e8f099}.search input{width:160px;color:var(--text-primary);background:0 0;border:0;outline:0;padding:9px 0;font-size:13px}.task-tools select{border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;background:#fff;border:1px solid #e2e8f0;outline:0;padding:8px 12px;font-size:13px;font-weight:600;box-shadow:0 1px 3px #00000005}.task-head,.task-row{grid-template-columns:2.2fr 1.35fr .8fr 1fr .9fr 22px;align-items:center;gap:12px;display:grid}.task-head{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid #f1f5f9;padding:12px 14px;font-size:11px;font-weight:700}.task-row{text-align:left;width:100%;color:var(--text-secondary);border-radius:var(--radius-md);background:0 0;border-bottom:1px solid #f8fafc;padding:14px;font-size:13px;transition:all .15s}.task-row:hover{background:#f8fafce6;transform:translateY(-1px)}.task-name{align-items:center;gap:12px;min-width:0;display:flex}.task-name>span{min-width:0}.task-name strong{text-overflow:ellipsis;white-space:nowrap;color:var(--text-primary);font-size:14px;font-weight:700;display:block;overflow:hidden}.task-name small{color:var(--text-muted);margin-top:3px;font-size:12px;display:block}.dept-dot{border-radius:10px;flex:none;place-items:center;width:32px;height:32px;font-size:11px;font-style:normal;font-weight:800;display:grid}.dept-dot.violet{color:#7e22ce;background:#f3e8ff}.dept-dot.blue{color:#1d4ed8;background:#dbeafe}.dept-dot.orange{color:#c2410c;background:#ffedd5}.dept-dot.teal{color:#0f766e;background:#ccfbf1}.priority{align-items:center;gap:6px;font-size:12px;font-weight:600;display:inline-flex}.priority i{background:var(--text-muted);border-radius:50%;width:7px;height:7px}.priority.urgent{color:#dc2626}.priority.urgent i{background:#ef4444}.priority.high{color:#ea580c}.priority.high i{background:#f97316}.priority.normal{color:#475569}.priority.normal i{background:#64748b}.priority.low{color:#64748b}.due{color:var(--text-secondary);font-size:12px}.status{white-space:nowrap;letter-spacing:.01em;border-radius:20px;justify-self:start;padding:5px 11px;font-size:11px;font-weight:700}.status.submitted{color:#c2410c;background:#fff7ed;border:1px solid #ffedd5}.status.seen{color:#e11d48;background:#fff1f2;border:1px solid #ffe4e6}.status.in-progress{color:#7e22ce;background:#f3e8ff;border:1px solid #e9d5ff}.status.completed{color:#047857;background:#ecfdf5;border:1px solid #a7f3d0}.status.waiting{color:#a16207;background:#fefce8;border:1px solid #fef08a}.status.closed{color:#b91c1c;background:#fef2f2;border:1px solid #fecaca}.more{color:var(--text-muted)}.empty-state{text-align:center;color:var(--text-muted);padding:64px 20px}.empty-state svg{color:var(--primary-accent);width:36px;height:36px}.empty-state h3{color:var(--text-primary);margin:12px 0 4px}.empty-state p{margin:0;font-size:13px}.department-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;display:grid}.department-card{border-radius:var(--radius-xl);box-shadow:var(--shadow-md);background:#fff;border:1px solid #e2e8f0e6;padding:24px;transition:all .2s cubic-bezier(.4,0,.2,1)}.department-card:hover{box-shadow:var(--shadow-lg);border-color:#cbd5e1;transform:translateY(-2px)}.department-card-head{justify-content:space-between;align-items:flex-start;display:flex}.dept-dot.large{border-radius:var(--radius-md);width:44px;height:44px;font-size:13px}.card-more{color:var(--text-secondary);border-radius:var(--radius-sm);background:#f1f5f9;place-items:center;width:32px;height:32px;display:grid}.card-more:hover{color:var(--text-primary);background:#e2e8f0}.department-card h2{color:var(--text-primary);margin:18px 0 6px;font-size:20px;font-weight:800}.department-card>p{color:var(--text-secondary);margin:0;font-size:13px}.department-numbers{color:var(--text-muted);border-top:1px solid #f1f5f9;gap:24px;margin-top:20px;padding-top:16px;font-size:12px;display:flex}.department-numbers strong{color:var(--text-primary);margin-right:4px;font-size:16px}.access-code{border-radius:var(--radius-md);background:#f8fafc;border:1px solid #e2e8f0;align-items:center;gap:10px;margin-top:18px;padding:10px 14px;font-size:12px;display:flex}.access-code span{color:var(--text-muted)}.access-code strong{letter-spacing:.05em;color:var(--text-primary);margin-right:auto;font-family:monospace;font-size:13px}.access-code button{color:var(--primary-accent);background:0 0;font-size:12px;font-weight:700}.access-code .reset-code{color:#ea580c;border-left:1px solid #e2e8f0;padding-left:10px}.modal-wrap{z-index:30;-webkit-backdrop-filter:blur(8px);background:#0f172a73;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal,.login-card,.detail{border-radius:var(--radius-xl);background:#fff;border:1px solid #fffc;position:relative;box-shadow:0 25px 60px -15px #0003}.modal{width:min(540px,100%);padding:32px}.close{color:var(--text-secondary);background:#f1f5f9;border-radius:50%;place-items:center;width:32px;height:32px;transition:all .2s;display:grid;position:absolute;top:18px;right:18px}.close:hover{color:var(--text-primary);background:#e2e8f0}.modal h2,.login-card h2,.detail h2{color:var(--text-primary);margin:0;font-size:24px;font-weight:800}.modal-sub,.login-card>p{color:var(--text-secondary);margin:8px 0 24px;font-size:13.5px}.modal label,.login-card label{color:var(--text-primary);margin:16px 0 6px;font-size:12.5px;font-weight:700;display:block}.modal input,.modal select,.modal textarea,.login-card input{border-radius:var(--radius-md);width:100%;color:var(--text-primary);background:#fff;border:1px solid #cbd5e1;outline:none;margin-top:6px;padding:11px 14px;font-size:14px;transition:all .2s cubic-bezier(.4,0,.2,1);display:block}.modal input:focus,.modal select:focus,.modal textarea:focus,.login-card input:focus{border-color:var(--primary-accent);background:#fff;box-shadow:0 0 0 3px #dc262626}.modal select,.task-tools select{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-position:right 14px center;background-repeat:no-repeat;background-size:16px 16px;padding-right:40px!important}.modal select:hover,.task-tools select:hover{border-color:#94a3b8}.modal select option,.task-tools select option{color:#0f172a;background-color:#fff;padding:10px;font-weight:500}.modal input[type=file]{border-radius:var(--radius-md);cursor:pointer;color:var(--text-secondary);background:#f8fafc;border:1.5px dashed #cbd5e1;padding:8px 12px;font-size:13px;transition:all .2s}.modal input[type=file]:hover{border-color:var(--primary-accent);background:#fff1f2}.modal input[type=file]::file-selector-button{color:#fff;border-radius:var(--radius-sm);cursor:pointer;background:#0f172a;border:0;margin-right:12px;padding:7px 14px;font-size:12px;font-weight:700;transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:0 2px 6px #0f172a1f}.modal input[type=file]::-webkit-file-upload-button{color:#fff;border-radius:var(--radius-sm);cursor:pointer;background:#0f172a;border:0;margin-right:12px;padding:7px 14px;font-size:12px;font-weight:700;transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:0 2px 6px #0f172a1f}.modal input[type=file]::file-selector-button:hover{background:#1e293b;transform:translateY(-1px);box-shadow:0 4px 10px #0f172a33}.modal input[type=file]::-webkit-file-upload-button:hover{background:#1e293b;transform:translateY(-1px);box-shadow:0 4px 10px #0f172a33}.date-picker-button-wrap{align-items:center;margin-top:6px;display:flex;position:relative}.date-picker-button-wrap .date-icon{color:#64748b;pointer-events:none;z-index:1;position:absolute;left:14px}.date-picker-button{width:100%;border-radius:var(--radius-md)!important;color:var(--text-primary)!important;cursor:pointer!important;background:#f8fafc!important;border:1px solid #cbd5e1!important;padding:11px 14px 11px 42px!important;font-size:14px!important;font-weight:600!important;transition:all .2s cubic-bezier(.4,0,.2,1)!important}.date-picker-button:hover{transform:translateY(-1px);background:#fff!important;border-color:#dc2626!important;box-shadow:0 4px 12px #dc26261f!important}.modal input[type=date],.modal input[type=datetime-local],.modal input[type=time]{cursor:pointer;position:relative}.modal input::-webkit-calendar-picker-indicator{cursor:pointer;filter:invert(20%)sepia(90%)saturate(3000%)hue-rotate(345deg)brightness(95%);border-radius:6px;padding:4px;transition:all .2s}.modal input::-webkit-calendar-picker-indicator:hover{filter:invert(15%)sepia(95%)saturate(3500%)hue-rotate(345deg)brightness(90%);background:#dc26261a}.modal textarea{resize:vertical;min-height:80px}.form-row{grid-template-columns:1fr 1fr;gap:14px;display:grid}.optional{color:var(--text-muted);margin-left:4px;font-weight:400}.file-selected{color:#047857;margin-top:6px;font-weight:600;display:block}.modal-actions{justify-content:flex-end;gap:10px;margin-top:28px;display:flex}.detail{width:min(680px,100%);max-height:92vh;padding:36px;overflow:auto}.detail-top h2{margin:12px 0 8px}.detail-top p{align-items:center;gap:10px;margin:0;display:flex}.status-change{color:#0f172a;border-radius:var(--radius-sm);background:#f1f5f9;border:1px solid #cbd5e1;padding:6px 12px;font-size:12px;font-weight:700}.closed-note{color:#c2410c;margin-top:10px;font-size:12px;display:block}.detail-meta{color:var(--text-secondary);border-top:1px solid #f1f5f9;border-bottom:1px solid #f1f5f9;flex-wrap:wrap;gap:24px;margin:24px 0;padding:14px 0;font-size:13px;display:flex}.detail-meta span{align-items:center;gap:8px;display:flex}.detail-meta svg{width:16px;color:var(--text-muted)}.description{color:var(--text-secondary);font-size:14px;line-height:1.65}.attachment{border-radius:var(--radius-md);color:var(--text-primary);background:#f8fafc;border:1px solid #e2e8f0;align-items:center;gap:12px;margin:20px 0 28px;padding:14px;display:flex}.attachment span{flex:1}.attachment strong,.attachment small{display:block}.attachment strong{font-size:13px}.attachment small{color:var(--text-muted);margin-top:2px;font-size:11px}.attachment button{color:var(--primary-accent);border-radius:var(--radius-sm);background:#fff;border:1px solid #cbd5e1;padding:7px 12px;font-size:12px;font-weight:700}.activity{border-top:1px solid #f1f5f9;padding-top:22px}.activity h3{margin:0 0 16px;font-size:15px;font-weight:700}.comment{gap:12px;margin:16px 0;display:flex}.avatar.small{width:32px;height:32px;font-size:10px}.comment p{color:var(--text-secondary);margin:0;font-size:13px;line-height:1.5}.comment p strong{color:var(--text-primary)}.comment p small{color:var(--text-muted);font-size:11px}.comment p span{margin-top:4px;display:block}.comment-box{border-radius:var(--radius-md);border:1px solid #cbd5e1;margin-top:20px;display:flex;overflow:hidden}.comment-box input{border:0;outline:0;flex:1;padding:12px 14px;font-size:13.5px}.comment-box button{color:#fff;background:#0f172a;padding:0 18px;font-size:13px;font-weight:700}.login-page{background:radial-gradient(circle at 12% 8%,#fee2e299 0,#0000 40%),radial-gradient(circle at 88% 92%,#fef3c799 0,#0000 40%),#f4f6fc;place-items:center;min-height:100vh;padding:24px;display:grid}.login-page .login-card{width:min(440px,100%)}.login-card{text-align:center;width:min(440px,100%);padding:36px}.login-card .centered{justify-content:center;margin:0 auto 24px}.login-card .brand-logo{object-position:center;width:240px;max-height:56px;margin:auto}.login-card label{text-align:left}.login-kicker{text-transform:uppercase;letter-spacing:.08em;font-weight:800;color:var(--primary-accent)!important;margin-bottom:8px!important;font-size:11px!important}.role-tabs{border-radius:var(--radius-md);background:#f1f5f9;grid-template-columns:1fr 1fr;margin:20px 0 24px;padding:4px;display:grid}.role-tabs button{color:var(--text-secondary);border-radius:var(--radius-sm);background:0 0;padding:9px;font-size:13px;font-weight:700}.role-tabs button.selected{color:var(--text-primary);background:#fff;box-shadow:0 2px 8px #00000014}.form-error{color:#dc2626;border-radius:var(--radius-sm);background:#fef2f2;border:1px solid #fecaca;margin:10px 0;padding:10px;font-size:12px}.full{width:100%;margin-top:14px}.secure{color:var(--text-muted);margin-top:22px;font-size:12px;display:block}.toast{z-index:25;color:#fff;border-radius:var(--radius-md);background:#0f172a;align-items:center;gap:10px;padding:14px 20px;font-size:13.5px;font-weight:600;display:flex;position:fixed;bottom:28px;right:28px;box-shadow:0 10px 30px #0f172a40}.scrim{display:none}@media (width<=900px){.sidebar{transition:transform .25s cubic-bezier(.4,0,.2,1);transform:translate(-100%)}.sidebar.open{transform:translate(0)}.scrim{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:5;background:#0f172a66;display:block;position:fixed;inset:0}.mobile-close{display:block}.hamburger{display:grid}main{margin-left:0}header{padding:0 24px}.content{padding:28px 24px}.task-head,.task-row{grid-template-columns:2fr 1fr .8fr 22px}.task-head span:nth-child(2),.task-head span:nth-child(4),.task-head span:nth-child(5),.task-row .hide-tablet,.task-row .hide-mobile,.task-row .status{display:none}.section-title{align-items:flex-start;gap:14px}.task-tools{flex-direction:column}.search input{width:130px}}@media (width<=590px){header{height:64px;padding:0 18px}.crumb{display:none}.content{padding:24px 16px}.hero h1{font-size:24px}.task-head{display:none}.task-row{grid-template-columns:1fr auto 18px;gap:8px;padding:12px 6px}.department-grid{grid-template-columns:1fr}.modal{padding:24px 18px}.detail{padding:26px 18px}.form-row{grid-template-columns:1fr}}
