:root{--color-bg: #FFFDF1;--color-surface: #ffffff;--color-surface-alt: #f2f3e6;--color-ink: #1c1f18;--color-ink-soft: #6b7263;--color-border: #e6e3d0;--color-green: #59C749;--color-green-dark: #3f9c34;--color-green-soft: #e3f6df;--color-warn: #c98a1d;--color-warn-soft: #fbecc8;--color-danger: #d64545;--color-danger-soft: #fbe2e2;--radius-sm: 10px;--radius-md: 16px;--radius-full: 999px;--shadow-sm: 0 1px 2px rgba(28, 27, 24, .06);--shadow-md: 0 10px 30px rgba(28, 27, 24, .1);--font-sans: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--safe-bottom: env(safe-area-inset-bottom, 0px)}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--color-bg);color:var(--color-ink);font-family:var(--font-sans);position:relative;min-height:100vh;-webkit-font-smoothing:antialiased}#root{position:relative;z-index:1}h1,h2,h3,h4{font-family:var(--font-sans);font-weight:700;margin:0 0 .35rem;color:var(--color-ink);line-height:1.25}h1{font-size:1.5rem}h2{font-size:1.25rem}h3{font-size:1.05rem;font-weight:600}p{line-height:1.55}a{color:var(--color-green-dark);font-weight:600;text-decoration:none;overflow-wrap:anywhere}a:hover{text-decoration:underline}button{font-family:var(--font-sans);font-weight:600;font-size:.95rem;cursor:pointer;border:none;border-radius:var(--radius-sm);background:var(--color-ink);color:var(--color-surface);padding:.65rem 1.2rem;transition:background .15s ease,translate .1s ease,opacity .15s ease;display:inline-flex;align-items:center;gap:.4rem}button:hover{opacity:.88}button:active{translate:0 1px}button:disabled{background:var(--color-ink-soft);cursor:not-allowed;opacity:.7}.btn-primary,.btn-secondary,.btn-danger,.btn-icon{font-family:var(--font-sans);font-weight:600;font-size:.95rem;cursor:pointer;border-radius:var(--radius-sm);padding:.65rem 1.2rem;transition:background .15s ease,translate .1s ease,opacity .15s ease;display:inline-flex;align-items:center;gap:.4rem;border:none}.btn-primary:active,.btn-secondary:active,.btn-danger:active,.btn-icon:active{translate:0 1px}.btn-primary{background:var(--color-green);color:#0e2409}.btn-primary:hover{opacity:.88}.btn-secondary{background:transparent;color:var(--color-ink);border:1.5px solid var(--color-border)}.btn-secondary:hover{background:var(--color-surface-alt)}.btn-danger{background:var(--color-danger-soft);color:var(--color-danger)}.btn-danger:hover{opacity:.85}.btn-icon{background:transparent;color:var(--color-ink);padding:.5rem;border-radius:var(--radius-full)}.btn-icon:hover{background:var(--color-surface-alt)}input,textarea,select{font-family:var(--font-sans);font-size:.95rem;padding:.65rem .85rem;border:1.5px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-ink);width:100%}textarea{resize:vertical}input[type=date]{-webkit-appearance:none;-moz-appearance:none;appearance:none;min-width:0}input[type=search]{-webkit-appearance:none;-moz-appearance:none;appearance:none}input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;-moz-appearance:none;appearance:none}input::placeholder,textarea::placeholder{color:var(--color-ink-soft)}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--color-green);box-shadow:0 0 0 3px var(--color-green-soft)}label{display:flex;flex-direction:column;gap:.3rem;font-size:.85rem;font-weight:600;color:var(--color-ink-soft)}.field-label{font-size:.85rem;font-weight:600;color:var(--color-ink-soft)}input[type=checkbox]{width:auto;padding:0;border:none;background:none;accent-color:var(--color-green-dark);flex-shrink:0}.checkbox-row{display:flex;flex-direction:row;align-items:center;gap:.55rem;font-weight:400;font-size:.9rem;color:var(--color-ink)}.availability-grid{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:.5rem .75rem}.availability-grid .availability-head{font-size:.72rem;font-weight:700;color:var(--color-ink-soft);text-align:center}.availability-grid .availability-day{font-size:.88rem}.card{background:var(--color-surface);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);border:1px solid var(--color-border);padding:1.1rem}.app-header{position:sticky;top:0;z-index:40;display:flex;justify-content:space-between;align-items:center;gap:.75rem;padding:.85rem 1.1rem;background:#fffdf1d9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--color-border)}.app-brand{display:flex;align-items:center;gap:.5rem}.app-brand-mark{width:30px;height:30px;border-radius:9px;background:var(--color-green);display:flex;align-items:center;justify-content:center;color:#0e2409;flex-shrink:0}.app-brand-name{font-weight:800;font-size:1.05rem;letter-spacing:-.01em}.app-header-actions{display:flex;align-items:center;gap:.4rem}.app-user-chip{width:32px;height:32px;padding:0;border-radius:var(--radius-full);background:var(--color-surface-alt);color:var(--color-ink);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem;flex-shrink:0;overflow:hidden}.app-main{max-width:640px;margin:0 auto;padding:1.1rem 1.1rem calc(6.5rem + var(--safe-bottom))}.bottom-nav{position:fixed;left:50%;bottom:calc(1rem + var(--safe-bottom));transform:translate(-50%);display:flex;gap:.2rem;background:#ffffffeb;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--color-border);border-radius:var(--radius-full);box-shadow:var(--shadow-md);padding:.4rem;z-index:50;max-width:calc(100vw - 1.5rem)}.nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.15rem;padding:.5rem 1.2rem;border-radius:var(--radius-full);background:transparent;color:var(--color-ink-soft)}.nav-item:hover{opacity:1;background:var(--color-surface-alt)}.nav-item.active{background:var(--color-green-soft);color:var(--color-ink)}.nav-item span{font-size:.68rem;font-weight:700}@media (max-width: 480px){.nav-item{padding:.45rem .8rem;gap:.1rem}.nav-item svg{width:18px;height:18px}.nav-item span{font-size:.6rem}}.stack{display:flex;flex-direction:column;gap:.7rem}.row{display:flex;align-items:center;gap:.5rem}.row-between{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.muted{color:var(--color-ink-soft)}.text-danger{color:var(--color-danger)}@media (min-width: 720px){.app-main{padding-top:1.5rem}}.badge{display:inline-flex;align-items:center;padding:.2rem .6rem;border-radius:var(--radius-full);font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em}.badge-pending{background:var(--color-warn-soft);color:var(--color-warn)}.badge-approved{background:var(--color-green-soft);color:var(--color-green-dark)}.badge-rejected{background:var(--color-danger-soft);color:var(--color-danger)}.badge-admin{background:var(--color-surface-alt);color:var(--color-ink)}.volunteer-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.85rem 1.1rem;margin:0 -1.1rem;border-bottom:1px solid var(--color-border);cursor:pointer}.volunteer-row:last-child{border-bottom:none}.volunteer-row:hover{background:var(--color-surface-alt)}.volunteer-name{font-weight:700}.volunteer-meta{font-size:.8rem;color:var(--color-ink-soft)}.search-input,.search-input:focus{border:none;box-shadow:none;padding:0}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:#1c1b188c;display:flex;align-items:center;justify-content:center;padding:1.25rem;overflow-y:auto}.modal-card{background:var(--color-surface);border-radius:var(--radius-md);box-shadow:var(--shadow-md);width:100%;max-width:480px;max-height:88vh;display:flex;flex-direction:column;overflow:hidden}.modal-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:1.1rem 1.1rem .75rem;border-bottom:1px solid var(--color-border);flex-shrink:0}.modal-body{padding:1.1rem;overflow-y:auto}.modal-footer{padding:.9rem 1.1rem;border-top:1px solid var(--color-border);display:flex;justify-content:flex-end;gap:.5rem;flex-shrink:0}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}@media (max-width: 480px){.field-grid{grid-template-columns:1fr}}.login-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1.25rem}.login-card{width:100%;max-width:380px}.login-logo{width:52px;height:52px;border-radius:14px;background:var(--color-green);color:#0e2409;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem}