/* ==========================================================================
   EDITÖR MASASI — yayin oncesi editor masasi
   atelier.css uzerine oturur, kendi token'ini tanimlamaz — --atl-* degiskenlerini
   kullanir (light/dark otomatik, body.dark-mode ile).
   Prefix: pb- (Prep Board). 4 tema: Kanban / Timeline / Canvas / Flow.
   ========================================================================== */

/* ---------- Ana ekran: "Yeni masa" satiri + masa galerisi ---------- */
.pb-list-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 28px 0 22px; }

.pb-title-input {
    background: rgba(127,127,127,.08);
    border: 1px solid var(--atl-glass-stroke);
    border-radius: var(--atl-r-1);
    padding: 9px 12px;
    color: var(--atl-ink);
    font-size: 13.5px;
    font-family: var(--atl-font-body);
    outline: none;
    transition: border-color var(--atl-d-1) var(--atl-ease);
}
.pb-title-input:focus { border-color: var(--atl-aurora-2); }

.pb-board-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 16px; margin-bottom: 32px;
}
.pb-board-grid[hidden] { display: none; }
.pb-board-card {
    display: flex; align-items: flex-start; gap: 14px;
    padding: 18px;
    background: var(--atl-surface-1);
    border: 1px solid var(--atl-glass-stroke);
    border-radius: var(--atl-r-2);
    cursor: pointer; text-align: left;
    backdrop-filter: blur(var(--atl-blur-1));
    -webkit-backdrop-filter: blur(var(--atl-blur-1));
    transition: transform var(--atl-d-1) var(--atl-ease), border-color var(--atl-d-1) var(--atl-ease), box-shadow var(--atl-d-1) var(--atl-ease);
}
.pb-board-card:hover { transform: translateY(-2px); border-color: var(--atl-glass-stroke-strong); box-shadow: 0 14px 30px rgba(0,0,0,.12); }
.pb-board-card__icon {
    flex: 0 0 auto; width: 42px; height: 42px; border-radius: 12px;
    display: grid; place-items: center; font-size: 17px;
    background: color-mix(in oklab, var(--atl-aurora-1) 16%, transparent);
    color: var(--atl-aurora-1);
}
.pb-board-card__body { flex: 1; min-width: 0; }
.pb-board-card__title {
    font-size: 15px; font-weight: 700; color: var(--atl-ink); margin: 0 0 6px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pb-board-card__meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 11.5px; color: var(--atl-faint); }
.pb-board-card__badge {
    font-size: 10.5px; padding: 2px 9px; border-radius: 999px; font-weight: 600;
    background: rgba(127,127,127,.14); color: var(--atl-mute);
}
.pb-board-card__badge--ready { background: color-mix(in oklab, var(--atl-aurora-2) 20%, transparent); color: var(--atl-aurora-2); }
.pb-board-card__badge--sent { background: color-mix(in oklab, var(--atl-success) 18%, transparent); color: var(--atl-success); }
.pb-board-card__arrow { color: var(--atl-faint); align-self: center; flex: 0 0 auto; }

.pb-board-card--archived { opacity: .68; }
.pb-board-card--archived:hover { opacity: 1; }
.pb-board-card__archive-btn {
    flex: 0 0 auto; align-self: center;
    width: 30px; height: 30px; border-radius: 50%;
    display: grid; place-items: center;
    color: var(--atl-faint); background: transparent; border: none;
    cursor: pointer; font-size: 12px;
    opacity: 0; transition: opacity var(--atl-d-1) var(--atl-ease), background var(--atl-d-1) var(--atl-ease), color var(--atl-d-1) var(--atl-ease);
}
.pb-board-card:hover .pb-board-card__archive-btn,
.pb-board-card--archived .pb-board-card__archive-btn { opacity: 1; }
.pb-board-card__archive-btn:hover { background: var(--atl-surface-2); color: var(--atl-ink); }

#pbArchiveBoardBtn.is-archived { color: var(--atl-aurora-2); border-color: color-mix(in oklab, var(--atl-aurora-2) 40%, transparent); }

/* ---------- Masa editoru: sagdan acilan, %80 genislikte, animasyonlu drawer.
   .atl-modal--drawer'in kendi giris animasyonunu (atl-drawer-in) ve backdrop'unu
   yeniden kullanir — sadece genislik override edilir. Onceden buraya bir
   padding-top:92px hilesi eklenmisti (#prepBoardPage'in .atelier-page {
   position:relative; z-index:2 } stacking context'i icinde z-index'in ust
   topbar'i gecemedigi icin fiziksel bosluk gerekiyordu) — artik bu modal
   pro.html'de #prepBoardPage'in DISINA (body seviyesine) tasindi, z-index:999
   gercekten topbar/dock'un (95/99) uzerine cikabiliyor, boylece gercek
   height:100% + tam ekran korunuyor, ekstra bosluk gerekmiyor. Kapanista
   simetrik bir cikis animasyonu oynuyor (bkz. prep-board.js: closeBoardEditor). ---------- */
