/* Vesika AI demo window: ported from vesika.ai's hero (live/index.html #giris), the app replica laid out at 1440×860
   and scaled as one picture. Its in-app tokens are scoped to the figure so they never reach the landing's own. */
#giris .g-fig {
  --font-sans: "Inter Variable", "Inter", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-serif: "Newsreader", Georgia, "Times New Roman", serif;
  --font-mono: var(--font-sans);

  --background: #ffffff;          /* sheet, card, popover */
  --card: #ffffff;
  --popover: #ffffff;
  --color-canvas: #f4f4f3;        /* behind the sheet + rail */
  --color-subtle: #f9f9f9;        /* recessed: search, icon tiles, card hover */
  --muted: #f4f4f3;               /* hover surface, user bubble */
  --muted-panel: #efefee;         /* --muted inside .vesika-sidebar */
  --color-selected: #e9e9e8;      /* current rail item, segment track */
  --foreground: #100f0e;
  --muted-foreground: #535250;
  --color-tertiary: #6d6c6a;
  --color-placeholder: #878684;
  --border: #e2e1e0;
  --input: #d7d7d5;
  --color-border-strong: #bbbab9;
  --ring: #bd8005;
  --color-accent-border: #f4c98e;
  --color-accent-solid: #bd8005;
  --color-accent-solid-hover: #a87100;
  --color-accent-text: #845a0f;
  --destructive: #dc2627;
  --color-danger-subtle: #fff2f0; --color-danger-border: #f7b4ab; --color-danger-text: #b32322;
  --success: #197037; --color-success-subtle: #ecfaee; --color-success-border: #9dd8a9; --color-success-solid: #25984d;
  --warning: #a24e10; --color-warning-subtle: #fff3ed; --color-warning-border: #f6bc9c; --color-warning-solid: #e8721c;
  --color-info: #2d74ca; --color-info-subtle: #eff6ff; --color-info-border: #aecaee; --color-info-text: #1e5ba1;

  --primary: #181716;
  --primary-foreground: #ffffff;
  --color-inverse-hover: #242322;
  --primary-gradient: linear-gradient(180deg, oklch(1 0 0 / 0.1) 0%, oklch(1 0 0 / 0) 45%, oklch(0 0 0 / 0.22) 100%);
  --primary-shadow:
    inset 0 1px 0 oklch(1 0 0 / 0.16), inset 0 0 0 1px oklch(1 0 0 / 0.06),
    inset 0 -4px 6px -3px oklch(0 0 0 / 0.6), 0 0 0 1px #0a0a0a,
    0 1px 1px oklch(0 0 0 / 0.18), 0 2px 4px oklch(0 0 0 / 0.12);
  --primary-shadow-pressed:
    inset 0 2px 4px oklch(0 0 0 / 0.6), inset 0 0 0 1px oklch(1 0 0 / 0.04),
    0 0 0 1px #0a0a0a;

  --radius-sm: 4px; --radius-md: 6px; --radius-lg: 8px; --radius-10: 10px;
  --radius-xl: 12px; --radius-2xl: 16px;
  --shadow-raised: 0 0 0 1px var(--border), 0 1px 2px oklch(0 0 0 / 0.06);
  --shadow-card: 0 0 0 1px var(--border), 0 1px 2px oklch(0 0 0 / 0.04);
  --shadow-sheet: 0 0 0 1px oklch(0 0 0 / 0.06), 0 1px 2px -1px oklch(0 0 0 / 0.06), 0 2px 4px 0 oklch(0 0 0 / 0.04);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --l-canvas: var(--color-canvas);
  --l-sheet: var(--background);
  --l-raised: var(--popover);
  --l-subtle: var(--color-subtle);
  --l-ink: var(--foreground);
  --l-ink-2: var(--muted-foreground);
  --l-ink-3: var(--color-tertiary);
  --l-line: var(--border);
  --l-line-2: var(--input);
  --l-amber: var(--color-accent-solid);
  --l-amber-text: var(--color-accent-text);
  --l-hit: color-mix(in oklab, var(--color-accent-border) 45%, transparent);
  --l-hit-current: var(--color-accent-border);
  --l-serif: var(--font-serif);
  --l-sans: var(--font-sans);
  --l-mono: var(--font-mono);
  --l-dark-canvas: #090908;
  --l-dark-sheet: #242423;
  --l-dark-ink: #f6f5f3;
  --l-dark-ink-2: #d7d6d3;
  --l-dark-ink-3: #bab9b6;
  --l-dark-line: #52514f;
  --l-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --l-ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
  --l-r-sm: 4px; --l-r-md: 8px; --l-r-lg: 12px;
  --l-nav-h: 64px;
  color-scheme: light;
}
#giris .g-fig *, #giris .g-fig ::before, #giris .g-fig ::after { border-color: var(--border); }
#giris .g-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
#giris .g-stage { position: relative; }

