:root{color-scheme:light;--page:#f1f5f3;--panel:#fff;--panel-soft:#f8faf9;--ink:#233832;--mute:#778b83;--line:#e3eae6;--green:#145f51;--green-light:#e5f2ec;--orange:#ef7b24;--shadow:0 14px 45px rgba(19,45,36,.09);font-family:system-ui,-apple-system,"Segoe UI","Tahoma",sans-serif;background:var(--page);color:var(--ink)}
:root.dark{color-scheme:dark;--page:#15231f;--panel:#1b2b27;--panel-soft:#233630;--ink:#eff8f3;--mute:#adc3b7;--line:#34483e;--green:#3a9c7f;--green-light:#29473e;--shadow:0 12px 35px #0004}
*{box-sizing:border-box}html,body,#app{height:100%;margin:0;overflow:hidden}body{font-size:14px}button,input{font:inherit}button{border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--ink);cursor:pointer;min-height:42px}button:disabled{opacity:.4;cursor:default}button:hover:not(:disabled){background:var(--green-light)}button:focus-visible,.upload:focus-within,input:focus-visible{outline:2px solid var(--orange);outline-offset:2px}button.active,button.selected{background:var(--green-light);border-color:#7eb7a1;color:var(--green)}.icon-btn{width:43px;min-width:43px;height:43px;display:grid;place-items:center;font-size:23px;border-color:transparent;background:transparent}.primary-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;background:var(--green);color:white;padding:10px 15px;border-radius:12px;font-weight:700;text-decoration:none;min-height:43px;border:0;cursor:pointer;white-space:nowrap}.primary-btn:hover{background:#237b67;color:#fff}.subtle-btn{border:0;background:transparent;min-width:42px}.appbar{height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;background:var(--panel);border-bottom:1px solid var(--line);position:relative;z-index:11}.app-brand{display:flex;align-items:center;gap:10px}.brand-icon,.welcome-mark{background:linear-gradient(145deg,#ff913c,#e66a15);color:#fff;font-size:13px;font-weight:800;letter-spacing:.4px;border-radius:12px;display:grid;place-items:center;width:46px;height:46px}.brand-text strong{font-size:19px;display:block;letter-spacing:.15px}.brand-text small{font-size:11px;color:var(--mute)}.header-actions{display:flex;align-items:center;gap:6px}.workspace{height:calc(100% - 68px);display:flex;min-width:0}.sidebar{background:var(--panel);border-left:1px solid var(--line);width:278px;flex:0 0 278px;display:flex;flex-direction:column;overflow:hidden;z-index:9}.sidebar-head{display:flex;justify-content:space-between;align-items:center;padding:16px 16px 8px}.sidebar-head strong{font-size:18px}.counter{background:var(--green-light);padding:3px 8px;border-radius:20px;margin-inline-start:8px;font-size:12px}.sidebar-switch{display:flex;padding:4px 10px 12px;gap:4px}.sidebar-switch button{flex:1;padding:7px 2px;min-height:37px;font-size:12px}.file-list{overflow:auto;padding:0 10px;flex:1}.doc{display:flex;align-items:center;gap:4px;padding:6px;border-radius:12px;border:1px solid var(--line);margin-bottom:8px;background:var(--panel-soft)}.doc.selected{border-color:#9bd0bb;background:var(--green-light)}.doc .open{flex:1;min-width:0;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:transparent;border:0;font-size:13px;padding:0 5px}.doc .delete{color:#b74c3d;min-width:34px;min-height:34px;border:0;background:transparent;font-size:21px}.doc .mini-star{min-width:32px;min-height:34px;padding:0;border:0;background:transparent;color:var(--orange)}.privacy-note{padding:12px 16px;font-size:11px;color:var(--mute);line-height:1.7;border-top:1px solid var(--line)}.main-panel{flex:1;position:relative;min-width:0;display:flex;flex-direction:column;overflow:hidden}.message{position:absolute;top:7px;left:15px;right:15px;background:var(--panel);box-shadow:var(--shadow);z-index:25;border:1px solid var(--line);padding:10px 14px;border-radius:11px;text-align:center}.message[hidden],.welcome[hidden],.viewer[hidden],.panel[hidden],.thumbs[hidden],.tool-settings[hidden],#searchPanel[hidden],#notesPanel[hidden],#toolsPanel[hidden],.native-preview[hidden],.backdrop[hidden]{display:none!important}.welcome{padding:30px 20px;max-width:610px;align-self:center;margin:auto;text-align:center}.welcome-mark{width:86px;height:86px;font-size:22px;margin:0 auto 22px;border-radius:24px;box-shadow:0 12px 38px #f38a4a55}.eyebrow{color:var(--green);font-weight:800;letter-spacing:1px}.welcome h1{font-size:clamp(25px,4vw,38px);margin:12px 0}.welcome p{line-height:2;color:var(--mute);font-size:15px}.welcome-cta{min-width:190px;margin:18px auto}.features{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:34px}.features span{border:1px solid var(--line);background:var(--panel);padding:10px;border-radius:12px;color:var(--mute);font-size:12px}.viewer{display:flex;flex-direction:column;flex:1;min-height:0}.docbar,.readerbar{display:flex;align-items:center;gap:8px;background:var(--panel);border-bottom:1px solid var(--line);padding:7px 16px;min-height:54px}.document-title{min-width:0;flex:1}.document-title strong{font-size:14px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.document-title small{font-size:10px;color:var(--mute)}.docbar .primary-btn{min-width:86px}.readerbar{justify-content:space-between;background:var(--panel-soft);min-height:49px;padding:5px 12px}.readerbar button{min-height:33px;border-radius:9px}.page-group,.zoom-group{display:flex;align-items:center;gap:4px;direction:ltr}.page-group button,.zoom-group button{padding:4px 10px;min-width:33px}.page-number{min-width:73px;direction:rtl;font-weight:700}.zoom-group span{font-size:11px;color:var(--mute);min-width:42px;text-align:center}.readerbar .fit-btn{font-size:12px;min-width:auto}.reading-area{flex:1;position:relative;min-height:0;display:flex;overflow:hidden}.desk{flex:1;min-width:0;overflow:auto;padding:20px;background:#e6eae7;text-align:center;overscroll-behavior:contain;position:relative;touch-action:pan-x pan-y}.dark .desk{background:#13201c}.sheet{position:relative;display:inline-block;vertical-align:top;background:white;box-shadow:0 8px 26px #182d2460}.sheet canvas{display:block}#inkCanvas{position:absolute;inset:0;touch-action:none;pointer-events:none;cursor:crosshair}.native-preview{position:absolute;inset:0;background:white}.native-preview iframe{width:100%;height:100%;border:0}.tools-rail{position:sticky;position:fixed;z-index:5;right:calc(min(278px, 19vw) + 22px);top:43%;transform:translateY(-35%);display:flex;flex-direction:column;gap:5px;padding:6px;border:1px solid #e0e9e3;background:#fffffff5;box-shadow:var(--shadow);border-radius:16px}.tools-rail button{width:42px;height:42px;min-height:42px;font-size:21px;border:0;background:transparent}.tools-rail button.active{background:#fce8d7;color:#ba5c10}.tool-settings{display:flex;gap:14px;align-items:center;justify-content:center;background:var(--panel);border-top:1px solid var(--line);padding:6px;min-height:49px;flex-wrap:wrap}.tool-settings input[type=color]{width:28px;height:28px;border:0;background:transparent;vertical-align:middle}.tool-settings input[type=range]{width:90px;vertical-align:middle;accent-color:var(--orange)}.tool-settings button{min-height:33px;padding:3px 9px}.tool-settings label{font-size:12px}.bottom-reader{display:none;align-items:center;justify-content:space-around;background:var(--panel);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}.bottom-reader button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font-size:24px;border:0;background:transparent;min-width:62px;min-height:54px}.bottom-reader button.selected{color:var(--orange);background:transparent}.bottom-reader small{font-size:11px}.thumbs{width:116px;flex:0 0 116px;background:var(--panel);border-left:1px solid var(--line);overflow:auto;z-index:3;padding:8px}.thumbs-head{display:flex;align-items:center;justify-content:space-between}.thumb-card{display:block;width:100%;padding:6px;margin-bottom:10px;border:1px solid var(--line);text-align:center;font-size:11px}.thumb-card.selected{border:2px solid var(--orange)}.thumb-card canvas{width:100%;height:auto;background:white;box-shadow:0 2px 8px #0001}.panel{position:absolute;z-index:20;left:18px;bottom:18px;width:min(380px,calc(100% - 36px));max-height:min(70%,570px);background:var(--panel);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);padding:14px;overflow:auto}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;font-size:17px}.search-row{display:flex;gap:6px}.search-row input{min-width:0;flex:1;border:1px solid var(--line);padding:11px;border-radius:10px;background:var(--panel);color:var(--ink)}.hint{font-size:12px;line-height:1.8;color:var(--mute)}.result{display:block;width:100%;text-align:right;padding:10px;margin-bottom:7px}.notes-item{padding:12px;border-bottom:1px solid var(--line);line-height:1.8;overflow-wrap:anywhere}.tools-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.tools-grid button{display:flex;align-items:center;justify-content:center;flex-direction:column;padding:8px;font-size:12px;gap:4px;min-height:68px}.tools-grid button span{font-size:22px}.secondary-full{width:100%;margin-top:14px;padding:10px}.backdrop{display:none}
@media (max-width:1100px){.sidebar{position:absolute;top:0;right:0;bottom:0;z-index:21;width:min(320px,86vw);transform:translateX(110%);transition:transform .18s;box-shadow:var(--shadow)}.sidebar.open{transform:translateX(0)}.backdrop:not([hidden]){display:block;position:fixed;inset:68px 0 0;background:#12241c77;z-index:19}.tools-rail{right:23px}.desk{padding:14px}}
@media (max-width:700px){.appbar{height:58px;padding:0 12px}.workspace{height:calc(100% - 58px)}.app-brand{gap:7px}.brand-icon{width:37px;height:37px;border-radius:9px;font-size:11px}.brand-text strong{font-size:16px}.brand-text small{font-size:9px}.appbar .primary-btn{padding:8px 12px;min-height:38px}.appbar .icon-btn{width:38px;min-width:38px;height:38px}.optional-wide{display:none}.backdrop:not([hidden]){inset:58px 0 0}.docbar{padding:5px 8px;gap:4px;min-height:46px}.docbar .primary-btn{min-width:40px;padding:7px 9px}.docbar .primary-btn span{display:none}.document-title strong{font-size:12px}.document-title small{font-size:9px}.readerbar{min-height:43px;padding:3px 6px;gap:3px}.readerbar .icon-btn{width:35px;min-width:35px}.page-group,.zoom-group{gap:1px}.page-group button,.zoom-group button{padding:3px 6px;min-width:28px}.page-number{min-width:61px;font-size:12px}.zoom-group span{min-width:31px;font-size:10px}.fit-btn{display:none}.desk{padding:8px 4px}.tools-rail{right:8px;top:40%;padding:3px;gap:1px;max-height:58vh;overflow-y:auto}.tools-rail button{width:38px;height:38px;min-height:38px;font-size:19px}.bottom-reader{display:flex;min-height:57px}.bottom-reader button{min-width:50px}.tool-settings{position:absolute;bottom:calc(57px + env(safe-area-inset-bottom));right:6px;left:6px;z-index:8;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:5px}.tool-settings .size-label{display:none}.panel{left:0;right:0;bottom:calc(57px + env(safe-area-inset-bottom));width:100%;max-height:62%;border-radius:18px 18px 0 0;padding:16px}.thumbs{width:92px;flex-basis:92px}.welcome{padding:16px}.welcome-mark{width:66px;height:66px}.welcome h1{font-size:24px}.welcome p{font-size:13px}.features{gap:5px;margin-top:18px}.features span{padding:7px;font-size:10px}}
@media (max-height:620px){.welcome-mark{display:none}.welcome{padding:10px}.welcome p{margin:6px}.features{margin-top:6px}}

.font-fix-btn{min-width:71px;padding:6px 10px;font-weight:700;color:var(--green);border-color:#b8d7cb;background:var(--green-light);font-size:12px}
.text-reader{overflow:auto;position:absolute;inset:0;background:#fff;color:#171717;padding:clamp(18px,4vw,54px);text-align:right;direction:rtl;font-family:"Noto Naskh Arabic","Noto Sans Arabic",Tahoma,Arial,sans-serif;font-size:clamp(18px,2.4vw,24px);line-height:2.2;white-space:normal;unicode-bidi:plaintext}
.text-reader p{margin:0 0 .8em;direction:rtl;overflow-wrap:anywhere}
.text-reader[hidden],#fontPanel[hidden]{display:none!important}.font-options{display:grid;gap:7px}
@media(max-width:700px){.font-fix-btn{min-width:60px;font-size:10px;padding:4px 6px}.text-reader{padding:18px 15px;font-size:19px;line-height:2}}