.pb-board-editor .pb-editor-panel {
    max-width: 80vw; width: 80vw;
    display: flex; flex-direction: column;
    padding: 0; overflow: hidden;
}
.pb-board-editor.pb-editor-closing .pb-editor-panel {
    animation: pb-drawer-out .22s cubic-bezier(.16,1,.3,1) forwards;
}
@keyframes pb-drawer-out {
    from { transform: translateX(0); opacity: 1; }
    to { transform: translateX(100%); opacity: .6; }
}
@media (max-width: 900px) {
    .pb-board-editor .pb-editor-panel { max-width: 100vw; width: 100vw; }
}

.pb-editor-header {
    display: flex; align-items: center; flex-wrap: wrap; gap: 14px;
    padding: 16px 24px;
    background: var(--atl-surface-1);
    border-bottom: 1px solid var(--atl-glass-stroke);
    flex: 0 0 auto;
}
.pb-editor-actions { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.pb-editor-body { flex: 1 1 auto; overflow-y: auto; padding: 24px; }
.pb-editor-body.pb-views { min-height: 0; }

/* ---------- Ekip: varlik (presence) avatarlari + sesli oda ---------- */
.pb-presence { display: flex; align-items: center; }
.pb-presence-avatar {
    width: 28px; height: 28px; border-radius: 50%;
    display: grid; place-items: center;
    font-size: 11px; font-weight: 700; color: #fff;
    border: 2px solid var(--atl-surface-1);
    margin-left: -8px;
    font-family: var(--atl-font-mono);
}
.pb-presence-avatar:first-child { margin-left: 0; }

.pb-voice-btn.is-active { color: var(--atl-live); border-color: color-mix(in oklab, var(--atl-live) 40%, transparent); }
.pb-voice-bar {
    display: flex; align-items: center; gap: 8px;
    padding: 6px 10px; border-radius: 999px;
    background: color-mix(in oklab, var(--atl-live) 10%, transparent);
    border: 1px solid color-mix(in oklab, var(--atl-live) 30%, transparent);
}
.pb-voice-participants { display: flex; align-items: center; }
.pb-voice-avatar {
    width: 24px; height: 24px; border-radius: 50%;
    display: grid; place-items: center;
    font-size: 10px; font-weight: 700; color: #fff;
    margin-left: -6px;
    font-family: var(--atl-font-mono);
    border: 2px solid var(--atl-surface-1);
    transition: box-shadow .15s ease;
}
.pb-voice-avatar:first-child { margin-left: 0; }
.pb-voice-avatar.is-speaking { box-shadow: 0 0 0 2px var(--atl-live); }
.pb-voice-icon-btn {
    width: 26px; height: 26px; border-radius: 50%; border: none; cursor: pointer;
    display: grid; place-items: center; font-size: 11px;
    background: var(--atl-surface-2); color: var(--atl-ink);
}
.pb-voice-icon-btn:hover { background: var(--atl-surface-3); }
.pb-voice-icon-btn.is-muted { color: var(--atl-live); }
.pb-voice-icon-btn--danger { background: color-mix(in oklab, var(--atl-live) 16%, transparent); color: var(--atl-live); }

/* Kart Inspector'i editorun UZERINDE acilmali (editor icinden tetikleniyor) —
   ikisi de .atl-modal (z-index:999) oldugu icin sira eşit kalirdi, Inspector'a
   ozel daha yuksek bir deger veriyoruz. */
#pbInspector.atl-modal { z-index: 1001; }

/* ---------- Empty states ---------- */
.pb-empty-state {
    display: flex; flex-direction: column; align-items: center; gap: 14px;
    padding: 64px 24px; text-align: center;
    color: var(--atl-mute);
}
.pb-empty-state[hidden] { display: none; }
.pb-empty-state i { font-size: 34px; opacity: .5; }
.pb-empty {
    padding: 28px 16px; text-align: center; color: var(--atl-faint); font-size: 13px;
}

/* ---------- View shell ---------- */
.pb-views { position: relative; min-height: 320px; }
.pb-view[hidden] { display: none !important; }

/* ---------- Card base (shared by all 4 themes) ---------- */
.pb-card {
    position: relative;
    background: var(--atl-surface-2);
    border: 1px solid var(--atl-glass-stroke);
    border-radius: var(--atl-r-1);
    padding: 12px 12px 12px 14px;
    cursor: pointer;
    backdrop-filter: blur(var(--atl-blur-1));
    -webkit-backdrop-filter: blur(var(--atl-blur-1));
    transition: transform var(--atl-d-1) var(--atl-ease), box-shadow var(--atl-d-1) var(--atl-ease), border-color var(--atl-d-1) var(--atl-ease);
}
.pb-card:hover { border-color: var(--atl-glass-stroke-strong); box-shadow: 0 8px 22px rgba(0,0,0,.10); }
.pb-card::before {
    content: ''; position: absolute; left: 0; top: 8px; bottom: 8px; width: 3px; border-radius: 3px;
    background: var(--pb-accent, var(--atl-aurora-1));
}
.pb-card--segment { --pb-accent: var(--atl-aurora-1); }
.pb-card--note { --pb-accent: var(--atl-aurora-3); }
.pb-card--media { --pb-accent: var(--atl-aurora-4); }
.pb-card--link { --pb-accent: var(--atl-aurora-2); }
.pb-card--checklist { --pb-accent: var(--atl-aurora-5); }

.pb-card__type { font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--atl-faint); font-family: var(--atl-font-mono); }
.pb-card__title { font-size: 13.5px; font-weight: 600; color: var(--atl-ink); margin-top: 3px; line-height: 1.35; word-break: break-word; }
.pb-card__body { font-size: 12px; color: var(--atl-mute); margin-top: 4px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pb-card__foot { display: flex; align-items: center; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
.pb-card__chip {
    font-size: 10.5px; padding: 2px 8px; border-radius: 999px;
    background: rgba(127,127,127,.12); color: var(--atl-mute); font-family: var(--atl-font-mono);
}
.pb-card__priority-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--atl-live); flex: 0 0 auto; }
.pb-card__chip--verify-verified { background: rgba(46,190,126,.15); color: var(--atl-success); }
.pb-card__chip--verify-pending { background: rgba(255,176,32,.15); color: #FFB020; }
.pb-card__chip--verify-unverified { background: rgba(255,59,92,.15); color: var(--atl-live); }
.pb-card--priority-must .pb-card__title::after { content: ''; }

.pb-dragging { opacity: .35; transform: scale(.97) rotate(-1deg); }
.pb-drop-marker { height: 3px; background: var(--atl-aurora-2); border-radius: 3px; margin: 4px 0; }
.pb-tl-strip .pb-drop-marker { height: auto; width: 3px; margin: 0 4px; align-self: stretch; }

/* ---------- KANBAN ---------- */
.pb-kb-board { display: grid; grid-template-columns: repeat(4, minmax(220px, 1fr)); gap: 14px; overflow-x: auto; padding-bottom: 8px; }
.pb-kb-col {
    background: var(--atl-surface-1);
    border: 1px solid var(--atl-glass-stroke);
    border-radius: var(--atl-r-2);
    padding: 12px; min-height: 200px;
    display: flex; flex-direction: column;
}
.pb-kb-col-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; padding: 0 2px; }
.pb-kb-col-title { font-size: 12.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--atl-mute); }
.pb-kb-col-count { font-size: 11px; color: var(--atl-faint); font-family: var(--atl-font-mono); }
.pb-kb-col-body { display: flex; flex-direction: column; gap: 8px; flex: 1; min-height: 60px; }
.pb-kb-col-body.pb-drop-target { outline: 2px dashed var(--atl-aurora-2); outline-offset: 4px; border-radius: var(--atl-r-1); }
.pb-kb-add {
    margin-top: 8px; padding: 8px; border-radius: var(--atl-r-1); border: 1px dashed var(--atl-glass-stroke-strong);
    color: var(--atl-faint); font-size: 12px; text-align: center; cursor: pointer; background: transparent;
    transition: border-color var(--atl-d-1) var(--atl-ease), color var(--atl-d-1) var(--atl-ease);
}
.pb-kb-add:hover { border-color: var(--atl-aurora-2); color: var(--atl-aurora-2); }

