*,*:before,*:after{box-sizing:border-box}:root{color-scheme:light;font-family:system-ui,-apple-system,sans-serif;--brand: #2a6f4f;--topbar-height: 3.25rem;--bottom-nav-height: 4rem}body{margin:0;background:#fafafa;color:#222;overflow-x:hidden}.container{max-width:720px;margin:0 auto;padding:1.25rem 1rem}.container.with-app-chrome{padding-top:calc(var(--topbar-height) + env(safe-area-inset-top) + 1.25rem);padding-bottom:calc(var(--bottom-nav-height) + env(safe-area-inset-bottom) + 1.5rem)}.topbar{position:fixed;top:0;left:0;right:0;z-index:10;height:var(--topbar-height);padding:0 1rem;padding-top:env(safe-area-inset-top);display:flex;align-items:center;justify-content:space-between;background:#fff;border-bottom:1px solid #e5e5e5}.topbar-title{font-weight:700;font-size:1.1rem;color:var(--brand)}.topbar-actions{display:flex;align-items:center;gap:.4rem}.topbar-user{font-size:.85rem;font-weight:600;color:#555;margin-right:.2rem;max-width:8rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topbar-logout,.topbar-icon-link{position:relative;display:flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;background:transparent;border:none;border-radius:999px;color:#888;text-decoration:none}.topbar-badge{position:absolute;top:.15rem;right:.15rem;min-width:1rem;height:1rem;padding:0 .2rem;display:flex;align-items:center;justify-content:center;border-radius:999px;background:#b3261e;color:#fff;font-size:.6rem;font-weight:700;line-height:1}.topbar-logout:hover,.topbar-icon-link:hover{background:#f1f1f1}.topbar-logout:hover{color:#b3261e}.topbar-icon-link:hover{color:var(--brand)}.bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:10;height:var(--bottom-nav-height);padding-bottom:env(safe-area-inset-bottom);display:flex;background:#fff;border-top:1px solid #e5e5e5;box-shadow:0 -2px 8px #0000000a}.bottom-nav-tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.2rem;text-decoration:none;color:#9a9a9a;font-size:.7rem;font-weight:600}.bottom-nav-tab.active{color:var(--brand)}form{display:flex;flex-direction:column;gap:.75rem;max-width:480px}label{display:flex;flex-direction:column;gap:.25rem;font-size:.9rem}input,select,button{font-size:1rem;padding:.5rem}button{cursor:pointer;border:1px solid #2a6f4f;background:#2a6f4f;color:#fff;border-radius:4px}button:disabled{opacity:.5;cursor:not-allowed}.inline-form{flex-direction:row}.error{color:#b3261e}.success{color:#2a6f4f}.task-card{background:#fff;border:1px solid #e5e5e5;border-radius:8px;padding:.85rem;margin-bottom:.75rem}.task-card-header{display:flex;justify-content:space-between;align-items:center;gap:.5rem;margin-bottom:.6rem}.task-index{font-weight:600;font-size:.85rem;color:#666}.task-card-header-actions{display:flex;align-items:center;gap:.4rem}.task-card-header-actions select{width:auto;padding:.4rem;font-size:.85rem}.icon-button{flex-shrink:0;width:2.25rem;height:2.25rem;padding:0;display:flex;align-items:center;justify-content:center;background:#f1f1f1;border:1px solid #ddd;color:#555}.task-mode-tabs{margin-bottom:.6rem}.task-mode-tabs button{padding:.35rem .6rem;font-size:.8rem}.vocab-combobox{position:relative}.vocab-dropdown{position:absolute;top:calc(100% + .2rem);left:0;right:0;z-index:20;list-style:none;margin:0;padding:0;max-height:13rem;overflow-y:auto;background:#fff;border:1px solid #ddd;border-radius:6px;box-shadow:0 4px 12px #0000001f}.vocab-dropdown li+li{border-top:1px solid #f0f0f0}.vocab-dropdown-hint{padding:.5rem .6rem;font-size:.85rem;color:#999}.vocab-option{width:100%;display:flex;align-items:center;justify-content:space-between;gap:.5rem;text-align:left;background:transparent;color:#222;border:none;border-radius:0;padding:.45rem .6rem;font-size:.85rem}.vocab-option:hover{background:#f5f5f5}.vocab-picker-arrow{color:#999}.vocab-option-check{flex-shrink:0;color:var(--brand);font-weight:700}.vocab-option-used{color:#aaa}.vocab-option-used .vocab-option-text{text-decoration:line-through}.vocab-option-used-label{flex-shrink:0;font-size:.7rem;color:#b3261e;white-space:nowrap}.task-field{margin-bottom:.5rem}.task-field:last-child{margin-bottom:0}.task-field-row{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.task-field-row input,.task-field-row .vocab-combobox{flex:1;min-width:0}.task-source-label{font-weight:600;margin:0 0 .6rem;display:flex;flex-wrap:wrap;align-items:center;gap:.4rem}.translate-check{display:contents}.translate-check-result{flex-basis:100%;font-size:.85rem;font-weight:400;color:var(--brand);background:#eaf3ee;padding:.3rem .5rem;border-radius:4px}.translate-check-error{color:#b3261e;background:#fbeceb}.task-direction{display:inline-block;font-size:.7rem;font-weight:700;color:var(--brand);background:#eaf3ee;border-radius:4px;padding:.1rem .4rem;margin-right:.5rem;vertical-align:middle}.task-readonly{margin:0;font-size:.9rem}.task-readonly dt{font-size:.7rem;text-transform:uppercase;letter-spacing:.02em;color:#999;margin-top:.5rem}.task-readonly dd{margin:0}.task-correct-toggle{display:flex;flex-direction:row;align-items:center;gap:.4rem;margin-top:.6rem;font-size:.9rem}.task-correct-toggle input{width:auto}.challenge-list{list-style:none;padding:0}.challenge-list li{display:flex;justify-content:space-between;padding:.5rem 0;border-bottom:1px solid #eee}.status{font-size:.8rem;color:#666}.practice-card{margin-top:1.5rem;padding:1.5rem;background:#fff;border-radius:8px;border:1px solid #e0e0e0;max-width:480px}.practice-source{font-size:1.5rem;font-weight:600}.practice-answer{color:#2a6f4f;font-weight:600}.practice-actions{display:flex;gap:.5rem;margin-top:1rem}.practice-progress{color:#999;font-size:.85rem}.admin-page{max-width:960px}.settings-page{max-width:480px}.settings-section{margin-bottom:2rem}.settings-section h2{font-size:1rem;margin-bottom:.5rem}.settings-hint{color:#666;font-size:.85rem;margin-bottom:.75rem}.settings-toggle-list{display:flex;flex-direction:column;gap:.6rem}.settings-toggle{flex-direction:row;align-items:center;gap:.5rem;font-size:.95rem}.settings-toggle input{width:auto}.notification-list{list-style:none;margin:1rem 0 0;padding:0;display:flex;flex-direction:column;gap:.5rem}.notification-item{cursor:pointer;background:#fff;border:1px solid #e5e5e5;border-radius:8px;padding:.75rem}.notification-item.unread{border-color:var(--brand);background:#f2f8f5}.notification-item p{margin:.25rem 0;color:#555;font-size:.9rem}.notification-item time{color:#999;font-size:.75rem}.admin-tabs{display:flex;gap:.5rem;margin-bottom:1.25rem}.admin-tabs button{background:transparent;color:#666;border:1px solid #ddd}.admin-tabs button.active{background:var(--brand);color:#fff;border-color:var(--brand)}.admin-table-wrap{overflow-x:auto;border:1px solid #e5e5e5;border-radius:8px;margin:1rem 0}.admin-table{width:100%;border-collapse:collapse;font-size:.9rem;white-space:nowrap}.admin-table th,.admin-table td{padding:.5rem .75rem;text-align:left;border-bottom:1px solid #eee}.admin-table tbody tr:last-child td{border-bottom:none}.admin-table input,.admin-table select{padding:.3rem;font-size:.85rem}.admin-table-actions{display:flex;gap:.4rem;align-items:center}.admin-table-actions button:not(.icon-button){padding:.3rem .6rem;font-size:.8rem}.admin-vocab-form{display:flex;flex-wrap:wrap;flex-direction:row;gap:.5rem;align-items:center;max-width:none}.admin-vocab-form select{width:auto}.admin-vocab-form input{flex:1;min-width:140px}.admin-vocab-arrow{color:#999}.admin-vocab-count{color:#666;font-size:.85rem}.admin-pagination{display:flex;gap:.5rem}.admin-pagination button{flex:1}.notification-optin{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem;background:#eaf3ee;border:1px solid #cfe4d8;border-radius:8px;padding:.75rem 1rem;margin-bottom:1.25rem;font-size:.9rem;color:#234}.notification-optin-actions{display:flex;gap:.5rem;flex-shrink:0}.notification-optin-actions button{padding:.4rem .8rem;font-size:.85rem}.notification-optin-dismiss{background:transparent;color:#666;border:1px solid #ccc}.invite-list-item{flex-direction:column;align-items:stretch;gap:.4rem}.invite-link-row{display:flex;gap:.5rem;align-items:center}.invite-link-row input{flex:1;min-width:0;font-size:.8rem;color:#555;background:#f7f7f7}.invite-link-row button{flex-shrink:0}.invite-link-row .success{font-size:.8rem;flex-shrink:0}