/* Search hit and Vesika icon accent (landing base styles the replica relies on) */
#giris .g-fig .hit { color: inherit; border-radius: 4px; padding: 0 2px; -webkit-box-decoration-break: clone; box-decoration-break: clone;
  background: linear-gradient(var(--l-hit), var(--l-hit)) no-repeat 0 0 / 0% 100%; transition: background-size .9s var(--l-ease), box-shadow .3s var(--l-ease); }
#giris .g-fig .hit.lit { background-size: 100% 100%; }
#giris .g-fig .vi .vi-a { opacity: .45; transition: opacity .2s ease, color .2s ease; }
#giris .g-fig .vi-lit .vi-a { opacity: 1; color: var(--l-amber); }

#giris .g-fig { position: relative; margin: 0 auto; width: min(1320px, calc(100% - 2 * clamp(20px, 4vw, 40px))); }
#giris .g-fig.is-phone { width: min(420px, calc(100% - 2 * clamp(20px, 4vw, 40px))); }
#giris .g-frame { position: relative; height: calc(860px * var(--s, .8)); border-radius: var(--l-r-lg); overflow: hidden; background: var(--color-canvas);
  box-shadow: 0 0 0 1px oklch(0 0 0 / 0.07), 0 1px 2px oklch(0 0 0 / 0.06), 0 40px 80px -40px oklch(0 0 0 / 0.28), 0 16px 32px -24px oklch(0 0 0 / 0.12); }

/* ---- App replica: native pixels from IN-APP-SPEC, scaled as one ---- */
#giris .ga { position: absolute; left: 0; top: 0; width: 1440px; height: 860px; transform: scale(var(--s, .8)); transform-origin: 0 0;
  display: flex; background: var(--color-canvas); color: var(--foreground); font-family: var(--font-sans); font-size: 16px; line-height: 1.5;
  text-align: left; letter-spacing: normal; text-wrap: wrap; user-select: none; -webkit-user-select: none; }
#giris .ga svg { display: block; flex: none; max-width: none; }
#giris .ga .l { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
#giris .ga .vi { fill: currentColor; overflow: visible; }
#giris .ga .vi .vi-a { opacity: .45; }
#giris .ga .vi-lit { --via: 1; --vic: var(--color-accent-solid); }
#giris .ga .i12 { width: 12px; height: 12px; }
#giris .ga .i14 { width: 14px; height: 14px; }
#giris .ga .i16 { width: 16px; height: 16px; }
#giris .ga .i18 { width: 18px; height: 18px; }
#giris .ga .i20 { width: 20px; height: 20px; }
#giris .ga p { text-wrap: wrap; }

/* Rail (Rail.tsx) */
#giris .ga-rail { width: 64px; flex: none; display: flex; flex-direction: column; align-items: center; padding: 8px 0 12px; }
#giris .ga-logo { margin-top: 10px; width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; }
#giris .ga-logo svg { width: 21.2px; height: 19px; }
#giris .ga-newwrap { padding: 10px 4px 8px; }
#giris .ga-new { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; color: var(--primary-foreground);
  background-color: var(--primary); background-image: var(--primary-gradient); box-shadow: var(--primary-shadow); }
#giris .ga-secs { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
#giris .ga-sec { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; color: var(--color-tertiary); }
#giris .ga-sec.is-cur { background: var(--color-selected); color: var(--foreground); }
#giris .ga-sec.is-cur .vi-a { opacity: .45; }
#giris .ga-acct { margin-top: auto; width: 36px; height: 36px; border-radius: 999px; display: grid; place-items: center; background: var(--background);
  box-shadow: 0 0 0 1px var(--border), 0 1px 2px oklch(0 0 0 / 0.06); font-size: 11px; line-height: 16.5px; font-weight: 600; }

/* Sheet + tool header (App.tsx) */
#giris .ga-sheet { position: relative; flex: 1; min-width: 0; margin: 8px 8px 8px 0; border-radius: 16px; background: var(--background); overflow: hidden;
  display: flex; flex-direction: column; box-shadow: 0 0 0 1px oklch(0 0 0 / 0.06), 0 1px 2px -1px oklch(0 0 0 / 0.06), 0 2px 4px 0 oklch(0 0 0 / 0.04); }
#giris .ga-head { height: 56px; flex: none; display: flex; align-items: center; gap: 8px; padding: 0 12px; border-bottom: 1px solid var(--border); }
#giris .ga-ib36 { width: 36px; height: 36px; flex: none; border-radius: 8px; display: grid; place-items: center; color: var(--muted-foreground); }
#giris .ga-div { width: 1px; height: 20px; flex: none; background: var(--border); }
#giris .ga-ticon { color: var(--color-tertiary); }
#giris .ga-tname { font-size: 14px; line-height: 20px; font-weight: 500; white-space: nowrap; }
#giris .ga-tdesc { min-width: 0; font-size: 14px; line-height: 20px; color: var(--muted-foreground); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#giris .ga-grow { flex: 1; }