@media (max-width: 900px) {
    .pb-kb-board { grid-template-columns: 1fr; }
}

/* ---------- TIMELINE ---------- */
.pb-tl-wrap { background: var(--atl-surface-1); border: 1px solid var(--atl-glass-stroke); border-radius: var(--atl-r-2); padding: 16px; }
.pb-tl-summary { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; flex-wrap: wrap; }
.pb-tl-badge { font-size: 12px; padding: 5px 12px; border-radius: 999px; background: rgba(127,127,127,.12); color: var(--atl-ink); font-family: var(--atl-font-mono); }
.pb-tl-badge--over { background: color-mix(in oklab, var(--atl-live) 16%, transparent); color: var(--atl-live); }
.pb-tl-badge--ok { background: color-mix(in oklab, var(--atl-success) 16%, transparent); color: var(--atl-success); }
.pb-tl-strip { display: flex; align-items: stretch; gap: 4px; overflow-x: auto; padding: 6px 2px 14px; min-height: 132px; }
.pb-tl-card {
    flex: 0 0 auto; width: 160px; display: flex; flex-direction: column; justify-content: space-between;
}
.pb-tl-card .pb-card__time { font-size: 10.5px; color: var(--atl-faint); font-family: var(--atl-font-mono); margin-top: 6px; }
.pb-tl-add { flex: 0 0 auto; width: 120px; border: 1px dashed var(--atl-glass-stroke-strong); border-radius: var(--atl-r-1); display: flex; align-items: center; justify-content: center; color: var(--atl-faint); cursor: pointer; background: transparent; }
.pb-tl-add:hover { border-color: var(--atl-aurora-2); color: var(--atl-aurora-2); }

