/* ═══════════════ e'thix AI — Agent workspace, editors, review panel ═══════════════ */

/* ─── run card (in chat) ─── */
.run-card{margin:4px 0 10px;border-radius:18px;background:var(--surface);border:1px solid var(--line);overflow:hidden;box-shadow:var(--shadow-1);position:relative}
.run-card.running::before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,transparent,#7488A8,var(--accent-b),transparent);background-size:200% 100%;animation:shimmer 1.6s linear infinite}
.run-head{display:flex;align-items:center;gap:10px;width:100%;padding:10px 14px;text-align:start;font-size:13.5px;font-weight:600;transition:background-color var(--t)}
.run-head:hover{background:color-mix(in srgb,var(--accent-b) 8%,transparent)}
.run-ic{width:26px;height:26px;border-radius:9px;display:grid;place-items:center;flex:none;background:var(--g-agent);color:#141922}
.run-ic .spinner{width:16px;height:16px}
.run-card.done .run-ic{background:linear-gradient(135deg,#A6DDB4,#4E8A5E);color:#fff}
.run-card.stopped .run-ic{background:color-mix(in srgb,var(--ink) 10%,transparent);color:var(--ink-soft)}
.run-ic .i{width:15px;height:15px}
.run-title{flex:1;min-width:0;display:flex;align-items:baseline;flex-wrap:wrap;column-gap:5px}
/* the verb shimmers while working, like Claude Code's status line */
.run-card.running .run-verb{background:linear-gradient(90deg,var(--gold-deep) 25%,#F3E2BD 50%,var(--gold-deep) 75%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 2s linear infinite}
/* 12px on --surface needs 4.5:1; plain --muted gave 4.07:1 (light). The mix agent-live.css already uses on the live
   agent's cards (.agl-card .run-meta, >= 4.9:1) now holds for every run card, the earlier ones stored in threads too. */
.run-meta{font-size:12px;font-weight:500;color:color-mix(in srgb,var(--muted) 60%,var(--ink))}
.run-time{font-weight:600}
@media (pointer:coarse){.run-esc{display:none}}
.run-glyph{width:18px;height:18px;flex:none;display:grid;place-items:center;font-size:15px;line-height:18px;color:var(--gold-deep);overflow:hidden;font-family:system-ui,'Segoe UI Symbol',sans-serif}
.run-glyph.running{align-items:start}
.run-glyph.running i{font-style:normal;display:block;text-align:center;line-height:18px;animation:run-glyph 1.2s steps(10) infinite}
.run-glyph.stopped{font-size:10px;color:var(--muted)}
@keyframes run-glyph{to{transform:translateY(-180px)}}
html.reduce-motion .run-glyph.running i{animation:none}
.run-chev{width:15px;height:15px;color:var(--muted);transition:transform .5s var(--spring)}
.run-head[aria-expanded="false"] .run-chev{transform:rotate(-90deg)}
html[dir="rtl"] .run-head[aria-expanded="false"] .run-chev{transform:rotate(90deg)}
.run-steps{list-style:none;margin:0;padding:2px 14px 12px;display:grid;gap:2px;position:relative}
.st{display:flex;align-items:center;gap:10px;min-height:30px;font-size:13px;color:var(--ink-soft);position:relative;animation:item-in .45s var(--ios) both}
.st::before{content:"";position:absolute;inset-inline-start:12px;top:-8px;height:12px;width:1.5px;background:var(--line)}
.st:first-child::before{display:none}
.st-dot{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;flex:none;background:var(--surface-2);border:1.5px solid var(--line);color:var(--muted);position:relative;z-index:1}
.st-dot i{width:6px;height:6px;border-radius:50%;background:currentColor}
.st-dot .i{width:13px;height:13px;stroke-width:2.6}
.st-dot .spinner{width:15px;height:15px}
.st.done .st-dot{background:var(--g-agent);border-color:transparent;color:#141922;animation:otp-pop .45s var(--spring)}
.st.running{color:var(--ink);font-weight:600}
.st.running .st-dot{border-color:#7488A8}
.st.stopped{opacity:.6}
.st-label{flex:1;min-width:0}
.st-tool{font-family:var(--mono);font-size:11px;padding:2px 8px;border-radius:7px;background:color-mix(in srgb,#7488A8 12%,transparent);color:#56667F;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:45%}
html[data-theme="dark"] .st-tool{color:#B7C6DD}
.run-files{display:flex;flex-wrap:wrap;gap:6px;padding:0 14px 12px}

/* ─── workspace shell ─── */
.ws{display:flex;flex-direction:column;height:100%;min-height:0;container-type:inline-size;container-name:ws}
.ws-head{display:flex;align-items:center;gap:8px;min-height:52px;padding:6px 10px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--surface) 70%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.ws-tabs{flex:1;min-width:0;display:flex;gap:4px;overflow-x:auto;overflow-y:hidden;padding:2px 2px 4px;
  scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--ink) 22%,transparent) transparent}
.ws-tabs::-webkit-scrollbar{height:6px}
.ws-tabs::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--ink) 20%,transparent);border-radius:99px}
.ws-tabs::-webkit-scrollbar-track{background:transparent}
.ws-tab{position:relative;display:flex;align-items:center;flex:none;max-width:220px;border-radius:11px;color:var(--ink-soft);transition:background-color var(--t),color var(--t),box-shadow var(--t);animation:tray-in .45s var(--spring) both}
.ws-tab.on{background:var(--surface);color:var(--ink);box-shadow:var(--shadow-1)}
.ws-tab.on::after{content:"";position:absolute;inset-inline:10px;bottom:0;height:2px;border-radius:2px;background:var(--g-agent)}
.wt-main{display:flex;align-items:center;gap:7px;min-height:36px;padding-inline:10px 4px;font-size:12.5px;font-weight:600;min-width:0}
.wt-main .i{width:15px;height:15px}
.wt-main .i.k-pdf{color:#C2473A}.wt-main .i.k-doc{color:#3F6FC2}.wt-main .i.k-sheet{color:#2F8A55}.wt-main .i.k-slides{color:#D9772E}.wt-main .i.k-code{color:#6F52C2}
.wt-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wt-count{font-size:10px;min-width:18px;height:17px;padding:0 5px;border-radius:9px;display:grid;place-items:center;background:linear-gradient(135deg,#F08A6E,#D0453A);color:#fff}
.wt-x{width:24px;height:24px;margin-inline-end:4px;border-radius:7px;display:grid;place-items:center;color:var(--muted);opacity:0;transition:opacity var(--t-fast),transform .45s var(--spring),background var(--t-fast)}
.wt-x .i{width:12px;height:12px}
.ws-tab:hover .wt-x,.ws-tab.on .wt-x,.wt-x:focus-visible{opacity:1}
.ws-tools{display:flex;align-items:center;gap:2px;flex:none}
.ed-sep{width:1px;height:20px;background:var(--line);margin:0 4px;flex:none}
/* Four tracks: file sidebar · main · split · (fallback) review. Every track is
   always present so opening or closing any of them can animate. */
.ws-body{flex:1;min-height:0;display:grid;grid-template-columns:0px minmax(0,1fr) 0px 0px;grid-template-rows:minmax(0,1fr);position:relative;
  --wf-min:46px;--wf-max:clamp(170px,26%,236px);transition:grid-template-columns .5s var(--ios)}
.ws-body > .ws-files{grid-column:1;grid-row:1}
.ws-body > .ws-main{grid-column:2;grid-row:1}
.ws-body > .ws-split{grid-column:3;grid-row:1}
.ws-body > .ws-review{grid-column:4;grid-row:1}
.ws-body.with-review{grid-template-columns:0px minmax(0,1fr) 1px clamp(280px,33%,380px)}
.ws-body.has-files{grid-template-columns:var(--wf-min) minmax(0,1fr) 0px 0px}
.ws-body.has-files.with-files{grid-template-columns:var(--wf-max) minmax(0,1fr) 0px 0px}
.ws-body.has-files.with-review{grid-template-columns:var(--wf-min) minmax(0,1fr) 1px clamp(280px,33%,380px)}
.ws-body.has-files.with-files.with-review{grid-template-columns:var(--wf-max) minmax(0,1fr) 1px clamp(280px,33%,380px)}
html.reduce-motion .ws-body{transition:none}

/* ── file sidebar: icons when closed, full names (scrollable both ways) when open ── */
.ws-files{min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden;z-index:6;
  background:color-mix(in srgb,var(--ink) 4%,var(--surface));border-inline-end:1px solid var(--line)}
.wf-head{display:flex;align-items:center;gap:6px;padding:8px 6px 6px;flex:none;min-width:0}
.wf-toggle{width:34px;height:34px;flex:none;display:grid;place-items:center;border-radius:10px;color:var(--muted);
  transition:color var(--t-fast),background var(--t-fast)}
.wf-toggle .i{width:17px;height:17px;transition:transform .5s var(--spring)}
@media (hover:hover){.wf-toggle:hover{color:var(--ink);background:color-mix(in srgb,var(--ink) 7%,transparent)}}
.ws-body.with-files .wf-toggle .i{transform:scaleX(-1)}
.wf-title{font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.wf-n{margin-inline-start:auto;padding-inline-end:6px;font-size:10.5px;color:var(--muted)}
.wf-scroll{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--ink) 22%,transparent) transparent}
.wf-scroll::-webkit-scrollbar{width:8px;height:8px}
.wf-scroll::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--ink) 20%,transparent);border-radius:99px;border:2px solid transparent;background-clip:content-box}
.wf-list{list-style:none;margin:0;padding:0 6px 6px;display:grid;gap:2px;align-content:start;min-width:100%;width:max-content}
.wf-item{position:relative;display:flex;align-items:center;gap:9px;width:100%;min-height:34px;padding:6px 9px;border-radius:9px;font-size:12.5px;
  color:var(--ink-soft);text-align:start;transition:background var(--t-fast),color var(--t-fast)}
.wf-ic{flex:none;display:grid;place-items:center}
.wf-item .i{width:16px;height:16px}
.wf-item .i.k-pdf{color:#C2473A}.wf-item .i.k-doc{color:#3F6FC2}.wf-item .i.k-sheet{color:#2F8A55}
.wf-item .i.k-slides{color:#D9772E}.wf-item .i.k-code{color:#6F52C2}
.wf-name{white-space:nowrap}
/* tree: indentation per depth, folders with a turning chevron */
.ws-body.with-files .wf-item{padding-inline-start:calc(9px + var(--d, 0) * 14px)}
.wf-list ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.wf-dir:not(.open) > .wf-sub{display:none}
.wf-folder{font-weight:600;color:var(--ink)}
.wf-chev{width:13px !important;height:13px !important;flex:none;margin-inline-end:-4px;color:var(--muted);transition:transform .35s var(--spring)}
.wf-dir.open > .wf-folder .wf-chev{transform:rotate(90deg)}
html[dir="rtl"] .wf-dir.open > .wf-folder .wf-chev{transform:scaleX(-1) rotate(90deg)}
.wf-item .i.k-folder{color:#C9A227}
.wf-item.tab-open:not(.on) .wf-name{color:var(--ink)}
/* closed strip: no folders, just every file's icon */
.ws-body:not(.with-files) .wf-folder{display:none}
.ws-body:not(.with-files) .wf-dir > .wf-sub{display:grid}
/* nothing open in a tab */
.ws-pick{margin:auto;display:grid;justify-items:center;gap:8px;padding:32px 24px;text-align:center;color:var(--muted);max-width:320px;animation:fade-up .5s var(--ios) both}
.ws-pick .i{width:34px;height:34px;color:#C9A227}
.ws-pick b{color:var(--ink);font-size:15px}
.ws-pick span{font-size:13px;line-height:1.5}
.wf-c{margin-inline-start:auto;flex:none;font-size:10px;min-width:17px;height:16px;padding:0 5px;border-radius:9px;
  display:grid;place-items:center;background:linear-gradient(135deg,#F08A6E,#D0453A);color:#fff}
.wf-item.on{background:var(--surface);color:var(--ink);box-shadow:var(--shadow-1)}
@media (hover:hover){.wf-item:hover{background:color-mix(in srgb,var(--ink) 6%,transparent);color:var(--ink)}}
.wf-add{display:flex;align-items:center;gap:8px;margin:4px 6px 8px;padding:7px 9px;border-radius:9px;flex:none;white-space:nowrap;
  font-size:12px;color:var(--muted);border:1px dashed var(--line);transition:color var(--t-fast),border-color var(--t-fast)}
.wf-add .i{width:15px;height:15px;flex:none}
@media (hover:hover){.wf-add:hover{color:var(--gold-deep);border-color:color-mix(in srgb,var(--accent-b) 45%,var(--line))}}

/* closed: a slim icon strip */
.ws-body:not(.with-files) .wf-title,.ws-body:not(.with-files) .wf-n,
.ws-body:not(.with-files) .wf-name,.ws-body:not(.with-files) .wf-add span{display:none}
.ws-body:not(.with-files) .wf-head{justify-content:center;padding-inline:0}
.ws-body:not(.with-files) .wf-scroll{overflow-x:hidden}
.ws-body:not(.with-files) .wf-list{width:auto;padding-inline:5px}
.ws-body:not(.with-files) .wf-item{justify-content:center;padding:6px 0}
.ws-body:not(.with-files) .wf-c{position:absolute;top:2px;inset-inline-end:2px;min-width:14px;height:14px;padding:0 3px;font-size:9px}
.ws-body:not(.with-files) .wf-add{justify-content:center;margin-inline:6px;padding:7px 0}

.ws-main{min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden;overscroll-behavior:contain}
.ed-scroll,.rv-scroll,.sheet-scroll,.slide-rail,.slide-stage,.out-pane,.pdf-pages{-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
@media (max-width:640px){
  .ws-main{overflow-y:auto}
  .ed{min-height:100%}
}
.ws-split{background:var(--line)}
.ws-review{
  min-width:0;min-height:0;overflow:hidden;background:var(--surface);
  opacity:0;transform:translateX(calc(24px * var(--dx,1)));pointer-events:none;
  transition:opacity .35s var(--ios),transform .5s var(--ios);
}
.ws-review.open{opacity:1;transform:none;pointer-events:auto}
html[dir="rtl"] .ws-review{--dx:-1}
@container ws (max-width:760px){
  /* Narrow pane: the icon strip keeps its column; opened, the sidebar slides
     over the editor instead of squeezing it. */
  .ws-body,.ws-body.with-review{grid-template-columns:0px minmax(0,1fr);grid-template-rows:minmax(0,1fr) 0px 0px;transition:grid-template-rows .5s var(--ios)}
  .ws-body.has-files,.ws-body.has-files.with-files{grid-template-columns:var(--wf-min) minmax(0,1fr)}
  .ws-body.with-review{grid-template-rows:minmax(0,1fr) 1px minmax(0,.9fr)}
  .ws-body.has-files.with-review,.ws-body.has-files.with-files.with-review{grid-template-columns:var(--wf-min) minmax(0,1fr);grid-template-rows:minmax(0,1fr) 1px minmax(0,.9fr)}
  .ws-body > .ws-split{grid-column:1 / -1;grid-row:2}
  .ws-body > .ws-review{grid-column:1 / -1;grid-row:3;transform:translateY(24px)}
  .ws-body > .ws-review.open{transform:none}
  .ws-body > .ws-files{grid-row:1 / 2}
  .ws-body.with-files > .ws-files{position:absolute;inset-block:0;inset-inline-start:0;width:min(236px,72%);box-shadow:var(--shadow-3);
    animation:wf-over .38s var(--ios) both}
}
@keyframes wf-over{from{width:46px}}
.ws-editor{flex:1;min-height:0;display:flex;flex-direction:column}
.ws-editor.swap{animation:fade-up .5s var(--ios) both}

/* empty workspace */
.ws-empty{margin:auto;display:grid;justify-items:center;text-align:center;gap:10px;padding:32px 24px;max-width:520px;animation:rise-in .7s var(--ios) both}
.ws-empty h2{font-size:22px;font-weight:700;letter-spacing:-.01em}
.ws-empty p{color:var(--ink-soft);font-size:14.5px;line-height:1.6}
.wse-art{position:relative;width:200px;height:150px;margin-bottom:10px}
.wse-orb{position:absolute;inset:18px 40px;border-radius:50%;background:conic-gradient(from 0deg,#B7C6DD,#7488A8,var(--accent-b),#D9A48F,#B7C6DD);filter:blur(26px);opacity:.55;animation:spin 14s linear infinite}
.wse-card{position:absolute;width:62px;height:76px;border-radius:14px;display:grid;place-items:center;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-2);animation:float 6s ease-in-out infinite}
.wse-card .i{width:24px;height:24px}
.wse-card.c1{left:16px;top:40px;transform:rotate(-10deg);color:#3F6FC2}
.wse-card.c2{left:69px;top:14px;color:#2F8A55;animation-delay:-2s;z-index:1}
.wse-card.c3{right:16px;top:44px;transform:rotate(9deg);color:#6F52C2;animation-delay:-4s}
.wse-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:100%;margin-top:14px}
.wse-btn{display:grid;justify-items:center;gap:8px;padding:14px 8px;border-radius:16px;background:var(--surface);border:1px solid var(--line);font-size:12.5px;animation:rise-in .5s var(--ios) both;animation-delay:calc(var(--i) * 40ms + .2s);transition:transform .5s var(--spring),box-shadow var(--t),border-color var(--t)}
.wse-btn span{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:color-mix(in srgb,#7488A8 12%,transparent);color:#56667F;transition:background .4s,color .4s,transform .5s var(--spring)}
html[data-theme="dark"] .wse-btn span{color:#B7C6DD}
.wse-btn b{font-weight:600}

/* ─── shared editor chrome ─── */
.ed{flex:1;min-height:0;display:flex;flex-direction:column}
.ed-tools{display:flex;align-items:center;gap:2px;flex-wrap:nowrap;overflow-x:auto;min-height:46px;padding:5px 10px;border-bottom:1px solid var(--line);background:var(--surface);scrollbar-width:none}
.ed-tools::-webkit-scrollbar{display:none}
.ed-tools .b{flex:none}
.ed-select{min-height:32px;width:auto;padding:0 32px 0 10px;font-size:12.5px;border-radius:9px;flex:none}
html[dir="rtl"] .ed-select{padding:0 10px 0 32px}
.ed-status,.ed-info{margin-inline-start:auto;font-size:11.5px;color:var(--muted);white-space:nowrap;padding-inline:8px}
.ed-info{margin-inline-start:6px}
.ed-push{margin-inline-start:auto}
.ed-zoom{font-size:11.5px;min-width:42px;text-align:center;color:var(--ink-soft)}
.ed-scroll{flex:1;min-height:0;overflow:auto;padding:28px 20px 60px;background:
  radial-gradient(60% 40% at 50% 0%,color-mix(in srgb,#8FA0B8 10%,transparent),transparent 70%),var(--sunken)}

/* document */
.paper{
  max-width:780px;margin:0 auto;min-height:100%;padding:56px clamp(22px,6cqi,72px);background:#FFFEFB;color:#1F252E;border-radius:6px;outline:none;
  box-shadow:0 1px 2px rgba(0,0,0,.06),0 18px 50px rgba(40,48,59,.12);font-family:'IBM Plex Sans Arabic','Montserrat',system-ui,sans-serif;font-size:15px;line-height:1.85;
  animation:paper-in .7s var(--ios) both;
}
html[data-theme="dark"] .paper{background:#262C36;color:#E9E3D9;box-shadow:0 18px 50px rgba(0,0,0,.45)}
@keyframes paper-in{from{opacity:0;transform:translateY(20px) scale(.99)}}
.paper:focus{box-shadow:0 0 0 2px color-mix(in srgb,#7488A8 50%,transparent),0 18px 50px rgba(40,48,59,.14)}
.paper h1{font-size:26px;line-height:1.3;margin:0 0 .6em;font-weight:700}
.paper h2{font-size:19px;margin:1.4em 0 .5em;font-weight:700}
.paper h3{font-size:16px;margin:1.2em 0 .4em;font-weight:700}
.paper p{margin:0 0 .8em}
.paper ul,.paper ol{margin:0 0 .9em;padding-inline-start:1.4em}
.paper blockquote{margin:0 0 1em;padding:8px 14px;border-inline-start:3px solid #C9AE7E;background:rgba(201,174,126,.1)}
.paper table{border-collapse:collapse;width:100%;margin:0 0 1em}
.paper td,.paper th{border:1px solid rgba(40,48,59,.18);padding:6px 10px}
.paper hr{border:0;border-top:1px dashed rgba(40,48,59,.25);margin:2em 0}
.paper img{max-width:100%;height:auto}
.paper .flash{animation:flash 1.6s var(--ease)}
.pdf-text{position:relative;margin-bottom:22px;min-height:auto}
.page-no{position:absolute;top:14px;inset-inline-end:18px;font-size:11px;color:#8C939D;font-family:'Montserrat',sans-serif}
.pdf-pages{display:grid;justify-items:center;gap:22px}
.pdf-page{position:relative;background:#fff;border-radius:4px;box-shadow:0 18px 50px rgba(40,48,59,.14);max-width:100%;overflow:hidden}
.pdf-page::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#f1ede6 25%,#e8e2d8 50%,#f1ede6 75%);background-size:200% 100%;animation:shimmer 1.4s linear infinite}
.pdf-page.ready::before{display:none}
.pdf-page canvas{display:block;position:relative}
.pdf-page .page-no{background:rgba(255,255,255,.85);padding:2px 8px;border-radius:8px;top:10px}

/* spreadsheet */
.cell-ref{min-width:54px;height:32px;display:grid;place-items:center;padding:0 8px;border-radius:9px;background:color-mix(in srgb,var(--ink) 6%,transparent);font-size:12px;font-weight:700;color:var(--ink-soft);flex:none}
.fx{display:grid;place-items:center;width:28px;color:var(--muted);flex:none}
.fx .i{width:15px;height:15px}
.fx-input{min-height:32px;height:32px;padding:0 10px;font-family:var(--mono);font-size:12.5px;border-radius:9px;min-width:140px;flex:1}
.sheet-scroll{flex:1;min-height:0;overflow:auto;background:var(--surface);outline:none;position:relative;direction:ltr}
.sheet-scroll:focus-visible{box-shadow:inset 0 0 0 2px color-mix(in srgb,#7488A8 50%,transparent)}
.sgrid{border-collapse:separate;border-spacing:0;font-size:13px;direction:ltr;min-width:100%}
.sgrid th,.sgrid td{height:30px;min-width:96px;max-width:260px;padding:0 8px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left}
.sgrid thead th{position:sticky;top:0;z-index:2;background:color-mix(in srgb,var(--surface-2) 92%,#8FA0B8 8%);font-size:11px;font-weight:700;color:var(--muted);text-align:center;cursor:pointer;transition:background var(--t-fast)}
.sgrid thead th:hover{background:color-mix(in srgb,#8FA0B8 20%,var(--surface))}
.sgrid thead th.col-on{background:var(--g-agent);color:#141922}
.sgrid tbody th{position:sticky;left:0;z-index:1;min-width:46px;width:46px;background:var(--surface-2);font-size:11px;color:var(--muted);text-align:center;font-weight:600}
.sgrid .corner{position:sticky;left:0;top:0;z-index:3;min-width:46px;width:46px}
.sgrid td{cursor:cell;color:var(--ink);font-variant-numeric:tabular-nums;transition:background-color .15s}
.sgrid td.num{text-align:right}
.sgrid td.head{font-weight:700;background:color-mix(in srgb,var(--accent-b) 10%,transparent)}
.sgrid td.err{color:var(--danger);font-weight:700}
.sgrid td.sel{box-shadow:inset 0 0 0 2px #7488A8;background:color-mix(in srgb,#8FA0B8 12%,transparent);position:relative;z-index:1}
.sgrid td.flash{animation:flash 1.6s var(--ease)}
.cell-input{width:100%;height:28px;border:0;outline:none;background:var(--surface);font:inherit;color:var(--ink);padding:0}
.sheet-chart{border-top:1px solid var(--line);background:var(--surface);padding:10px 14px 6px;animation:rise-in .5s var(--ios) both}
.sc-head{display:flex;align-items:center;justify-content:space-between;font-size:13px}
.sc-body{padding-top:6px}
.sheet-foot{display:flex;align-items:center;gap:10px;min-height:42px;padding:4px 10px;border-top:1px solid var(--line);background:var(--surface-2)}
.sheet-tabs{display:flex;align-items:center;gap:4px;overflow-x:auto;flex:1;min-width:0;scrollbar-width:none}
.sheet-tab{height:30px;padding:0 14px;border-radius:9px;font-size:12.5px;font-weight:600;color:var(--muted);white-space:nowrap;transition:background var(--t),color var(--t),transform .45s var(--spring)}
.sheet-tab.on{background:var(--surface);color:var(--ink);box-shadow:var(--shadow-1)}
.sheet-stats{font-size:11.5px;color:var(--ink-soft);white-space:nowrap}

/* slides */
.theme-dots{display:flex;gap:6px;padding:0 6px;flex:none}
.theme-dot{width:22px;height:22px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1);transition:transform .45s var(--spring),box-shadow var(--t)}
.theme-dot.th-gold{background:linear-gradient(135deg,#F3E2BD,#9A7E51)}
.theme-dot.th-ink{background:linear-gradient(135deg,#3B4553,#1A2029)}
.theme-dot.th-rose{background:linear-gradient(135deg,#F4D3C4,#A8705C)}
.theme-dot.th-steel{background:linear-gradient(135deg,#D1DCEB,#56667F)}
.theme-dot.on{box-shadow:0 0 0 2px var(--surface),0 0 0 4px #7488A8;transform:scale(1.08)}
.slides-body{flex:1;min-height:0;display:grid;grid-template-columns:170px minmax(0,1fr);background:var(--sunken)}
.slide-rail{overflow-y:auto;padding:14px 10px;display:grid;align-content:start;gap:10px;border-inline-end:1px solid var(--line)}
.thumb{display:flex;gap:6px;align-items:flex-start;text-align:start;border-radius:10px;padding:4px;transition:transform .45s var(--spring),background var(--t)}
.thumb-n{font-size:10.5px;color:var(--muted);width:14px;padding-top:2px;flex:none}
.thumb .slide{flex:1;border-radius:6px;pointer-events:none;box-shadow:0 0 0 1.5px transparent;transition:box-shadow var(--t)}
.thumb.on .slide{box-shadow:0 0 0 2px #7488A8}
.slide-stage{min-width:0;min-height:0;display:grid;place-items:center;padding:24px;overflow:auto;container-type:inline-size}
.slide{position:relative;width:100%;aspect-ratio:16/9;border-radius:14px;overflow:hidden;container-type:inline-size;isolation:isolate;background:linear-gradient(135deg,#FFFDF8,#F1EBE1);color:#1F252E;box-shadow:0 20px 50px rgba(40,48,59,.18)}
.main-slide{max-width:980px}
.main-slide.swap{animation:paper-in .5s var(--ios) both}
.slide::before{content:"";position:absolute;width:60%;aspect-ratio:1;inset-inline-end:-18%;top:-40%;border-radius:50%;z-index:-1;filter:blur(8cqi);opacity:.75}
.slide.th-gold::before{background:radial-gradient(circle,#E9CFA0,transparent 65%)}
.slide.th-ink{background:linear-gradient(135deg,#2E3643,#161A21);color:#F1EBE1}
.slide.th-ink::before{background:radial-gradient(circle,rgba(201,174,126,.55),transparent 65%)}
.slide.th-rose{background:linear-gradient(135deg,#FFF8F4,#F4DCD0)}
.slide.th-rose::before{background:radial-gradient(circle,#E3A58F,transparent 65%)}
.slide.th-steel{background:linear-gradient(135deg,#F4F7FB,#D8E1EE)}
.slide.th-steel::before{background:radial-gradient(circle,#8FA0B8,transparent 65%)}
.slide-inner{position:absolute;inset:0;padding:7cqi 8cqi 9cqi;display:flex;flex-direction:column}
.sl-kicker{font-family:'Montserrat',sans-serif;font-weight:700;font-size:1.8cqi;letter-spacing:.2em;color:#9A7E51}
.th-ink .sl-kicker{color:#E2CCA2}
.th-steel .sl-kicker{color:#56667F}
.sl-title{font-size:5.2cqi;line-height:1.15;font-weight:700;margin:1.5cqi 0 3cqi;outline:none;letter-spacing:-.01em}
.sl-title:empty::before{content:attr(data-ph);opacity:.35}
.sl-bullets{margin:0;padding-inline-start:3.5cqi;display:grid;gap:1.6cqi;font-size:2.6cqi;line-height:1.45;outline:none}
.sl-bullets li::marker{color:#C9AE7E}
.sl-foot{position:absolute;inset-inline:8cqi;bottom:4cqi;display:flex;justify-content:space-between;align-items:center;font-size:1.7cqi;opacity:.6}
.sl-foot .wordmark{font-size:2.2cqi;color:inherit}
.main-slide [contenteditable]:focus{box-shadow:0 0 0 .3cqi rgba(116,136,168,.45);border-radius:.6cqi}
.presenter{position:fixed;inset:0;z-index:800;background:#0C0E12;display:flex;flex-direction:column;animation:fade-in .4s}
.presenter.closing{animation:fade-out .3s both}
.pr-stage{flex:1;display:grid;place-items:center;padding:3vmin;cursor:pointer}
.pr-slide{width:min(100%,calc((100dvh - 90px) * 16 / 9));box-shadow:0 30px 90px rgba(0,0,0,.6)}
.pr-slide.swap{animation:paper-in .5s var(--ios) both}
.pr-bar{display:flex;justify-content:center;align-items:center;gap:10px;padding:10px;color:#F1EBE1}
.pr-bar .ib{color:#F1EBE1}
.pr-count{font-size:13px;min-width:60px;text-align:center}

/* code */
.lang-badge{background:var(--g-agent);color:#141922;height:24px;flex:none}
.ed-tools .b kbd{height:18px;font-size:10px;background:rgba(255,255,255,.35);border-color:transparent;color:inherit}
.b.running .i{animation:spin 1s linear infinite}
.code-split{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
.code-split.solo{grid-template-columns:minmax(0,1fr)}
@container ws (max-width:720px){.code-split{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1.1fr) minmax(0,.9fr)}}
.code-editor{min-width:0;min-height:0;display:flex;background:#1B2028;color:#E6E1D8;font-family:var(--mono);font-size:13px;line-height:21px;text-align:left}
.gutter{flex:none;width:48px;padding:12px 8px 12px 0;overflow:hidden;text-align:right;color:#5B6370;user-select:none;background:#171B22;border-right:1px solid rgba(255,255,255,.05)}
.gutter span{display:block;height:21px}
.code-area{position:relative;flex:1;min-width:0}
.code-hl,.code-input{position:absolute;inset:0;margin:0;padding:12px 16px;font:inherit;line-height:inherit;white-space:pre;overflow:auto;tab-size:2;border:0}
.code-hl{pointer-events:none;overflow:hidden;color:#E6E1D8;z-index:1}
.code-input{z-index:2;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.22) transparent}
.code-input::-webkit-scrollbar{width:11px;height:11px}
.code-input::-webkit-scrollbar-thumb{background:rgba(255,255,255,.2);border-radius:99px;border:3px solid transparent;background-clip:content-box}
.code-input::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.34);background-clip:content-box}
/* the caret's line, highlighted behind the text */
.code-active{position:absolute;inset-inline:0;top:0;height:21px;z-index:0;pointer-events:none;background:rgba(255,255,255,.05);
  box-shadow:inset 2px 0 0 rgba(243,226,189,.5);opacity:1;transition:transform .12s linear,opacity .3s var(--ios)}
.code-active.off{opacity:0}
.gutter span.on{color:#F3E2BD}
.code-hl.wrap,.code-input[wrap="soft"]{white-space:pre-wrap;word-break:break-word}
.code-input{background:transparent;color:transparent;caret-color:#F3E2BD;resize:none;outline:none}
.code-input::selection{background:rgba(143,160,184,.35);color:transparent}
.code-out{min-width:0;min-height:0;display:flex;flex-direction:column;border-inline-start:1px solid var(--line);background:var(--surface)}
@container ws (max-width:720px){.code-out{border-inline-start:0;border-top:1px solid var(--line)}}
.out-tabs{margin:8px;align-self:flex-start}
.out-tabs button{min-height:30px;font-size:12px}
.con-count{min-width:18px;height:17px;padding:0 5px;border-radius:9px;font-size:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--ink) 12%,transparent);color:var(--ink-soft)}
.con-count.err{background:linear-gradient(135deg,#F08A6E,#D0453A);color:#fff}
.out-body{flex:1;min-height:0;position:relative}
.out-pane{position:absolute;inset:0;overflow:auto}
.out-frame{width:100%;height:100%;border:0;background:#fff;animation:fade-in .4s}
.out-empty{height:100%;display:grid;place-content:center;justify-items:center;gap:10px;color:var(--muted);font-size:13px;text-align:center;padding:20px;max-width:340px;margin:0 auto}

/* ── Opinion pane: what e'thix thinks of the file ── */
.op{padding:14px;display:grid;gap:14px;align-content:start}
.op-load{height:100%;display:grid;place-content:center;justify-items:center;gap:12px;color:var(--muted)}
.op-top{display:flex;gap:12px;align-items:flex-start}
.op-top p{margin:0;font-size:13px;line-height:1.6;color:var(--ink-soft)}
.op-score{flex:none;display:grid;place-items:center;width:62px;padding:8px 0;border-radius:14px;background:var(--surface);border:1px solid var(--line)}
.op-score b{font-size:20px;font-weight:700;line-height:1}
.op-score small{font-size:10px;color:var(--muted)}
.op-score.good b{color:#2F8A55}.op-score.mid b{color:#C08A2E}.op-score.low b{color:#C2473A}
.op-sec h4{display:flex;align-items:center;gap:7px;margin:0 0 7px;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.op-sec h4 .i{width:14px;height:14px}
.op-sec.good h4 .i{color:#2F8A55}
.op-sec ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.op-sec li{display:grid;gap:2px;font-size:12.5px;line-height:1.55;padding:8px 10px;border-radius:11px;background:var(--surface);border:1px solid var(--line);color:var(--ink-soft)}
.op-sec li b{color:var(--ink);font-size:13px}
.op-sec.good li{padding:6px 10px;border-style:dashed}
.op-clean{display:flex;align-items:center;gap:8px;margin:0;font-size:13px;color:#2F8A55}
.op-foot{display:flex;justify-content:flex-start}
.out-empty .i{width:30px;height:30px;color:#7488A8}
.out-console{background:#12151B}
.con-list{list-style:none;margin:0;padding:8px 0;font-family:var(--mono);font-size:12.5px;color:#D9D4CA}
.con-list li{display:flex;gap:8px;padding:4px 12px;border-bottom:1px solid rgba(255,255,255,.04);animation:item-in .3s var(--ios) both}
.con-list pre{margin:0;white-space:pre-wrap;word-break:break-word;font:inherit}
.con-ic{flex:none;color:#5B6370;padding-top:2px}
.con-ic .i{width:12px;height:12px}
.con-error{color:#F4A596;background:rgba(240,84,60,.08)}
.con-error .con-ic{color:#F08A6E}
.con-warn{color:#F2D38A;background:rgba(242,197,17,.06)}
.con-info{color:#9CC4F5}

/* ─── review panel ─── */
.rvw{height:100%;display:flex;flex-direction:column}
.rv-head{display:flex;align-items:center;gap:8px;padding:10px 12px 10px 16px;border-bottom:1px solid var(--line);min-height:56px}
html[dir="rtl"] .rv-head{padding:10px 16px 10px 12px}
.rv-head h3{font-size:18px;font-weight:700;flex:1}
.rv-scroll{flex:1;min-height:0;overflow-y:auto;padding:16px;display:grid;gap:14px;align-content:start}
.rv-loading{justify-items:stretch}
.rv-loading .shimmer-text{text-align:center;font-size:13px;font-weight:600}
.rv-summary{display:grid;justify-items:center;gap:16px;padding:6px 0 14px;border-bottom:1px solid var(--line)}
.rv-summary .donut{color:var(--ink)}
.rv-summary .legend{width:100%;padding:0 6px}
.rv-meta{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center}
.rv-score{display:grid;justify-items:center;padding:8px 14px;border-radius:14px;background:color-mix(in srgb,var(--ink) 5%,transparent)}
.rv-score small{font-size:10.5px;color:var(--muted);font-weight:600}
.rv-score b{font-size:22px;font-family:'Montserrat',var(--lt);line-height:1.1}
.rv-score b i{font-style:normal;font-size:11px;color:var(--muted)}
.rv-score.good b{color:var(--ok)}.rv-score.mid b{color:var(--warn)}.rv-score.low b{color:var(--danger)}
.rv-progress{display:grid;gap:6px}
.rv-progress small{font-size:12px;color:var(--ink-soft)}
.bar{display:block;height:7px;border-radius:7px;background:color-mix(in srgb,var(--ink) 9%,transparent);overflow:hidden}
.bar i{display:block;height:100%;border-radius:7px;background:var(--g-agent);width:var(--w,0%);transition:width .8s var(--ios)}
.rv-text{font-size:13.5px;line-height:1.65;color:var(--ink-soft)}
.rv-block{display:grid;gap:10px}
.rv-block h4{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;letter-spacing:.02em;color:var(--ink)}
.rv-block h4 .i{width:15px;height:15px;color:var(--gold-deep)}
.rv-good h4 .i{color:var(--ok)}
.rv-block h4 .rv-gcount{margin-inline-start:auto}
.rv-goods{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.rv-goods li{display:flex;gap:9px;align-items:flex-start;padding:9px 12px;border-radius:12px;font-size:13px;line-height:1.5;color:var(--ink-soft);
  background:color-mix(in srgb,var(--ok) 9%,transparent);animation:item-in .4s var(--ios) both}
.rvg-dot{width:18px;height:18px;border-radius:50%;flex:none;display:grid;place-items:center;background:color-mix(in srgb,var(--ok) 22%,transparent);color:var(--ok)}
.rvg-dot .i{width:12px;height:12px;stroke-width:2.6}
.rv-next{padding:14px;border-radius:18px;background:color-mix(in srgb,var(--accent-b) 10%,transparent);border:1px solid color-mix(in srgb,var(--accent-b) 25%,transparent)}
.rv-steps{list-style:none;margin:0;padding:0;display:grid;gap:10px;counter-reset:rvs}
.rv-steps li{display:flex;gap:10px;font-size:13px;line-height:1.55;color:var(--ink-soft)}
.rv-steps b{display:block;color:var(--ink);font-size:13.5px;margin-bottom:1px}
.rvs-n{width:22px;height:22px;border-radius:50%;flex:none;display:grid;place-items:center;background:var(--g-accent);color:var(--on-accent);font-size:11.5px;font-weight:700}
.rv-group{border-radius:18px;border:1px solid var(--line);background:var(--surface-2);overflow:hidden;animation:rise-in .5s var(--ios) both}
.rv-gh{display:flex;align-items:center;gap:10px;width:100%;padding:14px 16px;text-align:start;font-size:15px;transition:background var(--t)}
.rv-gh:hover{background:color-mix(in srgb,var(--accent-b) 8%,transparent)}
.rv-gdot{width:10px;height:10px;border-radius:50%;flex:none;background:var(--dot,currentColor)}
.rv-gh b{flex:1}
.rv-gcount{font-size:12px;font-weight:700;min-width:24px;height:22px;padding:0 7px;border-radius:11px;display:grid;place-items:center;background:color-mix(in srgb,var(--ink) 8%,transparent)}
.rv-chev{width:16px;height:16px;color:var(--muted);transition:transform .5s var(--spring)}
.rv-group:not(.open) .rv-chev{transform:rotate(-90deg)}
html[dir="rtl"] .rv-group:not(.open) .rv-chev{transform:rotate(90deg)}
.rv-list{list-style:none;margin:0;padding:0 8px;display:grid;grid-template-rows:1fr;transition:grid-template-rows .5s var(--ios),padding .4s}
.rv-group:not(.open) .rv-list{display:none}
.rv-group.open .rv-list{padding-bottom:8px;border-top:1px solid var(--line)}
.rv-item{border-bottom:1px solid var(--line)}
.rv-item:last-child{border-bottom:0}
.rv-row{display:flex;align-items:center;gap:10px;width:100%;padding:11px 8px;text-align:start;font-size:13.5px;border-radius:10px;transition:background var(--t)}
.rv-status{width:18px;height:18px;display:grid;place-items:center;flex:none}
.rv-status i{width:9px;height:9px;border-radius:50%;background:var(--dot,currentColor)}
.rv-status .i{width:16px;height:16px;color:var(--ok);stroke-width:2.6}
.rv-title{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink)}
.rv-item.open .rv-title{white-space:normal}
.rv-item.resolved .rv-title{color:var(--muted);text-decoration:line-through;text-decoration-color:color-mix(in srgb,var(--muted) 60%,transparent)}
.rv-detail{display:none;padding:0 8px 12px 36px;font-size:13px;color:var(--ink-soft);line-height:1.6}
html[dir="rtl"] .rv-detail{padding:0 36px 12px 8px}
.rv-item.open .rv-detail{display:grid;gap:8px;animation:fade-up .4s var(--ios) both}
.rv-detail blockquote{margin:0;padding:6px 12px;border-inline-start:3px solid #F2C511;background:rgba(242,197,17,.08);border-radius:0 8px 8px 0;font-size:12.5px;color:var(--ink)}
html[dir="rtl"] .rv-detail blockquote{border-radius:8px 0 0 8px}
.rv-fix{display:flex;gap:8px;align-items:flex-start;color:var(--ink)}
.rv-fix .i{width:15px;height:15px;color:#7488A8;margin-top:3px}
.rv-actions{display:flex;flex-wrap:wrap;gap:6px}
.rv-foot{display:flex;align-items:center;gap:6px;justify-content:center;font-size:11.5px;color:var(--muted)}
.rv-foot .i{width:13px;height:13px}

@media (max-width:640px){
  .ed-scroll{padding:14px 8px 40px}
  .paper{padding:28px 18px}
  .slides-body{grid-template-columns:1fr;grid-template-rows:auto 1fr}
  .slide-rail{display:flex;overflow-x:auto;border-inline-end:0;border-bottom:1px solid var(--line);padding:8px}
  .thumb{width:120px;flex:none}
  .wse-grid{grid-template-columns:repeat(2,1fr)}
  .ws-body.with-review{grid-template-rows:minmax(0,1fr) 1px minmax(0,1.2fr)}
}
/* A9 (W4 extras): «تابع قضيتك الأخيرة» on the Agent home */
.c-hero .agl-continue{display:flex;align-items:center;gap:12px;width:100%;max-width:640px;margin:0 auto 12px;padding:12px 14px;min-height:56px;border-radius:16px;text-align:start;color:var(--ink);background:color-mix(in srgb,var(--accent-c) 10%,var(--surface));border:1px solid color-mix(in srgb,var(--accent-c) 45%,var(--line));cursor:pointer;box-sizing:border-box}
.agl-continue-ic{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:12px;background:var(--surface);border:1px solid var(--line)}
.agl-continue-txt{flex:1;min-width:0;display:grid;gap:2px}
.agl-continue-txt b{font-size:14px}
.agl-continue-case{font-size:13px;font-weight:700;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.agl-continue-sub{font-size:12px;color:var(--ink-soft)}
@media (hover:hover){.c-hero .agl-continue:hover{border-color:var(--accent-c)}}
.c-hero .agl-continue:focus-visible{outline:2px solid var(--accent-c);outline-offset:2px}
@media (forced-colors:active){ .c-hero .agl-continue{border:1px solid CanvasText} }