/* Assistant pane (tools/assistant) */
#giris .ga-body { flex: 1; min-height: 0; display: flex; }
#giris .ga-pane { flex: 1; min-width: 0; display: flex; flex-direction: column; padding: 8px 24px 16px; }
#giris .ga-chathead { display: flex; align-items: center; gap: 4px; min-height: 40px; margin-bottom: 4px; }
#giris .ga-ctitle { flex: 1; min-width: 0; font-size: 14px; line-height: 20px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: opacity .2s; }
#giris .ga-ib32 { width: 32px; height: 32px; flex: none; border-radius: 8px; display: grid; place-items: center; color: var(--muted-foreground); }
#giris .ga-compose { display: none; }
#giris .ga-stage { position: relative; flex: 1; min-height: 0; width: 100%; max-width: 800px; align-self: center; display: flex; flex-direction: column; padding-top: 4px; }
#giris .ga-scroll { position: relative; flex: 1; min-height: 0; overflow: hidden; padding-right: 40px; }
#giris .ga-col { display: flex; flex-direction: column; gap: 24px; padding: 0 36px 16px 0; transform: translateY(calc(var(--y, 0) * -1px)); transition: transform .5s var(--l-ease); }
#giris .ga-ticks { position: absolute; right: 4px; top: 12px; bottom: 12px; width: 28px; display: flex; flex-direction: column; justify-content: center; align-items: flex-end; transition: opacity .3s; }
#giris .ga-ticks i { display: flex; justify-content: flex-end; align-items: center; width: 16px; height: 14px; }
#giris .ga-ticks i::before { content: ""; width: 16px; height: 1px; background: var(--muted-foreground); transform-origin: right; transform: scaleX(.68); }
#giris .ga-ticks i + i::before { background: var(--foreground); transform: scaleX(1); }

/* Messages (message.tsx, message-bubble.tsx) */
#giris .ga-msg { display: flex; align-items: flex-start; gap: 8px; width: 100%; }
#giris .ga-u { flex-direction: row-reverse; }
#giris .ga-bw { width: 85%; display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
/* A file the user attached (UserAttachment.tsx, FileChip.tsx): a raised face in a muted tray. */
#giris .ga-files { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; max-width: 100%; }
#giris .ga-file { display: flex; align-items: center; gap: 2px; min-width: 0; max-width: 288px; padding: 4px; border-radius: 16px; background: color-mix(in oklab, var(--muted) 70%, transparent); }
#giris .ga-fface { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; padding: 6px 10px; border-radius: 12px; background: var(--background); color: var(--muted-foreground); }
#giris .ga-fnm { flex: 1; min-width: 0; }
#giris .ga-fn { display: block; font-size: 14px; line-height: 20px; font-weight: 500; color: var(--foreground); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#giris .ga-fd { display: block; font-size: 11px; line-height: 16px; color: var(--muted-foreground); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#giris .ga-fx { width: 32px; height: 32px; flex: none; display: grid; place-items: center; color: var(--muted-foreground); }
#giris .ga-bub { max-width: 82%; min-width: 36px; padding: 10px 14px; border-radius: 16px; background: var(--muted); font-size: 14px; line-height: 24px; white-space: pre-wrap; transform-origin: 100% 100%; }
#giris .ga-av { width: 28px; height: 28px; flex: none; border-radius: 8px; display: grid; place-items: center; color: var(--primary-foreground);
  background-color: var(--primary); background-image: var(--primary-gradient); box-shadow: var(--primary-shadow); }
#giris .ga-acol { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
#giris .ga-name { font-size: 11px; line-height: 11px; color: var(--muted-foreground); padding: 0 4px; }
#giris .ga-act { height: 28px; display: flex; align-items: center; font-size: 14px; line-height: 20px; color: var(--muted-foreground); }
#giris .ga-actb { display: flex; align-items: center; gap: 6px; font-weight: 500; }
#giris .ga-actb svg { color: color-mix(in oklab, var(--muted-foreground) 70%, transparent); }
#giris .ga-actr { display: none; gap: 6px; align-items: center; white-space: nowrap; }
#giris .ga-shim { display: inline-block; font-weight: 500; color: transparent; -webkit-background-clip: text; background-clip: text; background-size: 200% 100%;
  background-image: linear-gradient(110deg, var(--muted-foreground) 30%, var(--color-accent-text) 50%, var(--muted-foreground) 70%); animation: giris-shimmer 1.8s linear infinite; }
@keyframes giris-shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }
#giris .ga-tk { display: inline-block; color: var(--color-tertiary); font-variant-numeric: tabular-nums; animation: giris-tick .35s var(--l-ease); }
@keyframes giris-tick { from { opacity: 0; transform: translateY(4px); } }