/* ---------- CANVAS (corkboard) ---------- */
.pb-cv-viewport {
    position: relative; overflow: hidden; height: 62vh; min-height: 420px;
    background:
        radial-gradient(circle at 1px 1px, var(--atl-glass-stroke) 1px, transparent 0) 0 0/22px 22px,
        var(--atl-surface-0);
    border: 1px solid var(--atl-glass-stroke);
    border-radius: var(--atl-r-2);
    cursor: grab;
}
.pb-cv-viewport.pb-cv-panning { cursor: grabbing; }
.pb-cv-world { position: absolute; left: 0; top: 0; width: 0; height: 0; transform-origin: 0 0; }
.pb-cv-card { position: absolute; width: 220px; }
.pb-cv-card:active { cursor: grabbing; }
.pb-cv-hint {
    position: absolute; left: 14px; bottom: 14px; font-size: 11.5px; color: var(--atl-faint);
    background: var(--atl-surface-2); padding: 6px 12px; border-radius: 999px; border: 1px solid var(--atl-glass-stroke);
    pointer-events: none;
}
.pb-cv-zoom { position: absolute; right: 14px; bottom: 14px; display: flex; gap: 4px; }
.pb-cv-zoom button {
    width: 30px; height: 30px; border-radius: 8px; border: 1px solid var(--atl-glass-stroke);
    background: var(--atl-surface-2); color: var(--atl-ink); cursor: pointer;
}

/* ---------- FLOW (node diagram) ---------- */
.pb-fl-viewport {
    position: relative; overflow: hidden; height: 62vh; min-height: 420px;
    background: var(--atl-surface-0);
    border: 1px solid var(--atl-glass-stroke);
    border-radius: var(--atl-r-2);
    cursor: grab;
}
.pb-fl-viewport.pb-cv-panning { cursor: grabbing; }
.pb-fl-world { position: absolute; left: 0; top: 0; width: 0; height: 0; transform-origin: 0 0; }
.pb-fl-node { position: absolute; width: 240px; }
.pb-fl-node.pb-card { padding-left: 26px; }
.pb-fl-port {
    position: absolute; top: 50%; width: 12px; height: 12px; border-radius: 50%;
    background: var(--atl-surface-3); border: 2px solid var(--pb-accent, var(--atl-aurora-1));
    transform: translateY(-50%); cursor: crosshair; z-index: 2;
}
.pb-fl-port--out { right: -6px; }
.pb-fl-port--in { left: -6px; }
.pb-fl-port:hover { background: var(--atl-aurora-2); }
.pb-fl-edges-layer { position: absolute; left: 0; top: 0; overflow: visible; pointer-events: none; }
.pb-fl-edges-layer path { fill: none; stroke: var(--atl-glass-stroke-strong); stroke-width: 2; pointer-events: stroke; cursor: pointer; }
.pb-fl-edges-layer path:hover { stroke: var(--atl-live); }
.pb-fl-edges-layer text { font-size: 11px; fill: var(--atl-mute); font-family: var(--atl-font-mono); pointer-events: all; cursor: pointer; }
.pb-fl-edge-temp { stroke: var(--atl-aurora-2); stroke-width: 2; stroke-dasharray: 4 4; }

