/* Meridyus — pusula / açık-ferah / güven estetiği (Apollo/Lemlist ilhamı: beyaz zemin, tek canlı vurgu, bol boşluk) */
:root {
  --void: #ffffff;
  --ink: #f7f8fa;
  --ink-2: #f0f2f5;
  --line: #e2e6eb;
  --line-2: #eceef2;
  --paper: #101826;
  --muted: #64748b;
  --muted-2: #94a0ad;
  --brass: #b8721f;
  --brass-2: #e0a94a;
  --mint: #0d9488;
  --coral: #dc4c41;
  --radius: 18px;
  --maxw: 1120px;
  --disp: "Bricolage Grotesque", system-ui, sans-serif;
  --body: "Hanken Grotesk", system-ui, sans-serif;
  --mono: "Space Mono", ui-monospace, monospace;
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  background:
    radial-gradient(1200px 700px at 85% -10%, rgba(184,114,31,.05), transparent 60%),
    radial-gradient(900px 600px at -5% 10%, rgba(13,148,136,.04), transparent 55%),
    var(--void);
  color: var(--paper);
  font-family: var(--body);
  font-size: 16px; line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
  overflow-x: hidden;
}
.grain { display: none; } /* koyu temanın "gece" dokusuydu — açık/ferah temada gürültü yerine temizlik */
a { color: var(--mint); text-decoration: none; }
a:hover { text-decoration: underline; }

/* NAV */
.nav {
  max-width: var(--maxw); margin: 0 auto; padding: 22px clamp(18px, 4vw, 40px);
  display: flex; align-items: center; justify-content: space-between; position: relative; z-index: 2;
}
.wordmark { display: flex; align-items: center; gap: 11px; font-family: var(--disp); font-weight: 800; font-size: 21px; letter-spacing: .3px; }
.wordmark em { font-style: normal; color: var(--brass); }
.mark { width: 30px; height: 30px; color: var(--muted); }

main { max-width: var(--maxw); margin: 0 auto; padding: 0 clamp(18px, 4vw, 40px) 80px; position: relative; z-index: 2; }

/* Dürüst kullanım banner'ı — gerçek veri, sahte geri sayım yok */
.usagebanner {
  display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap;
  background: linear-gradient(100deg, rgba(184,114,31,.10), rgba(224,169,74,.06));
  border-bottom: 1px solid var(--line); padding: 10px clamp(18px, 4vw, 40px);
  font-size: 13.5px; color: #4a3a20; position: relative; z-index: 3;
}
.usagebanner button { font-family: var(--body); }
#usageBannerCta {
  background: var(--brass); color: var(--void); border: none; border-radius: 8px;
  padding: 6px 14px; font-weight: 700; font-size: 12.5px; cursor: pointer;
}
#usageBannerCta:hover { filter: brightness(1.06); }
#usageBannerClose {
  position: absolute; right: 14px; top: 50%; transform: translateY(-50%);
  background: none; border: none; color: var(--muted); cursor: pointer; font-size: 13px; padding: 4px;
}
#usageBannerClose:hover { color: var(--paper); }