/* Answer (Markdown.tsx) */
#giris .ga-ans { width: 100%; font-size: 15px; line-height: 24.75px; }
#giris .ga-ans p, #giris .ga-ans ul { margin: 8px 0; max-width: 68ch; }
#giris .ga-ans > :first-child { margin-top: 0; }
#giris .ga-ans > :last-child { margin-bottom: 0; }
#giris .ga-ans ul { padding-left: 20px; list-style: disc outside; }
#giris .ga-ans li { margin: 2px 0; padding: 4px 0; }
#giris .ga-ans b { font-weight: 600; }
#giris .ga-lk { color: var(--color-accent-text); font-weight: 500; text-decoration: underline; text-decoration-color: currentColor; text-underline-offset: 4px; }
#giris .ga-c { margin: 0 1px; vertical-align: super; font-size: .7em; line-height: 1.65; font-weight: 500; color: var(--color-accent-text);
  text-decoration: underline; text-decoration-color: currentColor; text-underline-offset: 4px; cursor: pointer; }
#giris .ga-ans.is-stream .ga-c { margin: 0; vertical-align: baseline; font-size: inherit; line-height: inherit; font-weight: 400; color: inherit; text-decoration: none; }
#giris .ga-ans.is-land .ga-c { animation: giris-land .45s var(--l-ease) both; }
@keyframes giris-land { from { opacity: 0; transform: translateY(5px); } }
#giris .ga-ans.is-land .ga-c { display: inline-block; }
#giris .ga-ans.is-stream .w:not(.on), #giris .ga-ans.is-stream li:not(.on) { visibility: hidden; }
#giris .ga-ans.is-stream li.on { visibility: visible; }
#giris .ga-caret { display: inline-block; width: 6px; height: 16px; margin-left: 2px; vertical-align: text-bottom; background: currentColor; animation: giris-pulse 2s cubic-bezier(.4, 0, .6, 1) infinite; }
@keyframes giris-pulse { 50% { opacity: .5; } }

/* Numbered sources + action bar (citations.tsx) */
#giris .ga-srcs { width: 100%; }
#giris .ga-stog { display: inline-flex; align-items: center; gap: 8px; min-height: 32px; padding: 0 4px; margin-left: -4px; border-radius: 8px; font-size: 14px; line-height: 20px; color: var(--muted-foreground); }
#giris .ga-stl { font-weight: 500; }
#giris .ga-pill { border-radius: 999px; background: var(--muted); padding: 2px 6px; font-size: 10px; line-height: 15px; font-weight: 600; font-variant-numeric: tabular-nums; }
#giris .ga-up { transform: rotate(180deg); color: color-mix(in oklab, var(--muted-foreground) 60%, transparent); }
#giris .ga-slist { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px; margin-top: 4px; }
#giris .ga-srow { display: flex; align-items: center; gap: 8px; height: 28px; padding: 4px 6px; border-radius: 6px; font-size: 14px; line-height: 20px; cursor: pointer; }
#giris .ga-sic { width: 20px; height: 20px; flex: none; display: grid; place-items: center; color: var(--muted-foreground); }
#giris .ga-slab { flex: 1; min-width: 0; font-weight: 500; color: color-mix(in oklab, var(--foreground) 80%, transparent); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: color .15s; }
#giris .ga-sgrp { display: flex; align-items: center; gap: 6px; color: color-mix(in oklab, var(--muted-foreground) 40%, transparent); transition: color .15s; }
#giris .ga-sn { width: 20px; height: 20px; border-radius: 6px; display: grid; place-items: center; background: color-mix(in oklab, var(--foreground) 5%, transparent);
  font-size: 10px; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--muted-foreground); }
#giris .ga-srow.is-hov .ga-slab { color: var(--foreground); }
#giris .ga-srow.is-hov .ga-sgrp { color: var(--muted-foreground); }
#giris .ga-more { display: flex; align-items: center; gap: 8px; min-height: 28px; padding: 0 6px; margin-top: 2px; border-radius: 6px; font-size: 14px; color: var(--muted-foreground); }
#giris .ga-acts { display: flex; gap: 2px; margin-left: -4px; }
#giris .ga-acts span { width: 24px; height: 24px; border-radius: 6px; display: grid; place-items: center; color: var(--muted-foreground); }