/* ---------- Inspector extras ---------- */
.pb-media-preview {
    min-height: 60px; border-radius: var(--atl-r-1); border: 1px dashed var(--atl-glass-stroke-strong);
    display: flex; align-items: center; justify-content: center; color: var(--atl-faint); font-size: 12px;
    background: rgba(127,127,127,.05); overflow: hidden;
}
.pb-media-preview img, .pb-media-preview video { width: 100%; max-height: 140px; object-fit: cover; }
.pb-row { display: flex; gap: 8px; margin-top: 8px; }
.pb-checklist { display: flex; flex-direction: column; gap: 6px; }
.pb-checklist-item { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.pb-checklist-item input[type="text"] {
    flex: 1; background: rgba(127,127,127,.08); border: 1px solid var(--atl-glass-stroke);
    border-radius: 8px; padding: 6px 10px; color: var(--atl-ink); font-size: 13px; outline: none;
}
.pb-checklist-item__remove { color: var(--atl-faint); cursor: pointer; padding: 4px; }
.pb-checklist-item__remove:hover { color: var(--atl-live); }

.pb-color-row { display: flex; gap: 8px; margin-top: 14px; }
.pb-color-dot {
    width: 26px; height: 26px; border-radius: 50%; border: 2px solid transparent;
    background: var(--dot); cursor: pointer; position: relative;
}
.pb-color-dot--none { background: transparent; border: 2px dashed var(--atl-glass-stroke-strong); }
.pb-color-dot.is-active { border-color: var(--atl-ink); }

/* ---------- "Yeni Masa" popup: yandan acilan panel (drawer), varsayilan 420px'ten
   biraz genis — 4 tema kartinin rahat sigmasi icin. #prepBoardPage'in DISINA
   tasindigi icin (bkz. pro.html + .pb-board-editor yorumu) artik topbar ile
   cakismiyor, padding-top hilesine gerek yok — gercek height:100%. */
.pb-create-modal .atl-modal__panel { max-width: 540px; }
@media (max-width: 640px) { .pb-create-modal .atl-modal__panel { max-width: 100%; } }

.pb-create-view-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 4px; }
@media (max-width: 520px) { .pb-create-view-grid { grid-template-columns: 1fr; } }
.pb-create-view-tile {
    display: flex; flex-direction: column; align-items: flex-start; gap: 6px;
    padding: 16px 18px;
    background: rgba(127,127,127,.05);
    border: 1.5px solid var(--atl-glass-stroke);
    border-radius: var(--atl-r-2);
    cursor: pointer; text-align: left;
    color: var(--atl-ink);
    transition: border-color var(--atl-d-1) var(--atl-ease), background var(--atl-d-1) var(--atl-ease), transform var(--atl-d-1) var(--atl-ease);
}
.pb-create-view-tile:hover { border-color: var(--atl-glass-stroke-strong); transform: translateY(-1px); }
.pb-create-view-tile i { font-size: 20px; color: var(--atl-aurora-1); }
.pb-create-view-tile strong { font-size: 14.5px; font-weight: 700; }
.pb-create-view-tile span { font-size: 12px; color: var(--atl-mute); line-height: 1.4; }
.pb-create-view-tile.is-active {
    border-color: var(--atl-aurora-1);
    background: color-mix(in oklab, var(--atl-aurora-1) 10%, transparent);
}

/* ---------- Medya / yayin secici (inspector'da ve "Reji'ye Gonder" hand-off'ta kullanilan
   dinamik-enjekte popover liste) ---------- */
.pb-media-picker { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px; max-height: 320px; overflow-y: auto; }
.pb-media-picker-item {
    display: flex; flex-direction: column; align-items: center; gap: 6px;
    padding: 10px 8px; border-radius: var(--atl-r-1); border: 1px solid var(--atl-glass-stroke);
    cursor: pointer; text-align: center; font-size: 11px; color: var(--atl-mute);
    transition: border-color var(--atl-d-1) var(--atl-ease), background var(--atl-d-1) var(--atl-ease);
}
.pb-media-picker-item:hover { border-color: var(--atl-aurora-2); background: rgba(127,127,127,.06); }
.pb-media-picker-item img { width: 100%; height: 64px; object-fit: cover; border-radius: 8px; }
.pb-media-picker-item i { font-size: 22px; color: var(--atl-faint); }
.pb-media-picker-item span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; word-break: break-word; }

/* ---------- BultenHub köprüsü: kaynak seç modalı + haber arama paneli ---------- */
.pb-news-setup-hint { font-size: 12.5px; color: var(--atl-mute); margin: 0 0 14px; line-height: 1.5; }
.pb-news-chip-group { flex-wrap: wrap; max-height: 180px; overflow-y: auto; }
.pb-news-empty-hint { font-size: 12px; color: var(--atl-faint); padding: 4px 0; }

/* Panel eskiden .atl-modal--drawer'di (420px sabit, tek sutun) -- "cok minik
   kaliyor" geri bildirimi (2026-08-23) uzerine .atl-modal--wide'a (80vw)
   gecirildi, sonuc listesi tek sutundan grid'e cevrildi. Baslik/govde sabit
   kalsin, sadece sonuclar (.pb-news-results) kendi icinde kaysin diye panel
   flex-column + overflow:hidden yapilip kaydirma alt gride devrediliyor. */
