:root{font-family:Inter,system-ui,-apple-system,'Segoe UI',sans-serif;color:#19382f;background:#f8f8f3;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.48;cursor:not-allowed}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #9abfad;outline-offset:2px}.app{max-width:520px;min-height:100dvh;margin:auto;background:#fbfbf8;box-shadow:0 6px 50px #273d3020}.topbar{height:86px;padding:18px 24px;display:flex;align-items:center;gap:12px;border-bottom:1px solid #e9ede6}.brand-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:#153b33;color:#e2c78b;font-size:25px}.brand{flex:1}.brand-title{font-size:22px;font-weight:750;letter-spacing:-.7px}.brand-title span{font-family:serif;font-size:17px;font-weight:normal;margin-left:3px;color:#81908a}.brand small{font-size:11px;color:#89968d;letter-spacing:.1px}.icon-btn{border:0;background:#eff2ea;color:#466353;border-radius:13px;width:39px;height:39px;font-size:20px}.view{display:none;padding:28px 23px 114px}.view.active{display:block}.eyebrow{font-size:10px;font-weight:800;color:#949d8d;letter-spacing:2px;margin-bottom:10px}h1{font-size:34px;line-height:1.1;margin:0;letter-spacing:-1.4px;font-weight:760}.dot{color:#caab69}.lede{font-size:14px;color:#78857c;margin:12px 0 25px;line-height:1.55}.overview{background:#173d35;border-radius:19px;color:#fff;display:flex;padding:20px 10px;justify-content:space-around;gap:3px;margin-bottom:33px;box-shadow:0 12px 28px #1e463519}.overview>div:not(.divider-v){display:flex;flex-direction:column;align-items:center;gap:5px;text-align:center;flex:1}.overview small{color:#c2cec5;font-size:10px}.overview strong{font-size:29px;line-height:1.2;color:#f2e9d4;font-weight:750}.overview span{font-size:10px;color:#c2cec5}.divider-v{width:1px;background:#406057;margin:5px 0}.section-row{display:flex;align-items:center;justify-content:space-between;margin:25px 0 15px;gap:12px}h2{font-size:17px;letter-spacing:-.5px;margin:0}.section-row h2{font-size:18px}.link-btn{font-size:12px;color:#4e8167;font-weight:700;background:none;border:0}.card{background:#fff;border:1px solid #e7ebe3;border-radius:16px;padding:16px;margin:10px 0;box-shadow:0 2px 9px #25382a05}.card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:9px}.passage-name{font-weight:750;font-size:15px;direction:rtl;text-align:left}.card-sub{font-size:12px;color:#879086;margin-top:7px}.tag{background:#e9f2e9;color:#4c795f;font-weight:700;border-radius:8px;padding:6px 9px;font-size:10px;white-space:nowrap}.tag.fresh{background:#f6eddc;color:#9c7536}.tag.late{background:#fbeee6;color:#ba7356}.rating-row{display:flex;gap:7px;margin-top:17px}.rating-row button{flex:1;border:1px solid #dce7df;background:#f8fbf7;padding:11px 4px;border-radius:10px;color:#355d4b;font-weight:700;font-size:12px}.rating-row button:first-child{background:#fff8f3;border-color:#f5ddd0;color:#b06b56}.rating-row button:last-child{background:#e8f1e9;border-color:#d7e8d9;color:#286746}.primary-btn{background:#19483a;border:0;border-radius:13px;color:white;padding:15px 18px;font-weight:750;font-size:14px}.primary-btn:hover{background:#22634f}.wide{width:100%}.outline-btn{background:#fff;border:1px solid #d7e4d8;border-radius:12px;padding:12px;color:#325c48;font-weight:650}.danger-btn{background:#fff4ef;border:1px solid #f1ddd6;color:#aa543a;border-radius:12px;padding:11px}.button-row{display:flex;gap:9px;margin-top:16px}.button-row>*{flex:1}.soft-btn{background:#eff5ee;color:#286147;border:0;padding:9px 13px;border-radius:10px;font-size:12px;font-weight:700}.guide{background:#f1f2e8;border:1px solid #e7ead9;padding:18px 19px;border-radius:16px;margin-top:30px}.guide-title{font-weight:750;font-size:14px;color:#536b52}.guide ol{padding-left:20px;margin:12px 0 0;color:#72806e;font-size:12px;line-height:1.9}.bottom-nav{position:fixed;max-width:520px;width:100%;left:50%;transform:translateX(-50%);bottom:0;z-index:5;background:#fffffff7;backdrop-filter:blur(12px);border-top:1px solid #e5e9e2;display:flex;justify-content:space-around;padding:11px 12px calc(10px + env(safe-area-inset-bottom))}.nav-item{flex:1;border:0;background:transparent;color:#9ca79e;font-size:11px;font-weight:700;display:flex;align-items:center;flex-direction:column;gap:3px;padding:5px}.nav-item.active{color:#1c6047}.nav-icon{font-size:23px}.count-pill{background:#edf3ed;border-radius:99px;padding:5px 10px;font-size:12px;color:#406a54;font-weight:750}.empty{padding:30px 18px;border:1px dashed #dce7dc;border-radius:17px;text-align:center;color:#93a093;font-size:13px;line-height:1.6}.empty .empty-ico{font-size:25px;margin-bottom:12px}.mini-stats{background:#e9f1ea;padding:13px;border-radius:14px;color:#54745c;font-size:12px;margin-top:13px;text-align:center}.arabic{font-family:'Noto Naskh Arabic','Amiri','Times New Roman',serif;font-size:21px;direction:rtl;line-height:1.9}.mistake-words{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px}.mistake-words .wrong{color:#b06555;background:#fff4ee;padding:5px 9px;border-radius:9px}.mistake-words .right{color:#27714c;background:#eaf5eb;padding:5px 9px;border-radius:9px}.mistake-note{color:#626f64;font-size:13px;line-height:1.5;margin:8px 0}.modal-backdrop{position:fixed;inset:0;z-index:20;background:#1731269c;display:flex;align-items:flex-end;justify-content:center}.modal-backdrop[hidden]{display:none}.sheet{width:min(520px,100%);max-height:min(93dvh,850px);overflow-y:auto;background:#fbfcf9;border-radius:24px 24px 0 0;padding:12px 22px calc(28px + env(safe-area-inset-bottom));box-shadow:0 -20px 35px #1c312a25}.sheet-grab{width:46px;height:5px;border-radius:99px;background:#d6dfd4;margin:2px auto 18px}.modal-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:23px}.modal-heading h2{font-size:22px}.form-label{display:block;font-size:12px;font-weight:700;margin:16px 0 7px;color:#476453}.form-field{display:block;width:100%;background:#fff;border:1px solid #dce5dc;border-radius:11px;padding:12px 13px;color:#1c3c31;font-size:15px;min-height:46px}.form-field:focus{border-color:#70a685;outline:none}.form-row{display:flex;gap:11px}.form-row>div{flex:1;min-width:0}.form-hint{font-size:12px;line-height:1.6;color:#899588;margin-top:7px}.field-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:10px}.section-divider{height:1px;background:#e5ebe3;margin:22px 0}.record-btn{width:100%;background:#eaf2e9;color:#315e45;border:1px dashed #a5baa6;border-radius:13px;padding:17px;font-weight:750;margin-top:13px}.record-btn.active{background:#fcefe8;color:#a7593a;animation:pulse 1.4s infinite}@keyframes pulse{50%{opacity:.65}}.alert{background:#fff5e3;border-radius:12px;padding:12px;font-size:12px;color:#876837;line-height:1.5}.success{background:#ecf5ec;color:#416c4b}.toast{position:fixed;z-index:100;bottom:92px;left:50%;transform:translateX(-50%) translateY(40px);opacity:0;background:#1c4032;color:white;padding:12px 18px;border-radius:11px;pointer-events:none;transition:.2s;max-width:90%;width:max-content;font-size:13px}.toast.visible{opacity:1;transform:translateX(-50%) translateY(0)}.set-row{display:flex;gap:10px;align-items:center}.set-row .form-field{flex:1}.small-muted{font-size:11px;color:#929b92;line-height:1.6}.linklike{color:#347f59;text-decoration:underline;text-underline-offset:3px}.help-block{line-height:1.8;font-size:13px;color:#657a6a}.checklabel{display:flex;gap:9px;align-items:center;margin-top:12px;font-size:13px;color:#52705d}details summary{cursor:pointer;font-weight:700;font-size:13px;color:#54735c;margin:13px 0}input[type=checkbox]{accent-color:#2b6d51;width:16px;height:16px}.record-preview{border:1px solid #d5e5d8;background:#f3f9f4;padding:14px;border-radius:12px;margin-top:12px}.banner{border-radius:14px;background:#f4ebdb;padding:13px;margin:14px 0;color:#8a6f48;font-size:12px}.row-between{display:flex;justify-content:space-between;align-items:center;gap:10px}.caption-right{font-size:12px;color:#8a988b;white-space:nowrap}#modal-body form{padding-bottom:10px}