/* Follow-ups + composer (index.tsx, prompt-input.tsx) */
#giris .ga-fups { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px; }
#giris .ga-fup { padding: 6px 12px; border: 1px solid var(--border); border-radius: 8px; background: var(--card); font-size: 12px; line-height: 16px; color: var(--muted-foreground); }
#giris .ga-comp { margin-top: 12px; flex: none; padding: 8px; border-radius: 16px; border: 1px solid color-mix(in oklab, var(--border) 80%, transparent); background: var(--card); box-shadow: 0 4px 20px -8px oklch(0 0 0 / 0.12); }
#giris .ga-ta { margin-top: 6px; padding: 0 8px; font-size: 14px; line-height: 24px; }
#giris .ga-ph { color: color-mix(in oklab, var(--muted-foreground) 55%, transparent); }
#giris .ga-typed { display: none; }
#giris .ga-tb { margin-top: 4px; display: flex; align-items: center; gap: 4px; min-height: 32px; }
#giris .ga-plus { width: 32px; height: 32px; border-radius: 999px; display: grid; place-items: center; color: var(--muted-foreground); transition: opacity .2s; }
#giris .ga-chip { height: 32px; padding: 0 8px; border-radius: 12px; display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 500; color: var(--muted-foreground); white-space: nowrap; min-width: 0; }
#giris .ga-chipm { display: none; }
#giris .ga-depth { height: 32px; padding: 0 8px; border-radius: 12px; display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted-foreground); transition: opacity .2s; }
#giris .ga-dslot { width: 16px; display: grid; place-items: center; }
#giris .ga-send { margin-left: auto; width: 32px; height: 32px; border-radius: 999px; display: grid; place-items: center; background: var(--color-selected); color: var(--color-tertiary); transition: transform .15s; }
#giris .ga-send svg { grid-area: 1 / 1; }
#giris .ga .ga-sq-ic { display: none; fill: currentColor; }

/* Side panel tabs + document reader (PanelTabStrip.tsx, DocumentReader.tsx) */
#giris .ga-panel { width: 662px; flex: none; min-height: 0; display: flex; flex-direction: column; background: var(--background); border-left: 1px solid var(--border); box-shadow: -8px 0 24px -16px rgba(0, 0, 0, .15); }
/* Closed (a new conversation, until a result opens a tab): not mounted, so the chat takes the full width. */
#giris .ga:not(.is-phone):not(.is-sheet) .ga-panel { display: none; }
#giris .ga-tabs { height: 40px; flex: none; display: flex; background: var(--color-subtle); border-bottom: 1px solid var(--border); }
#giris .ga-tab { position: relative; width: 176px; height: 39px; flex: none; display: flex; align-items: center; gap: 8px; padding: 0 32px 0 12px; overflow: hidden;
  border-right: 1px solid var(--border); font-size: 13px; line-height: 19.5px; color: var(--muted-foreground); white-space: nowrap; transition: width .42s var(--l-ease), background-color .15s, color .15s; }
#giris .ga-tab.is-on { background: var(--background); color: var(--foreground); padding-right: 56px; }
#giris .ga-tab.is-on::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: var(--primary); transform-origin: left; animation: giris-edge .4s var(--l-ease); }
@keyframes giris-edge { from { transform: scaleX(0); } }
#giris .ga-tab.is-shut { width: 0; padding: 0; border-right-width: 0; }
#giris .ga-tlab { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
#giris .ga-tx, #giris .ga-tst { position: absolute; top: 9.5px; width: 20px; height: 20px; border-radius: 4px; display: grid; place-items: center; color: var(--muted-foreground); }
#giris .ga-tx { right: 6px; }
#giris .ga-tst { right: 28px; }
#giris .ga-tab:not(.is-on) .ga-tx, #giris .ga-tab:not(.is-on) .ga-tst { display: none; }
#giris .ga-hide { width: 40px; margin-left: auto; flex: none; display: grid; place-items: center; border-left: 1px solid var(--border); color: var(--muted-foreground); }
#giris .ga-docs { position: relative; flex: 1; min-height: 0; }
#giris .ga-doc { position: absolute; inset: 0; display: flex; flex-direction: column; background: var(--background); opacity: 0; visibility: hidden; transition: opacity .22s var(--l-ease), visibility 0s linear .22s; }
#giris .ga-doc.is-on { opacity: 1; visibility: visible; transition: opacity .22s var(--l-ease), visibility 0s; }
#giris .ga-dbar { height: 48px; flex: none; display: flex; align-items: center; gap: 8px; padding: 0 12px; }
#giris .ga-dtitle { flex: 1; min-width: 0; font-size: 14px; line-height: 20px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#giris .ga-dacts { display: flex; align-items: center; gap: 2px; }
#giris .ga-ib { width: 32px; height: 32px; border-radius: 8px; display: grid; place-items: center; color: var(--muted-foreground); }
#giris .ga-pdf { height: 32px; padding: 0 12px; border-radius: 6px; display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 500; color: var(--primary-foreground);
  background-color: var(--primary); background-image: var(--primary-gradient); box-shadow: var(--primary-shadow); margin-left: 2px; }