#pbNewsPanel .atl-modal__panel { display: flex; flex-direction: column; overflow: hidden; }
.pb-news-panel-body { display: flex; flex-direction: column; gap: 12px; flex: 1; min-height: 0; }
.pb-news-search-row { display: flex; gap: 8px; flex-wrap: wrap; }
.pb-news-search-row[hidden] { display: none; }
.pb-news-search-row select {
    padding: 9px 32px 9px 14px; border-radius: 999px; cursor: pointer;
    border: 1px solid var(--atl-glass-stroke);
    background: var(--atl-surface-1) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%235C5C6E' stroke-width='1.6' stroke-linecap='round'/></svg>") no-repeat right 13px center;
    background-size: 10px;
    color: var(--atl-ink); font-family: inherit; font-size: 12.5px; font-weight: 600;
    appearance: none; -webkit-appearance: none; outline: none;
    transition: border-color var(--atl-d-1) var(--atl-ease);
}
.pb-news-search-row select:focus { border-color: var(--atl-aurora-1); }

.pb-news-results {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    align-content: start; align-items: start; gap: 18px;
    overflow-y: auto; flex: 1; min-height: 0;
    padding: 4px 4px 8px; /* hover'da 2px yukselen kartlarin golgesi kirpilmasin */
}
.pb-news-empty { text-align: center; color: var(--atl-faint); padding: 30px 0; font-size: 13px; grid-column: 1 / -1; }

/* Bulten modu: hazir gunluk rundown'u oldugu gibi masaya dokme
   (kullanici talebi, 2026-09-08). */
/* ---------- Panel ust cubugu: mod secimi + arama + (gizlenebilir) filtreler ----------
   Onceden arama kutusu ve 4 adet <select> TEK SIRADA duruyordu; yogun ve
   itici goruntuluyordu. Artik varsayilan gorunum sadece "mod + arama";
   filtreler istege bagli aciliyor, acik filtre sayisi rozetle belli oluyor
   (kullanici geri bildirimi, 2026-09-08: "daha kolay ve estetik"). */
.pb-news-toolbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

/* [hidden] ozniteligi, CSS'te acikca display verilmis elemanlarda ETKISIZ kalir
   (UA stylesheet'teki display:none override edilir). setNewsMode bu elemanlari
   .prop('hidden', true) ile gizlemeye calisiyordu ama bulten moduna gecince
   arama kutusu ve eski haber kartlari ekranda kaliyordu -- onizleme ekran
   goruntusunde yakalandi (2026-09-08). */
.pb-news-search[hidden],
.pb-news-filter-btn[hidden],
.pb-news-results[hidden] { display: none !important; }

.pb-seg {
    display: inline-flex; padding: 3px; gap: 2px; flex: none;
    background: rgba(127,127,127,.10); border-radius: 999px;
}
.pb-seg__btn {
    appearance: none; border: 0; cursor: pointer;
    padding: 7px 16px; border-radius: 999px;
    font-family: inherit; font-size: 13px; font-weight: 600;
    color: var(--atl-mute); background: transparent;
    transition: color var(--atl-d-1) var(--atl-ease), background var(--atl-d-1) var(--atl-ease), box-shadow var(--atl-d-1) var(--atl-ease);
}
.pb-seg__btn:hover { color: var(--atl-ink); }
.pb-seg__btn.is-active {
    background: var(--atl-surface-3); color: var(--atl-ink);
    box-shadow: 0 1px 2px rgba(11,11,20,.10), 0 0 0 1px var(--atl-glass-stroke);
}

.pb-news-search {
    position: relative; flex: 1 1 260px; min-width: 200px;
    display: flex; align-items: center;
}
.pb-news-search i {
    position: absolute; left: 14px; font-size: 12.5px;
    color: var(--atl-faint); pointer-events: none;
}
.pb-news-search input {
    width: 100%; padding: 11px 14px 11px 36px;
    border-radius: 999px; border: 1px solid var(--atl-glass-stroke);
    background: var(--atl-surface-1); color: var(--atl-ink);
    font-family: inherit; font-size: 13.5px; outline: none;
    transition: border-color var(--atl-d-1) var(--atl-ease), background var(--atl-d-1) var(--atl-ease);
}
.pb-news-search input::placeholder { color: var(--atl-faint); }
.pb-news-search input:focus { border-color: var(--atl-aurora-1); background: var(--atl-surface-3); }

.pb-news-filter-btn {
    display: inline-flex; align-items: center; gap: 7px; flex: none;
    padding: 10px 15px; border-radius: 999px; cursor: pointer;
    border: 1px solid var(--atl-glass-stroke); background: var(--atl-surface-1);
    color: var(--atl-mute); font-family: inherit; font-size: 13px; font-weight: 600;
    transition: color var(--atl-d-1) var(--atl-ease), border-color var(--atl-d-1) var(--atl-ease);
}
.pb-news-filter-btn:hover, .pb-news-filter-btn.is-active { color: var(--atl-ink); border-color: var(--atl-glass-stroke-strong); }
.pb-news-filter-count {
    min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--atl-aurora-1); color: #fff; font-size: 11px; font-weight: 700;
}
.pb-news-filter-count[hidden] { display: none; }

