@font-face{font-family:Editorial;src:url('/lugat/assets/fonts/EBGaramond.woff2') format('woff2');font-display:swap}@font-face{font-family:Sans;src:url('/lugat/assets/fonts/SourceSans3.woff2') format('woff2');font-display:swap}
:root{--paper:#eef1e9;--ink:#263a32;--muted:#65736a;--line:#cad2c8;--surface:#f7f9f2ed;--green:#24684f;--root:#286c55;--lemma:#a67c35;--surah:#4a6e8a;--source:#a35640;--verse:#89759b;--shadow:0 12px 50px #243e3010;color-scheme:light;font-family:Sans, sans-serif;color:var(--ink);background:var(--paper)}
:root[data-theme=dark]{--paper:#111f1b;--ink:#e4eadf;--muted:#a0b1a5;--line:#3b5045;--surface:#1b2c25f2;--green:#99cbb3;--root:#86bda3;--lemma:#d3b271;--surah:#9bbbd0;--source:#d29883;--verse:#bfacd0;color-scheme:dark}
*{box-sizing:border-box}body{margin:0;overflow:hidden}button,input,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{color:inherit;cursor:pointer}button,a,input{outline-offset:5px}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--green)}button{background:none;border:0}a{color:inherit}button:disabled{opacity:.5;cursor:wait}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.skip{position:fixed;top:-100px;z-index:100;background:var(--surface);padding:12px}.skip:focus{top:8px}
#graph{position:fixed;inset:0;width:100%;height:100dvh;touch-action:none;background-image:radial-gradient(var(--line) .8px,transparent .8px);background-size:25px 25px}.topbar{position:fixed;z-index:12;top:22px;left:26px;right:26px;display:flex;gap:10px;align-items:center}.brand{font:600 18px ui-monospace,monospace;letter-spacing:-1px;text-decoration:none;white-space:nowrap;padding:13px 17px;border:1px solid var(--line);border-radius:5px;background:var(--surface)}.brand>span:not(.brand-bracket){color:var(--green)}.brand-bracket{font-weight:400;color:var(--muted)}.icon-button{width:43px;height:45px;border:1px solid var(--line);border-radius:5px;background:var(--surface);font-size:21px}.search-wrap{position:relative;width:min(410px,32vw)}#search-form{height:47px;border:1px solid var(--line);background:var(--surface);border-radius:5px;display:flex;align-items:center;padding:0 12px;gap:10px}.search-symbol{font-size:23px;color:var(--muted)}#search{min-width:0;flex:1;background:transparent;border:0;color:var(--ink);font-size:15px;outline:0}input::placeholder{color:var(--muted)}kbd{font-size:11px;border:1px solid var(--line);border-radius:3px;padding:1px 6px;color:var(--muted)}#keyboard-toggle{font-family:'Scheherazade New',serif;font-size:24px}.top-links{margin-left:auto;display:flex;gap:22px;align-items:center;font-size:14px}.top-links>button:not(.icon-button){padding:10px 0}.top-links span{color:var(--muted);margin-left:8px}#notebook-count{border:1px solid var(--line);padding:1px 5px;font:11px monospace;border-radius:3px}.surface{border:1px solid var(--line);border-radius:7px;background:var(--surface);backdrop-filter:blur(14px);box-shadow:var(--shadow)}
#intro{position:fixed;z-index:2;left:clamp(28px,4vw,70px);bottom:100px;width:min(560px,43vw);pointer-events:none}.eyebrow{font:10px ui-monospace,monospace;letter-spacing:1.6px;color:var(--muted);line-height:1.6}.live-dot{display:inline-block;width:6px;height:6px;margin-right:7px;background:var(--green);border-radius:50%}h1{font:500 clamp(42px,4.8vw,74px)/.98 Editorial,Georgia,serif;letter-spacing:-1.9px;margin:20px 0 22px}h1 em{font-weight:400;color:var(--green)}.intro-copy{font:21px/1.45 Editorial,Georgia,serif;color:var(--muted);margin:0 0 30px}.entry-paths{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;pointer-events:auto}.entry-paths>button{text-align:left;background:var(--surface);border:1px solid var(--line);border-top:2px solid var(--green);border-radius:4px;padding:13px 11px;transition:transform .2s,background .2s}.entry-paths>button:nth-child(2){border-top-color:var(--surah)}.entry-paths>button:nth-child(3){border-top-color:var(--source)}.entry-paths>button:hover{transform:translateY(-4px);background:var(--paper)}.path-index{font:8px/1.5 ui-monospace,monospace;letter-spacing:.6px;color:var(--muted)}.entry-paths strong{display:block;font:500 19px/1.2 Editorial,Georgia,serif;margin:12px 0 20px;min-height:45px}.entry-paths strong [lang=ar]{font-family:'Scheherazade New';color:var(--green);margin-left:5px}.path-foot{font-size:10px;color:var(--muted);display:flex;justify-content:space-between;gap:3px}.path-foot i{font-style:normal;font-size:13px;color:var(--ink)}.intro-bottom{display:flex;gap:16px;align-items:center;margin-top:22px;font-size:11px;color:var(--muted);pointer-events:auto}.intro-bottom b{font-weight:500;color:var(--ink)}.intro-bottom button{margin-left:auto;font-size:10px;text-decoration:underline;text-underline-offset:3px}.map-caption{position:fixed;right:40px;top:100px;text-align:right;pointer-events:none}.map-caption p{font:17px/1.35 Editorial,serif;color:var(--muted)}.map-footer{position:fixed;z-index:5;bottom:23px;left:26px;right:26px;display:flex;align-items:center;gap:20px}.layers{display:flex;gap:15px;padding:12px 16px;box-shadow:none}.layers label{font-size:12px;cursor:pointer;display:flex;align-items:center;gap:6px}.layers input{appearance:none;width:0;margin:0}.layers input:focus-visible+span{outline:2px solid var(--green);outline-offset:3px}.layers label:has(input:not(:checked)){opacity:.35}.dot{width:7px;height:7px;border-radius:50%;display:inline-block}.root{background:var(--root)}.lemma{background:var(--lemma)}.surah{background:var(--surah)}.source{background:var(--source)}.verse{background:var(--verse)}.map-hint{font:10px ui-monospace,monospace;color:var(--muted)}.camera{margin-left:auto;display:flex;align-items:center;padding:2px 4px;box-shadow:none}.camera button{width:37px;height:35px;font-size:18px}.camera button:hover{background:var(--line);border-radius:3px}.camera span{height:15px;width:1px;background:var(--line);margin:0 3px}.hover-label{position:fixed;z-index:6;pointer-events:none;background:var(--surface);padding:8px 12px;border:1px solid var(--line);border-radius:4px;font-size:13px;box-shadow:var(--shadow)}
.selection{position:fixed;right:28px;top:95px;bottom:87px;width:385px;z-index:8;padding:19px 22px;overflow:auto}.panel-top{display:flex;align-items:center;justify-content:space-between;gap:15px}.panel-top .icon-button{border:0;background:none;width:24px;height:25px;color:var(--muted)}.selection h2{font:500 35px/1.1 Editorial,serif;margin:18px 0 13px}.selection h2.ar{font:64px/1.3 'Scheherazade New',serif;text-align:right;margin:12px 0}.selection .gloss{font:20px/1.4 Editorial,serif;color:var(--muted)}.selection .stats{display:flex;gap:25px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:15px 0;margin:20px 0}.stats b{display:block;font:26px Editorial,serif}.stats small{font-size:10px;color:var(--muted)}.primary{display:block;background:var(--green);color:var(--paper);border-radius:3px;padding:12px 17px;font-size:13px;text-align:left;width:100%}.primary span{float:right}.selection .actions{display:flex;gap:15px;padding:13px 0 7px;font-size:12px}.text-button{font-size:12px;text-decoration:underline;text-underline-offset:4px;padding:8px 0}.selection h3{font:10px ui-monospace,monospace;letter-spacing:1px;color:var(--muted);margin:28px 0 12px;display:flex;justify-content:space-between}.node-row{display:flex;width:100%;gap:15px;align-items:center;text-align:left;padding:10px 0;border-bottom:1px solid var(--line)}.node-row .arabic{font:26px 'Scheherazade New',serif;min-width:70px;text-align:right}.node-row small{font-size:12px;color:var(--muted)}.node-row .number{font:11px ui-monospace,monospace;margin-left:auto;color:var(--muted)}.node-row:hover{color:var(--green)}.distribution{display:flex;gap:1px;height:46px;align-items:flex-end}.distribution button{padding:0;flex:1;background:var(--green);opacity:.55;min-height:2px}.distribution button:hover{opacity:1}.fine,.micro{color:var(--muted);font-size:11px;line-height:1.5}.selection .fine{margin-top:14px}.selection-active #intro{opacity:0;pointer-events:none}.selection-active .entry-paths,.selection-active .intro-bottom{pointer-events:none}.selection-active .map-caption{display:none}
.directory{position:fixed;z-index:14;top:81px;left:26px;bottom:85px;width:360px;padding:18px;overflow:auto}.directory-tabs{display:flex;gap:8px;border-bottom:1px solid var(--line);margin:15px 0}.directory-tabs button{padding:10px 7px;font-size:13px;border-bottom:2px solid transparent}.directory-tabs button[aria-pressed=true]{border-color:var(--green);color:var(--green)}#directory-search{border:1px solid var(--line);background:transparent;width:100%;padding:10px;color:inherit;border-radius:3px}.directory .node-row{padding:9px 3px}.search-results{position:absolute;top:53px;left:0;right:0;max-height:70dvh;overflow:auto;background:var(--surface);border:1px solid var(--line);border-radius:5px;box-shadow:var(--shadow);padding:6px}.search-results button{display:flex;align-items:center;width:100%;text-align:left;padding:11px 12px;border-radius:3px;gap:14px}.search-results button:hover,.search-results button:focus{background:var(--line)}.search-results .result-title{font-size:17px}.search-results .result-title[lang=ar]{font:28px 'Scheherazade New',serif}.search-results small{color:var(--muted);font-size:11px;display:block}.search-results .result-kind{margin-left:auto;font:9px ui-monospace,monospace;color:var(--muted)}#arabic-keyboard{position:absolute;top:53px;right:0;width:310px;background:var(--surface);border:1px solid var(--line);padding:10px;z-index:2;border-radius:5px}#arabic-keyboard button{font:24px 'Scheherazade New';width:35px;height:38px;border-radius:3px}#arabic-keyboard button:hover{background:var(--line)}
.reader-shell{position:fixed;z-index:20;right:0;top:0;bottom:0;width:min(920px,76vw);background:var(--paper);border-left:1px solid var(--line);box-shadow:-20px 0 100px #13251c15;display:flex;flex-direction:column}.reader-shell.wide{width:100%}.reader-bar{height:66px;flex-shrink:0;display:flex;gap:12px;align-items:center;padding:0 22px;border-bottom:1px solid var(--line)}.reader-bar>button{font-size:12px;white-space:nowrap}.reader-bar>span{font:17px Editorial,serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:auto;color:var(--muted)}.reader-bar>div{display:flex;align-items:center;gap:15px}.reader-bar>div button,.reader-bar a{font-size:22px;text-decoration:none}#reader-frame{width:100%;flex:1;border:0;background:var(--paper)}#reader-loading{position:absolute;top:66px;left:0;right:0;padding:20px;background:var(--surface);color:var(--muted);font-size:14px}#notice{position:fixed;z-index:40;bottom:80px;left:50%;transform:translateX(-50%);padding:12px 20px;background:var(--ink);color:var(--paper);border-radius:4px;font-size:13px;max-width:90vw}#notice:empty{display:none}.loading{position:fixed;inset:0;z-index:50;display:grid;place-content:center;text-align:center;background:var(--paper);transition:opacity .4s}.loading-mark{font:19px ui-monospace,monospace}.loading p{font:italic 19px Editorial,serif;color:var(--muted)}.nojs{position:fixed;z-index:60;inset:0;background:var(--paper);padding:10vw}.load-error{max-width:400px;padding:25px}.load-error button{padding:12px;border:1px solid var(--line)}
@media(min-width:1550px){#intro{width:620px;bottom:120px}.entry-paths strong{font-size:22px}.path-index{font-size:9px}.path-foot{font-size:12px}}
@media(max-width:1100px){.top-links{gap:12px}.top-links>button:first-child{display:none}.brand{font-size:16px;padding:13px 10px}.search-wrap{width:min(360px,35vw)}#intro{width:470px;max-width:47vw}.entry-paths strong{font-size:17px}.path-index{font-size:7px}.intro-bottom{gap:10px;font-size:10px}.intro-bottom button{display:none}.map-hint{display:none}}
@media(max-width:700px){.topbar{top:12px;left:12px;right:12px;gap:7px;flex-wrap:wrap}.brand{font-size:15px;padding:12px 10px}.icon-button{width:39px;height:42px}.search-wrap{order:4;width:100%}#search-form{height:43px}.top-links{gap:12px}.top-links>button:not(.icon-button){font-size:12px}.map-caption{top:125px;right:17px}.map-caption .eyebrow{font-size:8px}.map-caption p{font-size:14px}#intro{left:20px;right:20px;width:auto;max-width:none;bottom:108px}#intro>.eyebrow{font-size:9px}h1{font-size:43px;line-height:.99;letter-spacing:-1px;margin:13px 0}.intro-copy{font-size:17px;margin-bottom:20px}.entry-paths{gap:6px}.entry-paths>button{padding:10px 8px}.entry-paths strong{font-size:17px;min-height:42px;margin:10px 0}.path-index{font-size:6.5px;letter-spacing:0}.path-foot{font-size:8px}.intro-bottom{margin-top:13px;font-size:10px;gap:18px}.map-footer{bottom:16px;left:12px;right:12px;gap:7px;align-items:flex-end}.layers{padding:11px 9px;gap:9px;flex-wrap:wrap;max-width:230px}.layers label{font-size:10px;gap:4px}.dot{width:5px;height:5px}.camera{padding:2px}.camera button{width:27px;height:31px;font-size:16px}.camera span{margin:0 1px}.selection{right:12px;left:12px;top:auto;bottom:75px;width:auto;max-height:57dvh;padding:15px 19px;border-radius:12px 12px 5px 5px}.selection h2.ar{font-size:47px;margin:4px 0}.selection h2{font-size:29px}.selection .stats{margin:14px 0;padding:10px 0}.selection .gloss{font-size:18px}.selection h3{margin-top:20px}.directory{left:12px;right:12px;top:112px;bottom:78px;width:auto}.reader-shell{width:100%;border:0}.reader-bar{height:58px;padding:0 12px;gap:7px}.reader-bar>span{font-size:14px}.reader-bar>div{gap:12px}.reader-bar>button{font-size:11px}#reader-loading{top:58px}#reader-width{display:none}.search-results{max-height:60dvh}.selection-active .map-caption{display:none}}
@media(max-height:730px) and (min-width:701px){#intro{bottom:88px}h1{font-size:53px;margin:14px 0}.intro-copy{font-size:18px;margin-bottom:20px}.entry-paths strong{margin:9px 0;min-height:40px}.intro-bottom{margin-top:14px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}@media(prefers-reduced-transparency:reduce){.surface{background:var(--paper);backdrop-filter:none}}

@media(max-width:700px){.layers{max-width:215px;gap:8px}.layers label{font-size:9px}.map-footer{bottom:12px}}
@media(max-width:700px){#graph{mask-image:linear-gradient(to bottom,#000 0%,#000 34%,transparent 49%);-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 34%,transparent 49%)}.selection-active #graph{mask-image:none;-webkit-mask-image:none}.map-caption{opacity:.65}.map-caption p{display:none}.layers label{font-size:10px}.layers{gap:8px;max-width:215px}.camera button{min-height:38px}.path-index{font-size:7px}}
.layers small{font:9px ui-monospace,monospace;color:var(--muted);margin-left:1px}.map-help{margin-left:auto;position:relative;box-shadow:none;font-size:13px}.map-help summary{cursor:pointer;list-style:none;padding:11px 16px;font:15px Editorial,serif}.map-help summary::-webkit-details-marker{display:none}.map-help>div{position:absolute;right:0;bottom:50px;width:300px;background:var(--surface);border:1px solid var(--line);border-radius:5px;padding:20px;line-height:1.5;box-shadow:var(--shadow)}.map-help strong{font:22px Editorial,serif}.map-help p{font-size:13px;color:var(--muted)}.map-help button{font-size:12px;text-decoration:underline}.camera{margin-left:0}.directory-tabs{gap:2px}.directory-tabs button{padding:10px 6px}.reader-shell #reader-sequence{display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid var(--line);padding:8px 22px;font-size:12px;background:var(--surface)}#reader-sequence button{padding:7px 0}#reader-position{font:10px ui-monospace,monospace;color:var(--muted)}#reader-sequence button:disabled{opacity:.3;cursor:default}.reader-shell:has(#reader-sequence:not([hidden])) #reader-loading{top:113px}.connection-stat{white-space:nowrap}.entry-paths>button:active,.icon-button:active,.camera button:active{transform:translateY(1px)}
@media(max-width:1100px){.connection-stat{display:none}.map-hint{display:none}}@media(max-width:700px){.map-help{display:none}.camera{margin-left:auto}.layers small{display:none}.reader-shell #reader-sequence{padding:5px 12px}.reader-shell:has(#reader-sequence:not([hidden])) #reader-loading{top:100px}}
/* The map owns the visual field; the reading paths stay in a compact rail. */
@media(min-width:701px){#intro{top:110px;bottom:auto;left:clamp(28px,4vw,65px);width:min(390px,30vw);max-width:390px}#intro h1{font-size:clamp(42px,3.7vw,60px);line-height:1.02;margin:17px 0 20px;letter-spacing:-1.3px}.intro-copy{font-size:19px;line-height:1.4;margin-bottom:24px}.entry-paths{grid-template-columns:1fr;gap:8px}.entry-paths>button{display:grid;grid-template-columns:70px 1fr;column-gap:10px;text-align:left;padding:12px 14px;border-top:1px solid var(--line);border-left:3px solid var(--green)}.entry-paths>button:nth-child(2){border-top-color:var(--line);border-left-color:var(--surah)}.entry-paths>button:nth-child(3){border-top-color:var(--line);border-left-color:var(--source)}.path-index{grid-row:1/3;align-self:center;font-size:8px;line-height:1.6}.entry-paths strong{font-size:21px;line-height:1.2;margin:0 0 4px;min-height:0}.path-foot{font-size:11px}.intro-bottom{flex-wrap:wrap;gap:7px 13px;font-size:11px;margin-top:17px}.intro-bottom button{margin-left:0}.map-caption{top:92px;right:30px}.map-caption p{display:none}}
@media(min-width:701px) and (max-height:760px){#intro{top:95px}#intro h1{font-size:43px;margin:12px 0 15px}.intro-copy{font-size:17px;margin-bottom:17px}.entry-paths>button{padding:10px 12px}.entry-paths strong{font-size:20px}.intro-bottom{font-size:10px}}
@media(max-width:700px){body{overflow-y:auto;overflow-x:hidden;min-height:100dvh}#graph{position:absolute;inset:110px 0 auto;width:100%;height:clamp(340px,52svh,460px);mask-image:none;-webkit-mask-image:none}#intro{position:relative;inset:auto;width:auto;max-width:none;margin:calc(134px + clamp(340px,52svh,460px)) 20px 130px;pointer-events:auto}.map-caption{position:absolute;top:calc(110px + clamp(340px,52svh,460px));right:20px}.map-caption .eyebrow{font-size:8px}.selection-active{overflow:hidden}.selection-active #intro{visibility:hidden}.selection-active #graph{position:fixed;top:110px;bottom:0;height:calc(100dvh - 110px)}.selection-active .map-caption{display:none}.entry-paths strong{font-size:18px}.camera button{width:30px;min-height:40px}.map-footer{background:linear-gradient(0deg,var(--paper),transparent);padding-top:6px}}

.selection>.panel-top{position:relative;z-index:1}.selection>.panel-top .icon-button{min-width:40px;min-height:40px}