#giris .ga-vd { width: 1px; height: 20px; margin: 0 4px; background: var(--border); }
#giris .ga-prog { position: relative; height: 3px; flex: none; border-bottom: 1px solid var(--border); }
#giris .ga-prog i { position: absolute; left: 0; top: 0; width: 100%; height: 2px; background: var(--foreground); transform-origin: 0 0; transform: scaleX(var(--p)); }
#giris .ga-dbody { flex: 1; min-height: 0; overflow: hidden; padding: 24px 32px 40px; }
#giris .ga-rd { font-family: var(--font-serif); font-size: 16.5px; line-height: 24.75px; color: color-mix(in oklab, var(--foreground) 90%, transparent); hyphens: auto; }
#giris .ga-rd p { margin: 12px 0; }
#giris .ga-art { margin-top: 36px; font: 700 13px/19.5px var(--font-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--foreground); }
#giris .ga-art:first-child { margin-top: 0; }
#giris .ga-sub { margin-top: 28px; font: 500 14px/20px var(--font-sans); color: var(--muted-foreground); }
#giris .ga-sub + .ga-sub { margin-top: 32px; }
#giris .ga-rd .hit { color: inherit; margin: 0 -2px; }
#giris .ga-eb { font: 600 12px/16px var(--font-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--muted-foreground); }
#giris .ga-ht { margin-top: 8px; font: 500 25.6px/38.4px var(--font-serif); letter-spacing: -.015em; color: var(--foreground); }
#giris .ga-hm { margin-top: 8px; font-size: 15px; line-height: 22.5px; color: var(--muted-foreground); font-variant-numeric: tabular-nums; }
#giris .ga-ha { margin-top: 20px; display: flex; flex-wrap: wrap; gap: 8px; font-size: 14px; }
#giris .ga-cchip { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border: 1px solid var(--border); background: color-mix(in oklab, var(--muted) 40%, transparent); font-size: 14px; line-height: 20px; }
#giris .ga-cchip svg { color: var(--muted-foreground); }
#giris .ga-ob { height: 32px; padding: 0 12px; border-radius: 6px; border: 1px solid var(--border); display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 500; }
#giris .ga-rm { margin-top: 12px; font-size: 12px; line-height: 16px; color: var(--muted-foreground); }
#giris .ga-fact { margin-top: 32px; display: grid; grid-template-columns: minmax(9rem, max-content) 1fr; column-gap: 24px; padding: 16px 20px;
  border-left: 2px solid var(--primary); background: color-mix(in oklab, var(--muted) 30%, transparent); }
#giris .ga-dt { padding-top: 2px; font-size: 12px; line-height: 16px; font-weight: 500; letter-spacing: .025em; text-transform: uppercase; color: var(--muted-foreground); }
#giris .ga-dd { font-size: 14px; line-height: 20px; }
#giris .ga-hgk { margin-top: 24px; }
#giris .ga-np { display: grid; grid-template-columns: 44px 1fr; gap: 4px; margin: 16px 0; }
#giris .ga-np > span { padding-top: 1px; text-align: right; font: 600 14px/20px var(--font-sans); color: var(--muted-foreground); font-variant-numeric: tabular-nums; }
#giris .ga-np p { margin: 0; padding-left: 8px; }
#giris .ga-kd > p { margin: 16px 0; }
#giris .ga-h3 { margin: 36px 0 12px; font: 600 16px/24px var(--font-sans); letter-spacing: -.01em; color: var(--foreground); }
#giris .ga-dscroll { transform: translateY(calc(var(--dy, 0) * -1px)); }

/* A document the assistant wrote (DocumentCard.tsx): open row, then one button per format, the asked one filled. */
#giris .ga-dcard { max-width: 100%; padding: 12px; border-radius: 12px; background: var(--card); box-shadow: 0 0 0 1px var(--border); }
#giris .ga-dcard:not(.is-in) { display: none; }
#giris .ga-dcard.is-in { animation: giris-row .38s var(--l-ease) both; }
#giris .ga-dopen { display: flex; align-items: center; gap: 10px; min-width: 0; }
#giris .ga-dic { width: 36px; height: 36px; flex: none; display: grid; place-items: center; border-radius: 8px; background: var(--color-subtle); color: var(--muted-foreground); box-shadow: inset 0 0 0 1px var(--border); }
#giris .ga-dtx { flex: 1; min-width: 0; }
#giris .ga-dtt { display: block; font-size: 14px; line-height: 20px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-underline-offset: 3px; }
#giris .ga-dopen.is-hov .ga-dtt { text-decoration: underline; }
#giris .ga-ddt { display: block; font-size: 12px; line-height: 16px; color: var(--muted-foreground); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#giris .ga-dfmts { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 6px; }
#giris .ga-dfmt { height: 32px; padding: 0 12px; border-radius: 8px; display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 500; background: var(--background); box-shadow: 0 0 0 1px var(--border); }
#giris .ga-dfmt.is-pri, #giris .ga-fdl.is-pri { color: var(--primary-foreground); background-color: var(--primary); background-image: var(--primary-gradient); box-shadow: var(--primary-shadow); }

/* A stored file in the side panel (FileViewer.tsx) shown as PDF pages (PdfPreview.tsx). A draft is laid out as
   draft-render.ts sets it: A4, 12pt (set in the site serif here), margins 70/60/70/72pt, the page fitted to the pane's width. */