.pb-icon-btn {
    width: 34px; height: 34px; flex: none; cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%; border: 1px solid var(--atl-glass-stroke);
    background: var(--atl-surface-1); color: var(--atl-mute); font-size: 13px;
    transition: color var(--atl-d-1) var(--atl-ease), background var(--atl-d-1) var(--atl-ease);
}
.pb-icon-btn:hover { color: var(--atl-ink); background: var(--atl-surface-3); }

.pb-bulletin-bar { display: flex; align-items: center; gap: 12px; }
.pb-bulletin-bar[hidden] { display: none; }
.pb-bulletin-title {
    font-family: var(--atl-font-display); font-weight: 700; font-size: 15px;
    color: var(--atl-ink); flex: 1; min-width: 0;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* Bulten kartlari: haber kartlariyla AYNI grid ve kart dilinde -- once duz
   satir listesiydi, panelde iki ayri gorsel dil olusuyordu. */
.pb-bulletin-list {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    align-content: start; align-items: start; gap: 18px;
    overflow-y: auto; flex: 1; min-height: 0;
    padding: 4px 4px 8px;
}
.pb-bulletin-list[hidden] { display: none; }
.pb-bulletin-card {
    display: flex; flex-direction: column; gap: 10px; cursor: pointer;
    padding: 16px 18px; border-radius: var(--atl-r-2);
    border: 1px solid var(--atl-glass-stroke); background: var(--atl-surface-1);
    transition: transform var(--atl-d-1) var(--atl-ease), border-color var(--atl-d-1) var(--atl-ease), box-shadow var(--atl-d-1) var(--atl-ease);
}
.pb-bulletin-card:hover {
    transform: translateY(-2px); border-color: var(--atl-aurora-1);
    box-shadow: 0 10px 24px -14px rgba(11,11,20,.35);
}
.pb-bulletin-card__date {
    font-family: var(--atl-font-mono); font-size: var(--atl-tx-6);
    letter-spacing: .06em; text-transform: uppercase; color: var(--atl-aurora-1); font-weight: 700;
}
.pb-bulletin-card__title {
    font-family: var(--atl-font-display); font-weight: 700; font-size: 15px;
    line-height: 1.35; color: var(--atl-ink);
}
.pb-bulletin-card__foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.pb-bulletin-card__count {
    font-size: var(--atl-tx-5); color: var(--atl-mute); font-weight: 600;
    background: rgba(127,127,127,.10); padding: 4px 10px; border-radius: 999px;
}
.pb-bulletin-card__go { color: var(--atl-faint); font-size: 12px; }

/* Sonuc listesi kompakt: puan+baslik+kaynak -- "biraz daha yonlendirici olman
   lazim" geri bildirimi (2026-08-24) sonrasi basliklar TAMAMEN okunamiyordu,
   kaynak da hic gorunmuyordu (kullanici geri bildirimi, 2026-08-25) -- kart
   genisletildi, baslik artik kirpilmiyor, altina kaynak satiri eklendi. Detay
   (aciklama/kategori/tarih) hala tiklayinca #pbNewsDetailModal'da aciliyor.
   */
/* Kart: baslik once (tam genislik), altta tek satir meta (kaynak · kategori ·
   yas) ve sagda puan. Onceki halde puan basligin onunu kesiyordu, kategori/
   zaman hic yoktu ve kartlar icinde buyuk olu bosluk kaliyordu
   (ekran goruntusu alinip incelendi, 2026-09-08). Sol kenardaki ince serit
   puan seviyesini tarama sirasinda belli ediyor. */
.pb-news-result {
    position: relative; overflow: hidden;
    display: flex; flex-direction: column; gap: 10px; justify-content: space-between;
    border: 1px solid var(--atl-glass-stroke); border-radius: var(--atl-r-2);
    padding: 15px 16px 13px 19px; background: var(--atl-surface-3); cursor: pointer;
    transition: transform var(--atl-d-1) var(--atl-ease), border-color var(--atl-d-1) var(--atl-ease),
                box-shadow var(--atl-d-1) var(--atl-ease), opacity var(--atl-d-1) var(--atl-ease);
}
.pb-news-result::before {
    content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
    background: var(--atl-line);
}
.pb-news-result.pb-news-score--high::before { background: var(--atl-success); }
.pb-news-result.pb-news-score--mid::before  { background: var(--atl-warn); }
.pb-news-result:hover {
    transform: translateY(-2px); border-color: var(--atl-glass-stroke-strong);
    box-shadow: 0 12px 26px -16px rgba(11,11,20,.45);
}
.pb-news-result--added { opacity: .55; }
.pb-news-result--added:hover { transform: none; }

.pb-news-title {
    font-family: var(--atl-font-display);
    font-weight: 700; font-size: 15px; line-height: 1.38; color: var(--atl-ink);
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}

.pb-news-foot { display: flex; align-items: center; gap: 10px; }
/* Meta satiri TEK SATIR kalmali. Onceden flex-wrap:wrap idi: uzun kaynak+kategori
   adlarinda (orn. "Internet Haber - Ekonomi ve Finans - 3 gun once") ikinci satira
   tasiyor, puan rozetiyle ust uste biniyor ve kartlar birbirini eziyormus gibi
   gorunuyordu (kullanici ekran goruntusu, 2026-09-09). Artik yer yetmezse
   kategori uc noktayla kirpiliyor; kaynak ve yas her zaman okunur kaliyor. */
.pb-news-meta-line {
    display: flex; align-items: center; gap: 6px; flex-wrap: nowrap; flex: 1;
    min-width: 0; overflow: hidden;
    font-size: var(--atl-tx-5); color: var(--atl-faint); line-height: 1.2;
}
.pb-news-meta-line > span {
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0;
}
/* Kaynak ve yas kirpilmasin; daralinca sadece kategori feda edilsin. */
.pb-news-meta-line > span:first-child,
.pb-news-meta-line > span:last-child { flex: none; }
.pb-news-meta-line .pb-news-src { color: var(--atl-mute); font-weight: 700; }
.pb-news-dot {
    width: 3px; height: 3px; border-radius: 50%; background: currentColor;
    opacity: .5; flex: none;
}
.pb-news-added-badge {
    flex: none; display: inline-flex; align-items: center; gap: 5px;
    font-size: 11px; font-weight: 700; color: var(--atl-success);
}

/* Puan rozeti: kartin sag altinda, notr; renk kodu sol seritte. */
.pb-news-score {
    flex: none; font-family: var(--atl-font-mono, monospace); font-weight: 700; font-size: 11.5px;
    min-width: 34px; height: 22px; padding: 0 8px; border-radius: 999px;
    display: inline-flex; align-items: center; justify-content: center;
    background: rgba(127,127,127,.12); color: var(--atl-mute);
}
.pb-news-score--high .pb-news-score,
.pb-news-detail-head .pb-news-score--high { background: color-mix(in oklab, var(--atl-success) 16%, transparent); color: var(--atl-success); }
.pb-news-score--mid .pb-news-score,
.pb-news-detail-head .pb-news-score--mid { background: color-mix(in oklab, var(--atl-warn) 20%, transparent); color: #B4761B; }
.pb-news-score--lg { min-width: 46px; height: 30px; font-size: 14px; padding: 0 12px; }

.pb-news-meta { display: flex; gap: 8px; flex-wrap: wrap; font-size: 11.5px; color: var(--atl-mute); margin-bottom: 6px; }
.pb-news-meta span { padding: 2px 8px; border-radius: 999px; background: rgba(127,127,127,.10); }
.pb-news-priority--acil   { color: var(--atl-aurora-4); background: color-mix(in oklab, var(--atl-aurora-4) 22%, transparent); }
.pb-news-priority--yuksek { color: var(--atl-aurora-3); background: color-mix(in oklab, var(--atl-aurora-3) 22%, transparent); }

.pb-news-excerpt {
    font-size: 12.5px; color: var(--atl-mute); line-height: 1.5; margin-bottom: 10px;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}

/* ---------- Haber detay karti (#pbNewsDetailModal) ---------- */
.pb-news-detail-body { display: flex; flex-direction: column; gap: 14px; }
.pb-news-detail-head { display: flex; align-items: flex-start; gap: 14px; }
.pb-news-detail-title { margin: 0; font-size: 18px; font-weight: 700; color: var(--atl-ink); line-height: 1.4; }
.pb-news-detail-excerpt { margin: 0; font-size: 14px; color: var(--atl-mute); line-height: 1.65; white-space: pre-wrap; }
.pb-news-detail-link {
    display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px;
    color: var(--atl-aurora-2, #7c6cf0); text-decoration: none; width: fit-content;
}
.pb-news-detail-link:hover { text-decoration: underline; }
.pb-news-add-btn[disabled] { opacity: .6; cursor: default; }
.pb-news-setup-email-hint { display: block; font-size: 11px; color: var(--atl-faint); margin-top: 4px; }

.pb-news-step-indicator { display: flex; align-items: center; gap: 8px; margin-bottom: 18px; }
.pb-news-step-dot {
    width: 26px; height: 26px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
    font-size: 12px; font-weight: 700; background: rgba(127,127,127,.14); color: var(--atl-faint);
    transition: background var(--atl-d-1) var(--atl-ease), color var(--atl-d-1) var(--atl-ease);
}
.pb-news-step-dot.is-active { background: var(--atl-aurora-1); color: #fff; }
.pb-news-step-line { flex: 1; height: 2px; background: rgba(127,127,127,.18); max-width: 60px; }