/* HERO */
.hero {
  display: grid; grid-template-columns: 1.15fr .85fr; gap: 30px; align-items: center;
  padding: clamp(20px, 5vw, 60px) 0 clamp(24px, 4vw, 46px);
}
.eyebrow { font-family: var(--mono); font-size: 12.5px; letter-spacing: 2px; text-transform: uppercase; color: var(--brass); margin: 0 0 18px; }
.hero h1 {
  font-family: var(--disp); font-weight: 800; font-size: clamp(48px, 8vw, 92px);
  line-height: .96; letter-spacing: -1.5px; margin: 0 0 22px;
}
.hero h1 .accent { color: var(--brass); position: relative; }
.lede { font-size: clamp(16px, 2vw, 19px); color: #3d4a58; max-width: 46ch; margin: 0; }
.lede b { color: var(--paper); font-weight: 600; }

/* COMPASS ROSE signature */
.hero-rose { display: flex; justify-content: center; }
.rose { width: min(100%, 380px); height: auto; }
.rose .cardinal { font-family: var(--mono); font-size: 15px; fill: var(--muted); text-anchor: middle; letter-spacing: 1px; }
.rose .needle { transform-origin: 200px 200px; animation: sway 9s ease-in-out infinite; }
@keyframes sway { 0%,100% { transform: rotate(-13deg); } 50% { transform: rotate(17deg); } }

/* CONSOLE (giriş) — yüzey/border değil, boşluk ve tipografiyle hiyerarşi */
.console { max-width: 640px; margin: 0 auto; padding-top: clamp(28px, 5vw, 48px); }

/* Segmented mode control — tek net "seçili" sinyali, kart değil */
.modes {
  display: inline-flex; padding: 4px; gap: 2px; margin-bottom: 32px;
  background: var(--ink-2); border-radius: 999px;
}
.mode {
  display: flex; flex-direction: row; align-items: baseline; gap: 6px;
  padding: 9px 18px; border-radius: 999px; cursor: pointer; text-align: left;
  background: transparent; border: none; color: var(--muted);
  font-family: var(--body); transition: background .16s, color .16s;
}
.mode .m-k { font-weight: 700; font-size: 14.5px; color: inherit; }
.mode .m-d { font-size: 12px; color: var(--muted-2); }
.mode:hover { color: var(--paper); }
.mode.active { background: var(--paper); color: var(--void); }
.mode.active .m-k { color: var(--void); }
.mode.active .m-d { color: rgba(255,255,255,.55); }
@media (max-width: 560px) {
  .modes { display: grid; grid-template-columns: repeat(3, 1fr); width: 100%; }
  .mode { flex-direction: column; align-items: center; padding: 10px 8px; gap: 1px; }
  .mode .m-d { display: none; }
}

.fields { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 20px; }
.field.span2 { grid-column: 1 / -1; }
label { display: block; font-family: var(--body); font-weight: 600; font-size: 13px; letter-spacing: 0; color: #475569; margin-bottom: 8px; }
label .opt { text-transform: none; letter-spacing: 0; color: var(--muted-2); font-weight: 400; }
input[type=text], textarea, select {
  width: 100%; padding: 13px 15px; border-radius: 12px; border: 1px solid var(--line);
  background: var(--void); color: var(--paper); font: inherit; font-size: 15px; resize: vertical;
}
select { appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%237c95aa' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center; padding-right: 38px;
}
select option { background: var(--ink); color: var(--paper); }
input:focus, textarea:focus, select:focus { outline: none; border-color: var(--brass); box-shadow: 0 0 0 3px rgba(224,169,74,.14); }
.drop {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  border: 1.5px dashed #ccd3da; border-radius: 12px; padding: 18px; margin-bottom: 12px;
  color: var(--muted); cursor: pointer; transition: .16s;
}
.drop:hover, .drop.over { border-color: var(--brass); color: var(--paper); background: rgba(224,169,74,.05); }
.drop:focus-visible { outline: 2px solid var(--brass); outline-offset: 2px; }

.scan {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  padding: 15px 30px; border: 0; border-radius: 999px; cursor: pointer;
  background: #1a1208; color: var(--void);
  font-family: var(--body); font-weight: 700; font-size: 15.5px; letter-spacing: .1px; transition: .16s;
  box-shadow: 0 8px 22px -8px rgba(26,18,8,.35);
}
.scan:hover { background: #2a1d10; box-shadow: 0 10px 26px -8px rgba(26,18,8,.45); }
.scan:disabled { opacity: .5; cursor: default; box-shadow: none; }
.hint { color: var(--coral); font-size: 14px; min-height: 20px; margin: 14px 0 0; }
.hint.info { color: var(--muted); }

/* Sekonder/ghost aksiyon butonu — DEBT-001: önceden hiç stillenmemişti (bkz. docs/DESIGN_DEBT.md) */
.hopen {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 9px 16px; border: 1px solid var(--line); border-radius: 999px; cursor: pointer;
  background: var(--void); color: var(--paper);
  font-family: var(--body); font-weight: 600; font-size: 13.5px; transition: .16s;
}
.hopen:hover { border-color: var(--brass); color: var(--brass); background: var(--ink); }
.hopen:disabled { opacity: .5; cursor: default; }

/* PROFILE bar */
.profilebar {
  margin: 28px 0 18px; padding: 20px 22px; border-radius: var(--radius);
  background: var(--ink); border: 1px solid var(--line); border-left: 3px solid var(--brass);
  box-shadow: 0 4px 20px -12px rgba(16,24,38,.08);
}
.profilebar h3 { margin: 0 0 8px; font-family: var(--mono); font-size: 11.5px; letter-spacing: 1.2px; text-transform: uppercase; color: var(--brass); }
.profilebar .psum { color: #33404f; font-size: 15px; }
.searched { margin-top: 14px; font-family: var(--mono); font-size: 11.5px; color: var(--muted); display: flex; flex-wrap: wrap; gap: 7px; align-items: center; }
.searched code { background: var(--void); border: 1px solid var(--line); padding: 3px 9px; border-radius: 7px; color: var(--mint); }
.pnote { margin-top: 12px; font-size: 13px; color: var(--muted); line-height: 1.5; }
.pnote.warn { color: var(--brass-2); }

/* OPPORTUNITY grid */
.oppgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px; }
.opp {
  background: var(--void);
  border: 1px solid var(--line); border-radius: var(--radius); padding: 20px;
  opacity: 0; transform: translateY(14px); animation: rise .5s ease forwards;
  display: flex; flex-direction: column;
  box-shadow: 0 4px 20px -14px rgba(16,24,38,.10);
}
@keyframes rise { to { opacity: 1; transform: none; } }
.oppTop { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 3px; }
.companylogo {
  width: 40px; height: 40px; border-radius: 11px; margin-bottom: 10px;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--disp); font-weight: 800; font-size: 15px; color: var(--void); flex: none;
}
.companylogo.hi { background: var(--mint); }
.companylogo.mid { background: var(--brass); }
.companylogo.lo { background: var(--muted-2); }
.opp h4 { margin: 0; font-family: var(--disp); font-weight: 700; font-size: 19px; line-height: 1.15; }
.opp h4 a { color: var(--paper); }
.opp h4 a:hover { color: var(--brass); text-decoration: none; }
.score {
  flex: none; width: 34px; height: 34px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  font-family: var(--mono); font-weight: 700; font-size: 13px; border: 2px solid;
}
.score.hi { color: var(--mint); border-color: var(--mint); background: rgba(79,214,180,.08); }
.score.mid { color: var(--brass-2); border-color: var(--brass); background: rgba(224,169,74,.08); }
.score.lo { color: var(--muted); border-color: var(--line); background: rgba(124,149,170,.06); }
.opp .meta { font-family: var(--mono); font-size: 11.5px; color: var(--muted); margin-bottom: 14px; letter-spacing: .3px; }
.companynote { font-size: 12.5px; color: #556; margin: -8px 0 12px; line-height: 1.45; }
.redflag { font-size: 12.5px; padding: 8px 11px; border-radius: 9px; margin: 0 0 10px; line-height: 1.45; background: rgba(220,76,65,.08); border: 1px solid rgba(220,76,65,.28); color: #8a281f; }
.redflag b { font-family: var(--mono); text-transform: uppercase; font-size: 11px; }
.painpoints li { color: #33404f; }
.simulchips { display: flex; flex-wrap: wrap; gap: 6px; margin: -2px 0 8px; }
.simchip {
  padding: 6px 11px; border-radius: 20px; border: 1px solid var(--line); background: var(--ink);
  color: var(--paper); font-size: 12px; cursor: pointer; transition: .15s;
}
.simchip:hover { border-color: var(--brass); background: rgba(224,169,74,.08); }
.simchip.reset { color: var(--muted); border-style: dashed; }
.techchip { padding: 6px 11px; border-radius: 20px; border: 1px solid var(--line); background: var(--ink); color: var(--muted); font-size: 12px; }
.healthlines li { color: #33404f; margin-bottom: 3px; }
/* .atsbox/.healthgrade/.coaching* — Tailwind utility classes now used inline (Task #58 tasarım düzeltmesi, docs/20) */
.signalform { display: flex; flex-direction: column; gap: 8px; margin: 6px 0 10px; padding: 10px; background: var(--ink); border: 1px solid var(--line); border-radius: 10px; }
.signalform textarea { width: 100%; resize: vertical; border: 1px solid var(--line); border-radius: 9px; padding: 8px 10px; font-family: var(--body); font-size: 13px; }
.signalform input[type=date] { border: 1px solid var(--line); border-radius: 9px; padding: 7px 10px; font-family: var(--body); font-size: 13px; width: fit-content; }
.signalrow { display: grid; grid-template-columns: 1fr 2fr auto auto; gap: 10px; align-items: center; padding: 9px 4px; border-bottom: 1px solid var(--line-2); font-size: 13px; }
.signalrow.due { background: rgba(224,169,74,.06); border-radius: 8px; }
.srcompany { font-weight: 600; }
.srnote { color: var(--muted); }
.srdate { font-family: var(--mono); font-size: 11.5px; color: var(--muted); }
.srdonebtn { border: 1px solid var(--line); background: var(--void); border-radius: 50%; width: 24px; height: 24px; cursor: pointer; color: var(--muted); }
.srdonebtn:hover { border-color: var(--mint); color: var(--mint); }
.srdone { color: var(--mint); font-size: 12px; }
.arbrow { padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; margin-bottom: 8px; }
.arbsector { font-family: var(--disp); font-weight: 700; font-size: 14.5px; margin-bottom: 3px; }
.arbreason { font-size: 13px; color: #33404f; margin-bottom: 2px; }
.arbsalary { font-size: 12px; color: var(--muted); }
.adjacency { font-size: 12.5px; padding: 8px 11px; border-radius: 9px; margin: 0 0 10px; line-height: 1.45; }
.adjacency b { font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: .3px; }
.adjacency.near { background: rgba(224,169,74,.08); border: 1px solid rgba(224,169,74,.25); color: #6b4a12; }
.adjacency.gap { background: rgba(13,148,136,.07); border: 1px solid rgba(13,148,136,.22); color: #0f6b61; }
.opp .fit { font-size: 14.5px; color: #33404f; margin: 0 0 4px; }
.opp .fit::before { content: "◆"; color: var(--mint); margin-right: 7px; font-size: 10px; vertical-align: 1px; }
.opp .gaps { font-size: 13px; color: var(--muted); margin: 0 0 4px; }
.why {
  margin: 12px 0; padding: 11px 13px; border-radius: 11px; font-size: 13px;
  background: rgba(79,214,180,.07); border: 1px solid rgba(79,214,180,.22); color: #0f6b61;
}
.why b { color: var(--mint); }
.contact { font-size: 14px; margin: 10px 0 2px; color: #33404f; }
.contact b { font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: .6px; color: var(--muted); font-weight: 700; margin-right: 6px; }

.badges { display: flex; flex-wrap: wrap; gap: 7px; margin: 12px 0 2px; }
.badge { font-family: var(--mono); font-size: 11.5px; font-weight: 700; padding: 4px 9px; border-radius: 20px; letter-spacing: .2px; }
.badge.mail { background: rgba(79,214,180,.12); color: var(--mint); }
.badge.mail.guess { background: rgba(224,169,74,.12); color: var(--brass-2); }
.badge.dns { background: rgba(79,214,180,.1); color: var(--mint); border: 1px solid rgba(79,214,180,.3); }
.badge.phone { background: rgba(224,169,74,.1); color: var(--brass-2); border: 1px solid rgba(224,169,74,.28); }
.badge.none { background: #eef0f3; color: var(--muted); }

.sources { margin-top: 13px; padding-top: 13px; border-top: 1px solid var(--line-2); display: flex; flex-wrap: wrap; gap: 7px; align-items: center; }
.sources .slbl { font-family: var(--mono); font-size: 10.5px; text-transform: uppercase; letter-spacing: .6px; color: var(--muted-2); }
.src { font-family: var(--mono); font-size: 11.5px; background: var(--void); border: 1px solid var(--line); padding: 3px 9px; border-radius: 7px; color: var(--muted); }
.src:hover { border-color: var(--mint); color: var(--mint); text-decoration: none; }

.draftbtn {
  margin-top: 14px; width: 100%; padding: 11px; border-radius: 11px; cursor: pointer;
  background: var(--void); color: var(--paper); border: 1px solid var(--line);
  font-family: var(--body); font-weight: 600; font-size: 14px; transition: .15s;
}
.draftbtn:hover { border-color: var(--brass); }
.draft { margin-top: 12px; display: none; }
.draft.open { display: block; animation: rise .3s ease; }
.draft .subj { font-family: var(--mono); font-size: 12.5px; color: var(--brass-2); margin-bottom: 7px; }
.drafttabs { display: flex; gap: 6px; margin-bottom: 10px; }
.dtab {
  padding: 6px 12px; border-radius: 8px; cursor: pointer; background: var(--void);
  border: 1px solid var(--line); color: var(--muted); font-family: var(--body); font-size: 12.5px; font-weight: 600;
}
.dtab.active { border-color: var(--mint); color: var(--mint); background: rgba(79,214,180,.08); }
.dtab .dgen { font-size: 10.5px; color: var(--muted-2); font-weight: 400; }
.dtab.active .dgen { color: var(--mint); }
.draft pre { white-space: pre-wrap; background: var(--void); border: 1px solid var(--line); border-radius: 11px; padding: 14px; font-family: var(--body); font-size: 13.5px; color: #33404f; margin: 0 0 9px; line-height: 1.55; }
.copybtn { padding: 8px 14px; border-radius: 9px; cursor: pointer; background: rgba(79,214,180,.1); color: var(--mint); border: 1px solid rgba(79,214,180,.28); font: inherit; font-weight: 600; font-size: 13px; }
.copybtn:hover { background: rgba(79,214,180,.18); }
.draftacts { display: flex; gap: 8px; }
.mirrorbtn {
  padding: 8px 14px; border-radius: 9px; cursor: pointer; background: rgba(224,169,74,.1);
  color: var(--brass-2); border: 1px solid rgba(224,169,74,.28); font: inherit; font-weight: 600; font-size: 13px;
}
.mirrorbtn:hover { background: rgba(224,169,74,.18); }
.mirrorbtn:disabled { opacity: .6; cursor: default; }
.mirror { margin-top: 12px; display: none; }
.mirror.open { display: block; animation: rise .3s ease; }
.mscore { display: inline-block; font-family: var(--disp); font-weight: 800; font-size: 22px; padding: 4px 12px; border-radius: 10px; margin-bottom: 8px; }
.mscore.hi { color: var(--mint); background: rgba(79,214,180,.1); }
.mscore.mid { color: var(--brass-2); background: rgba(224,169,74,.1); }
.mscore.lo { color: var(--coral); background: rgba(240,115,110,.1); }
.mverdict { font-size: 13.5px; color: #33404f; margin: 0 0 8px; font-style: italic; }
.missues { margin: 0 0 10px; padding-left: 18px; font-size: 13px; color: var(--muted); }
.missues li { margin-bottom: 4px; }
.usefixbtn {
  padding: 8px 14px; border-radius: 9px; cursor: pointer; background: rgba(79,214,180,.12);
  color: var(--mint); border: 1px solid rgba(79,214,180,.32); font: inherit; font-weight: 600; font-size: 13px;
}
.usefixbtn:hover { background: rgba(79,214,180,.2); }

.prepbtn {
  margin-top: 10px; width: 100%; padding: 11px; border-radius: 11px; cursor: pointer;
  background: rgba(224,169,74,.08); color: var(--brass-2); border: 1px solid rgba(224,169,74,.25);
  font-family: var(--body); font-weight: 600; font-size: 14px; transition: .15s;
}
.prepbtn:hover { background: rgba(224,169,74,.14); }
.prepbtn:disabled { opacity: .6; cursor: default; }
.prep { margin-top: 12px; display: none; font-size: 13.5px; color: #33404f; }
.prep.open { display: block; animation: rise .3s ease; }
.prep .pnotes { margin: 0 0 10px; color: #33404f; line-height: 1.5; }
.prep .plabel { font-family: var(--mono); font-size: 10.5px; text-transform: uppercase; letter-spacing: .6px; color: var(--muted-2); margin: 10px 0 6px; }
.prep ul { margin: 0; padding-left: 18px; }
.prep li { margin-bottom: 5px; line-height: 1.45; }

.empty { grid-column: 1/-1; padding: 40px; text-align: center; color: var(--muted); border: 1px dashed var(--line); border-radius: var(--radius); }

/* SCANNER loader — radar */
.scanner { text-align: center; padding: 60px 0; color: var(--muted); }
.radar { width: 72px; height: 72px; margin: 0 auto 18px; border-radius: 50%; position: relative;
  border: 1px solid var(--line); background:
    radial-gradient(circle, transparent 58%, rgba(79,214,180,.06) 60%),
    repeating-radial-gradient(circle, transparent 0 16px, rgba(28,49,69,.6) 16px 17px); }
.radar span { position: absolute; inset: 0; border-radius: 50%;
  background: conic-gradient(from 0deg, rgba(79,214,180,.55), transparent 45%);
  animation: sweep 1.4s linear infinite; }
@keyframes sweep { to { transform: rotate(360deg); } }
.scanner p { font-family: var(--mono); font-size: 13px; letter-spacing: .5px; }

.foot { max-width: var(--maxw); margin: 0 auto; padding: 30px clamp(18px,4vw,40px); text-align: center; font-family: var(--mono); font-size: 12px; color: var(--muted-2); position: relative; z-index: 2; }
.foot span { color: var(--muted); }

/* NAV geçmiş butonu — .hopen ile aynı sekonder pill dili (DEBT-002 kapatıldı) */
.nav-right { display: flex; align-items: center; gap: 10px; }
.histbtn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 9px 16px; border-radius: 999px; cursor: pointer;
  background: var(--void); color: var(--paper); border: 1px solid var(--line);
  font-family: var(--body); font-weight: 600; font-size: 13.5px; transition: .16s;
}
.histbtn:hover { border-color: var(--brass); color: var(--brass); background: var(--ink); }

/* BİLDİRİM ZİLİ — aynı pill dili, ikon-only */
.bellwrap { position: relative; }
.bellbtn {
  position: relative; padding: 9px 11px; border-radius: 999px; cursor: pointer; font-size: 15px;
  background: var(--void); border: 1px solid var(--line); transition: .16s; line-height: 1;
}
.bellbtn:hover { border-color: var(--brass); background: var(--ink); }
.bellbadge {
  position: absolute; top: -6px; right: -6px; min-width: 17px; height: 17px; padding: 0 3px;
  border-radius: 20px; background: var(--coral); color: #2a0d0b; font-family: var(--mono);
  font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center;
}
.bellpanel {
  position: fixed; right: 16px; top: 88px; width: min(340px, calc(100vw - 32px)); max-height: 420px; overflow-y: auto;
  background: var(--void); border: 1px solid var(--line); border-radius: 14px; padding: 14px;
  box-shadow: 0 20px 50px -20px rgba(16,24,38,.18); z-index: 20;
}
.bellhead { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; font-family: var(--mono); font-size: 11.5px; text-transform: uppercase; letter-spacing: .6px; color: var(--muted); }
.bellhead button { background: none; border: 0; color: var(--mint); cursor: pointer; font-family: var(--mono); font-size: 10.5px; text-transform: none; letter-spacing: 0; }
.bellrow { display: flex; gap: 10px; padding: 10px 0; border-top: 1px solid var(--line-2); }
.bellrow:first-child { border-top: 0; }
.bellrow.unread { background: rgba(224,169,74,.05); margin: 0 -14px; padding: 10px 14px; border-radius: 8px; }
.bicon { flex: none; font-size: 15px; }
.btitle { font-size: 13.5px; color: var(--paper); font-weight: 600; }
.bbody { font-size: 12.5px; color: var(--muted); margin-top: 2px; }
.btime { font-family: var(--mono); font-size: 10.5px; color: var(--muted-2); margin-top: 4px; }

/* Bildirim tercihleri */
.fieldnote { font-size: 12.5px; color: var(--muted); margin: -6px 0 12px; }
.togglerow { display: flex; align-items: center; gap: 9px; font-size: 13.5px; color: #33404f; margin-bottom: 10px; cursor: pointer; }
.togglerow input { accent-color: var(--brass); width: 16px; height: 16px; cursor: pointer; }

/* GEÇMİŞ paneli */
.histpanel {
  margin: 26px 0 6px; padding: 20px 22px; border-radius: var(--radius);
  background: var(--ink); border: 1px solid var(--line); border-left: 3px solid var(--mint);
  box-shadow: 0 4px 20px -12px rgba(16,24,38,.08);
}

/* KANBAN PANO */
.kanbanboard { display: grid; grid-template-columns: repeat(5, minmax(200px, 1fr)); gap: 12px; overflow-x: auto; padding-bottom: 4px; }
.kcol { background: var(--void); border: 1px solid var(--line-2); border-radius: 12px; padding: 10px; min-width: 200px; }
.kcolhead { font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: .5px; color: var(--muted); margin-bottom: 10px; display: flex; justify-content: space-between; }
.kcount { color: var(--brass-2); font-weight: 700; }
.kcards { min-height: 60px; display: flex; flex-direction: column; gap: 8px; border-radius: 8px; transition: background .15s; }
.kcards.over { background: rgba(224,169,74,.08); outline: 1px dashed var(--brass); }
.kcard {
  background: var(--ink-2); border: 1px solid var(--line); border-radius: 9px; padding: 10px 12px;
  cursor: grab; transition: opacity .15s, transform .15s;
}
.kcard.dragging { opacity: .4; transform: scale(.97); }
.kcompany { font-size: 13.5px; font-weight: 600; color: var(--paper); margin-bottom: 3px; }
.kmeta { font-family: var(--mono); font-size: 10.5px; color: var(--muted); }
@media (max-width: 860px) {
  .kanbanboard { grid-template-columns: 1fr; }
}
.histpanel h3 { margin: 0 0 14px; font-family: var(--mono); font-size: 11.5px; letter-spacing: 1.2px; text-transform: uppercase; color: var(--mint); }
.reminders { padding-bottom: 16px; margin-bottom: 14px; border-bottom: 1px solid var(--line-2); }
.rlbl { font-family: var(--mono); font-size: 11.5px; color: var(--brass-2); margin-bottom: 10px; }
.rrow { padding: 10px 0; border-top: 1px solid var(--line-2); }
.rrow:first-of-type { border-top: 0; }
.rmeta { display: flex; gap: 10px; align-items: baseline; font-size: 13.5px; color: #33404f; margin-bottom: 8px; }
.rmeta span { font-family: var(--mono); font-size: 11px; color: var(--muted); }
.rdraftbtn {
  padding: 6px 12px; border-radius: 9px; cursor: pointer;
  background: var(--void); color: var(--paper); border: 1px solid var(--line);
  font-family: var(--body); font-weight: 600; font-size: 12.5px; transition: .15s;
}
.rdraftbtn:hover { border-color: var(--brass); }
.rdraftbtn:disabled { opacity: .6; cursor: default; }
.rdraft { margin-top: 10px; display: none; }
.rdraft.open { display: block; animation: rise .3s ease; }
.rdraft .subj { font-family: var(--mono); font-size: 12px; color: var(--brass-2); margin-bottom: 6px; }
.rdraft pre { white-space: pre-wrap; background: var(--void); border: 1px solid var(--line); border-radius: 10px; padding: 12px; font-family: var(--body); font-size: 13px; color: #33404f; margin: 0; line-height: 1.5; }

.funnel { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding-bottom: 16px; margin-bottom: 14px; border-bottom: 1px solid var(--line-2); }
.fstep { display: flex; flex-direction: column; align-items: center; min-width: 64px; }
.fstep .fn { font-family: var(--disp); font-weight: 800; font-size: 22px; color: var(--paper); }
.fstep .fl { font-family: var(--mono); font-size: 10px; text-transform: uppercase; letter-spacing: .5px; color: var(--muted); text-align: center; }
.farrow { color: var(--muted-2); font-size: 14px; }
.fneg { margin-left: auto; font-family: var(--mono); font-size: 11.5px; color: var(--coral); }
.hrow {
  display: grid; grid-template-columns: 1fr auto; gap: 4px 16px; align-items: center;
  padding: 12px 0; border-top: 1px solid var(--line-2);
}
.hrow:first-child { border-top: 0; }
.hmeta { display: flex; flex-wrap: wrap; gap: 10px; font-family: var(--mono); font-size: 11.5px; color: var(--muted); }
.hmeta .hmode { color: var(--brass-2); font-weight: 700; }
.hsum { grid-column: 1; font-size: 13.5px; color: #3d4a58; }
.hacts { grid-column: 2; grid-row: 1 / span 2; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.hacts button, .hacts a {
  padding: 7px 14px; border-radius: 999px; cursor: pointer; text-decoration: none;
  background: var(--void); color: var(--paper); border: 1px solid var(--line);
  font-family: var(--body); font-weight: 600; font-size: 13px; transition: .15s;
}
.hacts button:hover { border-color: var(--brass); color: var(--brass-2); }
.hacts a { color: var(--muted); }
.hacts a:hover { border-color: var(--mint); color: var(--mint); text-decoration: none; }
.watchedtag { font-family: var(--mono); font-size: 12px; color: var(--mint); padding: 6px 12px; }
.unwatchbtn {
  padding: 7px 14px; border-radius: 999px; cursor: pointer; background: var(--void);
  border: 1px solid var(--line); color: var(--coral); font-family: var(--body); font-weight: 600; font-size: 13px;
}
.unwatchbtn:hover { border-color: var(--coral); }
.unwatchbtn:disabled { opacity: .5; cursor: default; }

/* KART aksiyonları: mail aç + durum */
.actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 2px; align-items: center; }
.mailbtn {
  padding: 8px 14px; border-radius: 9px; font-weight: 600; font-size: 13px;
  background: rgba(224,169,74,.12); color: var(--brass-2); border: 1px solid rgba(224,169,74,.3);
}
.mailbtn:hover { background: rgba(224,169,74,.2); text-decoration: none; }
select.status {
  padding: 7px 10px; border-radius: 9px; cursor: pointer;
  background: var(--void); color: var(--muted); border: 1px solid var(--line);
  font-family: var(--body); font-size: 13px;
}
select.status.set { border-color: rgba(79,214,180,.45); color: var(--mint); }
select.status:disabled { opacity: .45; cursor: default; }
select.status:focus { outline: none; border-color: var(--brass); }

/* Export linkleri (profil barı) */
.exports { margin-top: 13px; padding-top: 13px; border-top: 1px solid var(--line-2); display: flex; flex-wrap: wrap; gap: 7px; align-items: center; }
.exports .slbl { font-family: var(--mono); font-size: 10.5px; text-transform: uppercase; letter-spacing: .6px; color: var(--muted-2); }

/* AUTH: tam ekran split-panel giriş/kayıt ekranı — masaüstündeki gerçek Apollo/Jobright ekran
   görüntülerinden alınan desen: sade düz form (Apollo) + yumuşak pastel gradyanlı marka paneli (Jobright).
   Önceki hali (koyu lacivert blok + ikonlu input'lar) kullanıcı tarafından "tasarım yoksunu" bulunup reddedildi. */
.authscreen {
  min-height: 100vh; display: grid; grid-template-columns: 1.05fr 1fr;
}
.authbrand {
  background:
    radial-gradient(120% 100% at 15% 15%, rgba(224,169,74,.35), transparent 55%),
    radial-gradient(120% 100% at 85% 85%, rgba(13,148,136,.18), transparent 55%),
    linear-gradient(155deg, #fdf6ea 0%, #fbeedb 45%, #f3e6d4 100%);
  display: flex; align-items: center; padding: clamp(32px, 6vw, 80px);
  position: relative; overflow: hidden;
}
.authbrand-inner { position: relative; z-index: 2; max-width: 480px; }
.authbrand-mark { color: #5a4425; margin-bottom: clamp(28px, 6vh, 64px); }
.authbrand .eyebrow { color: #8a6a2f; }
.authbrand h1 {
  font-family: var(--disp); font-weight: 800; font-size: clamp(36px, 4.2vw, 54px);
  line-height: 1.02; letter-spacing: -1px; margin: 0 0 18px; color: #241703;
}
.authbrand h1 .accent { color: var(--brass); }
.authbrand .lede { color: #5c4a2e; font-size: 16.5px; max-width: 42ch; }
.authbrand .lede b { color: #241703; }
.authbrand-rose { position: absolute; right: -60px; bottom: -60px; width: 380px; opacity: .5; pointer-events: none; }
.authbrand-rose .rose { width: 100%; }
.authbrand-proof { list-style: none; margin: 30px 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.authbrand-proof li {
  font-size: 13.5px; color: #5c4a2e; padding-left: 22px; position: relative;
}
.authbrand-proof li::before { content: "✓"; position: absolute; left: 0; color: var(--brass); font-weight: 700; }

.authform-panel { display: flex; align-items: center; justify-content: center; padding: 40px 24px; background: var(--void); }
.authform-card { width: 100%; max-width: 380px; }
.authform-card .authtabs {
  display: grid; grid-template-columns: 1fr 1fr; gap: 3px; margin-bottom: 28px;
  background: var(--ink); border-radius: 12px; padding: 4px; border: 1px solid var(--line);
}
.authform-card .atab {
  padding: 9px 0; border-radius: 9px; cursor: pointer; background: transparent; border: none;
  color: var(--muted); font-family: var(--disp); font-weight: 700; font-size: 14px; transition: .15s;
}
.authform-card .atab.active { color: var(--paper); background: var(--void); box-shadow: 0 1px 5px rgba(16,24,38,.10); }
.oauthrow { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; }
.oauthbtn {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  padding: 12px; border-radius: 10px; border: 1px solid var(--line); background: var(--void);
  color: var(--paper); font-family: var(--body); font-weight: 600; font-size: 14px; transition: .15s;
}
.oauthbtn:hover { border-color: #ccd3da; text-decoration: none; background: var(--ink); }
.orline { text-align: center; margin: 2px 0 20px; position: relative; color: var(--muted-2); font-family: var(--body); font-size: 12.5px; }
.orline::before, .orline::after { content: ""; position: absolute; top: 50%; width: 36%; height: 1px; background: var(--line-2); }
.orline::before { left: 0; } .orline::after { right: 0; }
.authform { display: flex; flex-direction: column; gap: 16px; }
.authform .field { margin: 0; display: flex; flex-direction: column; gap: 7px; }
.authform .field label { font-family: var(--body); font-size: 13px; font-weight: 600; letter-spacing: 0; text-transform: none; color: #33404f; }
.authform .field input {
  background: var(--ink); border: 1px solid transparent; border-radius: 10px;
  padding: 11px 14px; font-size: 14.5px; color: var(--paper);
}
.authform .field input:focus { border-color: var(--brass); background: var(--void); box-shadow: 0 0 0 3px rgba(184,114,31,.1); }
.authform .field input::placeholder { color: var(--muted-2); }
.authsubmit {
  width: 100%; padding: 13px; border: none; border-radius: 999px; margin-top: 6px;
  background: #1a1208; color: #fdf6ea; font-family: var(--body); font-weight: 700; font-size: 15px;
  cursor: pointer; transition: .15s;
}
.authsubmit:hover { background: #2a1e10; }
.authsubmit:disabled { opacity: .5; cursor: default; }
@media (max-width: 860px) {
  .authscreen { grid-template-columns: 1fr; }
  .authbrand { padding: 32px 24px 40px; }
  .authbrand-inner { max-width: 100%; }
  .authbrand-proof, .authbrand-rose { display: none; }
  .authbrand h1 { font-size: 34px; }
}

/* HESAP: profil + paket */
.avatarrow { display: flex; align-items: center; gap: 16px; margin-bottom: 18px; }
.avatar { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; border: 2px solid var(--line); background: var(--void); }
.linkrow { display: flex; gap: 8px; margin-bottom: 8px; }
.linkrow .plink { flex: 1; }
.rmlink { flex: none; width: 38px; border-radius: 10px; border: 1px solid var(--line); background: var(--void); color: var(--coral); cursor: pointer; }
.rmlink:hover { border-color: var(--coral); }
#account .field { margin-bottom: 16px; }
.planbadge { display: inline-block; padding: 6px 14px; border-radius: 20px; font-family: var(--mono); font-size: 12px; font-weight: 700; background: #eef0f3; color: var(--muted); margin-bottom: 14px; }
.planbadge.pro { background: rgba(79,214,180,.12); color: var(--mint); border: 1px solid rgba(79,214,180,.3); }
.usagebox { display: flex; flex-direction: column; gap: 7px; margin-bottom: 16px; }
.usagerow { display: flex; justify-content: space-between; font-size: 13.5px; color: #33404f; padding: 8px 12px; background: var(--void); border: 1px solid var(--line-2); border-radius: 9px; }
.progressbar { height: 8px; border-radius: 5px; background: var(--void); border: 1px solid var(--line-2); overflow: hidden; margin: 8px 0 4px; }
.progressfill { height: 100%; background: var(--mint); border-radius: 5px; transition: width .4s ease; }
.streakbadge { font-family: var(--mono); font-size: 11px; color: var(--brass); margin-left: 4px; }
.simq, .sima { font-size: 13.5px; padding: 8px 12px; border-radius: 9px; margin: 6px 0; max-width: 85%; }
.simq { background: var(--void); border: 1px solid var(--line-2); }
.sima { background: rgba(79,214,180,.08); border: 1px solid rgba(79,214,180,.25); margin-left: auto; }
.simrow { display: flex; gap: 8px; margin-top: 8px; }
.simrow .siminput { flex: 1; }
.summarycard { background: var(--void); border: 1px solid var(--line-2); border-radius: 12px; padding: 16px 18px; margin: 14px 0; }
.summarycard.locked { border-color: rgba(212,163,79,.35); }
.summarytitle { font-weight: 700; margin-bottom: 8px; }
.summarystats { display: flex; gap: 24px; flex-wrap: wrap; margin: 10px 0; }
.sstat { display: flex; flex-direction: column; }
.sstat b { font-size: 22px; font-family: var(--mono); color: var(--mint); }
.sstat span { font-size: 12px; color: var(--muted); }
.sectorchips { display: flex; gap: 6px; flex-wrap: wrap; margin: 8px 0; }
.sectorchip { font-size: 12px; padding: 4px 10px; border-radius: 20px; background: #eef0f3; color: #33404f; }
.topopps { font-size: 13px; color: #33404f; margin-top: 8px; }

/* Dairesel uyum skoru gauge (Jobright ilhamlı) */
.gaugewrap { display: flex; flex-direction: column; align-items: center; gap: 4px; flex: none; }
.gauge { position: relative; width: 60px; height: 60px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: conic-gradient(var(--gauge-c) calc(var(--pct) * 3.6deg), var(--line-2) 0deg); }
.gauge::before { content: ""; position: absolute; inset: 6px; border-radius: 50%; background: var(--void); }
.gaugeval { position: relative; z-index: 1; font-family: var(--mono); font-weight: 700; font-size: 15px; color: var(--paper); }
.gaugeval span { font-size: 10px; color: var(--muted); }
.gauge.hi { --gauge-c: var(--mint); }
.gauge.mid { --gauge-c: var(--brass); }
.gauge.lo { --gauge-c: var(--muted); }
.gaugelabel { font-family: var(--mono); font-size: 9px; font-weight: 700; letter-spacing: .3px; text-transform: uppercase; text-align: center; white-space: nowrap; }
.gaugelabel.hi { color: var(--mint); }
.gaugelabel.mid { color: var(--brass); }
.gaugelabel.lo { color: var(--muted); }

/* Alt-skor kırılımı: Deneyim/Beceri/Sektör */
.matchbreak { display: flex; flex-direction: column; gap: 4px; margin: 6px 0 10px; }
.matchrow { display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: var(--muted); }
.matchrow .mlbl { width: 56px; flex: none; }
.matchbar { flex: 1; height: 5px; border-radius: 3px; background: var(--line-2); overflow: hidden; }
.matchbar span { display: block; height: 100%; background: var(--mint); border-radius: 3px; }
.matchrow .mval { width: 34px; text-align: right; font-family: var(--mono); flex: none; }
.upgradeform { margin-top: 14px; padding-top: 16px; border-top: 1px solid var(--line-2); }

/* Responsive */
@media (max-width: 860px) {
  .hero { grid-template-columns: 1fr; gap: 8px; text-align: left; }
  .hero-rose { order: -1; opacity: .5; }
  .rose { width: 210px; }
  .fields { grid-template-columns: 1fr; }
  .oppgrid { grid-template-columns: 1fr; }
  .hrow { grid-template-columns: 1fr; }
  .hacts { grid-column: 1; grid-row: auto; }
}
@media (max-width: 520px) {
  .modes { grid-template-columns: 1fr; }
}

/* A11y */
:focus-visible { outline: 2px solid var(--brass); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
  .rose .needle, .radar span, .opp { animation: none; }
  .opp { opacity: 1; transform: none; }
}

/* ================= Hazırlık paneli: CV skor sıçraması ================= */
.scorejump { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; padding: 10px 12px; background: var(--ink); border: 1px solid var(--line); border-radius: 10px; }
.sjval { font-family: var(--mono); font-weight: 700; font-size: 17px; padding: 3px 9px; border-radius: 7px; }
.sjbefore { color: var(--muted); background: var(--void); }
.sjafter { color: var(--void); background: var(--mint); }
.scorejump svg { color: var(--muted); flex: none; }
.sjlabel { font-size: 11.5px; color: var(--muted); margin-left: 2px; }
.rewrite { display: flex; flex-direction: column; gap: 6px; margin: 6px 0 14px; }
.rwrow { font-size: 13px; line-height: 1.5; padding: 8px 10px 8px 8px; border-radius: 8px; display: flex; gap: 8px; }
.rwtag { flex: none; font-family: var(--mono); font-size: 9.5px; font-weight: 700; text-transform: uppercase; padding: 2px 7px; border-radius: 5px; height: fit-content; margin-top: 1px; }
.rwbefore { background: var(--ink); border: 1px solid var(--line); color: #556; }
.rwbefore .rwtag { background: var(--void); color: var(--muted); }
.rwafter { background: rgba(13,148,136,.08); border: 1px solid rgba(13,148,136,.25); color: #0d5a52; }
.rwafter .rwtag { background: var(--mint); color: var(--void); }

/* ================= Ayna testi: sohbetle taslak düzeltme ================= */
.tweaklog { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; max-height: 180px; overflow-y: auto; }
.twmsg { margin: 0; padding: 7px 10px; border-radius: 9px; font-size: 12.5px; line-height: 1.45; max-width: 90%; }
.twmsg.bot { background: var(--ink); border: 1px solid var(--line); align-self: flex-start; color: #33404f; }
.twmsg.you { background: var(--brass); color: var(--void); align-self: flex-end; }
.tweakrow { display: flex; gap: 6px; margin-top: 8px; }
.tweakinput { flex: 1; resize: none; border: 1px solid var(--line); border-radius: 9px; padding: 8px 10px; font-family: var(--body); font-size: 12.5px; max-height: 90px; }
.tweaksendbtn { width: 32px; height: 32px; flex: none; border-radius: 50%; border: none; background: var(--brass); color: var(--void); cursor: pointer; font-size: 13px; }
.tweaksendbtn:hover { opacity: .9; }

/* ================= ORION: kalıcı AI asistan ================= */
.orionbtn {
  position: fixed; right: 22px; bottom: 22px; z-index: 200;
  width: 54px; height: 54px; border-radius: 50%; border: 1px solid var(--line);
  background: var(--brass); color: var(--void); display: flex; align-items: center; justify-content: center;
  box-shadow: 0 10px 30px -10px rgba(184,114,31,.55); cursor: pointer; transition: transform .15s ease;
}
.orionbtn:hover { transform: scale(1.06); }
.orionbtn.active { background: var(--paper); }
.orionpanel {
  position: fixed; right: 22px; bottom: 88px; z-index: 200;
  width: 340px; max-width: calc(100vw - 32px); height: 460px; max-height: calc(100vh - 140px);
  background: var(--void); border: 1px solid var(--line); border-radius: 16px;
  box-shadow: 0 20px 60px -16px rgba(16,24,38,.28); display: flex; flex-direction: column; overflow: hidden;
}
.orionhead {
  display: flex; align-items: center; justify-content: space-between; padding: 12px 14px;
  background: var(--paper); color: var(--void); font-family: var(--mono); font-size: 13px; font-weight: 700;
}
.orionhead button { background: none; border: none; color: var(--void); cursor: pointer; font-size: 15px; opacity: .8; }
.orionhead button:hover { opacity: 1; }
.orionbody { flex: 1; overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 8px; }
.orionmsg { margin: 0; padding: 9px 12px; border-radius: 12px; font-size: 13px; line-height: 1.5; max-width: 88%; }
.orionmsg.bot { background: var(--ink); border: 1px solid var(--line); align-self: flex-start; color: #33404f; }
.orionmsg.you { background: var(--brass); color: var(--void); align-self: flex-end; }
.orioninput { display: flex; gap: 8px; padding: 10px; border-top: 1px solid var(--line); }
.orioninput textarea {
  flex: 1; resize: none; border: 1px solid var(--line); border-radius: 10px; padding: 9px 11px;
  font-family: var(--body); font-size: 13px; max-height: 100px;
}
.orionsendbtn {
  width: 36px; height: 36px; flex: none; border-radius: 50%; border: none; background: var(--brass);
  color: var(--void); cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 15px;
}
.orionsendbtn:hover { opacity: .9; }
@media (max-width: 520px) {
  .orionpanel { right: 12px; bottom: 78px; width: calc(100vw - 24px); }
  .orionbtn { right: 14px; bottom: 14px; }
}