#giris .ga-fbar { flex: none; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 8px 12px; border-bottom: 1px solid var(--border); }
#giris .ga-fname { flex: 1; min-width: 0; font-size: 14px; line-height: 20px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#giris .ga-fsrc, #giris .ga-fdl { height: 32px; padding: 0 10px; border-radius: 8px; display: inline-flex; align-items: center; gap: 6px; font-size: 13px; flex: none; }
#giris .ga-fsrc { color: var(--muted-foreground); }
#giris .ga-fdl { font-weight: 500; background: var(--background); box-shadow: 0 0 0 1px var(--border); }
#giris .ga-pv { position: relative; flex: 1; min-height: 0; display: flex; flex-direction: column; background: var(--color-subtle); }
#giris .ga-pvs { --u: calc(1px * var(--pz, 1)); flex: 1; min-height: 0; overflow: hidden; padding: 16px; display: flex; flex-direction: column; align-items: center; gap: 12px; background: var(--muted); }
#giris .ga-pg { position: relative; flex: none; width: calc(595.28 * var(--u)); height: calc(841.89 * var(--u)); padding: calc(70 * var(--u)) calc(60 * var(--u)) 0 calc(72 * var(--u)); overflow: hidden;
  background: #fff; box-shadow: 0 1px 3px oklch(0 0 0 / 0.12); font-family: var(--font-serif); font-size: calc(12 * var(--u)); line-height: calc(15.8 * var(--u)); color: #111; text-align: justify; hyphens: none; }
#giris .ga-pg p { margin: 0 0 calc(8.3 * var(--u)); }
#giris .ga-pg .t { margin: calc(5.5 * var(--u)) 0 calc(11 * var(--u)); text-align: center; font-weight: 700; line-height: calc(13.8 * var(--u)); }
#giris .ga-pg .h { margin: calc(6.9 * var(--u)) 0 calc(4.1 * var(--u)); font-weight: 700; text-align: left; line-height: calc(13.8 * var(--u)); }
#giris .ga-pg .q { margin-inline: calc(28 * var(--u)); font-style: italic; }
#giris .ga-pg .pn { position: absolute; right: calc(60 * var(--u)); top: calc(790 * var(--u)); font-size: calc(9 * var(--u)); line-height: 1; color: #555; }
#giris .ga-pvbar { position: absolute; left: 0; right: 0; bottom: 12px; display: flex; justify-content: center; }
#giris .ga-pvbar > span { display: flex; align-items: center; gap: 2px; padding: 4px 6px; border-radius: 999px; font-size: 13px; line-height: 20px;
  background: color-mix(in oklab, var(--background) 95%, transparent); box-shadow: 0 0 0 1px var(--border), 0 4px 16px -4px oklch(0 0 0 / 0.25); }
#giris .ga-pvpg { display: flex; align-items: center; gap: 4px; padding: 0 6px; color: var(--muted-foreground); font-variant-numeric: tabular-nums; }
#giris .ga-pvin { width: 32px; height: 24px; display: grid; place-items: center; color: var(--foreground); }
#giris .ga-pvd { width: 1px; height: 16px; margin: 0 2px; background: var(--border); }
#giris .ga-pvb { width: 28px; height: 28px; border-radius: 999px; display: grid; place-items: center; color: var(--muted-foreground); }
#giris .ga-pvb.is-off { opacity: .4; }
#giris .ga-pvz { width: 44px; text-align: center; color: var(--muted-foreground); font-variant-numeric: tabular-nums; }

/* A file waiting to be sent (index.tsx pending row), shown only while the question sits in the composer. */
#giris .ga-pend { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px; }
#giris .ga-pend:empty, #giris .ga:not(.is-pre) .ga-pend { display: none; }
#giris .ga-pchip { display: flex; align-items: center; gap: 6px; padding: 4px 6px 4px 10px; border-radius: 8px; border: 1px solid var(--border); background: var(--card); font-size: 12px; line-height: 16px; }
#giris .ga-pcn { max-width: 160px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#giris .ga-pcx { width: 20px; height: 20px; border-radius: 6px; display: grid; place-items: center; color: var(--muted-foreground); }

