/* Vantriq: live pictures of the app, drawn in HTML. No images. */
:root{ --vt: #9B7DF2; } :root[data-theme="light"]{ --vt: #6D3BE8; }
.rep{ position:relative; border-radius: 16px; overflow:hidden; text-align:left;
  -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; }
.rep::after{ content:""; position:absolute; inset:auto 15% -40% 15%; height:60%; z-index:-1; pointer-events:none;
  background: radial-gradient(closest-side, rgba(var(--vi), .16), transparent); filter: blur(40px); }
.rb{ display:flex; align-items:center; gap:6px; height:34px; padding: 0 16px; border-bottom: 1px solid rgba(var(--ink), .08); }
.rb i{ width:9px; height:9px; border-radius:50%; background: rgba(var(--ink), .2); }
.rb .meta{ margin-left:auto; font-size:.56rem; }
.rbd{ padding: 22px 24px; }
.rf{ display:flex; justify-content:space-between; gap:16px; padding: 12px 24px; border-top: 1px solid rgba(var(--ink), .08); }
.rf .meta{ font-size:.56rem; color: rgba(var(--ink), .42); }
.rep .meta{ letter-spacing:.18em; }
.rep button{ font: inherit; color: inherit; -webkit-tap-highlight-color: transparent; }
.rep button:focus-visible{ outline:1px solid rgba(var(--vi), .9); outline-offset:2px; }
.chipb{ -webkit-appearance:none; appearance:none; cursor:pointer; background:none; border:1px solid rgba(var(--ink), .18); border-radius:999px;
  padding: 6px 12px; font-size:.8rem !important; color: rgba(var(--ink), .72) !important; transition: border-color 300ms var(--ease), background 300ms var(--ease), color 300ms var(--ease); }
.chipb:hover{ border-color: rgba(var(--ink), .38); color: rgba(var(--ink), .95) !important; }
.chipb[aria-pressed="true"], .chipb.on{ border-color: rgba(var(--vi), .9); background: rgba(var(--vi), .14); color: rgba(var(--ink), .98) !important; }
.chipb.go{ background: var(--violet); border-color: var(--violet); color:#fff !important; }
.chipb.go:hover{ box-shadow: 0 0 20px rgba(var(--vi), .5); }
.lnkb{ -webkit-appearance:none; appearance:none; cursor:pointer; background:none; border:0; padding:0; color: var(--vt) !important;
  border-bottom: 1px solid rgba(var(--vi), .35); font-size:.85rem !important; }
.badge{ display:inline-block; padding: 2px 7px; border-radius: 6px; font-size:.56rem; letter-spacing:.12em; font-weight:500;
  background: rgba(var(--ink), .08); color: rgba(var(--ink), .6); }
.mutedp{ color: rgba(var(--ink), .5); font-size:.85rem; }

/* ---------- the chat ---------- */
.rep-chat .rbd{ display:grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 28px; min-height: 340px; }
.rc-ex{ display:flex; flex-wrap:wrap; gap:8px; }
.rc-q{ margin-top: 22px; padding: 14px 16px; border-radius: 12px; background: rgba(var(--ink), .06); color: rgba(var(--ink), .92); font-size: 1rem; line-height:1.5; min-height: 52px; }
.rc-q .car{ display:inline-block; width:1px; height:1em; background: var(--violet); vertical-align:-2px; margin-left:1px; animation: blink 1s steps(1) infinite; }
@keyframes blink{ 50%{ opacity:0; } }
.rc-a{ margin-top: 18px; font-size: 1.02rem; line-height:1.65; color: rgba(var(--ink), .86); min-height: 6.6em; }
.rc-a .w{ opacity:0; transition: opacity 260ms var(--ease); } .rc-a .w.in{ opacity:1; }
.cite{ -webkit-appearance:none; appearance:none; cursor:pointer; border:0; padding: 0 5px; margin-left: 3px; border-radius: 5px; vertical-align: 2px;
  font-size:.66rem !important; line-height:1.5; background: rgba(var(--vi), .16); color: var(--vt) !important; transition: background 200ms; }
.cite:hover, .cite.on{ background: var(--violet); color:#fff !important; }
.rc-src{ border-left: 1px solid rgba(var(--ink), .08); padding-left: 24px; display:flex; flex-direction:column; gap: 10px; }
.rc-src > .meta{ margin-bottom: 4px; }
.sc{ display:block; padding: 12px 14px; border-radius: 12px; border: 1px solid rgba(var(--ink), .1); background: rgba(var(--ink), .03);
  opacity:0; transform: translateY(6px); transition: opacity 400ms var(--ease), transform 400ms var(--ease), border-color 250ms, background 250ms; }
.sc.in{ opacity:1; transform:none; }
.sc.on{ border-color: rgba(var(--vi), .8); background: rgba(var(--vi), .08); }
.sc .n{ display:inline-block; min-width: 18px; text-align:center; border-radius:5px; font-size:.62rem; background: rgba(var(--vi), .16); color: var(--vt); margin-right: 6px; }
.sc .p{ font-size:.82rem; color: rgba(var(--ink), .86); word-break: break-word; }
.sc .pg{ display:block; margin-top: 4px; font-size:.55rem; }
.sc q{ display:block; margin-top: 8px; font-size: .82rem; line-height:1.5; color: rgba(var(--ink), .58); quotes: "\201C" "\201D"; }
.sc mark{ background:none; color: inherit; border-radius: 3px; transition: background 250ms, color 250ms; }
.sc.on mark{ background: rgba(var(--vi), .28); color: rgba(var(--ink), .98); }

/* ---------- a document page with the cited sentence ---------- */
.rep-doc .rbd{ display:flex; justify-content:center; padding: 28px 24px 30px; }
.page{ position:relative; width: min(100%, 420px); aspect-ratio: 1 / 1.18; border-radius: 6px; padding: 30px 30px;
  background: rgba(var(--ink), .045); border: 1px solid rgba(var(--ink), .1); display:flex; flex-direction:column; gap: 9px; }
:root[data-theme="light"] .page{ background:#fff; }
.page .t{ font-size:.55rem; margin-bottom: 8px; }
.page .l{ height: 7px; border-radius: 4px; background: rgba(var(--ink), .1); }
.page .hl{ position:relative; font-size:.84rem; line-height:1.55; color: rgba(var(--ink), .9); padding: 6px 8px; margin: 4px -8px; border-radius: 6px; background: rgba(var(--vi), .18); }
.page .hl .cite{ position:absolute; right:-14px; top:-10px; background: var(--violet); color:#fff !important; }
.rep-doc:hover .hl{ animation: pulseh 1.2s var(--ease) 1; }
@keyframes pulseh{ 40%{ background: rgba(var(--vi), .34); } }
.page .open{ position:absolute; right: 18px; bottom: 16px; }

/* ---------- do it ---------- */
.rep-doit .rbd{ display:flex; flex-direction:column; gap: 16px; }
.bub{ align-self:flex-end; max-width: 86%; padding: 12px 16px; border-radius: 14px 14px 4px 14px; background: rgba(var(--ink), .07); color: rgba(var(--ink), .92); font-size:.98rem; line-height:1.5; }
.dx{ align-self:flex-start; }
.dmore{ overflow:hidden; height:0; transition: height 520ms var(--ease); }
.dmore > div{ display:flex; flex-direction:column; gap: 14px; padding-top: 2px; }
.dst{ font-size:.92rem; color: rgba(var(--ink), .58); }
.plan{ padding: 16px 18px; border-radius: 14px; border: 1px solid rgba(var(--ink), .12); background: rgba(var(--ink), .03); }
.plan .h{ font-size:.95rem; color: rgba(var(--ink), .9); }
.plan .act{ display:flex; gap: 12px; align-items:flex-start; margin-top: 12px; font-size:.95rem; color: rgba(var(--ink), .86); line-height:1.45; }
.deck{ flex:none; width: 30px; height: 22px; border-radius: 4px; border: 1px solid rgba(var(--ink), .4); position:relative; margin-top: 1px; }
.deck::after{ content:""; position:absolute; left:5px; right:5px; bottom:5px; height:2px; background: var(--violet); border-radius:2px; }
.plan ol{ margin: 12px 0 0 42px; font-size:.85rem; line-height:1.75; color: rgba(var(--ink), .62); }
.plan .ch{ display:flex; gap: 8px; margin-top: 14px; }
.res{ font-size:.95rem; color: rgba(var(--ink), .88); line-height:1.6; }
.res .links{ display:flex; flex-wrap:wrap; gap: 6px 14px; margin-top: 6px; }
.prog{ height: 3px; border-radius: 3px; background: rgba(var(--ink), .1); overflow:hidden; }
.prog i{ display:block; height:100%; width:0; background: var(--violet); transition: width 900ms var(--ease); }
.step-in{ animation: stepin 420ms var(--ease) both; }
@keyframes stepin{ from{ opacity:0; transform: translateY(6px); } to{ opacity:1; transform:none; } }

/* ---------- projects ---------- */
.prj h4{ font-weight:300; font-size: 1.25rem; color: rgba(var(--ink), .96); letter-spacing:-.01em; }
.prj .grid{ display:grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 24px; margin-top: 16px; }
.ins{ margin-top: 8px; padding: 12px 14px; border-radius: 10px; border: 1px solid rgba(var(--ink), .12); font-size:.88rem; line-height:1.55; color: rgba(var(--ink), .82); background: rgba(var(--ink), .03); }
.fchips{ display:flex; flex-wrap:wrap; gap: 6px; margin-top: 8px; }
.fchips .chipb{ font-size:.74rem !important; padding: 5px 10px; }
.chats{ list-style:none; display:flex; flex-direction:column; }
.chats li{ padding: 10px 0; border-top: 1px solid rgba(var(--ink), .08); font-size:.88rem; color: rgba(var(--ink), .84); line-height:1.4; }
.chats li:first-child{ border-top:0; }
.chats li span{ display:block; margin-top: 2px; font-size:.55rem; }
.prj .sub{ margin-top: 18px; }

/* ---------- graph ---------- */
.rep-graph .rbd{ display:grid; grid-template-columns: minmax(0, 1.9fr) minmax(0, 1fr); gap: 20px; align-items:start; }
.gsvg{ width:100%; height:auto; display:block; touch-action: manipulation; }
.gsvg .e{ stroke: rgba(var(--ink), .16); stroke-width: 1; transition: stroke 250ms, opacity 250ms; }
.gsvg .e.on{ stroke: rgba(var(--vi), .85); stroke-width: 1.4; }
.gsvg .nd{ cursor:pointer; transition: opacity 250ms; }
.gsvg .nd text{ font: 400 14px "Hanken Grotesk", system-ui, sans-serif; fill: rgba(var(--ink), .74); }
.gsvg .nd.dim, .gsvg .e.dim{ opacity:.25; }
.gsvg .nd.sel text{ fill: rgba(var(--ink), 1); font-weight:500; }
.gsvg .person{ fill: rgba(var(--ink), .85); }
.gsvg .org{ fill: var(--violet); }
.gsvg .place{ fill: #3FA7A0; }
.gsvg .doc{ fill: rgba(var(--ink), .3); }
.gsvg .ring{ fill:none; stroke: var(--violet); stroke-width:1.2; opacity:0; }
.gsvg .nd.sel .ring{ opacity:.8; }
.legend{ display:flex; flex-wrap:wrap; gap: 6px 14px; margin-top: 10px; }
.legend span{ display:inline-flex; align-items:center; gap:6px; font-size:.55rem; }
.legend i{ width:8px; height:8px; border-radius:50%; }
.ent{ padding: 14px 16px; border-radius: 12px; border: 1px solid rgba(var(--ink), .1); background: rgba(var(--ink), .03); }
.ent h4{ font-weight:300; font-size: 1.2rem; color: rgba(var(--ink), .96); margin-top: 4px; }
.ent .k{ margin-top: 14px; font-size:.55rem; }
.ent .v{ display:flex; flex-wrap:wrap; gap: 5px; margin-top: 6px; }
.ent .v span{ padding: 3px 8px; border-radius: 999px; font-size:.72rem; border:1px solid rgba(var(--ink), .14); color: rgba(var(--ink), .78); }
.ent .f{ margin-top: 6px; font-size:.8rem; color: rgba(var(--ink), .72); line-height:1.5; word-break: break-word; }

/* ---------- files ---------- */
.rep-files .rbd{ display:grid; grid-template-columns: 150px minmax(0, 1fr); gap: 20px; }
.fold{ list-style:none; display:flex; flex-direction:column; gap: 2px; }
.fold li{ padding: 7px 10px; border-radius: 8px; font-size:.86rem; color: rgba(var(--ink), .82); display:flex; justify-content:space-between; gap:8px; }
.fold li span{ font-size:.72rem; color: rgba(var(--ink), .42); }
.fold li.on{ background: rgba(var(--ink), .07); }
.fl{ list-style:none; }
.fl li{ display:flex; align-items:center; gap: 12px; padding: 9px 0; border-top: 1px solid rgba(var(--ink), .08); transition: opacity 300ms; }
.fl li:first-child{ border-top:0; }
.fl .nm{ flex:1; min-width:0; font-size:.86rem; color: rgba(var(--ink), .88); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fl .nm span{ display:block; font-size:.55rem; margin-top: 2px; }
.fl li.out .nm{ color: rgba(var(--ink), .45); }
.sw{ -webkit-appearance:none; appearance:none; cursor:pointer; flex:none; width: 34px; height: 20px; border-radius: 999px; border: 0; padding:0; position:relative;
  background: var(--violet); transition: background 250ms; }
.sw::after{ content:""; position:absolute; top:3px; left:17px; width:14px; height:14px; border-radius:50%; background:#fff; transition: left 250ms var(--ease); }
.sw[aria-checked="false"]{ background: rgba(var(--ink), .2); }
.sw[aria-checked="false"]::after{ left:3px; }
.lo{ margin-top: 14px; font-size:.55rem; }

/* ---------- control ---------- */
.kv{ display:grid; grid-template-columns: auto 1fr; gap: 8px 24px; font-size:.88rem; }
.kv dt{ color: rgba(var(--ink), .5); } .kv dd{ color: rgba(var(--ink), .9); }
.dels{ margin-top: 20px; display:flex; flex-direction:column; gap: 8px; }
.del{ display:flex; align-items:center; justify-content:space-between; gap: 16px; padding: 12px 14px; border-radius: 10px; border: 1px solid rgba(var(--ink), .1); background: rgba(var(--ink), .03); }
.del b{ display:block; font-weight:400; font-size:.9rem; color: rgba(var(--ink), .9); }
.del span{ display:block; font-size:.78rem; color: rgba(var(--ink), .5); margin-top: 2px; }
.del .chipb{ flex:none; color: #E0677A !important; border-color: rgba(224,103,122,.4); }
.del .note{ color: var(--vt); }

/* ---------- homepage tiles ---------- */
.tiles{ display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 32px; }
.tile .rbd{ padding: 20px 20px 22px; display:flex; flex-direction:column; gap: 12px; min-height: 210px; }
.tile .hd{ display:flex; align-items:center; gap: 10px; }
.tile .hd .lab2{ font-size:.62rem; letter-spacing:.2em; text-transform:uppercase; color: var(--vt); }
.tile .pillb{ font-size:.52rem; padding: 3px 8px; }
.tile .qq{ font-size:.88rem; color: rgba(var(--ink), .9); padding: 9px 12px; border-radius: 10px; background: rgba(var(--ink), .06); line-height:1.45; }
.tile .aa{ font-size:.88rem; line-height:1.55; color: rgba(var(--ink), .78); }
.tile .srcc{ align-self:flex-start; font-size:.72rem; padding: 4px 10px; border-radius: 999px; border:1px solid rgba(var(--ink), .14); color: rgba(var(--ink), .7); }
.anon-s{ font-size: .98rem; line-height:1.75; color: rgba(var(--ink), .86); }
.nm2{ position:relative; display:inline-grid; vertical-align: baseline; }
.nm2 > span{ grid-area: 1 / 1; transition: opacity 500ms var(--ease), filter 500ms var(--ease); white-space:nowrap; }
.nm2 .ph{ opacity:0; filter: blur(3px); font-size:.8em; padding: 1px 6px; border-radius: 6px; background: rgba(var(--vi), .16); color: var(--vt); align-self:center; justify-self:start; }
.anon-s.ph .nm2 .og{ opacity:0; filter: blur(3px); }
.anon-s.ph .nm2 .ph{ opacity:1; filter:none; }
.tile .pc{ padding: 12px 14px; border-radius: 12px; border:1px solid rgba(var(--ink), .12); font-size:.86rem; line-height:1.5; color: rgba(var(--ink), .86); }
.tile .pc .ch{ display:flex; gap: 6px; margin-top: 10px; }

@media (max-width: 860px){
  .rep-chat .rbd, .rep-graph .rbd, .prj .grid{ grid-template-columns: minmax(0, 1fr); }
  .rc-src{ border-left:0; border-top: 1px solid rgba(var(--ink), .08); padding: 18px 0 0; }
  .rbd{ padding: 18px 16px; } .rf{ padding: 10px 16px; }
  .rep-files .rbd{ grid-template-columns: minmax(0, 1fr); }
  .fold{ flex-direction:row; flex-wrap:wrap; gap: 4px; }
  .fold li{ padding: 5px 9px; font-size:.78rem; }
  .tiles{ grid-template-columns: minmax(0, 1fr); }
  .tile .rbd{ min-height:0; }
  .page{ padding: 22px 20px; }
}
@media (prefers-reduced-motion: reduce){
  .rc-q .car{ animation:none; } .rep-doc:hover .hl{ animation:none; } .step-in{ animation:none; }
  .dmore{ transition:none; } .sc, .rc-a .w{ transition:none; }
}
.pillb{ display:inline-block; padding: 3px 9px; border: 1px solid rgba(var(--vi), .75); border-radius: 999px; font-size:.55rem; font-weight:400; letter-spacing:.2em; text-transform:uppercase; line-height:1.3; color: var(--vt, #9B7DF2); }
.tiles + .more{ margin-top: 24px; }
.gsvg .nd.doc-n text{ font-size: 12px; fill: rgba(var(--ink), .55); }
.gsvg .nd:focus{ outline:none; } .gsvg .nd:focus-visible .ring{ opacity:.9; }

/* ---------- source links ---------- */
.sl-l{ display:flex; flex-wrap:wrap; gap: 4px 14px; margin-top: 10px; }
.sl-l .lnkb{ font-size:.78rem !important; }
.rf .lnkb{ font-size:.75rem !important; }
.plan .from{ margin: 12px 0 0 42px; font-size:.55rem; }

/* ---------- the window with the example file ---------- */
.vw{ position:fixed; inset:0; z-index:50; display:grid; place-items:center; padding: 24px;
  background: rgba(4,4,8,.55); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); opacity:0; transition: opacity 250ms var(--ease);
  -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; }
:root[data-theme="light"] .vw{ background: rgba(240,238,232,.6); }
.vw.in{ opacity:1; } .vw[hidden]{ display:none; }
.vw-box{ position:relative; width: min(720px, 100%); max-height: calc(100vh - 48px); overflow:auto; border-radius: 16px; transform: translateY(10px) scale(.98); transition: transform 300ms var(--ease); }
.vw.in .vw-box{ transform:none; }
.vw .rb .meta{ margin-left: 10px; margin-right:auto; text-transform:none; letter-spacing:.02em; font-size:.8rem; color: rgba(var(--ink), .75); }
.vw-x{ -webkit-appearance:none; appearance:none; cursor:pointer; background:none; border:0; color: rgba(var(--ink), .7); font-size: 1.3rem; line-height:1; padding: 2px 6px; }
.vw-x:hover{ color: rgba(var(--ink), 1); }
.vw-b{ padding: 24px; }
.vw-n{ margin-top: 16px; font-size:.55rem; color: rgba(var(--ink), .42); text-align:center; }
.doc{ max-width: 520px; margin: 0 auto; padding: 32px 36px; border-radius: 6px; background: rgba(var(--ink), .05); border: 1px solid rgba(var(--ink), .1); }
:root[data-theme="light"] .doc{ background:#fff; }
.doc-h{ display:flex; justify-content:space-between; align-items:baseline; gap: 16px; padding-bottom: 14px; margin-bottom: 14px; border-bottom: 1px solid rgba(var(--ink), .12); }
.doc-h b{ font-weight:400; font-size: 1rem; color: rgba(var(--ink), .95); }
.doc p{ font-size:.9rem; line-height:1.6; color: rgba(var(--ink), .78); margin-top: 8px; }
.doc p.sec{ font-weight:500; color: rgba(var(--ink), .92); margin-top: 16px; }
.doc mark{ background: rgba(var(--vi), .24); color: rgba(var(--ink), .98); padding: 1px 3px; border-radius: 3px; }
.fdr{ display:grid; grid-template-columns: 150px minmax(0, 1fr); gap: 16px; }
.fdr-side{ display:flex; flex-direction:column; gap: 2px; font-size:.86rem; color: rgba(var(--ink), .8); }
.fdr-side .meta{ margin-bottom: 6px; } .fdr-side div{ padding: 6px 10px; border-radius: 8px; } .fdr-side div.on{ background: rgba(var(--ink), .08); }
.fdr-list{ list-style:none; }
.fdr-list li{ display:flex; align-items:center; gap: 10px; padding: 8px 10px; border-radius: 8px; font-size:.88rem; color: rgba(var(--ink), .84); }
.fdr-list li.on{ background: var(--violet); color:#fff; } .fdr-list li.on .badge{ background: rgba(255,255,255,.2); color:#fff; }
.deckv{ display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.sl{ position:relative; aspect-ratio: 16 / 9; border-radius: 8px; padding: 16px 18px; display:flex; flex-direction:column; justify-content:center; gap: 8px;
  background: rgba(var(--ink), .05); border: 1px solid rgba(var(--ink), .12); }
:root[data-theme="light"] .sl{ background:#fff; }
.sl b{ font-weight:400; font-size: 1rem; color: rgba(var(--ink), .95); } .sl span{ font-size:.78rem; line-height:1.45; color: rgba(var(--ink), .62); }
.sl.t{ background: linear-gradient(135deg, rgba(var(--vi), .9), rgba(var(--vi), .6)); border-color: transparent; } .sl.t b, .sl.t span{ color:#fff; } .sl.t b{ font-size: 1.2rem; }
.sl i{ position:absolute; right: 10px; bottom: 8px; font-style:normal; font-size:.5rem; }

/* ---------- homepage: the app, as it looks ---------- */
.appshot{ position:relative; margin-top: 40px; border-radius: 14px; overflow:hidden; border: 1px solid rgba(var(--ink), .12);
  box-shadow: 0 40px 120px -20px rgba(0,0,0,.55); -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; }
:root[data-theme="light"] .appshot{ box-shadow: 0 30px 90px -20px rgba(20,16,40,.22); }
.appshot .bar{ height: 30px; display:flex; align-items:center; gap: 7px; padding: 0 14px; background: rgba(var(--paper), .7); border-bottom: 1px solid rgba(var(--ink), .08); }
.appshot .bar i{ width:10px; height:10px; border-radius:50%; background: rgba(var(--ink), .22); }
.appshot .pic{ aspect-ratio: 1440 / 900; background-size: cover; background-position: center top;
  background-image: image-set(url("/product/img/chat-dark-1440.webp") 1x, url("/product/img/chat-dark-2880.webp") 2x); }
:root[data-theme="light"] .appshot .pic{ background-image: image-set(url("/product/img/chat-light-1440.webp") 1x, url("/product/img/chat-light-2880.webp") 2x); }
@media (max-width: 860px){ .fdr{ grid-template-columns: minmax(0,1fr); } .fdr-side{ flex-direction:row; flex-wrap:wrap; } .deckv{ grid-template-columns: minmax(0,1fr); } .doc{ padding: 22px 18px; } .vw-b{ padding: 16px; } .appshot{ margin-top: 28px; border-radius: 10px; } }

/* ---------- a Finder window, as on a Mac ---------- */
.vw.bare .vw-box{ background:none !important; border:0; box-shadow:none; -webkit-backdrop-filter:none; backdrop-filter:none; width: min(860px, 100%); }
.vw.bare .vw-box::before, .vw.bare .vw-box::after{ display:none; }
.vw.bare .vw-box > .rb{ display:none; }
.vw.bare .vw-b{ padding:0; }
.vw.bare .vw-n{ color: rgba(255,255,255,.6); }
:root[data-theme="light"] .vw.bare .vw-n{ color: rgba(0,0,0,.45); }
.fnd{ --f-bg:#1E1E1F; --f-side:rgba(44,44,48,.96); --f-bar:#2B2B2E; --f-tx:#E8E8EA; --f-dim:#98989D; --f-line:rgba(255,255,255,.07); --f-alt:rgba(255,255,255,.03);
  font: 13px/1.3 -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", "Hanken Grotesk", sans-serif; letter-spacing:0;
  border-radius: 12px; overflow:hidden; color: var(--f-tx); background: var(--f-bg);
  box-shadow: 0 0 0 .5px rgba(0,0,0,.6), 0 30px 80px rgba(0,0,0,.55); text-align:left; }
:root[data-theme="light"] .fnd{ --f-bg:#FFFFFF; --f-side:rgba(232,230,236,.96); --f-bar:#F3F2F5; --f-tx:#1D1D1F; --f-dim:#86868B; --f-line:rgba(0,0,0,.08); --f-alt:#F5F5F7;
  box-shadow: 0 0 0 .5px rgba(0,0,0,.18), 0 30px 80px rgba(20,16,40,.25); }
.fnd-bar{ display:flex; align-items:center; gap: 14px; height: 52px; padding: 0 16px; background: var(--f-bar); border-bottom: 1px solid var(--f-line); }
.fnd-bar .tl{ display:flex; gap: 8px; } .fnd-bar .tl i{ width:12px; height:12px; border-radius:50%; background:#FF5F57; cursor:pointer; }
.fnd-bar .tl i:nth-child(2){ background:#FEBC2E; cursor:default; } .fnd-bar .tl i:nth-child(3){ background:#28C840; cursor:default; }
.fnd-bar .nav{ color: var(--f-dim); font-size: 20px; margin-left: 46px; line-height:1; }
.fnd-bar b{ font-weight:600; font-size: 14px; }
.fnd-bar .srch{ margin-left:auto; color: var(--f-dim); font-size: 12px; padding: 4px 10px 4px 24px; border-radius: 6px; background: var(--f-line); position:relative; }
.fnd-bar .srch::before{ content:""; position:absolute; left:8px; top:7px; width:7px; height:7px; border:1.5px solid var(--f-dim); border-radius:50%; }
.fnd-main{ display:grid; grid-template-columns: 180px minmax(0, 1fr); min-height: 300px; }
.fnd-side{ background: var(--f-side); padding: 10px 10px 14px; display:flex; flex-direction:column; gap: 1px; border-right: 1px solid var(--f-line); }
.fnd-side span{ font-size: 11px; font-weight:600; color: var(--f-dim); padding: 10px 8px 4px; }
.fnd-side div{ padding: 4px 8px; border-radius: 6px; display:flex; align-items:center; gap: 7px; }
.fnd-side div.on{ background: rgba(128,128,140,.24); }
.fi{ width: 15px; height: 11px; border-radius: 2px; background: #3B8EEA; position:relative; flex:none; }
.fi::before{ content:""; position:absolute; left:0; top:-2px; width:7px; height:3px; border-radius: 2px 2px 0 0; background:#3B8EEA; }
.fnd-list{ overflow:hidden; }
.fnd-h, .fnd-r{ display:grid; grid-template-columns: minmax(0, 2.3fr) minmax(0, 1.5fr) 70px minmax(0, 1fr); gap: 10px; padding: 0 14px; align-items:center; }
.fnd-h{ height: 28px; font-size: 11px; color: var(--f-dim); border-bottom: 1px solid var(--f-line); }
.fnd-r{ height: 26px; } .fnd-r:nth-child(odd){ background: var(--f-alt); }
.fnd-r span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .fnd-r span:not(:first-child){ color: var(--f-dim); }
.fnd-r span:first-child{ display:flex; align-items:center; gap: 7px; }
.fnd-r.on{ background:#0A64D8 !important; color:#fff; border-radius: 5px; margin: 0 6px; padding: 0 8px; } .fnd-r.on span{ color:#fff !important; }
.dc{ flex:none; width: 11px; height: 14px; border-radius: 2px; background:#E5484D; position:relative; }
.dc-docx{ background:#2B6CDF; } .dc-xlsx{ background:#1E8E4E; } .dc-pptx{ background:#D9532B; }
.fnd-foot{ height: 26px; display:flex; align-items:center; justify-content:center; font-size: 11px; color: var(--f-dim); border-top: 1px solid var(--f-line); background: var(--f-bar); }
@media (max-width: 860px){ .fnd-main{ grid-template-columns: minmax(0,1fr); } .fnd-side{ display:none; } .fnd-h, .fnd-r{ grid-template-columns: minmax(0, 1fr) 90px; } .fnd-h span:nth-child(n+3), .fnd-r span:nth-child(n+3){ display:none; } .fnd-bar .nav{ margin-left: 10px; } }

/* ---------- a PowerPoint window ---------- */
.ppt{ --p-bg:#2B2B2B; --p-bar:#323232; --p-tx:#E8E8EA; --p-dim:#9A9A9F; --p-line:rgba(255,255,255,.08); --p-stage:#1F1F1F; --p-acc:#E8613C;
  font: 13px/1.3 -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", "Hanken Grotesk", sans-serif; letter-spacing:0; text-align:left;
  border-radius: 12px; overflow:hidden; color: var(--p-tx); background: var(--p-bg); box-shadow: 0 0 0 .5px rgba(0,0,0,.6), 0 30px 80px rgba(0,0,0,.55); }
:root[data-theme="light"] .ppt{ --p-bg:#F3F2F1; --p-bar:#E9E8E7; --p-tx:#1F1F1F; --p-dim:#6E6E73; --p-line:rgba(0,0,0,.1); --p-stage:#E1E0DF; --p-acc:#C43E1C;
  box-shadow: 0 0 0 .5px rgba(0,0,0,.18), 0 30px 80px rgba(20,16,40,.25); }
.ppt-bar{ position:relative; display:flex; align-items:center; height: 38px; padding: 0 14px; background: var(--p-bar); }
.ppt-bar .tl{ display:flex; gap: 8px; } .ppt-bar .tl i{ width:12px; height:12px; border-radius:50%; background:#FF5F57; cursor:pointer; }
.ppt-bar .tl i:nth-child(2){ background:#FEBC2E; cursor:default; } .ppt-bar .tl i:nth-child(3){ background:#28C840; cursor:default; }
.ppt-bar b{ position:absolute; left:50%; transform: translateX(-50%); font-weight:600; font-size: 13px; }
.ppt-bar .saved{ margin-left:auto; font-size: 11px; color: var(--p-dim); }
.ppt-tabs{ display:flex; gap: 18px; padding: 0 16px; height: 32px; align-items:flex-end; background: var(--p-bar); border-bottom: 1px solid var(--p-line); font-size: 12px; color: var(--p-dim); overflow:hidden; white-space:nowrap; }
.ppt-tabs span{ padding-bottom: 7px; border-bottom: 2px solid transparent; } .ppt-tabs span.on{ color: var(--p-tx); border-color: var(--p-acc); font-weight:500; }
.ppt-tools{ display:flex; align-items:center; gap: 10px; height: 44px; padding: 0 16px; border-bottom: 1px solid var(--p-line); }
.ppt-tools i{ width: 22px; height: 18px; border-radius: 4px; background: var(--p-line); } .ppt-tools u{ width:1px; height: 22px; background: var(--p-line); margin: 0 4px; }
.ppt-main{ display:grid; grid-template-columns: 150px minmax(0, 1fr); background: var(--p-stage); }
.ppt-th{ display:flex; flex-direction:column; gap: 12px; padding: 14px 12px; background: var(--p-bg); border-right: 1px solid var(--p-line); }
.th{ -webkit-appearance:none; appearance:none; border:0; background:none; padding:0; cursor:pointer; display:flex; gap: 6px; align-items:flex-start; color: var(--p-dim); font: 11px/1 -apple-system, sans-serif; }
.th .slide{ flex:1; border-radius: 3px; outline: 1px solid var(--p-line); }
.th.on .slide{ outline: 2px solid var(--p-acc); outline-offset: 1px; }
.ppt-stage{ padding: 26px 30px; display:flex; align-items:center; justify-content:center; min-height: 360px; }
.ppt-stage .slide{ width: 100%; box-shadow: 0 2px 10px rgba(0,0,0,.25); }
.ppt-foot{ display:flex; justify-content:space-between; height: 24px; align-items:center; padding: 0 14px; font-size: 11px; color: var(--p-dim); background: var(--p-bar); border-top: 1px solid var(--p-line); }

/* the slides: drawn at any size, every measure in container units */
.slide{ container-type: inline-size; aspect-ratio: 16 / 9; background:#FFFFFF; color:#1D1B26; overflow:hidden; position:relative; text-align:left;
  font-family: "Hanken Grotesk", "Helvetica Neue", Arial, sans-serif; }
.slide .s{ position:absolute; inset:0; padding: 6cqw 7cqw; }
.slide h4{ font-weight:300; font-size: 4.4cqw; letter-spacing:-.02em; color:#1D1B26; }
.slide h4::after{ content:""; display:block; width: 6cqw; height: .5cqw; margin-top: 1.6cqw; background:#6D3BE8; border-radius: 1cqw; }
.s1{ display:flex; align-items:center; padding:0 !important; background: linear-gradient(120deg, #F7F5FF, #FFFFFF 60%); }
.s1 .band{ position:absolute; left:0; top:0; bottom:0; width: 3cqw; background: linear-gradient(#6D3BE8, #9B7DF2); }
.s1 .tx{ padding-left: 10cqw; }
.s1 .k{ font-size: 1.7cqw; letter-spacing:.2em; text-transform:uppercase; color:#6D3BE8; }
.s1 h3{ font-weight:200; font-size: 8.5cqw; letter-spacing:-.04em; line-height:1; margin: 1.6cqw 0; color:#1D1B26; }
.s1 p{ font-size: 2.4cqw; color:#5B5866; }
.s1 .ft{ position:absolute; left: 10cqw; bottom: 5cqw; font-size: 1.4cqw; color:#8D8A97; }
.kpis{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 2.4cqw; margin-top: 3.4cqw; }
.kpis div{ padding: 2.2cqw 2.4cqw; border-radius: 1.2cqw; background:#F5F3FB; }
.kpis span{ display:block; font-size: 1.5cqw; color:#6E6A7A; text-transform:uppercase; letter-spacing:.14em; }
.kpis b{ display:block; font-weight:300; font-size: 4.4cqw; letter-spacing:-.02em; margin-top: .8cqw; }
.kpis i{ font-style:normal; font-size: 1.6cqw; } .kpis .up{ color:#1E8E4E; } .kpis .dn{ color:#D24B3F; }
.chart{ margin-top: 2.6cqw; }
.chart .ct{ font-size: 1.4cqw; color:#8D8A97; }
.bars{ display:flex; align-items:flex-end; gap: 3cqw; height: 15cqw; margin-top: 1cqw; padding-bottom: 2.4cqw; border-bottom: .15cqw solid #E4E1EC; }
.bc{ flex:1; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; position:relative; }
.bc u{ display:block; width: 100%; background: linear-gradient(#8C66F0, #6D3BE8); border-radius: .6cqw .6cqw 0 0; }
.bc em{ font-style:normal; font-size: 1.3cqw; color:#5B5866; margin-bottom: .5cqw; }
.bc span{ position:absolute; bottom: -2.4cqw; font-size: 1.3cqw; color:#8D8A97; }
.inv{ display:grid; grid-template-columns: 1fr 26cqw; gap: 4cqw; margin-top: 3cqw; align-items:center; }
.inv table{ width:100%; border-collapse:collapse; font-size: 1.7cqw; }
.inv th{ text-align:left; font-weight:400; color:#8D8A97; font-size: 1.3cqw; text-transform:uppercase; letter-spacing:.12em; padding-bottom: 1cqw; }
.inv td{ padding: 1.15cqw 0; border-top: .12cqw solid #ECE9F2; color:#2E2B38; }
.inv .st{ font-size: 1.2cqw; padding: .3cqw 1cqw; border-radius: 4cqw; background:#EEF6F1; color:#1E8E4E; } .inv .st.od{ background:#FCEDEB; color:#D24B3F; }
.donut{ text-align:center; } .donut svg{ width: 16cqw; height: 16cqw; transform: rotate(-90deg); }
.donut .d0{ fill:none; stroke:#ECE9F2; stroke-width: 5; } .donut .d1{ fill:none; stroke:#D24B3F; stroke-width: 5; }
.donut b{ display:block; font-weight:300; font-size: 3cqw; margin-top: 1cqw; } .donut span{ font-size: 1.4cqw; color:#6E6A7A; }
.cols{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 2.6cqw; margin-top: 4cqw; }
.cols div{ padding: 2.6cqw; border-radius: 1.2cqw; border: .15cqw solid #E4E1EC; }
.cols .n{ display:inline-grid; place-items:center; width: 3.6cqw; height: 3.6cqw; border-radius:50%; background:#6D3BE8; color:#fff; font-size: 1.7cqw; }
.cols b{ display:block; font-weight:400; font-size: 2.3cqw; margin-top: 1.8cqw; line-height:1.25; }
.cols p{ font-size: 1.6cqw; color:#6E6A7A; margin-top: 1cqw; }
.slide .away{ position:absolute; left: 7cqw; bottom: 5cqw; font-size: 1.6cqw; color:#8D8A97; }
@media (max-width: 860px){ .ppt-main{ grid-template-columns: minmax(0,1fr); } .ppt-th{ flex-direction:row; overflow-x:auto; border-right:0; border-bottom: 1px solid var(--p-line); } .th{ flex: 0 0 110px; } .ppt-stage{ padding: 14px; min-height:0; } .ppt-tabs span:nth-child(n+5){ display:none; } .ppt-tools{ display:none; } }