/* Replay states */
#giris .ga.is-pre .ga-u, #giris .ga.is-pre .ga-a, #giris .ga.is-pre .ga-fups, #giris .ga.is-pre .ga-ticks,
#giris .ga.is-run .ga-fups, #giris .ga.is-run .ga-srcs, #giris .ga.is-run .ga-acts { display: none; }
#giris .ga.is-pre .ga-ticks, #giris .ga.is-run .ga-ticks.is-off { opacity: 0; }
#giris .ga.is-pre .ga-ph { display: none; }
#giris .ga.is-pre .ga-typed { display: inline; }
#giris .ga.is-pre .ga-send, #giris .ga.is-run .ga-send { color: var(--primary-foreground); background-color: var(--primary); background-image: var(--primary-gradient); box-shadow: var(--primary-shadow); }
#giris .ga.is-run .ga-up-ic { display: none; }
#giris .ga.is-run .ga-sq-ic { display: block; }
#giris .ga.is-run .ga-plus, #giris .ga.is-run .ga-depth { opacity: .5; }
#giris .ga.is-run .ga-actb { display: none; }
#giris .ga.is-run .ga-actr { display: inline-flex; }
#giris .ga-send.is-press { transform: scale(.96); }
#giris .ga-u.is-pop { animation: giris-pop .5s cubic-bezier(.3, 1.3, .5, 1) both; transform-origin: 100% 100%; }
@keyframes giris-pop { from { opacity: 0; transform: translateY(8px) scale(.95); } }
#giris .ga-srcs.is-open .ga-slist { animation: giris-disclose .22s var(--l-ease) both; }
@keyframes giris-disclose { from { opacity: 0; clip-path: inset(0 0 100% 0); transform: translateY(-4px); } to { opacity: 1; clip-path: inset(0 0 0% 0); transform: none; } }
#giris .ga-srcs.is-open .ga-srow, #giris .ga-srcs.is-open .ga-more { animation: giris-row .38s var(--l-ease) both; }
#giris .ga-srcs.is-open .ga-srow:nth-child(2) { animation-delay: .05s; }
#giris .ga-srcs.is-open .ga-srow:nth-child(3) { animation-delay: .1s; }
#giris .ga-srcs.is-open .ga-more { animation-delay: .15s; }
@keyframes giris-row { from { opacity: 0; transform: translateY(6px); } }
#giris .ga-fups.is-in { animation: giris-row .4s var(--l-ease) both; }
/* A scenario switch resets the window at once. */
#giris .ga.is-reset, #giris .ga.is-reset * { transition: none !important; animation: none !important; }

/* Phone (app-design.css:235-244): laid out at the frame's own width, unscaled, so the text stays crisp and the
   window meets the page gutters exactly. The source opens as a sheet over the app's drawer scrim. */
#giris .ga.is-phone { transform: none; }
#giris .ga.is-phone .ga-rail { display: none; }
#giris .ga.is-phone .ga-sheet { margin: 0; border-radius: 0; box-shadow: none; }
#giris .ga.is-phone .ga-head { padding: 0 8px; }
#giris .ga.is-phone .ga-tdesc { display: none; }
#giris .ga.is-phone .ga-pane { padding: 4px 12px 12px; }
#giris .ga.is-phone .ga-stage { max-width: 100%; }
#giris .ga.is-phone .ga-compose { display: grid; }
#giris .ga.is-phone .ga-ta { font-size: 16px; }
#giris .ga.is-phone .ga-chipf { display: none; }
#giris .ga.is-phone .ga-chipm { display: inline; }
#giris .ga.is-phone .ga-chip { font-size: 11px; padding: 0 9px; }
#giris .ga.is-phone .ga-panel { position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; width: auto; height: 60%; border-left: 0; border-radius: 16px 16px 0 0; overflow: hidden;
  box-shadow: 0 0 0 1px var(--border), 0 -12px 40px -12px oklch(0 0 0 / 0.28); transform: translateY(104%); transition: transform .55s var(--l-ease-drawer); }
#giris .ga.is-phone.is-sheet .ga-panel { transform: none; }
#giris .ga.is-phone .ga-tabs { display: none; }
#giris .ga.is-phone .ga-dbody { padding: 20px 20px 40px; }
#giris .ga.is-phone .ga-dbar .ga-ib:nth-child(2), #giris .ga.is-phone .ga-dbar .ga-ib:nth-child(3) { display: none; }
#giris .ga.is-phone .ga-scroll { padding-right: 0; }
#giris .ga.is-phone .ga-ticks { display: none; }
#giris .ga.is-phone .ga-sheet::after { content: ""; position: absolute; inset: 0; z-index: 1; background: oklch(0 0 0 / 0.4); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
  opacity: 0; visibility: hidden; transition: opacity .25s var(--l-ease), visibility 0s linear .25s; }
#giris .ga.is-phone.is-sheet .ga-sheet::after { opacity: 1; visibility: visible; transition: opacity .25s var(--l-ease), visibility 0s; }
#giris .ga.is-phone .ga-file { max-width: 100%; }

@media (prefers-reduced-motion: reduce) {
  #giris .ga * { animation: none !important; }
  #giris .ga-col, #giris .ga-tab, #giris .ga-panel, #giris .ga-sheet::after { transition: none !important; }
}

/* In the landing hero the window spans the content column. */
#giris .g-fig { width: 100%; margin: 0; }
#giris .g-fig.is-phone { width: min(420px, 100%); margin: 0 auto; }
#giris .g-frame { box-shadow: 0 0 0 1px #ffffff1f, 0 40px 90px -30px #000000b3, 0 16px 32px -24px #00000066; }