/* DeuKlar Word Panel Next — shared word-panel system
   Functional source: existing extension word panel. Visual language: deuklar.app dx system. */

/* Shared outer-shell geometry. This is intentionally platform-agnostic:
   website and extension receive the same shell before type-specific rendering. */
#kelime-penceresi {
  position:fixed !important;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
#kelime-penceresi .popup-header {
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  flex-shrink:0 !important;
  user-select:none;
}
#kelime-penceresi #popup-dynamic-content {
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:0;
  overflow:hidden;
  position:relative;
  background:#ffffff !important;
}
#kelime-penceresi #standard-view-container {
  display:flex;
  flex-direction:column;
  width:100%;
  height:100%;
  min-height:0;
  background:#ffffff !important;
}
#kelime-penceresi #lecture-view-container { display:none; }
#kelime-penceresi #popup-resize-handle {
  position:absolute; right:0; bottom:0; width:15px; height:15px;
  background:transparent; cursor:nwse-resize; color:#444; font-size:10px;
  line-height:15px; text-align:center; user-select:none; z-index:10001;
}
#kelime-penceresi #popup-resize-handle:hover { color:#fff; }

/* Shared report geometry mirrors the extension's established report dialog. */
#kelime-penceresi .report-overlay {
  position:absolute; inset:0; width:100%; height:100%;
  z-index:9999; display:flex; justify-content:center; align-items:center;
  animation:reportFadeIn .25s ease;
}
#kelime-penceresi .report-modal {
  width:88%; max-width:380px; border-radius:16px; padding:24px;
  box-sizing:border-box; overflow:hidden; animation:reportSlideUp .3s ease;
}
#kelime-penceresi .report-option {
  display:flex; align-items:center; gap:10px; width:100%; padding:11px 14px;
  margin-bottom:8px; border-radius:10px; cursor:pointer; box-sizing:border-box;
  font-size:13px; text-align:left;
}
#kelime-penceresi .report-message-box {
  width:100%; min-height:60px; max-height:100px; padding:10px 12px;
  border-radius:10px; font-size:12px; font-family:inherit; resize:vertical;
  outline:none; margin-top:4px; box-sizing:border-box;
}
#kelime-penceresi .report-actions { display:flex; gap:10px; margin-top:16px; }
#kelime-penceresi .report-btn-send { flex:1; padding:11px; border-radius:10px; font-weight:700; font-size:13px; cursor:pointer; }
#kelime-penceresi .report-btn-cancel { padding:11px 20px; border-radius:10px; font-size:13px; cursor:pointer; }
#kelime-penceresi .report-success { text-align:center; padding:20px 0; }
@keyframes reportFadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes reportSlideUp { from { transform:translateY(20px); opacity:0; } to { transform:translateY(0); opacity:1; } }

#kelime-penceresi.dk-wp3-pending,
#kelime-penceresi.dk-wp3-active {
  --dkwp-ink:#151617;
  --dkwp-paper:#ffffff;
  --dkwp-cream:#ffffff;
  --dkwp-mist:#f7f5ff;
  --dkwp-viol:#b09cfb;
  --dkwp-viol-soft:#c1b3ff;
  --dkwp-viol-deep:#6a56a7;
  --dkwp-peach:#ffbe98;
  --dkwp-green:#38d794;
  --dkwp-sky:#a5d8ff;
  --dkwp-red:#e63213;
  --dkwp-warn:#ffd98a;
  --dkwp-gold-text:#5f4b96;
  --dkwp-gold-bright:#ffbe98;
  --dkwp-gold-soft:#fff8df;
  --dkwp-err:#ff9d9d;
  --dkwp-line:2.5px solid var(--dkwp-ink);
  --dkwp-r:14px;
  --dkwp-r-sm:10px;
  --dkwp-r-lg:20px;
  --dkwp-t:.16s;
  --dkwp-ease:cubic-bezier(.2,.9,.3,1.2);
  width:760px !important;
  height:780px !important;
  max-width:94vw !important;
  max-height:90vh !important;
  min-width:min(420px, 90vw) !important;
  min-height:520px !important;
  background:#ffffff !important;
  color:var(--dkwp-ink) !important;
  border:var(--dkwp-line) !important;
  border-radius:20px !important;
  box-shadow:8px 8px 0 var(--dkwp-ink) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  font-family:'Geist','Nunito',Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif !important;
  -webkit-font-smoothing:antialiased !important;
  -moz-osx-font-smoothing:grayscale !important;
  text-rendering:optimizeLegibility !important;
  overflow:hidden !important;
}

#kelime-penceresi.dk-wp3-active *,
#kelime-penceresi.dk-wp3-pending * { box-sizing:border-box; }

#kelime-penceresi.dk-wp3-pending .tabs,
#kelime-penceresi.dk-wp3-pending .popup-content,
#kelime-penceresi.dk-wp3-active .tabs,
#kelime-penceresi.dk-wp3-active .popup-content { display:none !important; }

#kelime-penceresi.dk-wp3-pending #lecture-view-container,
#kelime-penceresi.dk-wp3-active #lecture-view-container { background:var(--dkwp-cream); color:var(--dkwp-ink); }

#kelime-penceresi.dk-wp3-pending .popup-header,
#kelime-penceresi.dk-wp3-active .popup-header {
  padding:14px 16px 14px 18px !important;
  min-height:66px;
  background:var(--dkwp-viol) !important;
  border-bottom:var(--dkwp-line) !important;
  color:var(--dkwp-ink) !important;
  cursor:move;
}

#kelime-penceresi.dk-wp3-pending .popup-header > div:first-child,
#kelime-penceresi.dk-wp3-active .popup-header > div:first-child { min-width:0; gap:10px !important; }

#kelime-penceresi.dk-wp3-pending #secilen-kelime,
#kelime-penceresi.dk-wp3-active #secilen-kelime {
  min-width:0;
  max-width:470px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--dkwp-ink) !important;
  font-family:'Geist','Nunito',ui-sans-serif,system-ui,sans-serif !important;
  font-size:var(--dkwp-f-26,26px) !important;
  font-weight:900 !important;
  line-height:1.25 !important;
  padding:2px 0 6px 0 !important;
  letter-spacing:-.035em !important;
  text-shadow:none !important;
}

#kelime-penceresi.dk-wp3-active #dkwp-back-btn,
#kelime-penceresi.dk-wp3-pending #dkwp-back-btn,
#kelime-penceresi.dk-wp3-active #ses-oku-btn,
#kelime-penceresi.dk-wp3-active #report-word-btn,
#kelime-penceresi.dk-wp3-active #popup-yenile,
#kelime-penceresi.dk-wp3-active #popup-kapat,
#kelime-penceresi.dk-wp3-pending #ses-oku-btn,
#kelime-penceresi.dk-wp3-pending #report-word-btn,
#kelime-penceresi.dk-wp3-pending #popup-yenile,
#kelime-penceresi.dk-wp3-pending #popup-kapat {
  width:36px !important;
  height:36px !important;
  min-width:36px;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  padding:0 !important;
  border:2px solid var(--dkwp-ink) !important;
  border-radius:10px !important;
  background:var(--dkwp-paper) !important;
  color:var(--dkwp-ink) !important;
  box-shadow:2px 2px 0 var(--dkwp-ink) !important;
  transform:none !important;
  transition:transform var(--dkwp-t) var(--dkwp-ease),box-shadow var(--dkwp-t) var(--dkwp-ease),background-color var(--dkwp-t) ease !important;
  cursor:pointer;
}
#kelime-penceresi #dkwp-back-btn:not(.has-history),
#kelime-penceresi #dkwp-back-btn[hidden],
#kelime-penceresi.dk-wp3-active #dkwp-back-btn:not(.has-history),
#kelime-penceresi.dk-wp3-pending #dkwp-back-btn:not(.has-history),
#kelime-penceresi.dk-wp3-active #dkwp-back-btn[hidden],
#kelime-penceresi.dk-wp3-pending #dkwp-back-btn[hidden],
#kelime-penceresi.dk-wp3-active #dkwp-back-btn[style*="none"],
#kelime-penceresi.dk-wp3-pending #dkwp-back-btn[style*="none"] {
  display:none !important;
}
#kelime-penceresi.dk-wp3-active :is(#dkwp-back-btn, #ses-oku-btn, #report-word-btn, #popup-yenile, #popup-kapat):focus-visible,
#kelime-penceresi.dk-wp3-pending :is(#dkwp-back-btn, #ses-oku-btn, #report-word-btn, #popup-yenile, #popup-kapat):focus-visible {
  outline:none !important;
}
#kelime-penceresi.dk-wp3-active #dkwp-back-btn:hover { background:var(--dkwp-peach) !important; transform:translate(-1px,-1px) !important; box-shadow:4px 4px 0 var(--dkwp-ink) !important; }
#kelime-penceresi.dk-wp3-active #ses-oku-btn:hover,
#kelime-penceresi.dk-wp3-active #report-word-btn:hover,
#kelime-penceresi.dk-wp3-active #popup-yenile:hover,
#kelime-penceresi.dk-wp3-active #popup-kapat:hover { transform:translate(-1px,-1px) !important; box-shadow:4px 4px 0 var(--dkwp-ink) !important; }
#kelime-penceresi.dk-wp3-active #popup-kapat:hover { background:var(--dkwp-err) !important; }
#kelime-penceresi.dk-wp3-active #report-word-btn:hover { background:var(--dkwp-warn) !important; }
#kelime-penceresi.dk-wp3-active #ses-oku-btn:hover { background:var(--dkwp-sky) !important; }
#kelime-penceresi.dk-wp3-active #popup-yenile:hover { background:var(--dkwp-paper) !important; }
#kelime-penceresi.dk-wp3-active #dkwp-back-btn:active {
  transform: translate(2px, 2px) !important;
  box-shadow: 0 0 0 var(--dkwp-ink) !important;
}
#kelime-penceresi.dk-wp3-active #dkwp-back-btn svg {
  width: 17px !important;
  height: 17px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.8px !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#kelime-penceresi.dk-wp3-active #ses-oku-btn svg,
#kelime-penceresi.dk-wp3-active #report-word-btn svg,
#kelime-penceresi.dk-wp3-active #popup-yenile svg,
#kelime-penceresi.dk-wp3-active #popup-kapat svg { width:18px; height:18px; fill:currentColor; }


/* Phase 5.2 · Başlıkta tipografi ölçeği. Kontrol geometrisi sabit; yalnız panel metinleri ölçeklenir. */
#kelime-penceresi.dk-wp3-active .popup-header > div:last-child,
#kelime-penceresi.dk-wp3-pending .popup-header > div:last-child { gap:6px !important; flex:0 0 auto; }
#kelime-penceresi.dk-wp3-active .dk-wp3-font-controls,
#kelime-penceresi.dk-wp3-pending .dk-wp3-font-controls {
  display:inline-grid;
  grid-template-columns:28px 24px 28px;
  align-items:center;
  height:36px;
  padding:2px;
  border:2px solid var(--dkwp-ink);
  border-radius:10px;
  background:rgba(255,255,255,.72);
  box-shadow:2px 2px 0 var(--dkwp-ink);
  overflow:hidden;
  cursor:default;
  user-select:none;
}
#kelime-penceresi.dk-wp3-active .dk-wp3-font-step,
#kelime-penceresi.dk-wp3-pending .dk-wp3-font-step {
  width:28px;
  height:28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  border:0;
  border-radius:7px;
  background:transparent;
  color:var(--dkwp-ink);
  font:900 19px/1 'Geist','Nunito',ui-sans-serif,system-ui,sans-serif;
  cursor:pointer;
  transition:background-color var(--dkwp-t) ease, transform var(--dkwp-t) var(--dkwp-ease);
}
#kelime-penceresi.dk-wp3-active .dk-wp3-font-step:hover:not(:disabled),
#kelime-penceresi.dk-wp3-pending .dk-wp3-font-step:hover:not(:disabled) { background:transparent !important; transform:none !important; }
#kelime-penceresi.dk-wp3-active .dk-wp3-font-step:active:not(:disabled),
#kelime-penceresi.dk-wp3-pending .dk-wp3-font-step:active:not(:disabled) { transform:translateY(1px); }
#kelime-penceresi.dk-wp3-active .dk-wp3-font-step:disabled,
#kelime-penceresi.dk-wp3-pending .dk-wp3-font-step:disabled { opacity:.28; cursor:not-allowed; }
#kelime-penceresi.dk-wp3-active .dk-wp3-font-step:focus-visible,
#kelime-penceresi.dk-wp3-pending .dk-wp3-font-step:focus-visible { outline:2px solid var(--dkwp-viol-deep); outline-offset:1px; }
#kelime-penceresi.dk-wp3-active .dk-wp3-font-status,
#kelime-penceresi.dk-wp3-pending .dk-wp3-font-status {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:26px;
  border-left:1.5px solid rgba(21,22,23,.18);
  border-right:1.5px solid rgba(21,22,23,.18);
  color:var(--dkwp-ink);
  font:900 11px/1 'Geist','Nunito',ui-sans-serif,system-ui,sans-serif;
  letter-spacing:-.02em;
}

#kelime-penceresi.dk-wp3-active #popup-dynamic-content,
#kelime-penceresi.dk-wp3-pending #popup-dynamic-content,
#kelime-penceresi.dk-wp3-active #standard-view-container,
#kelime-penceresi.dk-wp3-pending #standard-view-container { min-height:0; background:var(--dkwp-cream); }

.dk-wp3-root { display:flex; flex:1 1 auto; min-height:0; flex-direction:column; width:100%; color:var(--dkwp-ink); background:var(--dkwp-cream); }
/* Phase 5.1 · Host-page renk sızıntısını kes. Güçlü metinler varsayılan olarak DeuKlar ink kullanır; semantik renkler aşağıdaki daha özel kurallarla yeniden tanımlanır. */
.dk-wp3-root :where(strong,b) { color:var(--dkwp-ink); text-shadow:none; }
.dk-wp3-root[hidden], .dk-wp3-root [hidden] { display:none !important; }
.dk-wp3-root button { font:inherit; color:inherit; }
.dk-wp3-root svg { width:18px; height:18px; fill:currentColor; flex:0 0 auto; }

.dk-wp3-root--loading { align-items:center; justify-content:center; padding:32px; }
.dk-wp3-loading-card { width:min(520px,100%); display:flex; align-items:center; gap:18px; padding:22px 24px; border:var(--dkwp-line); border-radius:var(--dkwp-r-lg); background:var(--dkwp-paper); box-shadow:5px 5px 0 var(--dkwp-ink); }
.dk-wp3-loading-title { font-size:var(--dkwp-f-18,18px); font-weight:900; line-height:1.25; }
.dk-wp3-loading-copy { margin-top:4px; font-size:var(--dkwp-f-13,13px); font-weight:600; opacity:.62; }
.dk-wp3-loading-card--error { background:#fff3f3; }
.dk-wp3-error-mark { width:34px; height:34px; display:flex; align-items:center; justify-content:center; flex:0 0 auto; border:2px solid var(--dkwp-ink); border-radius:50%; background:var(--dkwp-err); font-size:var(--dkwp-f-19,19px); font-weight:900; }
.dk-wp3-error-copy { flex:1; min-width:0; }
.dk-wp3-retry { margin-top:12px; background:var(--dkwp-peach) !important; }
.dk-wp3-loading-mark { display:inline-block; width:26px; height:26px; border:3px solid rgba(21,22,23,.18); border-top-color:var(--dkwp-viol-deep); border-radius:50%; animation:dkwp-spin .8s linear infinite; flex:0 0 auto; }
@keyframes dkwp-spin { to { transform:rotate(360deg); } }

.dk-wp3-modebar { display:flex; flex:0 0 auto; gap:4px; padding:10px 14px; border-bottom:var(--dkwp-line); background:var(--dkwp-paper); }
.dk-wp3-mode { flex:1; min-width:0; display:flex; align-items:baseline; justify-content:center; gap:8px; padding:9px 14px; border:2px solid transparent; border-radius:10px; background:transparent; cursor:pointer; font-size:var(--dkwp-f-14,14px); font-weight:900; transition:background-color var(--dkwp-t) ease,border-color var(--dkwp-t) ease,box-shadow var(--dkwp-t) var(--dkwp-ease),transform var(--dkwp-t) var(--dkwp-ease); }
.dk-wp3-mode small { font-family:'Fira Code',ui-monospace,monospace; font-size:var(--dkwp-f-10,10px); font-weight:500; opacity:.52; text-transform:lowercase; }
.dk-wp3-mode:hover { background:var(--dkwp-mist); }
.dk-wp3-mode.is-active { background:var(--dkwp-peach); border-color:var(--dkwp-ink); box-shadow:2px 2px 0 var(--dkwp-ink); }
.dk-wp3-mode:focus-visible,.dk-wp3-root button:focus-visible { outline:3px solid var(--dkwp-viol-deep); outline-offset:2px; }

.dk-wp3-scroll { flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:rgba(21,22,23,.4) transparent; }
.dk-wp3-scroll::-webkit-scrollbar { width:9px; }
.dk-wp3-scroll::-webkit-scrollbar-thumb { background:rgba(21,22,23,.28); border:2px solid var(--dkwp-cream); border-radius:99px; }
.dk-wp3-word-view,.dk-wp3-sentence-view { width:100%; padding:18px 18px 30px; background:#ffffff !important; }

.dk-wp3-hero { position:relative; overflow:hidden; padding:22px; border:var(--dkwp-line); border-radius:var(--dkwp-r-lg); background:var(--dkwp-paper); box-shadow:5px 5px 0 var(--dkwp-ink); }
.dk-wp3-hero::after { content:''; position:absolute; right:-34px; top:-48px; width:150px; height:150px; border:2.5px solid var(--dkwp-ink); border-radius:50%; background:var(--dkwp-viol-soft); opacity:.55; pointer-events:none; }
.dk-wp3-meta-row { position:relative; z-index:1; display:flex; align-items:center; flex-wrap:wrap; gap:7px; margin-bottom:14px; }
.dk-wp3-meta-chip { display:inline-flex; align-items:center; gap:6px; min-height:28px; padding:4px 9px; border:2px solid var(--dkwp-ink); border-radius:999px; background:var(--dkwp-mist); font-size:var(--dkwp-f-11_5,11.5px); font-weight:800; line-height:1.1; }
.dk-wp3-meta-chip.dk-wp3-level { background:var(--dkwp-viol-soft); }
.dk-wp3-gram { font-family:'Fira Code',ui-monospace,SFMono-Regular,Consolas,monospace !important; letter-spacing:.01em; }
.dk-wp3-freq { height:16px; display:inline-flex; align-items:flex-end; gap:2px; }
.dk-wp3-freq i { width:3px; border-radius:2px; background:rgba(21,22,23,.18); }
.dk-wp3-freq i:nth-child(1){height:5px}.dk-wp3-freq i:nth-child(2){height:7px}.dk-wp3-freq i:nth-child(3){height:10px}.dk-wp3-freq i:nth-child(4){height:13px}.dk-wp3-freq i:nth-child(5){height:16px}.dk-wp3-freq i.on{background:var(--dkwp-ink)}
.dk-wp3-form-path { position:relative; z-index:1; display:flex; align-items:center; flex-wrap:wrap; gap:7px; margin-bottom:9px; font-size:var(--dkwp-f-12,12px); font-weight:700; }
.dk-wp3-form-from { text-decoration:line-through; opacity:.5; }.dk-wp3-form-arrow{font-weight:900}.dk-wp3-form-to{font-weight:900}.dk-wp3-form-note{opacity:.5;font-size:var(--dkwp-f-11,11px)}
.dk-wp3-meaning { position:relative; z-index:1; max-width:620px; font-size:var(--dkwp-f-22,22px); font-weight:900; line-height:1.25; letter-spacing:-.025em; }
.dk-wp3-mana { position:relative; z-index:1; max-width:100%; width:100%; margin-top:8px; font-size:var(--dkwp-f-15_5,15.5px); font-weight:550; line-height:1.72; text-align:justify; text-justify:inter-word; hyphens:auto; }
.dk-wp3-primary-actions { position:relative; z-index:1; display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:18px; }
.dk-wp3-hero--noun::after { background:var(--dkwp-peach); }

/* Phase 4.8 · Artikel özel tetikleyici */
#kelime-penceresi.dk-wp3-active[data-dkwp-type="article"] .popup-header,
#kelime-penceresi.dk-wp3-pending[data-dkwp-type="article"] .popup-header{background:#ffe0cd!important}
.dk-wp3-article-hero{background:linear-gradient(145deg,#fff 0%,#faf7ff 58%,#fff0e5 100%)}
.dk-wp3-article-identity{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:start;margin-top:5px}
.dk-wp3-article-word{font-size:var(--dkwp-f-34,34px);line-height:1;font-weight:950;letter-spacing:-.045em}
.dk-wp3-article-lead{max-width:590px;margin:8px 0 0;font-size:var(--dkwp-f-13_5,13.5px);line-height:1.6;font-weight:650;color:rgba(21,22,23,.66)}
.dk-wp3-article-speak{margin-top:1px}
.dk-wp3-article-facts{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr 1.35fr;gap:8px;margin-top:17px}
.dk-wp3-article-fact{min-width:0;padding:11px 12px;border:2px solid rgba(21,22,23,.2);border-radius:10px;background:var(--dkwp-mist)}
.dk-wp3-article-fact:nth-child(1){background:#f3eaff}.dk-wp3-article-fact:nth-child(2){background:#fff0e5}.dk-wp3-article-fact:nth-child(3){background:#eef8ff}
.dk-wp3-article-fact>span{display:block;margin-bottom:4px;font-family:'Fira Code',ui-monospace,monospace;font-size:var(--dkwp-f-8_8,8.8px);font-weight:600;text-transform:uppercase;letter-spacing:.04em;opacity:.48}
.dk-wp3-article-fact>strong{display:block;overflow-wrap:anywhere;font-size:var(--dkwp-f-12_5,12.5px);line-height:1.4;font-weight:900}
.dk-wp3-article-use-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.dk-wp3-article-use-card {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 14px;
  border: 2px solid rgba(21, 22, 23, 0.25);
  border-radius: 11px;
  background: #ffffff;
  box-shadow: 2px 2px 0 rgba(21, 22, 23, 0.1);
}
.dk-wp3-article-use-card[data-gender="mask"] { border-left: 5px solid #287ec2; }
.dk-wp3-article-use-card[data-gender="fem"] { border-left: 5px solid #d94343; }
.dk-wp3-article-use-card[data-gender="neut"] { border-left: 5px solid #278b40; }
.dk-wp3-article-use-card[data-gender="plural"] { border-left: 5px solid #6a56a7; }

.dk-wp3-use-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border-bottom: 1px dashed rgba(21, 22, 23, 0.18);
  padding-bottom: 6px;
}
.dk-wp3-use-family-tag {
  font-family: 'Fira Code', ui-monospace, monospace;
  font-size: var(--dkwp-f-11, 11px) !important;
  font-weight: 800;
  text-transform: uppercase;
  color: #1e293b !important;
  background: rgba(21, 22, 23, 0.08);
  padding: 3px 8px;
  border-radius: 5px;
  opacity: 1 !important;
}
.dk-wp3-use-case-tag {
  font-size: var(--dkwp-f-13_5, 13.5px) !important;
  font-weight: 900;
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}
.dk-wp3-use-case-tag small {
  font-size: var(--dkwp-f-12, 12px) !important;
  font-weight: 750;
  color: #334155 !important;
  opacity: 1 !important;
}
.dk-wp3-use-card-mid {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}
.dk-wp3-use-gender-title {
  font-size: var(--dkwp-f-14, 14px) !important;
  font-weight: 900;
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}
.dk-wp3-use-gender-title small {
  font-size: var(--dkwp-f-12, 12px) !important;
  font-weight: 750;
  color: #334155 !important;
  opacity: 1 !important;
}
.dk-wp3-use-sample-pill {
  font-size: var(--dkwp-f-13, 13px) !important;
  color: var(--dkwp-ink, #151617) !important;
  background: #f1f5f9;
  border: 1.5px solid rgba(21, 22, 23, 0.2);
  border-radius: 6px;
  padding: 3px 10px;
  opacity: 1 !important;
}
.dk-wp3-use-sample-pill strong {
  color: #1e40af !important;
  font-weight: 900;
}
.dk-wp3-article-use-foot {
  display: flex;
  align-items: center;
  gap: 6px;
  background: #fbfbfc;
  padding: 5px 9px;
  border-radius: 6px;
  border-top: 1px solid rgba(21, 22, 23, 0.1);
}
.dk-wp3-use-q-title {
  font-size: var(--dkwp-f-11_5, 11.5px) !important;
  font-weight: 800;
  color: #334155 !important;
  opacity: 1 !important;
}
.dk-wp3-use-q-val {
  font-size: var(--dkwp-f-13_5, 13.5px) !important;
  font-weight: 900;
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}


.dk-wp3-use-sentence-box {
  margin-top: 6px;
  padding: 8px 10px;
  background: #f8fafc;
  border: 1.5px solid rgba(21, 22, 23, 0.12);
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.dk-wp3-use-sentence-de {
  font-size: var(--dkwp-f-13_5, 13.5px) !important;
  font-weight: 750 !important;
  color: var(--dkwp-ink, #151617) !important;
  line-height: 1.45;
}
.dk-wp3-use-sentence-tr {
  font-size: var(--dkwp-f-12, 12px) !important;
  font-weight: 600 !important;
  color: #334155 !important;
  line-height: 1.4;
}

.dk-wp3-article-ex-filter-strip {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
.dk-wp3-article-ex-filter-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 10px !important;
  background: var(--dkwp-paper, #ffffff) !important;
  color: var(--dkwp-ink, #151617) !important;
  box-shadow: 2px 2px 0 var(--dkwp-ink, #151617) !important;
  cursor: pointer;
  font-family: inherit;
  font-size: var(--dkwp-f-13, 13px) !important;
  font-weight: 800 !important;
  transition: transform 0.12s ease, box-shadow 0.12s ease, background-color 0.12s ease;
}
.dk-wp3-article-ex-filter-btn:hover {
  transform: translate(-1px, -1px);
  box-shadow: 3px 3px 0 var(--dkwp-ink, #151617) !important;
  background: #fdfdfd !important;
}
.dk-wp3-article-ex-filter-btn:active {
  transform: translateY(1px);
  box-shadow: 1px 1px 0 var(--dkwp-ink, #151617) !important;
}
.dk-wp3-article-ex-filter-btn.is-active {
  background: var(--dkwp-peach, #ffeacc) !important;
  border-color: var(--dkwp-ink, #151617) !important;
  box-shadow: 2px 2px 0 var(--dkwp-ink, #151617) !important;
  color: var(--dkwp-ink, #151617) !important;
}
.dk-wp3-article-ex-filter-btn strong {
  color: var(--dkwp-ink, #151617) !important;
  font-weight: 850 !important;
}
.dk-wp3-article-ex-filter-btn small {
  font-family: 'Fira Code', ui-monospace, monospace;
  font-size: var(--dkwp-f-11, 11px) !important;
  font-weight: 800 !important;
  color: #475569 !important;
}
.dk-wp3-article-ex-filter-btn.is-active small {
  color: var(--dkwp-ink, #151617) !important;
}
.dk-wp3-article-ex-group-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 12px;
  background: #f1f5f9;
  border-radius: 8px;
  margin-top: 12px;
  margin-bottom: 10px;
  border-left: 4px solid #2563eb;
}
.dk-wp3-article-ex-group-pill {
  font-size: var(--dkwp-f-13, 13px) !important;
  font-weight: 800 !important;
  color: #0f172a !important;
}
.dk-wp3-article-ex-group-count {
  font-size: var(--dkwp-f-11_5, 11.5px) !important;
  font-weight: 700 !important;
  color: #475569 !important;
  font-family: 'Fira Code', ui-monospace, monospace;
}
.dk-wp3-example-level-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 24px;
  padding: 0 6px;
  border-radius: 6px;
  font-family: 'Fira Code', ui-monospace, monospace;
  font-size: var(--dkwp-f-11, 11px) !important;
  font-weight: 800 !important;
  line-height: 1;
  flex-shrink: 0;
  margin-top: 2px;
}
.dk-wp3-level--a1, .dk-wp3-level--a2 {
  background: #ecfdf5;
  color: #047857 !important;
  border: 1.5px solid #a7f3d0;
}
.dk-wp3-level--b1, .dk-wp3-level--b2 {
  background: #eff6ff;
  color: #1d4ed8 !important;
  border: 1.5px solid #bfdbfe;
}
.dk-wp3-level--c1, .dk-wp3-level--c2 {
  background: #fbf5ff;
  color: #6b21a8 !important;
  border: 1.5px solid #e9d5ff;
}


/* Remove underline from words in Nerede Kullanılır cards */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-use-sentence-box .dk-wp3-word-link {
  border-bottom: none !important;
  text-decoration: none !important;
  box-shadow: none !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-use-sentence-box .dk-wp3-word-link:hover {
  border-bottom: none !important;
  text-decoration: none !important;
  background: rgba(255, 190, 152, 0.35) !important;
  border-radius: 4px !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-use-sentence-box .dk-wp3-word-link.is-target-word {
  border-bottom: none !important;
  box-shadow: none !important;
  background: var(--dkwp-peach, #ffbe98) !important;
  color: #151617 !important;
  font-weight: 900 !important;
  padding: 1px 5px !important;
  border-radius: 5px !important;
}

.dk-wp3-article-reference{background:linear-gradient(180deg,#fff 0%,#fdfbff 100%)}
.dk-wp3-article-family-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-bottom:14px}
.dk-wp3-article-family{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:11px 13px;border:2px solid rgba(21,22,23,.24);border-radius:10px;background:var(--dkwp-paper);color:var(--dkwp-ink);cursor:pointer;text-align:left;transition:transform var(--dkwp-t) var(--dkwp-ease),box-shadow var(--dkwp-t) var(--dkwp-ease),background-color var(--dkwp-t) ease}
.dk-wp3-article-family:hover{transform:translate(-1px,-1px);border-color:var(--dkwp-ink);box-shadow:3px 3px 0 var(--dkwp-ink)}
.dk-wp3-article-family.is-active{border-color:var(--dkwp-ink);background:var(--dkwp-peach);box-shadow:2px 2px 0 var(--dkwp-ink)}
.dk-wp3-article-family strong{font-size:var(--dkwp-f-14,14px) !important;font-weight:950 !important;color:var(--dkwp-ink,#151617) !important;}
.dk-wp3-article-family small{font-family:'Fira Code',ui-monospace,monospace;font-size:var(--dkwp-f-11,11px) !important;font-weight:750 !important;color:#334155 !important;opacity:1 !important;margin-top:2px;}
.dk-wp3-article-family-panel{display:none}.dk-wp3-article-family-panel.is-active{display:block}
.dk-wp3-article-family-head{display:none !important;}
.dk-wp3-article-table-wrap{width:100%;overflow-x:auto;border:2px solid var(--dkwp-ink);border-radius:12px;background:var(--dkwp-paper);box-shadow:3px 3px 0 var(--dkwp-ink);scrollbar-width:thin}
.dk-wp3-article-table-wrap:focus-visible{outline:3px solid var(--dkwp-viol-deep);outline-offset:3px}
.dk-wp3-article-table{min-width:650px}.dk-wp3-article-table-head,.dk-wp3-article-table-row{display:grid;grid-template-columns:122px repeat(4,minmax(112px,1fr))}
.dk-wp3-article-table-head{min-height:42px;background:var(--dkwp-viol-soft);border-bottom:2px solid var(--dkwp-ink)}
.dk-wp3-article-table-head>*{display:flex;align-items:center;justify-content:center;padding:8px 9px;border-left:1.5px solid rgba(21,22,23,.15);font-family:'Fira Code',ui-monospace,monospace;font-size:var(--dkwp-f-8_5,8.5px);font-weight:650;text-transform:uppercase;letter-spacing:.035em}.dk-wp3-article-table-head>*:first-child{border-left:0;justify-content:flex-start}
.dk-wp3-article-table-row{min-height:64px;border-bottom:1.5px solid rgba(21,22,23,.16)}.dk-wp3-article-table-row:last-child{border-bottom:0}
.dk-wp3-article-case,.dk-wp3-article-cell{min-width:0;padding:9px 10px;border-left:1.5px solid rgba(21,22,23,.13)}.dk-wp3-article-case{border-left:0;display:flex;flex-direction:column;justify-content:center;gap:2px;background:var(--dkwp-mist)}
.dk-wp3-article-case strong{font-size:var(--dkwp-f-10,10px);font-weight:700}.dk-wp3-article-case small{font-size:var(--dkwp-f-8_7,8.7px);font-weight:650;opacity:.45}
.dk-wp3-article-cell{position:relative;display:flex;flex-direction:column;justify-content:center;gap:3px}.dk-wp3-article-cell strong{font-size:var(--dkwp-f-15,15px);font-weight:950}.dk-wp3-article-cell span{font-size:var(--dkwp-f-10,10px);font-weight:650;opacity:.52}
.dk-wp3-article-cell[data-article-gender="mask"] strong{color:#287ec2}.dk-wp3-article-cell[data-article-gender="fem"] strong{color:#d94343}.dk-wp3-article-cell[data-article-gender="neut"] strong{color:#278b40}.dk-wp3-article-cell[data-article-gender="plural"] strong{color:#5f4b96}
.dk-wp3-article-cell.is-current{z-index:1;background:#ffe6d5;box-shadow:inset 0 0 0 2.5px var(--dkwp-ink)}
.dk-wp3-article-context{background:#f7f5ff}

/* Kök ➔ Çekim Gösterimi */
.dk-wp3-article-stem-card {
  margin: 12px 0 14px;
  padding: 13px 15px;
  background: #ffffff;
  border: 2px solid var(--dkwp-ink, #151617);
  border-radius: 12px;
  box-shadow: 3px 3px 0 var(--dkwp-ink, #151617);
}
.dk-wp3-article-stem-card.dk-wp3-stem-card--root {
  background: #f6faff;
  border-color: #287ec2;
  box-shadow: 2.5px 2.5px 0 #287ec2;
}
.dk-wp3-stem-card-header {
  margin-bottom: 8px;
}
.dk-wp3-stem-badge {
  display: inline-flex !important;
  align-self: flex-start !important;
  width: fit-content !important;
  max-width: max-content !important;
  font-family: 'Fira Code', ui-monospace, monospace;
  font-size: var(--dkwp-f-11, 11px) !important;
  font-weight: 850 !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #ffffff !important;
  background: var(--dkwp-ink, #151617) !important;
  padding: 4px 10px;
  border-radius: 6px;
}
.dk-wp3-stem-flow-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.dk-wp3-stem-flow-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 10px 14px;
  background: #f8fafc;
  border: 1.5px solid rgba(21, 22, 23, 0.18);
  border-radius: 9px;
}
.dk-wp3-stem-part {
  display: flex;
  flex-direction: column;
}
.dk-wp3-stem-part--root {
  min-width: 95px;
}
.dk-wp3-stem-part-type {
  font-family: 'Fira Code', ui-monospace, monospace;
  font-size: var(--dkwp-f-10, 10px) !important;
  font-weight: 800;
  color: #475569 !important;
  text-transform: uppercase;
  line-height: 1.2;
  margin-bottom: 2px;
}
.dk-wp3-stem-part-word {
  font-size: var(--dkwp-f-18, 18px) !important;
  font-weight: 950;
  color: #1e40af;
  line-height: 1.2;
}
.dk-wp3-stem-part-word--target {
  color: var(--dkwp-ink, #151617);
}
.dk-wp3-stem-part-sub {
  font-size: var(--dkwp-f-11, 11px) !important;
  color: #334155 !important;
  font-weight: 700;
  margin-top: 2px;
}
.dk-wp3-stem-arrow-block {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 14px;
}
.dk-wp3-stem-arrow-glyph {
  font-size: var(--dkwp-f-18, 18px) !important;
  font-weight: 900;
  color: #2563eb;
  line-height: 1;
}
.dk-wp3-stem-part--target {
  flex: 1;
  min-width: 0;
}
.dk-wp3-stem-part-role {
  font-size: var(--dkwp-f-13_5, 13.5px) !important;
  font-weight: 850;
  color: var(--dkwp-ink, #151617) !important;
}
.dk-wp3-stem-part-sample {
  font-size: var(--dkwp-f-12_5, 12.5px) !important;
  color: #1e3a8a !important;
  font-weight: 750;
  margin-top: 1px;
}
.dk-wp3-stem-root-flow {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}
.dk-wp3-stem-root-content {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 12px;
}
.dk-wp3-stem-root-word {
  font-size: var(--dkwp-f-22, 22px) !important;
  font-weight: 950;
  color: #1e40af !important;
}
.dk-wp3-stem-root-info {
  font-size: var(--dkwp-f-14, 14px) !important;
  font-weight: 850;
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}
.dk-wp3-stem-root-sample {
  font-size: var(--dkwp-f-13, 13px) !important;
  font-weight: 750;
  color: #1e3a8a !important;
  background: #e0f2fe;
  padding: 2px 8px;
  border-radius: 6px;
  border: 1px solid rgba(21, 22, 23, 0.15);
}

/* Mana / Ders Anlatımı Kartları */
.dk-wp3-mana-section {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 14px;
}
.dk-wp3-mana-intro-box {
  padding: 12px 14px;
  background: #ffffff;
  border: 1.5px solid rgba(21, 22, 23, 0.2);
  border-radius: 10px;
  font-size: var(--dkwp-f-15, 15px) !important;
  font-weight: 600;
  line-height: 1.72;
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}
.dk-wp3-mana-intro-box p {
  margin: 0;
}
.dk-wp3-mana-card {
  padding: 13px 15px;
  background: #ffffff;
  border: 1.5px solid rgba(21, 22, 23, 0.22);
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.dk-wp3-mana-card-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}
.dk-wp3-mana-num-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 24px;
  padding: 0 6px;
  background: var(--dkwp-ink, #151617);
  color: #ffffff;
  font-family: 'Fira Code', ui-monospace, monospace;
  font-size: var(--dkwp-f-12, 12px) !important;
  font-weight: 850;
  border-radius: 12px;
  flex-shrink: 0;
}
.dk-wp3-mana-card-title {
  font-size: var(--dkwp-f-15, 15px) !important;
  font-weight: 900;
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}
.dk-wp3-mana-card-body {
  font-size: var(--dkwp-f-14_5, 14.5px) !important;
  line-height: 1.72;
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}
.dk-wp3-mana-card-body strong {
  color: #1e40af;
  font-weight: 850;
}

.dk-wp3-noun-facts { position:relative; z-index:1; display:grid; grid-template-columns:110px 1fr minmax(180px,1.35fr); gap:8px; margin-top:17px; }
.dk-wp3-noun-fact { min-width:0; padding:11px 12px; border:2px solid rgba(21,22,23,.22); border-radius:10px; background:var(--dkwp-mist); }
.dk-wp3-noun-fact>span { display:block; margin-bottom:5px; font-family:'Fira Code',ui-monospace,monospace; font-size:var(--dkwp-f-9_5,9.5px); font-weight:500; text-transform:uppercase; letter-spacing:.04em; opacity:.5; }
.dk-wp3-noun-fact>strong { display:block; min-width:0; overflow-wrap:anywhere; font-size:var(--dkwp-f-14,14px); line-height:1.35; font-weight:900; }
.dk-wp3-article { width:max-content; min-width:40px; padding:3px 7px; color:var(--dkwp-ink); border:2px solid var(--dkwp-ink); border-radius:8px; background:var(--dkwp-paper); text-align:center; text-transform:lowercase; box-shadow:1.5px 1.5px 0 var(--dkwp-ink); }
.dk-wp3-article--der { background:var(--dkwp-sky); }
.dk-wp3-article--die { background:var(--dkwp-err); }
.dk-wp3-article--das { background:#a7edc9; }
.dk-wp3-noun-fact--plural { background:var(--dkwp-gold-soft); }
.dk-wp3-noun-fact--plural>strong { color:var(--dkwp-text-accent,#5f4b96); }
.dk-wp3-btn,.dk-wp3-notebook-action,.dk-wp3-save-slot > [id^="defter-badge-"] { min-height:38px !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; gap:8px !important; padding:8px 12px !important; border:2px solid var(--dkwp-ink) !important; border-radius:10px !important; background:var(--dkwp-paper) !important; color:var(--dkwp-ink) !important; box-shadow:2px 2px 0 var(--dkwp-ink) !important; cursor:pointer !important; font-size:var(--dkwp-f-12_5,12.5px) !important; font-weight:850 !important; user-select:none !important; transition:transform var(--dkwp-t) var(--dkwp-ease),box-shadow var(--dkwp-t) var(--dkwp-ease),background-color var(--dkwp-t) ease !important; }
.dk-wp3-btn:hover,.dk-wp3-notebook-action:hover,.dk-wp3-save-slot > [id^="defter-badge-"]:hover { transform:translate(-1px,-1px) !important; box-shadow:4px 4px 0 var(--dkwp-ink) !important; background:var(--dkwp-peach) !important; }
.dk-wp3-notebook-action.defter-badge-kayitli,.dk-wp3-save-slot > .defter-badge-kayitli { background:var(--dkwp-green) !important; }
.dk-wp3-notebook-action svg,.dk-wp3-save-slot > [id^="defter-badge-"] svg { width:16px !important; height:16px !important; fill:currentColor !important; }
.dk-wp3-notebook-action .defter-badge-text,.dk-wp3-save-slot > [id^="defter-badge-"] .defter-badge-text { color:inherit !important; font-size:var(--dkwp-f-12_5,12.5px) !important; font-weight:850 !important; }

.dk-wp3-section { margin-top:22px; padding:20px; border:2px solid var(--dkwp-ink); border-radius:var(--dkwp-r); background:var(--dkwp-paper); }
.dk-wp3-section--last { margin-bottom:2px; }
.dk-wp3-section-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:16px; }
.dk-wp3-section-head h3 { margin:2px 0 0; font-size:var(--dkwp-f-20,20px); line-height:1.15; font-weight:900; letter-spacing:-.025em; }
.dk-wp3-section-head p { max-width:330px; margin:1px 0 0; color:rgba(21,22,23,.62); font-size:var(--dkwp-f-12_5,12.5px); font-weight:600; line-height:1.5; text-align:right; }
.dk-wp3-kicker { font-family:'Fira Code',ui-monospace,monospace; font-size:var(--dkwp-f-10_5,10.5px); font-weight:500; letter-spacing:.05em; text-transform:uppercase; opacity:.54; }
.dk-wp3-section-intro { margin:-4px 0 14px; max-width:620px; font-size:var(--dkwp-f-12_5,12.5px); font-weight:600; line-height:1.6; opacity:.62; }

.dk-wp3-snapshot-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.dk-wp3-snapshot { min-width:0; padding:13px 14px; border:2px solid var(--dkwp-ink); border-radius:10px; background:var(--dkwp-mist); }
.dk-wp3-snapshot--wide { grid-column:1/-1; background:#fff8f1; }
.dk-wp3-snapshot span { display:block; margin-bottom:5px; font-family:'Fira Code',ui-monospace,monospace; font-size:var(--dkwp-f-10,10px); opacity:.52; }
.dk-wp3-snapshot strong { display:block; font-size:var(--dkwp-f-14_5,14.5px); line-height:1.35; word-break:break-word; }

.dk-wp3-rektion-list { border-top:2px solid var(--dkwp-ink); }
.dk-wp3-rektion-row { display:grid; grid-template-columns:38px minmax(0,1fr); gap:12px; padding:14px 0; border-bottom:2px solid rgba(21,22,23,.13); }
.dk-wp3-rektion-row:last-child { border-bottom:0; padding-bottom:0; }
.dk-wp3-rektion-number,.dk-wp3-example-index,.dk-wp3-anatomy-no { font-family:'Fira Code',ui-monospace,monospace; font-size:var(--dkwp-f-10,10px); font-weight:500; opacity:.45; padding-top:4px; }
.dk-wp3-rektion-line { display:flex; align-items:baseline; flex-wrap:wrap; gap:6px 10px; }
.dk-wp3-rektion-line strong { font-size:var(--dkwp-f-15,15px); line-height:1.4; }.dk-wp3-rektion-line span{font-size:var(--dkwp-f-13,13px);font-weight:600;opacity:.62}
.dk-wp3-empty { padding:16px; border:2px dashed rgba(21,22,23,.25); border-radius:10px; background:var(--dkwp-mist); font-size:var(--dkwp-f-13,13px); font-weight:650; opacity:.7; }

.dk-wp3-segmented { display:flex; gap:4px; padding:4px; border:2px solid var(--dkwp-ink); border-radius:12px; background:var(--dkwp-mist); }
.dk-wp3-segmented--scroll { overflow-x:auto; scrollbar-width:none; }.dk-wp3-segmented--scroll::-webkit-scrollbar{display:none}
.dk-wp3-seg { flex:1 0 auto; min-width:115px; padding:9px 11px; border:0; border-radius:8px; background:transparent; cursor:pointer; font-size:var(--dkwp-f-11_5,11.5px); font-weight:850; }
.dk-wp3-seg:hover { background:var(--dkwp-paper); }.dk-wp3-seg.is-active{background:var(--dkwp-viol-soft);box-shadow:inset 0 0 0 2px var(--dkwp-ink)}


/* Nomen — article family + two-column declension system */
.dk-wp3-noun-segments { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:7px; margin-bottom:13px; }
.dk-wp3-noun-seg { min-width:0; min-height:58px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:2px; padding:9px 10px; border:2px solid rgba(21,22,23,.22); border-radius:10px; background:var(--dkwp-paper); cursor:pointer; text-align:left; transition:transform var(--dkwp-t) var(--dkwp-ease),box-shadow var(--dkwp-t) var(--dkwp-ease),background-color var(--dkwp-t) ease,border-color var(--dkwp-t) ease; }
.dk-wp3-noun-seg span { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:var(--dkwp-f-11_5,11.5px); font-weight:900; }
.dk-wp3-noun-seg small { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-family:'Fira Code',ui-monospace,monospace; font-size:var(--dkwp-f-8_5,8.5px); opacity:.5; }
.dk-wp3-noun-seg:hover { transform:translate(-1px,-1px); border-color:var(--dkwp-ink); box-shadow:2px 2px 0 var(--dkwp-ink); background:var(--dkwp-mist); }
.dk-wp3-noun-seg.is-active { border-color:var(--dkwp-ink); background:var(--dkwp-peach); box-shadow:2px 2px 0 var(--dkwp-ink); }
.dk-wp3-noun-panel { display:none; }
.dk-wp3-noun-panel.is-active { display:block; }
.dk-wp3-noun-panel-head { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin:4px 0 9px; }
.dk-wp3-noun-panel-head>div { display:flex; align-items:baseline; flex-wrap:wrap; gap:7px 10px; }
.dk-wp3-noun-panel-head strong { font-size:var(--dkwp-f-14,14px); font-weight:900; }
.dk-wp3-noun-panel-head span { font-size:var(--dkwp-f-9_5,9.5px); opacity:.5; }
.dk-wp3-noun-case-table { overflow:hidden; border:2px solid var(--dkwp-ink); border-radius:11px; background:var(--dkwp-paper); }
.dk-wp3-noun-case-head,.dk-wp3-noun-case-row { display:grid; grid-template-columns:126px minmax(0,1fr) minmax(0,1fr); }
.dk-wp3-noun-case-head { background:var(--dkwp-viol-soft); font-family:'Fira Code',ui-monospace,monospace; font-size:var(--dkwp-f-9_5,9.5px); font-weight:550; text-transform:uppercase; letter-spacing:.035em; }
.dk-wp3-noun-case-head>* { padding:9px 11px; }
.dk-wp3-noun-case-head>*+* { border-left:1.5px solid rgba(21,22,23,.2); }
.dk-wp3-noun-case-row { min-height:57px; border-top:1.5px solid rgba(21,22,23,.18); }
.dk-wp3-noun-case-row>* { min-width:0; padding:10px 11px; display:flex; align-items:center; }
.dk-wp3-noun-case-row>*+* { border-left:1.5px solid rgba(21,22,23,.14); }
.dk-wp3-noun-case-name { flex-direction:column; align-items:flex-start; justify-content:center; gap:2px; background:var(--dkwp-mist); }
.dk-wp3-noun-case-name strong { font-size:var(--dkwp-f-10,10px); font-weight:550; }
.dk-wp3-noun-case-name small { font-size:var(--dkwp-f-9_5,9.5px); font-weight:650; opacity:.48; }
.dk-wp3-noun-form { font-size:var(--dkwp-f-13_5,13.5px); font-weight:850; line-height:1.4; overflow-wrap:anywhere; }
.dk-wp3-noun-form--plural { background:#fffcf0; color:var(--dkwp-text-accent,#5f4b96); }
.dk-wp3-possessive-wrap { display:grid; gap:9px; }
.dk-wp3-possessive-note { display:flex; align-items:baseline; flex-wrap:wrap; gap:6px 10px; padding:9px 11px; border:2px dashed rgba(21,22,23,.25); border-radius:9px; background:var(--dkwp-mist); }
.dk-wp3-possessive-note strong { font-size:var(--dkwp-f-11_5,11.5px); font-weight:900; }
.dk-wp3-possessive-note span { font-size:var(--dkwp-f-10_5,10.5px); font-weight:650; opacity:.56; }
.dk-wp3-mini-segmented { display:flex; gap:5px; overflow-x:auto; padding:1px 1px 5px; scrollbar-width:thin; }
.dk-wp3-mini-seg { flex:0 0 auto; padding:6px 9px; border:2px solid rgba(21,22,23,.2); border-radius:8px; background:var(--dkwp-paper); cursor:pointer; font-family:'Fira Code',ui-monospace,monospace!important; font-size:var(--dkwp-f-9_5,9.5px)!important; font-weight:550; }
.dk-wp3-mini-seg:hover { border-color:var(--dkwp-ink); }
.dk-wp3-mini-seg.is-active { border-color:var(--dkwp-ink); background:var(--dkwp-viol-soft); box-shadow:1.5px 1.5px 0 var(--dkwp-ink); }
.dk-wp3-possessive-panel { display:none; }
.dk-wp3-possessive-panel.is-active { display:block; }
.dk-wp3-conj-panel { display:none; margin-top:12px; }.dk-wp3-conj-panel.is-active{display:block}
.dk-wp3-accordion { overflow:hidden; border:2px solid rgba(21,22,23,.18); border-radius:10px; background:var(--dkwp-paper); margin-top:8px; }
.dk-wp3-accordion:first-child{margin-top:0}.dk-wp3-accordion.is-open{border-color:var(--dkwp-ink)}
.dk-wp3-accordion-head { width:100%; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px 13px; border:0; background:transparent; cursor:pointer; font-size:var(--dkwp-f-12_5,12.5px); font-weight:850; text-align:left; }
.dk-wp3-accordion-head:hover { background:var(--dkwp-mist); }
.dk-wp3-accordion-head > span:first-child { display:flex; flex-direction:column; gap:2px; }
.dk-wp3-accordion-head small { font-size:var(--dkwp-f-9_5,9.5px); opacity:.5; }
.dk-wp3-accordion-icon { display:inline-flex; transition:transform var(--dkwp-t) ease; }.dk-wp3-accordion.is-open .dk-wp3-accordion-icon{transform:rotate(180deg)}
.dk-wp3-accordion-body { display:none; padding:0 13px 13px; }.dk-wp3-accordion.is-open .dk-wp3-accordion-body{display:block}
.dk-wp3-conj-table { overflow:hidden; border:2px solid var(--dkwp-ink); border-radius:9px; }
.dk-wp3-conj-row { display:grid; grid-template-columns:105px minmax(0,1fr); min-height:38px; border-bottom:1.5px solid rgba(21,22,23,.18); }
.dk-wp3-conj-row:last-child{border-bottom:0}.dk-wp3-conj-row>*{display:flex;align-items:center;padding:8px 10px}.dk-wp3-person{font-family:'Fira Code',ui-monospace,monospace;font-size:var(--dkwp-f-10_5,10.5px);background:var(--dkwp-mist);border-right:1.5px solid rgba(21,22,23,.18)}.dk-wp3-conj-row strong{font-size:var(--dkwp-f-13,13px)}.dk-wp3-conj-full{grid-column:1/-1}

.dk-wp3-tense-strip { display:flex; gap:8px; overflow-x:auto; padding:2px 2px 8px; scrollbar-width:thin; }
.dk-wp3-tense-chip { flex:0 0 auto; display:flex; flex-direction:column; align-items:flex-start; gap:1px; min-width:96px; padding:9px 10px; border:2px solid rgba(21,22,23,.22); border-radius:10px; background:var(--dkwp-paper); cursor:pointer; }
.dk-wp3-tense-chip span{font-size:var(--dkwp-f-11_5,11.5px);font-weight:850}.dk-wp3-tense-chip small{font-size:var(--dkwp-f-9_5,9.5px);font-weight:650;opacity:.5}.dk-wp3-tense-chip.is-active{border-color:var(--dkwp-ink);background:var(--dkwp-peach);box-shadow:2px 2px 0 var(--dkwp-ink)}
.dk-wp3-examples-panel{display:none}.dk-wp3-examples-panel.is-active{display:block}
.dk-wp3-example { display:grid; grid-template-columns:32px minmax(0,1fr) auto; gap:10px; align-items:flex-start; padding:13px 0; border-bottom:1.5px solid rgba(21,22,23,.15); }
.dk-wp3-example:last-of-type{border-bottom:0}.dk-wp3-example.is-extra{display:none}.dk-wp3-examples-panel.show-all .dk-wp3-example.is-extra{display:grid}
.dk-wp3-example--compact { grid-template-columns:minmax(0,1fr) auto; gap:10px; padding:10px 0 0; border-bottom:0; }
.dk-wp3-example-copy{min-width:0}.dk-wp3-de{font-size:var(--dkwp-f-15,15px);font-weight:800;line-height:1.55}.dk-wp3-tr{margin-top:3px;font-size:var(--dkwp-f-12_5,12.5px);font-weight:600;line-height:1.5;opacity:.58}
.dk-wp3-example-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.dk-wp3-icon-btn { width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;padding:0;border:2px solid var(--dkwp-ink);border-radius:9px;background:var(--dkwp-paper);box-shadow:2px 2px 0 var(--dkwp-ink);cursor:pointer;transition:transform var(--dkwp-t) var(--dkwp-ease),box-shadow var(--dkwp-t) var(--dkwp-ease),background-color var(--dkwp-t) ease}.dk-wp3-icon-btn:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--dkwp-ink);background:var(--dkwp-sky)}.dk-wp3-icon-btn--sentence:hover{background:var(--dkwp-peach)}
.dk-wp3-sentence-btn { min-height:34px;display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border:2px solid var(--dkwp-ink);border-radius:9px;background:var(--dkwp-paper);box-shadow:2px 2px 0 var(--dkwp-ink);cursor:pointer;font-size:var(--dkwp-f-10_5,10.5px);font-weight:850;white-space:nowrap}.dk-wp3-sentence-btn svg{width:14px;height:14px}.dk-wp3-sentence-btn:hover{background:var(--dkwp-peach)}
.dk-wp3-more { width:100%;display:flex;align-items:center;justify-content:center;gap:6px;margin-top:10px;padding:10px;border:2px dashed rgba(21,22,23,.35);border-radius:9px;background:var(--dkwp-mist);cursor:pointer;font-size:var(--dkwp-f-11_5,11.5px);font-weight:800}.dk-wp3-more svg{width:15px;height:15px}.dk-wp3-examples-panel.show-all .dk-wp3-more svg{transform:rotate(180deg)}
.dk-wp3-word-link { display:inline !important; padding:0 !important; margin:0 !important; border:0 !important; border-bottom:1.5px dotted rgba(21,22,23,.34) !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; color:inherit !important; cursor:pointer !important; font:inherit !important; text-align:inherit !important; }.dk-wp3-word-link:hover{background:var(--dkwp-lime,#f8ff98)!important;border-bottom-color:var(--dkwp-ink)!important}

/* Phase 5.3 · Wortnetz: veri zengin, fakat kontrollü hiyerarşi */
.dk-wp3-network{overflow:hidden}.dk-wp3-network-title{padding-bottom:16px;border-bottom:1.5px solid rgba(21,22,23,.14)}
.dk-wp3-network-groups{display:grid;gap:22px;margin-top:18px}.dk-wp3-network-group{min-width:0}.dk-wp3-network-group + .dk-wp3-network-group{padding-top:22px;border-top:1.5px solid rgba(21,22,23,.14)}
.dk-wp3-network-group-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:11px}.dk-wp3-network-group-head>div{min-width:0}.dk-wp3-network-group-head span{display:block;margin-bottom:3px;font-size:var(--dkwp-f-8_8,8.8px);font-weight:650;letter-spacing:.055em;text-transform:uppercase;opacity:.46}.dk-wp3-network-group-head h4{margin:0;font-size:var(--dkwp-f-16,16px);font-weight:950;line-height:1.2;letter-spacing:-.02em}.dk-wp3-network-group-head p{max-width:610px;margin:5px 0 0;font-size:var(--dkwp-f-11_5,11.5px);font-weight:600;line-height:1.5;opacity:.58}
.dk-wp3-network-count{display:inline-flex;align-items:center;justify-content:center;min-width:31px;height:31px;padding:0 8px;border:2px solid var(--dkwp-ink);border-radius:999px;background:var(--dkwp-paper);box-shadow:2px 2px 0 var(--dkwp-ink);font-size:var(--dkwp-f-11_5,11.5px);font-weight:950}
.dk-wp3-network-family-grid,.dk-wp3-network-component-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.dk-wp3-network-card{min-width:0;padding:13px;border:2px solid rgba(21,22,23,.22);border-radius:12px;background:var(--dkwp-paper)}.dk-wp3-network-card--family{box-shadow:inset 0 4px 0 var(--dkwp-viol-soft)}.dk-wp3-network-card--component{box-shadow:inset 0 4px 0 var(--dkwp-peach)}
.dk-wp3-network-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.dk-wp3-network-type{padding-top:4px;font-size:var(--dkwp-f-8_8,8.8px);font-weight:650;letter-spacing:.04em;text-transform:uppercase;opacity:.48}
.dk-wp3-network-word{min-width:0;display:inline-flex;align-items:center;justify-content:flex-end;gap:7px;padding:2px 0;border:0;background:transparent;cursor:pointer;text-align:right;font-size:var(--dkwp-f-16,16px);font-weight:950;line-height:1.25;letter-spacing:-.015em}.dk-wp3-network-word span{min-width:0;overflow-wrap:anywhere}.dk-wp3-network-word svg{width:15px;height:15px;transition:transform var(--dkwp-t) var(--dkwp-ease)}.dk-wp3-network-word:hover span,.dk-wp3-network-word:focus-visible span{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}.dk-wp3-network-word:hover svg{transform:translateX(3px)}
.dk-wp3-network-meaning{margin:9px 0 0;font-size:var(--dkwp-f-12_5,12.5px);font-weight:750;line-height:1.5;color:rgba(21,22,23,.78)}.dk-wp3-network-explain{margin:7px 0 0;font-size:var(--dkwp-f-11_5,11.5px);font-weight:600;line-height:1.55;color:rgba(21,22,23,.66)}
.dk-wp3-network-note{display:flex;align-items:baseline;gap:8px;margin-top:9px;padding:7px 8px;border-radius:8px;background:var(--dkwp-mist)}.dk-wp3-network-note span{font-size:var(--dkwp-f-8,8px);font-weight:650;text-transform:uppercase;opacity:.46}.dk-wp3-network-note strong{min-width:0;font-size:var(--dkwp-f-10_5,10.5px);font-weight:750;line-height:1.4;color:rgba(21,22,23,.66)}
.dk-wp3-network-example{margin-top:10px;padding-top:9px;border-top:1.5px dashed rgba(21,22,23,.18)}.dk-wp3-network-example>span{display:block;margin-bottom:4px;font-size:var(--dkwp-f-8,8px);font-weight:650;letter-spacing:.04em;text-transform:uppercase;opacity:.43}.dk-wp3-network-example-de{font-size:var(--dkwp-f-11_5,11.5px);font-weight:800;line-height:1.5}.dk-wp3-network-example-tr{margin-top:3px;font-size:var(--dkwp-f-10_5,10.5px);font-weight:600;line-height:1.45;opacity:.56}
.dk-wp3-network-equation{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin:0 0 11px;padding:10px 12px;border:2px solid rgba(21,22,23,.18);border-radius:10px;background:#fff6ef}.dk-wp3-network-equation span,.dk-wp3-network-equation strong{padding:4px 7px;border:1.5px solid rgba(21,22,23,.2);border-radius:7px;background:var(--dkwp-paper);font-size:var(--dkwp-f-12,12px);font-weight:900}.dk-wp3-network-equation b{font-size:var(--dkwp-f-13,13px);font-weight:950;opacity:.55}
.dk-wp3-network-compare-list{display:grid;gap:11px}.dk-wp3-network-compare{overflow:hidden;border:2px solid var(--dkwp-ink);border-radius:13px;background:var(--dkwp-paper);box-shadow:3px 3px 0 var(--dkwp-ink)}.dk-wp3-network-compare-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:13px 14px;background:var(--dkwp-mist);border-bottom:1.5px solid rgba(21,22,23,.18)}.dk-wp3-network-compare-meta{min-width:0;display:flex;align-items:center;flex-wrap:wrap;gap:6px}.dk-wp3-network-compare-meta .dk-wp3-network-type{padding-top:0}.dk-wp3-network-relation{max-width:330px;padding:3px 7px;border:1.5px solid rgba(21,22,23,.2);border-radius:999px;background:var(--dkwp-paper);font-size:var(--dkwp-f-9,9px);font-weight:750;line-height:1.3;color:rgba(21,22,23,.65)}.dk-wp3-network-word--compare{font-size:var(--dkwp-f-17,17px);color:var(--dkwp-text-accent,#5f4b96)}
.dk-wp3-network-difference{padding:12px 14px 2px}.dk-wp3-network-difference>span,.dk-wp3-network-detail>span{display:block;margin-bottom:5px;font-size:var(--dkwp-f-8_5,8.5px);font-weight:700;letter-spacing:.045em;text-transform:uppercase;opacity:.45}.dk-wp3-network-difference p{margin:0;font-size:var(--dkwp-f-12_5,12.5px);font-weight:750;line-height:1.6;color:rgba(21,22,23,.77)}.dk-wp3-network-compare>.dk-wp3-network-example{margin:10px 14px 0;padding-bottom:1px}
.dk-wp3-network-detail{display:none;margin:11px 14px 0;padding:11px 12px;border:1.5px solid rgba(21,22,23,.18);border-radius:9px;background:#fffcf0}.dk-wp3-network-detail p{margin:0;font-size:var(--dkwp-f-12,12px);font-weight:650;line-height:1.65;color:rgba(21,22,23,.72)}.dk-wp3-network-compare.is-detail-open .dk-wp3-network-detail{display:block}
.dk-wp3-network-detail-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;padding:10px 14px;border:0;border-top:1.5px solid rgba(21,22,23,.16);background:var(--dkwp-paper);cursor:pointer;font-size:var(--dkwp-f-10_5,10.5px);font-weight:850;text-align:left}.dk-wp3-network-detail-toggle:hover{background:var(--dkwp-peach)}.dk-wp3-network-detail-toggle svg{width:15px;height:15px;transition:transform var(--dkwp-t) var(--dkwp-ease)}.dk-wp3-network-compare.is-detail-open .dk-wp3-network-detail-toggle svg{transform:rotate(180deg)}

.dk-wp3-deep-list .dk-wp3-accordion{margin-top:8px}.dk-wp3-long-copy{font-size:var(--dkwp-f-13_5,13.5px);font-weight:600;line-height:1.72;padding:4px 1px}
.dk-wp3-reference-table{overflow:hidden;border:2px solid var(--dkwp-ink);border-radius:9px}.dk-wp3-reference-head,.dk-wp3-reference-row{display:grid;grid-template-columns:1.2fr 1fr 1fr}.dk-wp3-reference-head{background:var(--dkwp-viol-soft);font-family:'Fira Code',ui-monospace,monospace;font-size:var(--dkwp-f-9_5,9.5px);font-weight:500}.dk-wp3-reference-head>*{padding:8px}.dk-wp3-reference-row>*{padding:8px;border-top:1.5px solid rgba(21,22,23,.16);font-size:var(--dkwp-f-12,12px)}.dk-wp3-reference-row span{text-align:center}.dk-wp3-reference-row strong{background:var(--dkwp-mist)}

.dk-wp3-sentence-state { min-height:280px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:44px 20px 24px; border:none; border-radius:0; background:transparent; box-shadow:none; }
.dk-wp3-sentence-state strong { margin-top:14px; font-size:var(--dkwp-f-17,17px); font-weight:850; color:var(--dkwp-ink); letter-spacing:-.01em; }
.dk-wp3-sentence-state p { max-width:390px; margin:6px 0 0; font-size:var(--dkwp-f-12_5,12.5px); font-weight:600; color:rgba(21,22,23,.64); line-height:1.55; }
.dk-wp3-sentence-state-badge { width:46px; height:46px; display:inline-flex; align-items:center; justify-content:center; border:2px solid var(--dkwp-ink); border-radius:50%; background:var(--dkwp-mist); box-shadow:2.5px 2.5px 0 var(--dkwp-ink); }
.dk-wp3-sentence-state-badge .dk-wp3-loading-mark { width:22px; height:22px; border-width:2.5px; border-color:rgba(21,22,23,.18); border-top-color:var(--dkwp-viol-deep); }
.dk-wp3-sentence-state-skeleton { width:100%; max-width:440px; margin-top:24px; display:flex; flex-direction:column; align-items:center; gap:8px; opacity:.4; }
.dk-wp3-skeleton-bar { height:10px; border-radius:6px; background:rgba(21,22,23,.12); animation:dkwp-pulse 1.6s ease-in-out infinite; }
@keyframes dkwp-pulse { 0%,100%{opacity:.45} 50%{opacity:1} }
.dk-wp3-sentence-state--error { border:2px solid var(--dkwp-ink) !important; border-radius:var(--dkwp-r-lg) !important; background:#fff3f3 !important; box-shadow:4px 4px 0 var(--dkwp-ink) !important; padding:24px 20px !important; min-height:auto !important; margin:16px 0 !important; }
.dk-wp3-sentence-summary { padding:22px; border:var(--dkwp-line); border-radius:var(--dkwp-r-lg); background:var(--dkwp-viol-soft); box-shadow:5px 5px 0 var(--dkwp-ink); }.dk-wp3-sentence-summary blockquote{margin:8px 0 10px;font-size:var(--dkwp-f-21,21px);font-weight:900;line-height:1.45;letter-spacing:-.02em}.dk-wp3-sentence-translation{font-size:var(--dkwp-f-14,14px);font-weight:700;line-height:1.55}.dk-wp3-sentence-tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:14px}.dk-wp3-sentence-tags span{padding:5px 8px;border:2px solid var(--dkwp-ink);border-radius:999px;background:var(--dkwp-paper);font-size:var(--dkwp-f-10,10px);font-weight:500}
.dk-wp3-section--sentence{margin-top:22px}.dk-wp3-anatomy{display:grid;gap:9px}.dk-wp3-anatomy-card{--accent:var(--dkwp-mist);display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;padding:14px;border:2px solid var(--dkwp-ink);border-radius:10px;background:linear-gradient(90deg,var(--accent) 0 8px,var(--dkwp-paper) 8px);}.dk-wp3-anatomy-card[data-accent="sky"]{--accent:var(--dkwp-sky)}.dk-wp3-anatomy-card[data-accent="green"]{--accent:var(--dkwp-green)}.dk-wp3-anatomy-card[data-accent="red"]{--accent:var(--dkwp-err)}.dk-wp3-anatomy-card[data-accent="peach"]{--accent:var(--dkwp-peach)}.dk-wp3-anatomy-card[data-accent="viol"]{--accent:var(--dkwp-viol-soft)}.dk-wp3-anatomy-role{font-size:var(--dkwp-f-9_5,9.5px);opacity:.56;text-transform:lowercase}.dk-wp3-anatomy-target{margin-top:2px;font-size:var(--dkwp-f-16,16px);font-weight:900}.dk-wp3-anatomy-main p{margin:5px 0 0;font-size:var(--dkwp-f-12_5,12.5px);font-weight:600;line-height:1.6;opacity:.74}

/* DeuKlar brand report modal styling */
#kelime-penceresi.dk-wp3-active .report-overlay {
  position:absolute !important; inset:0 !important; width:100% !important; height:100% !important;
  z-index:9999 !important; display:flex !important; justify-content:center !important; align-items:center !important;
  background:rgba(21,22,23,.48) !important; backdrop-filter:blur(3px) !important; -webkit-backdrop-filter:blur(3px) !important;
}
#kelime-penceresi.dk-wp3-active .report-modal {
  width:92% !important; max-width:400px !important; background:var(--dkwp-paper) !important;
  color:var(--dkwp-ink) !important; border:2.5px solid var(--dkwp-ink) !important;
  border-radius:18px !important; box-shadow:8px 8px 0 var(--dkwp-ink) !important;
  padding:20px !important; box-sizing:border-box !important;
}
#kelime-penceresi.dk-wp3-active .dkx-report-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:12px; }
#kelime-penceresi.dk-wp3-active .dkx-report-badge-wrap { min-width:0; }
#kelime-penceresi.dk-wp3-active .dkx-report-badge { display:inline-block; font-size:10px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; background:var(--dkwp-viol); color:var(--dkwp-ink); padding:3px 8px; border:1.5px solid var(--dkwp-ink); border-radius:6px; margin-bottom:6px; }
#kelime-penceresi.dk-wp3-active .dkx-report-title { margin:0 0 2px !important; font-size:18px !important; font-weight:850 !important; color:var(--dkwp-ink) !important; line-height:1.2 !important; }
#kelime-penceresi.dk-wp3-active .dkx-report-sub { font-size:12px !important; color:#555 !important; margin:0 !important; }
#kelime-penceresi.dk-wp3-active .dkx-report-close-btn { background:#f1eff8; border:1.5px solid var(--dkwp-ink); border-radius:8px; width:28px; height:28px; display:flex; align-items:center; justify-content:center; font-size:17px; font-weight:700; cursor:pointer; box-shadow:1.5px 1.5px 0 var(--dkwp-ink); transition:transform .1s,box-shadow .1s; }
#kelime-penceresi.dk-wp3-active .dkx-report-close-btn:hover { background:var(--dkwp-err); transform:translate(-1px,-1px); box-shadow:2.5px 2.5px 0 var(--dkwp-ink); }
#kelime-penceresi.dk-wp3-active .dkx-report-word-card { display:flex; align-items:center; gap:8px; padding:7px 11px; border:1.5px solid var(--dkwp-ink); border-radius:9px; background:#fff8eb; margin-bottom:11px; }
#kelime-penceresi.dk-wp3-active .dkx-report-word-icon { display:flex; align-items:center; color:var(--dkwp-ink); }
#kelime-penceresi.dk-wp3-active .dkx-report-word-lbl { font-size:11px; color:#666; font-weight:600; }
#kelime-penceresi.dk-wp3-active .dkx-report-word-val { font-size:13.5px; color:var(--dkwp-ink); font-weight:800; }
#kelime-penceresi.dk-wp3-active .dkx-report-options-grid { display:flex; flex-direction:column; gap:6px; margin-bottom:10px; }
#kelime-penceresi.dk-wp3-active .report-option { display:flex !important; align-items:center !important; gap:9px !important; width:100% !important; padding:8px 11px !important; background:var(--dkwp-paper) !important; border:1.5px solid #cfcae0 !important; border-radius:9px !important; cursor:pointer !important; font-size:12px !important; font-weight:650 !important; color:var(--dkwp-ink) !important; text-align:left !important; transition:border-color .12s,background .12s,transform .1s !important; }
#kelime-penceresi.dk-wp3-active .report-option:hover { border-color:var(--dkwp-ink) !important; background:#f8f6ff !important; transform:translateX(2px) !important; }
#kelime-penceresi.dk-wp3-active .report-option.selected { border:2px solid var(--dkwp-ink) !important; background:var(--dkwp-peach) !important; box-shadow:2px 2px 0 var(--dkwp-ink) !important; font-weight:750 !important; }
#kelime-penceresi.dk-wp3-active .dkx-ro-icon { display:flex; align-items:center; justify-content:center; color:var(--dkwp-ink); flex-shrink:0; }
#kelime-penceresi.dk-wp3-active .dkx-ro-text { flex:1; min-width:0; }
#kelime-penceresi.dk-wp3-active .report-message-box { width:100% !important; min-height:56px !important; max-height:86px !important; padding:8px 11px !important; border:1.5px solid var(--dkwp-ink) !important; border-radius:9px !important; font-size:12px !important; font-family:inherit !important; resize:vertical !important; outline:none !important; margin-bottom:10px !important; background:#faf9fd !important; }
#kelime-penceresi.dk-wp3-active .report-message-box:focus { border-color:var(--dkwp-ink) !important; background:#fff !important; box-shadow:2px 2px 0 var(--dkwp-ink) !important; }
#kelime-penceresi.dk-wp3-active .dkx-report-actions { display:flex; gap:8px; }
#kelime-penceresi.dk-wp3-active .report-btn-cancel { flex:0 0 auto !important; padding:8px 14px !important; border:1.5px solid var(--dkwp-ink) !important; border-radius:9px !important; background:#f1eff8 !important; color:var(--dkwp-ink) !important; font-size:12px !important; font-weight:700 !important; cursor:pointer !important; }
#kelime-penceresi.dk-wp3-active .report-btn-cancel:hover { background:#e4e0f0 !important; }
#kelime-penceresi.dk-wp3-active .report-btn-send { flex:1 !important; padding:8px 14px !important; border:2px solid var(--dkwp-ink) !important; border-radius:9px !important; background:var(--dkwp-peach) !important; color:var(--dkwp-ink) !important; font-size:12.5px !important; font-weight:800 !important; box-shadow:2px 2px 0 var(--dkwp-ink) !important; cursor:pointer !important; transition:transform .1s,box-shadow .1s !important; }
#kelime-penceresi.dk-wp3-active .report-btn-send:hover:not(:disabled) { transform:translate(-1px,-1px) !important; box-shadow:3px 3px 0 var(--dkwp-ink) !important; background:#ffa978 !important; }
#kelime-penceresi.dk-wp3-active .report-btn-send:disabled { opacity:.42 !important; cursor:not-allowed !important; box-shadow:none !important; }
#kelime-penceresi.dk-wp3-active .dkx-report-success { text-align:center; padding:12px 6px 4px; }
#kelime-penceresi.dk-wp3-active .dkx-rs-icon { margin-bottom:8px; display:inline-flex; }
#kelime-penceresi.dk-wp3-active .dkx-rs-title { font-size:17px; font-weight:850; margin-bottom:6px; color:var(--dkwp-ink); }
#kelime-penceresi.dk-wp3-active .dkx-rs-desc { font-size:12.5px; color:#444; line-height:1.45; }

#kelime-penceresi.dk-wp3-active #popup-resize-handle,#kelime-penceresi.dk-wp3-pending #popup-resize-handle { color:var(--dkwp-ink)!important; opacity:.5; }

@media (max-width:680px){
  #kelime-penceresi.dk-wp3-active,#kelime-penceresi.dk-wp3-pending{width:94vw!important;min-width:0!important;height:86vh!important;}
  #kelime-penceresi.dk-wp3-active #secilen-kelime,#kelime-penceresi.dk-wp3-pending #secilen-kelime{font-size:var(--dkwp-f-22,22px)!important;max-width:46vw}
  #kelime-penceresi.dk-wp3-active .popup-header,#kelime-penceresi.dk-wp3-pending .popup-header{padding:11px 12px!important}
  .dk-wp3-word-view,.dk-wp3-sentence-view{padding:12px 12px 24px}.dk-wp3-hero,.dk-wp3-section,.dk-wp3-sentence-summary{padding:16px}.dk-wp3-section-head{display:block}.dk-wp3-section-head p{text-align:left;margin-top:6px;max-width:none}.dk-wp3-relation-grid{grid-template-columns:1fr}.dk-wp3-example{grid-template-columns:26px minmax(0,1fr)}.dk-wp3-example-actions{grid-column:2;justify-content:flex-start}.dk-wp3-example--compact{grid-template-columns:1fr}.dk-wp3-example--compact .dk-wp3-example-actions{grid-column:1}.dk-wp3-sentence-btn span{display:none}.dk-wp3-conj-row{grid-template-columns:88px minmax(0,1fr)}.dk-wp3-noun-facts{grid-template-columns:90px 1fr}.dk-wp3-noun-fact--plural{grid-column:1/-1}.dk-wp3-noun-segments{grid-template-columns:repeat(2,minmax(0,1fr))}.dk-wp3-noun-case-head,.dk-wp3-noun-case-row{grid-template-columns:100px minmax(0,1fr) minmax(0,1fr)}
}

@media (max-width:480px){
.dk-wp3-snapshot-grid{grid-template-columns:1fr}.dk-wp3-snapshot--wide{grid-column:auto}.dk-wp3-modebar{padding:8px}.dk-wp3-mode{padding:8px}.dk-wp3-mode small{display:none}.dk-wp3-meaning{font-size:var(--dkwp-f-20,20px)}.dk-wp3-mana{font-size:var(--dkwp-f-14_5,14.5px)}.dk-wp3-rektion-row{grid-template-columns:28px minmax(0,1fr);gap:8px}.dk-wp3-reference-head,.dk-wp3-reference-row{grid-template-columns:1.1fr 1fr 1fr}.dk-wp3-noun-facts{grid-template-columns:1fr}.dk-wp3-noun-fact--plural{grid-column:auto}.dk-wp3-noun-segments{grid-template-columns:1fr 1fr}.dk-wp3-noun-case-head{display:none}.dk-wp3-noun-case-row{grid-template-columns:88px minmax(0,1fr);}.dk-wp3-noun-case-name{grid-row:1/3}.dk-wp3-noun-form,.dk-wp3-noun-form--plural{position:relative;padding-left:70px}.dk-wp3-noun-form::before{content:'Singular';position:absolute;left:10px;font-family:'Fira Code',ui-monospace,monospace;font-size:var(--dkwp-f-8,8px);opacity:.45}.dk-wp3-noun-form--plural::before{content:'Plural'}
}

@media (prefers-reduced-motion:reduce){
  #kelime-penceresi.dk-wp3-active *,#kelime-penceresi.dk-wp3-pending *{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* Phase 3.1 hierarchy refinements */
#kelime-penceresi.dk-wp3-active #ses-oku-btn,
#kelime-penceresi.dk-wp3-pending #ses-oku-btn { display:none !important; }

.dk-wp3-sentence-summary-top { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.dk-wp3-context-btn { flex:0 0 auto; padding:6px 9px; border:2px solid var(--dkwp-ink); border-radius:9px; background:var(--dkwp-paper); box-shadow:2px 2px 0 var(--dkwp-ink); cursor:pointer; font-size:var(--dkwp-f-10_5,10.5px); font-weight:850; transition:transform var(--dkwp-t) var(--dkwp-ease),box-shadow var(--dkwp-t) var(--dkwp-ease),background-color var(--dkwp-t) ease; }
.dk-wp3-context-btn:hover { transform:translate(-1px,-1px); box-shadow:4px 4px 0 var(--dkwp-ink); background:var(--dkwp-peach); }

@media (max-width:480px){
  .dk-wp3-sentence-summary-top { align-items:flex-start; flex-direction:column; }
}

/* Phase 4.2 — Adjektiv: Steigerung + unified declension workspace */
#kelime-penceresi.dk-wp3-active[data-dkwp-type="adjective"] .popup-header,
#kelime-penceresi.dk-wp3-pending[data-dkwp-type="adjective"] .popup-header { background:var(--dkwp-viol-soft) !important; }
.dk-wp3-hero--adjective::after { background:#d9ccff; }
.dk-wp3-meta-chip--adverb { background:#dff8eb; }
.dk-wp3-adj-facts { position:relative; z-index:1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:17px; }
.dk-wp3-adj-fact { min-width:0; padding:11px 12px; border:2px solid rgba(21,22,23,.22); border-radius:10px; background:var(--dkwp-mist); }
.dk-wp3-adj-fact:nth-child(2) { background:#fff8df; }
.dk-wp3-adj-fact:nth-child(3) { background:#fff1ea; }
.dk-wp3-adj-fact>span { display:block; margin-bottom:5px; font-family:'Fira Code',ui-monospace,monospace; font-size:var(--dkwp-f-9,9px); font-weight:500; text-transform:uppercase; letter-spacing:.04em; opacity:.5; }
.dk-wp3-adj-fact>strong { display:block; min-width:0; overflow-wrap:anywhere; font-size:var(--dkwp-f-14,14px); line-height:1.35; font-weight:900; }
.dk-wp3-muted { margin:0; font-size:var(--dkwp-f-12,12px); font-weight:600; line-height:1.55; opacity:.52; }

.dk-wp3-adj-usage-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.dk-wp3-adj-usage-card { min-width:0; padding:14px; border:2px solid var(--dkwp-ink); border-radius:12px; background:var(--dkwp-mist); }
.dk-wp3-adj-usage-card--adj { box-shadow:inset 7px 0 0 var(--dkwp-viol-soft); }
.dk-wp3-adj-usage-card--adv { background:#f2fff8; box-shadow:inset 7px 0 0 #a7edc9; }
.dk-wp3-adj-usage-head { display:flex; flex-direction:column; gap:3px; padding-left:4px; }
.dk-wp3-adj-usage-head span { font-size:var(--dkwp-f-9_5,9.5px); opacity:.55; }
.dk-wp3-adj-usage-head strong { font-size:var(--dkwp-f-13_5,13.5px); font-weight:900; line-height:1.3; }
.dk-wp3-adj-usage-examples { margin-top:10px; display:grid; gap:8px; }
.dk-wp3-adj-usage-example { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:flex-start; gap:8px; padding:10px; border:1.5px solid rgba(21,22,23,.18); border-radius:9px; background:var(--dkwp-paper); }
.dk-wp3-adj-usage-example .dk-wp3-de { font-size:var(--dkwp-f-13,13px); }
.dk-wp3-adj-usage-example .dk-wp3-tr { font-size:var(--dkwp-f-11,11px); }
.dk-wp3-adj-usage-example .dk-wp3-icon-btn { width:30px; height:30px; box-shadow:1.5px 1.5px 0 var(--dkwp-ink); }
.dk-wp3-adj-usage-example .dk-wp3-icon-btn svg { width:14px; height:14px; }

.dk-wp3-degree-track { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-bottom:12px; }
.dk-wp3-degree-step { position:relative; min-width:0; min-height:68px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:2px; padding:10px 12px; border:2px solid var(--dkwp-ink); border-radius:12px; background:var(--dkwp-paper); box-shadow:2px 2px 0 var(--dkwp-ink); cursor:pointer; text-align:left; transition:transform var(--dkwp-t) var(--dkwp-ease),box-shadow var(--dkwp-t) var(--dkwp-ease),background-color var(--dkwp-t) ease; }
.dk-wp3-degree-step:hover { transform:translate(-1px,-1px); box-shadow:3px 3px 0 var(--dkwp-ink); }
.dk-wp3-degree-step.is-active { background:var(--dkwp-peach); box-shadow:3px 3px 0 var(--dkwp-ink); }
.dk-wp3-degree-step small { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:var(--dkwp-f-9,9px); font-weight:700; opacity:.55; }
.dk-wp3-degree-step strong { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:var(--dkwp-f-14,14px); line-height:1.25; font-weight:900; }
.dk-wp3-degree-step span { font-size:var(--dkwp-f-8_5,8.5px); opacity:.48; }
.dk-wp3-degree-panel { display:none; padding:18px 20px; border:2px solid var(--dkwp-ink); border-radius:14px; background:var(--dkwp-paper,#fff); box-shadow:3px 3px 0 var(--dkwp-ink); margin-top:12px; }
.dk-wp3-degree-panel.is-active { display:block; }
.dk-wp3-degree-copy { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-bottom:14px; margin-bottom:14px; border-bottom:1.5px solid rgba(21,22,23,.12); }
.dk-wp3-degree-copy-lead { min-width:130px; flex-shrink:0; }
.dk-wp3-degree-copy-lead .dk-wp3-gram { font-size:var(--dkwp-f-10,10px); font-weight:750; letter-spacing:.05em; text-transform:uppercase; opacity:.55; }
.dk-wp3-degree-copy-lead h4 { margin:3px 0 0; font-size:var(--dkwp-f-20,20px); font-weight:900; line-height:1.2; letter-spacing:-.025em; color:var(--dkwp-ink); }
.dk-wp3-degree-copy-desc { flex:1; font-size:var(--dkwp-f-12_5,12.5px); font-weight:600; line-height:1.55; color:rgba(21,22,23,.75); background:var(--dkwp-mist,#f7f5ff); padding:9px 14px; border-radius:9px; border-left:3px solid var(--dkwp-peach,#ffb088); }
.dk-wp3-degree-examples { display:grid; gap:10px; margin-top:14px; }
.dk-wp3-degree-example { display:grid; grid-template-columns:36px minmax(0,1fr) auto; gap:12px; align-items:center; padding:12px 14px; border:1.5px solid rgba(21,22,23,.14); border-radius:12px; background:var(--dkwp-paper,#fff); box-shadow:0 1px 3px rgba(21,22,23,.04); transition:all var(--dkwp-t) ease; }
.dk-wp3-degree-example:hover { background:var(--dkwp-cream,#fbf9f5); border-color:rgba(21,22,23,.28); box-shadow:2px 2px 0 var(--dkwp-ink); transform:translate(-1px,-1px); }
.dk-wp3-degree-example-text { min-width:0; }
.dk-wp3-degree-example .dk-wp3-de { font-size:var(--dkwp-f-14,14px); font-weight:850; line-height:1.45; color:var(--dkwp-ink); }
.dk-wp3-degree-example .dk-wp3-tr { margin-top:3px; font-size:var(--dkwp-f-12,12px); font-weight:600; color:rgba(21,22,23,.65); line-height:1.45; }
.dk-wp3-degree-example .dk-wp3-example-actions { display:flex; align-items:center; gap:6px; flex-shrink:0; }

.dk-wp3-adj-form-strip { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-bottom:12px; }
.dk-wp3-adj-form { min-width:0; min-height:64px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:3px; padding:10px 12px; border:2px solid rgba(21,22,23,.2); border-radius:12px; background:var(--dkwp-paper); cursor:pointer; text-align:left; transition:transform var(--dkwp-t) var(--dkwp-ease),box-shadow var(--dkwp-t) var(--dkwp-ease),background-color var(--dkwp-t) ease,border-color var(--dkwp-t) ease; }
.dk-wp3-adj-form:hover { transform:translate(-1px,-1px); border-color:var(--dkwp-ink); box-shadow:2px 2px 0 var(--dkwp-ink); }
.dk-wp3-adj-form.is-active { border-color:var(--dkwp-ink); background:var(--dkwp-peach); box-shadow:3px 3px 0 var(--dkwp-ink); }
.dk-wp3-adj-form span { font-size:var(--dkwp-f-9_5,9.5px); font-weight:750; letter-spacing:.04em; text-transform:uppercase; opacity:.55; }
.dk-wp3-adj-form strong { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:var(--dkwp-f-13_5,13.5px); font-weight:900; }
.dk-wp3-adj-form-panel { display:none; }
.dk-wp3-adj-form-panel.is-active { display:block; }
.dk-wp3-adj-form-note { margin:4px 0 14px; padding:10px 14px; border-left:3px solid var(--dkwp-viol-soft); border-radius:0 10px 10px 0; background:var(--dkwp-mist); font-size:var(--dkwp-f-12,12px); font-weight:600; color:rgba(21,22,23,.75); line-height:1.55; }
.dk-wp3-adj-form-note p { margin:0; }
.dk-wp3-adj-strength-strip { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-bottom:12px; }
.dk-wp3-adj-strength { min-width:0; min-height:48px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:2px; padding:8px 12px; border:2px solid rgba(21,22,23,.2); border-radius:10px; background:var(--dkwp-paper); cursor:pointer; text-align:left; transition:all var(--dkwp-t) ease; }
.dk-wp3-adj-strength:hover { border-color:var(--dkwp-ink); background:var(--dkwp-mist); }
.dk-wp3-adj-strength.is-active { border-color:var(--dkwp-ink); background:var(--dkwp-viol-soft); box-shadow:2px 2px 0 var(--dkwp-ink); }
.dk-wp3-adj-strength span { font-size:var(--dkwp-f-12,12px); font-weight:900; }
.dk-wp3-adj-strength small { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-family:'Fira Code',monospace; font-size:var(--dkwp-f-9,9px); opacity:.55; }
.dk-wp3-adj-strength-panel { display:none; padding-top:2px; }
.dk-wp3-adj-strength-panel.is-active { display:block; }
.dk-wp3-adj-gender-strip { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-bottom:10px; }
.dk-wp3-adj-gender { min-width:0; display:flex; align-items:center; justify-content:space-between; gap:6px; padding:8px 12px; border:2px solid rgba(21,22,23,.2); border-radius:10px; background:var(--dkwp-paper); cursor:pointer; transition:all var(--dkwp-t) ease; }
.dk-wp3-adj-gender:hover { border-color:var(--dkwp-ink); }
.dk-wp3-adj-gender.is-active { border-color:var(--dkwp-ink); background:#fff8df; box-shadow:2px 2px 0 var(--dkwp-ink); }
.dk-wp3-adj-gender-lbl { font-size:var(--dkwp-f-11,11px); font-weight:900; }
.dk-wp3-adj-gender-noun { font-size:var(--dkwp-f-10,10px); font-weight:750; opacity:.55; font-family:'Fira Code',monospace; }
.dk-wp3-adj-gender-panel { display:none; }
.dk-wp3-adj-gender-panel.is-active { display:block; }
.dk-wp3-adj-gender-head { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin:2px 0 8px; padding:0 2px; }
.dk-wp3-adj-gender-head>div { display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.dk-wp3-adj-gender-head span { font-size:var(--dkwp-f-9,9px); opacity:.5; }
.dk-wp3-adj-gender-head strong { font-size:var(--dkwp-f-11_5,11.5px); font-weight:900; }
.dk-wp3-adj-gender-head>small { font-size:var(--dkwp-f-9_5,9.5px); font-weight:650; opacity:.5; }
.dk-wp3-adj-case-table { overflow:hidden; border:2px solid var(--dkwp-ink); border-radius:12px; background:var(--dkwp-paper); box-shadow:3px 3px 0 var(--dkwp-ink); margin-top:6px; }
.dk-wp3-adj-case-row { display:grid; grid-template-columns:135px minmax(0,1fr); min-height:50px; border-top:1.5px solid rgba(21,22,23,.14); transition:background-color var(--dkwp-t) ease; }
.dk-wp3-adj-case-row:first-child { border-top:0; }
.dk-wp3-adj-case-row:hover { background:rgba(176,156,251,.08); }
.dk-wp3-adj-case-name { display:flex; flex-direction:column; justify-content:center; gap:2px; padding:9px 13px; background:var(--dkwp-mist); border-right:1.5px solid rgba(21,22,23,.14); }
.dk-wp3-adj-case-name strong { font-size:var(--dkwp-f-11,11px); font-weight:850; letter-spacing:-.01em; }
.dk-wp3-adj-case-name small { font-size:var(--dkwp-f-9,9px); font-weight:650; opacity:.5; }
.dk-wp3-adj-case-form { display:flex; align-items:center; padding:9px 14px; font-size:var(--dkwp-f-14_5,14.5px); font-weight:850; line-height:1.4; overflow-wrap:anywhere; }

/* Predicative superlativ_am display */
.dk-wp3-adj-predicative-box { padding:18px 20px; border:2px solid var(--dkwp-ink); border-radius:14px; background:var(--dkwp-paper); box-shadow:3px 3px 0 var(--dkwp-ink); margin-top:6px; }
.dk-wp3-adj-predicative-intro { margin-bottom:16px; padding-bottom:14px; border-bottom:1.5px solid rgba(21,22,23,.14); }
.dk-wp3-adj-predicative-intro .dk-wp3-gram { font-size:var(--dkwp-f-10,10px); font-weight:750; letter-spacing:.05em; text-transform:uppercase; opacity:.55; }
.dk-wp3-adj-predicative-intro h4 { margin:3px 0 6px; font-size:var(--dkwp-f-18,18px); font-weight:900; letter-spacing:-.02em; }
.dk-wp3-adj-predicative-intro p { margin:0; font-size:var(--dkwp-f-12_5,12.5px); font-weight:600; line-height:1.6; color:rgba(21,22,23,.75); }
.dk-wp3-adj-predicative-guide-label { margin:0 0 10px; font-size:var(--dkwp-f-11,11px); font-weight:750; text-transform:uppercase; letter-spacing:.04em; color:rgba(21,22,23,.55); }
.dk-wp3-adj-predicative-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
@media (max-width:640px) { .dk-wp3-adj-predicative-grid { grid-template-columns:1fr; } }
.dk-wp3-adj-predicative-card { padding:12px 14px; border:1.5px solid rgba(21,22,23,.18); border-radius:11px; background:var(--dkwp-mist); }
.dk-wp3-adj-pred-head { display:flex; align-items:baseline; justify-content:space-between; gap:8px; margin-bottom:4px; }
.dk-wp3-adj-pred-head .dk-wp3-gram { font-size:var(--dkwp-f-9_5,9.5px); font-weight:750; letter-spacing:.04em; text-transform:uppercase; opacity:.55; }
.dk-wp3-adj-pred-head small { font-family:'Fira Code',monospace; font-size:var(--dkwp-f-9,9px); opacity:.5; }
.dk-wp3-adj-pred-de { font-size:var(--dkwp-f-14,14px); font-weight:850; line-height:1.4; }
.dk-wp3-adj-pred-tr { margin-top:3px; font-size:var(--dkwp-f-11_5,11.5px); font-weight:600; color:rgba(21,22,23,.65); }

@media (max-width:680px){
  .dk-wp3-adj-facts { grid-template-columns:1fr 1fr; }
  .dk-wp3-adj-fact:last-child { grid-column:1/-1; }
  .dk-wp3-adj-usage-grid { grid-template-columns:1fr; }
  .dk-wp3-degree-track { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dk-wp3-degree-track::before { display:none; }
  .dk-wp3-degree-copy { grid-template-columns:1fr; gap:8px; }
  .dk-wp3-adj-form-head { flex-direction:column; gap:7px; }
  .dk-wp3-adj-form-head p { max-width:none; }
}

@media (max-width:480px){
  .dk-wp3-adj-facts { grid-template-columns:1fr; }
  .dk-wp3-adj-fact:last-child { grid-column:auto; }
  .dk-wp3-degree-track { display:flex; overflow-x:auto; padding:2px 2px 7px; scrollbar-width:thin; }
  .dk-wp3-degree-step { flex:0 0 142px; }
  .dk-wp3-degree-example-top { grid-template-columns:30px minmax(0,1fr); }
  .dk-wp3-level-dot { width:30px; }
  .dk-wp3-degree-example .dk-wp3-tr { margin-left:37px; }
  .dk-wp3-adj-form-strip { display:flex; overflow-x:auto; padding:2px 2px 7px; scrollbar-width:thin; }
  .dk-wp3-adj-form { flex:0 0 132px; }
  .dk-wp3-adj-strength-strip { grid-template-columns:1fr; }
  .dk-wp3-adj-strength { flex-direction:row; align-items:baseline; justify-content:space-between; }
  .dk-wp3-adj-case-row { grid-template-columns:92px minmax(0,1fr); }
  .dk-wp3-adj-case-form { font-size:var(--dkwp-f-13,13px); padding:9px 10px; }
  .dk-wp3-adj-usage-example { grid-template-columns:1fr; }
  .dk-wp3-adj-usage-example .dk-wp3-example-actions { justify-content:flex-start; }
}

/* Phase 4.3 — Adverb: role-first, level-based usage */
#kelime-penceresi.dk-wp3-active[data-dkwp-type="adverb"] .popup-header,
#kelime-penceresi.dk-wp3-pending[data-dkwp-type="adverb"] .popup-header { background:#dff8eb !important; }
.dk-wp3-hero--adverb::after { background:#bcefd3; }

/* Anlam ve Mana (Hero) Arka Planı: Kesin BEYAZ (#ffffff), gri değil */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-hero,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-hero,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)[data-dkwp-type="adverb"] .dk-wp3-hero {
  background: #ffffff !important;
}

.dk-wp3-adverb-identity {
  position: relative;
  z-index: 1;
  width: max-content;
  max-width: 100%;
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
  margin-top: 15px;
  padding: 8px 12px;
  border: 2px solid var(--dkwp-ink, #151617);
  border-radius: 10px;
  background: #f2fff8;
  box-shadow: 2px 2px 0 var(--dkwp-ink, #151617);
}
.dk-wp3-adverb-identity span,
.dk-wp3-adverb-identity .dk-wp3-gram {
  font-family: 'Fira Code', ui-monospace, SFMono-Regular, Consolas, monospace !important;
  font-size: var(--dkwp-f-10, 10px) !important;
  font-weight: 750 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  opacity: .75 !important;
}
.dk-wp3-adverb-identity strong {
  font-family: 'Geist', 'Nunito', Inter, ui-sans-serif, system-ui, sans-serif !important;
  font-size: var(--dkwp-f-12_5, 12.5px) !important;
  font-weight: 900 !important;
  line-height: 1.35 !important;
}

/* Cümledeki rolü — Section & DeuKlar Kutucuk Tasarımı */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-adverb-role {
  background: #ffffff !important;
  color: var(--dkwp-ink, #151617) !important;
  margin-top: 0 !important;
  padding-top: 14px !important;
  padding-bottom: 26px !important;
  position: relative;
}

/* Hero (Anlam ve Mana) ile Cümledeki Rolü arasındaki sahte dalgayı kaldır — İkisi de BEYAZ tek tuval */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-hero+.dk-wp3-adverb-role::before {
  content: none !important;
  display: none !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-hero+.dk-wp3-adverb-role {
  --dkwp-hero-bridge: #ffffff !important;
}

/* DeuKlar Yazı Teması: "Adverb · Funktion" kicker */
.dk-wp3-kicker--mint {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  background: rgba(16, 185, 129, 0.12) !important;
  color: #047857 !important;
  border: 1.5px solid rgba(16, 185, 129, 0.35) !important;
  padding: 3px 9px !important;
  border-radius: 999px !important;
  font-family: 'Fira Code', ui-monospace, SFMono-Regular, Consolas, monospace !important;
  font-size: var(--dkwp-f-10_5, 10.5px) !important;
  font-weight: 750 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
}
.dk-wp3-kicker--mint span {
  font-family: 'Fira Code', ui-monospace, SFMono-Regular, Consolas, monospace !important;
  letter-spacing: 0.06em !important;
}
.dk-wp3-kicker--mint svg {
  stroke: #059669;
  flex-shrink: 0;
}

#dk-wp3-adverb-role-title {
  font-family: 'Geist', 'Nunito', Inter, ui-sans-serif, system-ui, sans-serif !important;
  font-size: var(--dkwp-f-18, 18px) !important;
  font-weight: 900 !important;
  letter-spacing: -0.03em !important;
}

/* DeuKlar Kutucuk Tasarımı: 2px border, inset vurgusu, fiziksel gölge & basmatik dokunsal mekanik */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-adverb-role-card {
  position: relative;
  z-index: 1;
  margin-top: 14px;
  background: var(--dkwp-paper, #ffffff) !important;
  border-radius: 12px !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  box-shadow: inset 0 4px 0 #10b981, 2.5px 2.5px 0 var(--dkwp-ink, #151617) !important;
  padding: 16px 18px 18px !important;
  display: flex;
  flex-direction: column;
  gap: 12px;
  cursor: pointer !important;
  user-select: none !important;
  transition: transform 0.08s ease, box-shadow 0.08s ease, background-color 0.12s ease !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-adverb-role-card:hover {
  transform: translate(-1.5px, -1.5px) !important;
  box-shadow: inset 0 4px 0 #10b981, 4px 4px 0 var(--dkwp-ink, #151617) !important;
  background: #fafffc !important;
}

/* Cümledeki rolü kutucuğu: İşlevsiz dokunsal basma efekti */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-adverb-role-card:active {
  transform: translate(2px, 2px) !important;
  box-shadow: inset 0 4px 0 #10b981, 0.5px 0.5px 0 var(--dkwp-ink, #151617) !important;
  transition-duration: 0.05s !important;
}

.dk-wp3-adverb-role-header {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px;
  flex-wrap: wrap;
}

/* DeuKlar Yazı Teması: "Reines Adverb" hapı */
.dk-wp3-adverb-role-pill {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2.5px 9px !important;
  border-radius: 6px !important;
  background: #f1f5f9 !important;
  border: 1.5px solid rgba(21, 22, 23, 0.22) !important;
  color: var(--dkwp-ink, #151617) !important;
  font-family: 'Fira Code', ui-monospace, SFMono-Regular, Consolas, monospace !important;
  font-size: var(--dkwp-f-10, 10px) !important;
  font-weight: 750 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
}

.dk-wp3-adverb-role-body {
  position: relative;
}

.dk-wp3-adverb-role-text {
  margin: 0;
  color: var(--dkwp-ink, #151617) !important;
  font-family: 'Geist', 'Nunito', Inter, ui-sans-serif, system-ui, sans-serif !important;
  font-size: var(--dkwp-f-14_5, 14.5px) !important;
  font-weight: 650 !important;
  line-height: 1.68 !important;
  letter-spacing: -0.005em !important;
  text-align: justify !important;
  text-justify: inter-word;
  word-break: normal;
  overflow-wrap: anywhere;
}

.dk-wp3-adverb-level-strip .dk-wp3-tense-chip.is-active { background:#bcefd3; }

@media (max-width:480px){
  .dk-wp3-adverb-identity { width:100%; align-items:flex-start; flex-direction:column; gap:3px; }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-adverb-role-card { padding: 13px 14px 15px !important; }
  .dk-wp3-adverb-role-text { font-size: 13.5px; line-height: 1.65; }
}

/* Phase 4.4 — Pronomen: selected form + Personalpronomen reference */
#kelime-penceresi.dk-wp3-active[data-dkwp-type="pronoun"] .popup-header,
#kelime-penceresi.dk-wp3-pending[data-dkwp-type="pronoun"] .popup-header { background:#eadcff !important; }
.dk-wp3-hero--pronoun::after { background:#dec8ff; }
.dk-wp3-pronoun-facts { position:relative; z-index:1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:16px; }
.dk-wp3-pronoun-fact { min-width:0; display:flex; flex-direction:column; gap:3px; padding:11px 12px; border:2px solid rgba(21,22,23,.2); border-radius:10px; background:var(--dkwp-mist); }
.dk-wp3-pronoun-fact:nth-child(2) { background:#f7efff; }
.dk-wp3-pronoun-fact:nth-child(3) { background:#fff8df; }
.dk-wp3-pronoun-fact>span { font-family:'Fira Code',ui-monospace,monospace; font-size:var(--dkwp-f-9,9px); font-weight:550; text-transform:uppercase; letter-spacing:.04em; opacity:.48; }
.dk-wp3-pronoun-fact>strong { min-width:0; overflow-wrap:anywhere; font-size:var(--dkwp-f-13,13px); line-height:1.35; font-weight:900; }
.dk-wp3-pronoun-fact>small { font-size:var(--dkwp-f-9_5,9.5px); font-weight:650; line-height:1.35; opacity:.5; }

.dk-wp3-pronoun-reference { background:linear-gradient(180deg,#fff 0%,#fcf9ff 100%); }
.dk-wp3-pronoun-current { display:grid; grid-template-columns:minmax(190px,.8fr) minmax(0,1.2fr); gap:12px; align-items:center; margin-bottom:12px; padding:12px 14px; border:2px solid var(--dkwp-ink); border-radius:11px; background:#f3eaff; box-shadow:2px 2px 0 var(--dkwp-ink); }
.dk-wp3-pronoun-current>div { min-width:0; display:flex; flex-direction:column; gap:3px; }
.dk-wp3-pronoun-current span { font-family:'Fira Code',ui-monospace,monospace; font-size:var(--dkwp-f-9,9px); font-weight:550; text-transform:uppercase; letter-spacing:.04em; opacity:.48; }
.dk-wp3-pronoun-current strong { overflow-wrap:anywhere; font-size:var(--dkwp-f-13_5,13.5px); font-weight:900; line-height:1.35; }
.dk-wp3-pronoun-current p { margin:0; font-size:var(--dkwp-f-11_5,11.5px); font-weight:650; line-height:1.55; opacity:.62; }

.dk-wp3-pronoun-table-wrap { width:100%; overflow-x:auto; border:2px solid var(--dkwp-ink); border-radius:12px; background:var(--dkwp-paper); box-shadow:3px 3px 0 var(--dkwp-ink); scrollbar-width:thin; }
.dk-wp3-pronoun-table-wrap:focus-visible { outline:3px solid var(--dkwp-viol-deep); outline-offset:3px; }
.dk-wp3-pronoun-table { min-width:655px; }
.dk-wp3-pronoun-head,.dk-wp3-pronoun-row { display:grid; grid-template-columns:128px repeat(4,minmax(112px,1fr)); }
.dk-wp3-pronoun-head { min-height:58px; border-bottom:2px solid var(--dkwp-ink); background:var(--dkwp-mist); }
.dk-wp3-pronoun-person-head,.dk-wp3-pronoun-case-head { display:flex; flex-direction:column; justify-content:center; gap:2px; padding:8px 10px; border-left:1.5px solid rgba(21,22,23,.16); }
.dk-wp3-pronoun-person-head { border-left:0; font-family:'Fira Code',ui-monospace,monospace; font-size:var(--dkwp-f-9_5,9.5px); font-weight:600; text-transform:uppercase; letter-spacing:.04em; opacity:.55; }
.dk-wp3-pronoun-case-head strong { font-size:var(--dkwp-f-9_5,9.5px); font-weight:600; }
.dk-wp3-pronoun-case-head small { font-size:var(--dkwp-f-8_5,8.5px); font-weight:650; opacity:.5; }
.dk-wp3-pronoun-case-head:nth-child(3) { background:#fff1ef; }
.dk-wp3-pronoun-case-head:nth-child(4) { background:#fff8df; }
.dk-wp3-pronoun-case-head:nth-child(5) { background:#eef7ff; }
.dk-wp3-pronoun-row { min-height:56px; border-top:1.5px solid rgba(21,22,23,.16); }
.dk-wp3-pronoun-row:first-of-type { border-top:0; }
.dk-wp3-pronoun-person { min-width:0; display:flex; flex-direction:column; justify-content:center; gap:2px; padding:9px 10px; background:#fbfaf9; }
.dk-wp3-pronoun-person strong { font-size:var(--dkwp-f-13,13px); font-weight:900; }
.dk-wp3-pronoun-person small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:var(--dkwp-f-8_8,8.8px); font-weight:650; opacity:.48; }
.dk-wp3-pronoun-cell { position:relative; min-width:0; border:0; border-left:1.5px solid rgba(21,22,23,.16); background:var(--dkwp-paper); padding:8px 9px; cursor:pointer; font-size:var(--dkwp-f-13,13px); font-weight:850; text-align:center; transition:background-color var(--dkwp-t) ease,transform var(--dkwp-t) var(--dkwp-ease),box-shadow var(--dkwp-t) var(--dkwp-ease); }
.dk-wp3-pronoun-cell:hover { z-index:1; background:var(--dkwp-mist); box-shadow:inset 0 0 0 2px var(--dkwp-ink); }
.dk-wp3-pronoun-cell.is-current { z-index:2; box-shadow:inset 0 0 0 2.5px var(--dkwp-ink); }
.dk-wp3-pronoun-cell.is-current[data-case="nom"] { background:#eee8ff; }
.dk-wp3-pronoun-cell.is-current[data-case="akk"] { background:#ffdeda; }
.dk-wp3-pronoun-cell.is-current[data-case="dat"] { background:#fff0ba; }
.dk-wp3-pronoun-cell.is-current[data-case="gen"] { background:#dff1ff; }

.dk-wp3-reference-cta { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:14px; margin-top:14px; padding:14px 15px; border:2px solid rgba(21,22,23,.22); border-radius:11px; background:var(--dkwp-mist); }
.dk-wp3-reference-cta>div { min-width:0; }
.dk-wp3-reference-cta span { display:block; margin-bottom:3px; font-size:var(--dkwp-f-8_8,8.8px); opacity:.5; }
.dk-wp3-reference-cta strong { display:block; font-size:var(--dkwp-f-13_5,13.5px); font-weight:900; line-height:1.35; }
.dk-wp3-reference-cta p { margin:3px 0 0; font-size:var(--dkwp-f-10_5,10.5px); font-weight:650; line-height:1.45; opacity:.54; }
.dk-wp3-reference-cta .dk-wp3-btn { white-space:nowrap; background:var(--dkwp-viol-soft) !important; }
.dk-wp3-reference-cta .dk-wp3-btn:hover { background:var(--dkwp-peach) !important; }
.dk-wp3-pronoun-level-strip .dk-wp3-tense-chip.is-active { background:#eadcff; }

@media (max-width:680px){
  .dk-wp3-pronoun-facts { grid-template-columns:1fr 1fr; }
  .dk-wp3-pronoun-fact:last-child { grid-column:1/-1; }
  .dk-wp3-pronoun-current { grid-template-columns:1fr; gap:6px; }
  .dk-wp3-reference-cta { grid-template-columns:1fr; }
  .dk-wp3-reference-cta .dk-wp3-btn { width:100%; }
}

@media (max-width:480px){
  .dk-wp3-pronoun-facts { grid-template-columns:1fr; }
  .dk-wp3-pronoun-fact:last-child { grid-column:auto; }
  .dk-wp3-pronoun-current { padding:11px 12px; }
  .dk-wp3-pronoun-table { min-width:620px; }
  .dk-wp3-pronoun-head,.dk-wp3-pronoun-row { grid-template-columns:112px repeat(4,minmax(104px,1fr)); }
}

/* Phase 4.5 — Präposition: selected Kasus logic + four-family reference map */
#kelime-penceresi.dk-wp3-active[data-dkwp-type="preposition"] .popup-header,
#kelime-penceresi.dk-wp3-pending[data-dkwp-type="preposition"] .popup-header { background:#d9f4f1 !important; }
.dk-wp3-hero--preposition::after { background:#bfeae5; }

.dk-wp3-prep-facts { position:relative; z-index:1; display:grid; grid-template-columns:minmax(120px,.55fr) minmax(150px,.65fr) minmax(0,1.8fr); gap:8px; margin-top:16px; }
.dk-wp3-prep-fact { min-width:0; display:flex; flex-direction:column; gap:3px; padding:11px 12px; border:2px solid rgba(21,22,23,.2); border-radius:10px; background:var(--dkwp-mist); }
.dk-wp3-prep-fact[data-prep-case="akk"] { background:#fff0e7; }
.dk-wp3-prep-fact[data-prep-case="dat"] { background:#fff7d9; }
.dk-wp3-prep-fact[data-prep-case="wechsel"] { background:#e9f6ff; }
.dk-wp3-prep-fact[data-prep-case="gen"] { background:#e9f8ef; }
.dk-wp3-prep-fact>span { font-family:'Fira Code',ui-monospace,monospace; font-size:var(--dkwp-f-9,9px); font-weight:600; text-transform:uppercase; letter-spacing:.04em; opacity:.48; }
.dk-wp3-prep-fact>strong { overflow-wrap:anywhere; font-size:var(--dkwp-f-13,13px); line-height:1.35; font-weight:900; }
.dk-wp3-prep-fact>small { font-size:var(--dkwp-f-9_5,9.5px); font-weight:650; line-height:1.35; opacity:.5; }
.dk-wp3-prep-fact--rule strong { font-size:var(--dkwp-f-11_5,11.5px); line-height:1.5; }

.dk-wp3-prep-grammar { background:linear-gradient(180deg,#fff 0%,#fcfffe 100%); }
.dk-wp3-prep-rule { display:grid; grid-template-columns:110px minmax(0,1fr); gap:12px; align-items:start; margin-bottom:12px; padding:12px 14px; border:2px solid rgba(21,22,23,.18); border-radius:11px; background:#f2fbf9; }
.dk-wp3-prep-rule>span { padding-top:2px; font-size:var(--dkwp-f-9,9px); opacity:.5; }
.dk-wp3-prep-rule>p { margin:0; font-size:var(--dkwp-f-13,13px); font-weight:700; line-height:1.65; }
.dk-wp3-prep-case-grid { display:grid; grid-template-columns:1fr; gap:10px; }
.dk-wp3-prep-case-grid.is-wechsel { grid-template-columns:repeat(2,minmax(0,1fr)); }
.dk-wp3-prep-case-card { min-width:0; padding:14px; border:2px solid var(--dkwp-ink); border-radius:12px; background:var(--dkwp-paper); box-shadow:3px 3px 0 var(--dkwp-ink); }
.dk-wp3-prep-case-card[data-prep-case="akk"] { background:#fff7f1; }
.dk-wp3-prep-case-card[data-prep-case="dat"] { background:#fffbeb; }
.dk-wp3-prep-case-card[data-prep-case="gen"] { background:#f2fbf5; }
.dk-wp3-prep-case-top { display:flex; align-items:baseline; justify-content:space-between; gap:10px; padding-bottom:10px; border-bottom:1.5px solid rgba(21,22,23,.14); }
.dk-wp3-prep-case-top>span { font-size:var(--dkwp-f-10,10px); opacity:.58; }
.dk-wp3-prep-case-top>strong { font-size:var(--dkwp-f-14,14px); font-weight:900; text-align:right; }
.dk-wp3-prep-case-card>p { margin:11px 0 0; font-size:var(--dkwp-f-12_5,12.5px); font-weight:700; line-height:1.55; }
.dk-wp3-prep-article { display:flex; flex-direction:column; gap:3px; margin-top:11px; padding:9px 10px; border:1.5px solid rgba(21,22,23,.16); border-radius:9px; background:rgba(255,255,255,.65); }
.dk-wp3-prep-article>span { font-family:'Fira Code',ui-monospace,monospace; font-size:var(--dkwp-f-8_8,8.8px); text-transform:uppercase; letter-spacing:.04em; opacity:.46; }
.dk-wp3-prep-article>strong { font-size:var(--dkwp-f-11,11px); font-weight:800; line-height:1.45; overflow-wrap:anywhere; }
.dk-wp3-prep-case-example { margin-top:10px !important; }
.dk-wp3-prep-explain { margin-top:12px; }

.dk-wp3-prep-contractions { margin-top:14px; padding-top:14px; border-top:1.5px dashed rgba(21,22,23,.22); }
.dk-wp3-prep-subhead { display:flex; align-items:baseline; gap:9px; margin-bottom:9px; }
.dk-wp3-prep-subhead span { font-size:var(--dkwp-f-9,9px); opacity:.48; }
.dk-wp3-prep-subhead strong { font-size:var(--dkwp-f-13,13px); font-weight:900; }
.dk-wp3-prep-contract-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.dk-wp3-prep-contract { min-width:0; padding:11px 12px; border:2px solid rgba(21,22,23,.18); border-radius:10px; background:var(--dkwp-mist); }
.dk-wp3-prep-contract-form { display:flex; align-items:baseline; gap:6px; flex-wrap:wrap; }
.dk-wp3-prep-contract-form strong { font-size:var(--dkwp-f-16,16px); font-weight:950; }
.dk-wp3-prep-contract-form span { font-size:var(--dkwp-f-10_5,10.5px); font-weight:750; opacity:.55; }
.dk-wp3-prep-contract-example { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:start; margin-top:8px; padding-top:8px; border-top:1.5px solid rgba(21,22,23,.12); }
.dk-wp3-prep-contract-example .dk-wp3-de { font-size:var(--dkwp-f-12_5,12.5px); }
.dk-wp3-prep-contract-example .dk-wp3-tr { font-size:var(--dkwp-f-10_5,10.5px); }

.dk-wp3-prep-level-strip .dk-wp3-tense-chip.is-active { background:#ccefeb; }

.dk-wp3-prep-reference { background:linear-gradient(180deg,#fff 0%,#fbfefd 100%); }
.dk-wp3-prep-group-strip { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-bottom:12px; }
.dk-wp3-prep-group { min-width:0; display:flex; flex-direction:column; align-items:flex-start; gap:2px; padding:10px 11px; border:2px solid rgba(21,22,23,.2); border-radius:10px; background:var(--dkwp-paper); color:var(--dkwp-ink); cursor:pointer; transition:transform var(--dkwp-t) var(--dkwp-ease),box-shadow var(--dkwp-t) var(--dkwp-ease),background-color var(--dkwp-t) ease; }
.dk-wp3-prep-group:hover { transform:translate(-1px,-1px); box-shadow:3px 3px 0 var(--dkwp-ink); }
.dk-wp3-prep-group.is-active { border-color:var(--dkwp-ink); box-shadow:2px 2px 0 var(--dkwp-ink); }
.dk-wp3-prep-group[data-dkwp-prep-group="akk"].is-active { background:#ffe5d5; }
.dk-wp3-prep-group[data-dkwp-prep-group="dat"].is-active { background:#fff1bd; }
.dk-wp3-prep-group[data-dkwp-prep-group="wechsel"].is-active { background:#dff2ff; }
.dk-wp3-prep-group[data-dkwp-prep-group="gen"].is-active { background:#dff5e6; }
.dk-wp3-prep-group strong { font-size:var(--dkwp-f-11_5,11.5px); font-weight:900; }
.dk-wp3-prep-group small { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:var(--dkwp-f-8_8,8.8px); font-weight:650; opacity:.5; }
.dk-wp3-prep-ref-panel { display:none; }
.dk-wp3-prep-ref-panel.is-active { display:block; }
.dk-wp3-prep-ref-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.dk-wp3-prep-ref-item { position:relative; min-width:0; display:grid; grid-template-columns:auto minmax(0,1fr); grid-template-areas:'word tr' 'meta meta'; align-items:baseline; column-gap:8px; row-gap:3px; padding:10px 11px; border:2px solid rgba(21,22,23,.16); border-radius:10px; background:var(--dkwp-paper); color:var(--dkwp-ink); text-align:left; cursor:pointer; transition:transform var(--dkwp-t) var(--dkwp-ease),box-shadow var(--dkwp-t) var(--dkwp-ease),background-color var(--dkwp-t) ease; }
.dk-wp3-prep-ref-item:hover { z-index:1; transform:translate(-1px,-1px); box-shadow:3px 3px 0 var(--dkwp-ink); background:var(--dkwp-mist); }
.dk-wp3-prep-ref-item.is-current { border-color:var(--dkwp-ink); box-shadow:2px 2px 0 var(--dkwp-ink); background:#e7f7f4; }
.dk-wp3-prep-ref-word { grid-area:word; font-size:var(--dkwp-f-13_5,13.5px); font-weight:950; }
.dk-wp3-prep-ref-tr { grid-area:tr; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:var(--dkwp-f-10,10px); font-weight:650; opacity:.58; }
.dk-wp3-prep-ref-item small { grid-area:meta; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-family:'Fira Code',ui-monospace,monospace; font-size:var(--dkwp-f-8,8px); font-weight:550; opacity:.46; }
.dk-wp3-prep-ref-item i { position:absolute; right:7px; top:6px; padding:2px 5px; border-radius:999px; background:var(--dkwp-ink); color:#fff; font-family:'Fira Code',ui-monospace,monospace; font-size:var(--dkwp-f-6_5,6.5px); font-style:normal; text-transform:uppercase; letter-spacing:.04em; }
.dk-wp3-prep-wechsel-note { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:10px; }
.dk-wp3-prep-wechsel-note>div { display:flex; flex-direction:column; gap:3px; padding:10px 11px; border:2px solid rgba(21,22,23,.17); border-radius:10px; }
.dk-wp3-prep-wechsel-note>div:first-child { background:#fff1e7; }
.dk-wp3-prep-wechsel-note>div:last-child { background:#fff8d8; }
.dk-wp3-prep-wechsel-note span { font-size:var(--dkwp-f-9,9px); opacity:.5; }
.dk-wp3-prep-wechsel-note strong { font-size:var(--dkwp-f-11_5,11.5px); font-weight:900; line-height:1.4; }
.dk-wp3-prep-reference .dk-wp3-reference-cta .dk-wp3-btn { background:#ccefeb !important; }
.dk-wp3-prep-reference .dk-wp3-reference-cta .dk-wp3-btn:hover { background:var(--dkwp-peach) !important; }
/* ─────────────────────────────────────────────────────────────
   Wechselpräpositionen Görsel Hafıza Galerisi (Temiz, Tek Parça Tasarım)
   ───────────────────────────────────────────────────────────── */
.dk-wp3-prep-gallery-card {
  margin-top: 14px;
  padding: 14px;
  background: #ffffff;
  border: 2px solid var(--dkwp-ink, #151617);
  border-radius: 14px;
  box-shadow: 3px 3px 0 var(--dkwp-ink, #151617);
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.dk-wp3-prep-gallery-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.dk-wp3-prep-gallery-header .dk-wp3-kicker {
  font-size: var(--dkwp-f-11, 11px) !important;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--dkwp-ink, #151617);
  opacity: 0.65;
  margin-bottom: 2px;
}

.dk-wp3-prep-gallery-heading {
  margin: 0;
  font-size: var(--dkwp-f-16, 16px) !important;
  font-weight: 850;
  color: var(--dkwp-ink, #151617);
  letter-spacing: -0.015em;
  line-height: 1.25;
}

/* Edat Butonları: Kutucuk içinde kutucuk hissi yaratmayan zarif haplar */
.dk-wp3-prep-gallery-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding: 2px 0;
}

.dk-wp3-prep-gallery-pill {
  appearance: none;
  -webkit-appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1.5px solid var(--dkwp-ink, #151617);
  border-radius: 999px;
  background: #ffffff;
  padding: 0.35em 0.85em;
  font-size: var(--dkwp-f-13, 13px) !important;
  font-weight: 750;
  color: var(--dkwp-ink, #151617);
  cursor: pointer;
  box-shadow: 1.5px 1.5px 0 var(--dkwp-ink, #151617);
  transition: transform 0.1s ease, box-shadow 0.1s ease, background 0.1s ease;
  line-height: 1.2;
}

.dk-wp3-prep-gallery-pill:hover:not(.is-active) {
  background: #f4f0ff;
  transform: translate(-0.5px, -0.5px);
  box-shadow: 2px 2px 0 var(--dkwp-ink, #151617);
}

.dk-wp3-prep-gallery-pill.is-active {
  background: var(--dkwp-peach, #ffbe98) !important;
  transform: translate(-1px, -1px);
  box-shadow: 2.5px 2.5px 0 var(--dkwp-ink, #151617) !important;
  font-weight: 900;
}

/* Sahne: Çökme / açılıp kapanma yapmayan sabit oranlı görsel alanı */
.dk-wp3-prep-gallery-stage {
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.dk-wp3-prep-gallery-frame {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
  min-height: 260px;
  max-height: 420px;
  border-radius: 12px;
  overflow: hidden;
  border: 2px solid var(--dkwp-ink, #151617);
  background: #111112;
  box-shadow: 3px 3px 0 var(--dkwp-ink, #151617);
  display: flex;
  flex-direction: column;
}

.dk-wp3-prep-gallery-image {
  width: 100%;
  height: 100%;
  flex: 1;
  min-height: 0;
  object-fit: cover;
  display: block;
  background: #202124;
}



@media (max-width:680px){
  .dk-wp3-prep-facts { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dk-wp3-prep-fact--rule { grid-column:1/-1; }
  .dk-wp3-prep-case-grid.is-wechsel { grid-template-columns:1fr; }
  .dk-wp3-prep-contract-grid { grid-template-columns:1fr; }
  .dk-wp3-prep-group-strip { display:flex; overflow-x:auto; padding:2px 2px 7px; scrollbar-width:thin; }
  .dk-wp3-prep-group { flex:0 0 132px; }
}

@media (max-width:480px){
  .dk-wp3-prep-facts { grid-template-columns:1fr; }
  .dk-wp3-prep-fact--rule { grid-column:auto; }
  .dk-wp3-prep-rule { grid-template-columns:1fr; gap:5px; }
  .dk-wp3-prep-case-top { flex-direction:column; gap:3px; }
  .dk-wp3-prep-case-top>strong { text-align:left; }
  .dk-wp3-prep-ref-grid { grid-template-columns:1fr; }
  .dk-wp3-prep-wechsel-note { grid-template-columns:1fr; }
  .dk-wp3-prep-contract-example { grid-template-columns:1fr; }
  .dk-wp3-prep-contract-example .dk-wp3-icon-btn { justify-self:start; }
}


/* Phase 4.6 — Konjunktion: three-family syntax system + verb-position map */
#kelime-penceresi.dk-wp3-active[data-dkwp-type="conjunction"] .popup-header,
#kelime-penceresi.dk-wp3-pending[data-dkwp-type="conjunction"] .popup-header { background:#eadfff !important; }
.dk-wp3-hero--conjunction::after { background:#d6c5ff; }

.dk-wp3-conj-facts { position:relative; z-index:1; display:grid; grid-template-columns:minmax(145px,.75fr) minmax(145px,.8fr) minmax(0,1.35fr); gap:8px; margin-top:16px; }
.dk-wp3-conj-fact { min-width:0; display:flex; flex-direction:column; gap:3px; padding:11px 12px; border:2px solid rgba(21,22,23,.2); border-radius:10px; background:var(--dkwp-mist); }
.dk-wp3-conj-fact[data-conj-group="konj"] { background:#f3efff; }
.dk-wp3-conj-fact[data-conj-group="kadv"] { background:#fff0e5; }
.dk-wp3-conj-fact[data-conj-group="subj"] { background:#e9f4ff; }
.dk-wp3-conj-fact>span { font-family:'Fira Code',ui-monospace,monospace; font-size:var(--dkwp-f-9,9px); font-weight:600; text-transform:uppercase; letter-spacing:.04em; opacity:.48; }
.dk-wp3-conj-fact>strong { overflow-wrap:anywhere; font-size:var(--dkwp-f-13,13px); line-height:1.35; font-weight:900; }
.dk-wp3-conj-fact>small { font-size:var(--dkwp-f-9_5,9.5px); font-weight:650; line-height:1.35; opacity:.5; }
.dk-wp3-conj-fact--effect strong { font-size:var(--dkwp-f-11_5,11.5px); line-height:1.5; }

.dk-wp3-conj-syntax { background:linear-gradient(180deg,#fff 0%,#fcfaff 100%); }
.dk-wp3-conj-lane { display:flex; align-items:stretch; gap:7px; overflow-x:auto; padding:3px 3px 9px; scrollbar-width:thin; }
.dk-wp3-conj-lane>i { flex:0 0 auto; align-self:center; color:rgba(21,22,23,.38); font-size:var(--dkwp-f-15,15px); font-style:normal; font-weight:900; }
.dk-wp3-conj-token { flex:0 0 auto; min-width:86px; display:flex; flex-direction:column; justify-content:center; gap:3px; padding:10px 11px; border:2px solid rgba(21,22,23,.18); border-radius:10px; background:var(--dkwp-paper); }
.dk-wp3-conj-token small { min-height:11px; font-family:'Fira Code',ui-monospace,monospace; font-size:var(--dkwp-f-7_5,7.5px); font-weight:600; text-transform:uppercase; letter-spacing:.04em; opacity:.42; }
.dk-wp3-conj-token strong { font-size:var(--dkwp-f-11_5,11.5px); font-weight:900; white-space:nowrap; }
.dk-wp3-conj-token[data-kind="connector"] { border-color:var(--dkwp-ink); background:#eadfff; box-shadow:2px 2px 0 var(--dkwp-ink); }
.dk-wp3-conj-token[data-kind="verb-v2"] { background:#f3efff; }
.dk-wp3-conj-token[data-kind="verb-now"] { border-color:var(--dkwp-ink); background:#ffe0cd; box-shadow:2px 2px 0 var(--dkwp-ink); }
.dk-wp3-conj-token[data-kind="verb-end"] { border-color:var(--dkwp-ink); background:#dff0ff; box-shadow:2px 2px 0 var(--dkwp-ink); }
.dk-wp3-conj-token[data-kind="punct"] { min-width:30px; align-items:center; padding-inline:7px; background:transparent; border-style:dashed; }
.dk-wp3-conj-rule { display:grid; grid-template-columns:110px minmax(0,1fr); gap:12px; align-items:start; margin-top:10px; padding:12px 14px; border:2px solid rgba(21,22,23,.18); border-radius:11px; background:#f8f5ff; }
.dk-wp3-conj-rule>span { padding-top:2px; font-size:var(--dkwp-f-9,9px); opacity:.5; }
.dk-wp3-conj-rule>p { margin:0; font-size:var(--dkwp-f-13,13px); font-weight:700; line-height:1.65; }
.dk-wp3-conj-schema { display:grid; grid-template-columns:110px minmax(0,1fr); gap:12px; align-items:start; margin-top:8px; padding:11px 14px; border:1.5px dashed rgba(21,22,23,.28); border-radius:10px; background:var(--dkwp-paper); }
.dk-wp3-conj-schema>span { padding-top:2px; font-size:var(--dkwp-f-9,9px); opacity:.5; }
.dk-wp3-conj-schema code { overflow-wrap:anywhere; white-space:normal; font-family:'Fira Code',ui-monospace,monospace; font-size:var(--dkwp-f-10_5,10.5px); font-weight:600; line-height:1.55; color:var(--dkwp-ink); }
.dk-wp3-conj-explain { margin-top:10px; }
.dk-wp3-conj-level-strip .dk-wp3-tense-chip.is-active { background:#e4d7ff; }

.dk-wp3-conj-reference { background:linear-gradient(180deg,#fff 0%,#fdfbff 100%); }
.dk-wp3-conj-group-strip { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-bottom:12px; }
.dk-wp3-conj-group { min-width:0; display:flex; flex-direction:column; align-items:flex-start; gap:2px; padding:10px 11px; border:2px solid rgba(21,22,23,.2); border-radius:10px; background:var(--dkwp-paper); color:var(--dkwp-ink); cursor:pointer; transition:transform var(--dkwp-t) var(--dkwp-ease),box-shadow var(--dkwp-t) var(--dkwp-ease),background-color var(--dkwp-t) ease; }
.dk-wp3-conj-group:hover { transform:translate(-1px,-1px); box-shadow:3px 3px 0 var(--dkwp-ink); }
.dk-wp3-conj-group.is-active { border-color:var(--dkwp-ink); box-shadow:2px 2px 0 var(--dkwp-ink); }
.dk-wp3-conj-group[data-dkwp-conj-group="konj"].is-active { background:#eee7ff; }
.dk-wp3-conj-group[data-dkwp-conj-group="kadv"].is-active { background:#ffe5d5; }
.dk-wp3-conj-group[data-dkwp-conj-group="subj"].is-active { background:#dff0ff; }
.dk-wp3-conj-group strong { font-size:var(--dkwp-f-11_5,11.5px); font-weight:900; }
.dk-wp3-conj-group small { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:var(--dkwp-f-8_8,8.8px); font-weight:650; opacity:.5; }
.dk-wp3-conj-ref-panel { display:none; }
.dk-wp3-conj-ref-panel.is-active { display:block; }
.dk-wp3-conj-family-rule { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:10px; padding:9px 11px; border:1.5px dashed rgba(21,22,23,.24); border-radius:9px; background:var(--dkwp-mist); }
.dk-wp3-conj-family-rule span { flex:0 0 auto; font-size:var(--dkwp-f-8_5,8.5px); opacity:.5; }
.dk-wp3-conj-family-rule strong { min-width:0; font-size:var(--dkwp-f-10_5,10.5px); font-weight:800; line-height:1.45; text-align:right; }
.dk-wp3-conj-ref-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.dk-wp3-conj-ref-item { position:relative; min-width:0; display:grid; grid-template-columns:auto minmax(0,1fr); align-items:baseline; gap:8px; padding:10px 11px; border:2px solid rgba(21,22,23,.16); border-radius:10px; background:var(--dkwp-paper); color:var(--dkwp-ink); text-align:left; cursor:pointer; transition:transform var(--dkwp-t) var(--dkwp-ease),box-shadow var(--dkwp-t) var(--dkwp-ease),background-color var(--dkwp-t) ease; }
.dk-wp3-conj-ref-item:hover { z-index:1; transform:translate(-1px,-1px); box-shadow:3px 3px 0 var(--dkwp-ink); background:var(--dkwp-mist); }
.dk-wp3-conj-ref-item.is-current { border-color:var(--dkwp-ink); box-shadow:2px 2px 0 var(--dkwp-ink); background:#eee7ff; }
.dk-wp3-conj-ref-word { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:var(--dkwp-f-13,13px); font-weight:950; }
.dk-wp3-conj-ref-tr { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:var(--dkwp-f-9_8,9.8px); font-weight:650; opacity:.56; }
.dk-wp3-conj-ref-item i { position:absolute; right:7px; top:5px; padding:2px 5px; border-radius:999px; background:var(--dkwp-ink); color:#fff; font-family:'Fira Code',ui-monospace,monospace; font-size:var(--dkwp-f-6_5,6.5px); font-style:normal; text-transform:uppercase; letter-spacing:.04em; }
.dk-wp3-conj-reference .dk-wp3-reference-cta .dk-wp3-btn { background:#e0d2ff !important; }
.dk-wp3-conj-reference .dk-wp3-reference-cta .dk-wp3-btn:hover { background:var(--dkwp-peach) !important; }

@media (max-width:680px){
  .dk-wp3-conj-facts { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dk-wp3-conj-fact--effect { grid-column:1/-1; }
  .dk-wp3-conj-group-strip { display:flex; overflow-x:auto; padding:2px 2px 7px; scrollbar-width:thin; }
  .dk-wp3-conj-group { flex:0 0 170px; }
}

@media (max-width:480px){
  .dk-wp3-conj-facts { grid-template-columns:1fr; }
  .dk-wp3-conj-fact--effect { grid-column:auto; }
  .dk-wp3-conj-rule,.dk-wp3-conj-schema { grid-template-columns:1fr; gap:5px; }
  .dk-wp3-conj-family-rule { align-items:flex-start; flex-direction:column; gap:4px; }
  .dk-wp3-conj-family-rule strong { text-align:left; }
  .dk-wp3-conj-ref-grid { grid-template-columns:1fr; }
}


/* =========================================================
   DeuKlar Lesson / Reference Shell
   Shared by Personalpronomen, Präpositionen and Konjunktionen.
   ========================================================= */
.dk-lesson-overlay{--dkwp-ink:#151617;--dkwp-paper:#fff;--dkwp-cream:#f5f2f0;--dkwp-mist:#f7f5ff;--dkwp-viol:#b09cfb;--dkwp-viol-soft:#c1b3ff;--dkwp-peach:#ffbe98;--dkwp-green:#38d794;--dkwp-sky:#a5d8ff;--dkwp-red:#e63213;--dkwp-warn:#ffd98a;--dkwp-r:14px;--dkwp-t:.16s;position:fixed;inset:0;z-index:2147483646;display:none;align-items:center;justify-content:center;padding:clamp(12px,3vw,32px);background:rgba(21,22,23,.48);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--dkwp-ink);font-family:'Geist','Nunito',Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif}
.dk-lesson-overlay.is-open{display:flex}.dk-lesson-overlay *{box-sizing:border-box}
.dk-lesson-shell{width:min(1120px,96vw);height:min(900px,91vh);min-height:520px;display:grid;grid-template-rows:auto auto minmax(0,1fr);overflow:hidden;border:2.5px solid var(--dkwp-ink);border-radius:22px;background:var(--dkwp-cream);box-shadow:9px 9px 0 var(--dkwp-ink)}
.dk-lesson-header{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding:22px 24px 18px;border-bottom:2px solid var(--dkwp-ink);background:var(--dkwp-paper)}.dk-lesson-heading{min-width:0;max-width:800px}.dk-lesson-eyebrow,.dk-lesson-code,.dk-lesson-mini-title{font-family:'Fira Code',ui-monospace,SFMono-Regular,Consolas,monospace}.dk-lesson-eyebrow{margin-bottom:5px;font-size:var(--dkwp-f-10_5,10.5px);font-weight:650;letter-spacing:.075em;text-transform:uppercase;opacity:.55}.dk-lesson-heading h2{margin:0;font-size:var(--dkwp-f-34,34px);line-height:1.08;letter-spacing:-.04em;font-weight:900}.dk-lesson-heading p{margin:8px 0 0;max-width:760px;font-size:var(--dkwp-f-14,14px);line-height:1.58;font-weight:600;opacity:.62}
.dk-lesson-close,.dk-lesson-icon-btn{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;border:2px solid var(--dkwp-ink);background:var(--dkwp-paper);color:var(--dkwp-ink);box-shadow:2px 2px 0 var(--dkwp-ink);cursor:pointer;transition:transform var(--dkwp-t),box-shadow var(--dkwp-t),background-color var(--dkwp-t)}.dk-lesson-close{width:42px;height:42px;border-radius:11px}.dk-lesson-close svg,.dk-lesson-icon-btn svg{width:18px;height:18px;fill:currentColor}.dk-lesson-close:hover,.dk-lesson-icon-btn:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--dkwp-ink);background:var(--dkwp-peach)}
.dk-lesson-actions{display:inline-flex;align-items:center;gap:12px;flex:0 0 auto}
.dk-lesson-overlay .dk-wp3-font-controls{display:inline-grid;grid-template-columns:28px 24px 28px;align-items:center;height:38px;padding:2px;border:2px solid var(--dkwp-ink);border-radius:10px;background:rgba(255,255,255,.85);box-shadow:2px 2px 0 var(--dkwp-ink);overflow:hidden;cursor:default;user-select:none}
.dk-lesson-overlay .dk-wp3-font-step{width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;border-radius:7px;background:transparent;color:var(--dkwp-ink);font:900 19px/1 'Geist','Nunito',ui-sans-serif,system-ui,sans-serif;cursor:pointer;transition:background-color var(--dkwp-t) ease,transform var(--dkwp-t) var(--dkwp-ease)}
.dk-lesson-overlay .dk-wp3-font-step:active:not(:disabled){transform:translateY(1px)}
.dk-lesson-overlay .dk-wp3-font-step:disabled{opacity:.28;cursor:not-allowed}
.dk-lesson-overlay .dk-wp3-font-step:focus-visible{outline:2px solid var(--dkwp-viol-deep,#7b61ff);outline-offset:1px}
.dk-lesson-overlay .dk-wp3-font-status{display:inline-flex;align-items:center;justify-content:center;height:26px;border-left:1.5px solid rgba(21,22,23,.18);border-right:1.5px solid rgba(21,22,23,.18);color:var(--dkwp-ink);font:800 12px/1 'Fira Code',monospace;letter-spacing:.05em;opacity:.85}
.dk-lesson-tabs{display:flex;gap:6px;overflow-x:auto;padding:10px 14px;border-bottom:2px solid var(--dkwp-ink);background:var(--dkwp-mist);scrollbar-width:thin}.dk-lesson-tab{flex:0 0 auto;min-height:38px;padding:8px 13px;border:2px solid transparent;border-radius:10px;background:transparent;color:var(--dkwp-ink);cursor:pointer;font-size:var(--dkwp-f-12,12px);font-weight:850;white-space:nowrap}.dk-lesson-tab:hover{background:var(--dkwp-paper);border-color:rgba(21,22,23,.2)}.dk-lesson-tab.is-active{border-color:var(--dkwp-ink);background:var(--dkwp-viol-soft);box-shadow:2px 2px 0 var(--dkwp-ink)}.dk-lesson-overlay[data-variant="preposition"] .dk-lesson-tab.is-active{background:var(--dkwp-peach)}.dk-lesson-overlay[data-variant="pronoun"] .dk-lesson-tab.is-active{background:var(--dkwp-sky)}
.dk-lesson-content{min-height:0;overflow:auto;padding:22px;outline:none;scroll-behavior:smooth}.dk-lesson-hero-card{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:16px;padding:18px 20px;border:2px solid var(--dkwp-ink);border-radius:14px;background:var(--dkwp-paper);box-shadow:4px 4px 0 var(--dkwp-ink)}.dk-lesson-hero-card--syntax{background:linear-gradient(135deg,var(--dkwp-paper),#f0edff)}.dk-lesson-hero-card--prep{background:linear-gradient(135deg,var(--dkwp-paper),#fff1e7)}.dk-lesson-hero-card--pronoun{background:linear-gradient(135deg,var(--dkwp-paper),#eef8ff)}.dk-lesson-hero-card h3{margin:4px 0 0;font-size:var(--dkwp-f-21,21px);line-height:1.2;letter-spacing:-.025em;font-weight:900}.dk-lesson-hero-card p{max-width:470px;margin:2px 0 0;font-size:var(--dkwp-f-13,13px);line-height:1.55;font-weight:600;opacity:.63;text-align:right}.dk-lesson-code{display:inline-block;font-size:var(--dkwp-f-10,10px);font-weight:650;letter-spacing:.035em;opacity:.55}
.dk-lesson-intro{margin-bottom:16px;padding:16px 18px;border:2px solid rgba(21,22,23,.18);border-radius:12px;background:var(--dkwp-paper)}.dk-lesson-rich{font-size:var(--dkwp-f-13_5,13.5px);line-height:1.68;font-weight:600}.dk-lesson-rich strong{font-weight:900}.dk-lesson-rich em{font-style:italic}.dk-lesson-rich u{text-underline-offset:2px}.dk-lesson-card-grid,.dk-lesson-case-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}.dk-lesson-card{min-width:0;overflow:hidden;border:2px solid var(--dkwp-ink);border-radius:14px;background:var(--dkwp-paper)}.dk-lesson-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:15px 16px 13px;border-bottom:1.5px solid rgba(21,22,23,.15);background:var(--dkwp-mist)}.dk-lesson-card-head h3{margin:3px 0 0;font-size:var(--dkwp-f-20,20px);line-height:1.15;font-weight:900;letter-spacing:-.02em}.dk-lesson-meaning-pill{max-width:50%;padding:5px 8px;border:1.5px solid rgba(21,22,23,.25);border-radius:999px;background:var(--dkwp-paper);font-size:var(--dkwp-f-10_5,10.5px);line-height:1.3;font-weight:800;text-align:right}.dk-lesson-conj-card>.dk-lesson-rich{padding:14px 16px 2px}
.dk-lesson-form-word,.dk-lesson-word{margin:0;padding:0;border:0;background:transparent;color:inherit;font:inherit;cursor:pointer}.dk-lesson-form-word{font-weight:900;border-bottom:2px solid currentColor}.dk-lesson-word{display:inline;border-radius:4px;text-decoration:underline dotted rgba(21,22,23,.35);text-underline-offset:3px}.dk-lesson-word:hover,.dk-lesson-word:focus-visible{background:var(--dkwp-warn);text-decoration:none;outline:2px solid var(--dkwp-ink);outline-offset:1px}.dk-lesson-example-block{padding:4px 16px 12px}.dk-lesson-mini-title{margin:11px 0 4px;font-size:var(--dkwp-f-9_5,9.5px);font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.48}.dk-lesson-example-row{display:grid;grid-template-columns:36px minmax(0,1fr) 34px;gap:10px;align-items:start;padding:11px 0;border-bottom:1.5px solid rgba(21,22,23,.13)}.dk-lesson-example-row:last-child{border-bottom:0}.dk-lesson-level{display:inline-flex;align-items:center;justify-content:center;min-height:25px;padding:3px 6px;border:1.5px solid rgba(21,22,23,.25);border-radius:7px;background:var(--dkwp-mist);font-family:'Fira Code',ui-monospace,monospace;font-size:var(--dkwp-f-9_5,9.5px);font-weight:750}.dk-lesson-level.is-akk{background:#e7f5ff}.dk-lesson-level.is-dat{background:#fff1d6}.dk-lesson-example-copy{min-width:0}.dk-lesson-de{font-size:var(--dkwp-f-14,14px);font-weight:800;line-height:1.55}.dk-lesson-tr{margin-top:3px;font-size:var(--dkwp-f-12,12px);font-weight:600;line-height:1.5;opacity:.58}.dk-lesson-why{margin-top:7px;padding-left:9px;border-left:2px solid rgba(21,22,23,.2);font-size:var(--dkwp-f-11_5,11.5px);line-height:1.55;font-weight:600;opacity:.72}.dk-lesson-icon-btn{width:32px;height:32px;border-radius:8px}.dk-lesson-note{margin:12px 16px 0;padding:9px 11px;border:1.5px solid var(--dkwp-ink);border-radius:9px;background:var(--dkwp-warn);font-size:var(--dkwp-f-11_5,11.5px);line-height:1.5;font-weight:750}.dk-lesson-case-card[data-case="nominativ"] .dk-lesson-card-head{background:#f7f5ff}.dk-lesson-case-card[data-case="akkusativ"] .dk-lesson-card-head{background:#fff0f0}.dk-lesson-case-card[data-case="dativ"] .dk-lesson-card-head{background:#fff7df}.dk-lesson-case-card[data-case="genitiv"] .dk-lesson-card-head{background:#eef7ff}
.dk-lesson-tooltip{position:fixed;z-index:2147483647;max-width:min(300px,80vw);transform:translate(-50%,-100%);margin-top:-4px;padding:9px 11px;border:2px solid var(--dkwp-ink);border-radius:9px;background:var(--dkwp-paper);color:var(--dkwp-ink);box-shadow:4px 4px 0 var(--dkwp-ink);font-size:var(--dkwp-f-12,12px);line-height:1.4;font-weight:750;pointer-events:none}.dk-lesson-tooltip-loading{opacity:.55;font-style:italic}
@media (max-width:760px){.dk-lesson-overlay{padding:8px;align-items:stretch}.dk-lesson-shell{width:100%;height:100%;max-height:none;min-height:0;border-radius:16px;box-shadow:5px 5px 0 var(--dkwp-ink)}.dk-lesson-header{padding:17px 16px 14px;gap:12px}.dk-lesson-heading h2{font-size:var(--dkwp-f-24,24px)}.dk-lesson-heading p{font-size:var(--dkwp-f-12_5,12.5px)}.dk-lesson-close{width:38px;height:38px}.dk-lesson-tabs{padding:8px 10px}.dk-lesson-content{padding:14px}.dk-lesson-hero-card{display:block;padding:15px}.dk-lesson-hero-card p{margin-top:8px;text-align:left}.dk-lesson-card-grid,.dk-lesson-case-grid{grid-template-columns:1fr}.dk-lesson-card-head{padding:13px}.dk-lesson-example-block{padding:4px 13px 10px}}
@media (max-width:480px){.dk-lesson-heading p{display:none}.dk-lesson-header{align-items:center}.dk-lesson-content{padding:10px}.dk-lesson-card-head{display:block}.dk-lesson-meaning-pill{display:inline-flex;max-width:100%;margin-top:8px;text-align:left}.dk-lesson-example-row{grid-template-columns:31px minmax(0,1fr);gap:8px}.dk-lesson-example-row .dk-lesson-icon-btn{grid-column:2;justify-self:start}.dk-lesson-de{font-size:var(--dkwp-f-13_5,13.5px)}}
@media (prefers-reduced-motion:reduce){.dk-lesson-overlay *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}


@media (max-width:680px){
  .dk-wp3-article-facts{grid-template-columns:1fr 1fr}.dk-wp3-article-fact:nth-child(3){grid-column:1/-1}
  .dk-wp3-article-family-strip{display:flex;overflow-x:auto;padding:2px 2px 7px;scrollbar-width:thin}.dk-wp3-article-family{flex:0 0 145px}
  .dk-wp3-article-family-head{grid-template-columns:1fr;gap:5px}.dk-wp3-article-use-grid{grid-template-columns:1fr}
}
@media (max-width:480px){
  .dk-wp3-article-word{font-size:var(--dkwp-f-29,29px)}.dk-wp3-article-facts{grid-template-columns:1fr}.dk-wp3-article-fact:nth-child(3){grid-column:auto}
  .dk-wp3-article-table{min-width:600px}.dk-wp3-article-table-head,.dk-wp3-article-table-row{grid-template-columns:104px repeat(4,minmax(108px,1fr))}
  .dk-wp3-article-note{grid-template-columns:1fr;gap:4px}
}


@media (max-width:620px){
  #kelime-penceresi.dk-wp3-active .popup-header,
  #kelime-penceresi.dk-wp3-pending .popup-header{padding-left:12px!important;padding-right:10px!important}
  #kelime-penceresi.dk-wp3-active #secilen-kelime,
  #kelime-penceresi.dk-wp3-pending #secilen-kelime{max-width:calc(100vw - 310px)}
  #kelime-penceresi.dk-wp3-active .dk-wp3-font-controls,
  #kelime-penceresi.dk-wp3-pending .dk-wp3-font-controls{grid-template-columns:26px 20px 26px;height:34px}
  #kelime-penceresi.dk-wp3-active .dk-wp3-font-step,
  #kelime-penceresi.dk-wp3-pending .dk-wp3-font-step{width:26px;height:26px}
}
@media (max-width:480px){
  #kelime-penceresi.dk-wp3-active #secilen-kelime,
  #kelime-penceresi.dk-wp3-pending #secilen-kelime{max-width:calc(100vw - 245px)}
  #kelime-penceresi.dk-wp3-active .dk-wp3-font-status,
  #kelime-penceresi.dk-wp3-pending .dk-wp3-font-status{display:none}
  #kelime-penceresi.dk-wp3-active .dk-wp3-font-controls,
  #kelime-penceresi.dk-wp3-pending .dk-wp3-font-controls{grid-template-columns:26px 26px}
}


/* Phase 5.3 · Wortnetz responsive */
@media (max-width:680px){
  .dk-wp3-network-family-grid,.dk-wp3-network-component-grid{grid-template-columns:1fr}
  .dk-wp3-network-compare-head{flex-direction:column;gap:8px}.dk-wp3-network-word--compare{justify-content:flex-start;text-align:left}
  .dk-wp3-network-relation{max-width:100%}
}
@media (max-width:480px){
  .dk-wp3-network-group-head p{font-size:var(--dkwp-f-11,11px)}
  .dk-wp3-network-card{padding:11px}.dk-wp3-network-compare-head,.dk-wp3-network-difference{padding-left:11px;padding-right:11px}.dk-wp3-network-compare>.dk-wp3-network-example,.dk-wp3-network-detail{margin-left:11px;margin-right:11px}
  .dk-wp3-network-equation{padding:9px 10px}
}

/* ══════════════════════════════════════════════════════════════════════
   Phase 6 · Visual Identity Refinement
   deuklar.app source language: stage colors + organic masked transitions,
   physical raised actions, Geist-first micro typography.
   ══════════════════════════════════════════════════════════════════════ */

#kelime-penceresi.dk-wp3-active,
#kelime-penceresi.dk-wp3-pending{
  /* Yellow is no longer a text-accent role. Keep the legacy variables as
     compatibility aliases so older component rules resolve to the new role. */
  --dkwp-accent-text:#5f4b96;
  --dkwp-stage-viol:#eee9ff;
  --dkwp-stage-peach:#fff0e5;
  --dkwp-stage-sky:#eef8ff;
  --dkwp-stage-green:#eefaf4;
  --dkwp-stage-paper:#fbfaf9;
  --dkwp-gold-text:var(--dkwp-accent-text);
  --dkwp-gold-bright:var(--dkwp-peach);
  --dkwp-gold-soft:var(--dkwp-stage-viol);
  --dkwp-warn:#ffd8c2;
}

/* 6.1 · Yellow cleanup / semantic readability */
.dk-wp3-noun-fact>strong{color:var(--dkwp-ink)!important}
.dk-wp3-noun-fact--plural{background:var(--dkwp-stage-viol)!important}
.dk-wp3-noun-fact--plural>strong,
.dk-wp3-noun-form--plural,
.dk-wp3-network-word--compare{color:var(--dkwp-accent-text)!important}
.dk-wp3-noun-form--plural{background:#f7f4ff!important}
.dk-wp3-article{color:var(--dkwp-ink)!important}
.dk-wp3-article-use-card[data-gender="plural"]{box-shadow:inset 4px 0 0 var(--dkwp-viol-deep)!important}
.dk-wp3-article-cell[data-article-gender="plural"] strong{color:var(--dkwp-accent-text)!important}
.dk-wp3-article-note,
.dk-wp3-pronoun-fact:nth-child(3),
.dk-wp3-pronoun-case-head:nth-child(4),
.dk-wp3-adj-fact:nth-child(2),
.dk-wp3-adj-gender.is-active,
.dk-wp3-network-detail,
.dk-lesson-case-card[data-case="dativ"] .dk-lesson-card-head{background:var(--dkwp-stage-peach)!important}
.dk-wp3-prep-group[data-dkwp-prep-group="dat"].is-active{background:#eadfff!important}
.dk-lesson-word:hover,.dk-lesson-word:focus-visible{background:var(--dkwp-peach)!important}

/* 6.2 · deuklar.app stage rhythm inside the panel.
   Outer section boxes become full-width color bands with the exact wide-wave
   mask geometry used by the site design system. Dense inner tables/cards stay
   on paper for readability. */
.dk-wp3-section{
  --dkwp-section-stage:var(--dkwp-stage-paper);
  position:relative;
  isolation:isolate;
  overflow:visible;
  margin-top:38px;
  padding:28px 20px 29px;
  border:0;
  border-radius:0;
  background:var(--dkwp-section-stage);
  box-shadow:none;
}
.dk-wp3-section::before,
.dk-wp3-section::after{
  content:'';
  position:absolute;
  z-index:-1;
  left:-18px;
  right:-18px;
  height:25px;
  background:var(--dkwp-section-stage);
  pointer-events:none;
  -webkit-mask-size:100% 100%;
  mask-size:100% 100%;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
}
.dk-wp3-section::before{
  top:-24px;
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 64' preserveAspectRatio='none'><path d='M0,38 C280,60 520,30 840,36 C1120,42 1290,32 1440,50 L1440,0 L0,0 Z' fill='black'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 64' preserveAspectRatio='none'><path d='M0,38 C280,60 520,30 840,36 C1120,42 1290,32 1440,50 L1440,0 L0,0 Z' fill='black'/></svg>");
}
.dk-wp3-section::after{
  bottom:-24px;
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 64' preserveAspectRatio='none'><path d='M0,26 C280,4 520,34 840,28 C1120,22 1290,32 1440,14 L1440,64 L0,64 Z' fill='black'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 64' preserveAspectRatio='none'><path d='M0,26 C280,4 520,34 840,28 C1120,22 1290,32 1440,14 L1440,64 L0,64 Z' fill='black'/></svg>");
}
.dk-wp3-word-view>.dk-wp3-section:nth-of-type(4n+1),
.dk-wp3-sentence-view>.dk-wp3-section:nth-of-type(4n+1){--dkwp-section-stage:var(--dkwp-stage-viol)}
.dk-wp3-word-view>.dk-wp3-section:nth-of-type(4n+2),
.dk-wp3-sentence-view>.dk-wp3-section:nth-of-type(4n+2){--dkwp-section-stage:var(--dkwp-stage-paper)}
.dk-wp3-word-view>.dk-wp3-section:nth-of-type(4n+3),
.dk-wp3-sentence-view>.dk-wp3-section:nth-of-type(4n+3){--dkwp-section-stage:var(--dkwp-stage-peach)}
.dk-wp3-word-view>.dk-wp3-section:nth-of-type(4n),
.dk-wp3-sentence-view>.dk-wp3-section:nth-of-type(4n){--dkwp-section-stage:var(--dkwp-stage-sky)}
.dk-wp3-section.dk-wp3-network{--dkwp-section-stage:var(--dkwp-stage-viol)}
.dk-wp3-section.dk-wp3-section--last{--dkwp-section-stage:var(--dkwp-stage-peach);margin-bottom:24px}
.dk-wp3-section-head{position:relative;z-index:1}

/* Hero stays the primary raised object but inherits the site's scene language. */
.dk-wp3-hero{
  background:var(--dkwp-paper);
  border-width:2.5px;
  box-shadow:6px 6px 0 var(--dkwp-ink);
}
.dk-wp3-hero::before{
  content:'';
  position:absolute;
  z-index:0;
  left:-10%;
  right:35%;
  bottom:-45px;
  height:92px;
  background:var(--dkwp-stage-viol);
  opacity:.62;
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 46' preserveAspectRatio='none'><path d='M0,22 C40,-6 120,50 160,22 L160,46 L0,46 Z' fill='black'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 46' preserveAspectRatio='none'><path d='M0,22 C40,-6 120,50 160,22 L160,46 L0,46 Z' fill='black'/></svg>");
  -webkit-mask-size:100% 100%;mask-size:100% 100%;
  pointer-events:none;
}
.dk-wp3-hero--noun::before{background:var(--dkwp-stage-peach)}
.dk-wp3-hero--adjective::before,.dk-wp3-hero--pronoun::before{background:var(--dkwp-stage-viol)}
.dk-wp3-hero--adverb::before{background:var(--dkwp-stage-green)}

/* 6.3 · Physical actions: a clickable control must look clickable before hover. */
.dk-wp3-btn,
.dk-wp3-notebook-action,
.dk-wp3-save-slot>[id^="defter-badge-"]{
  min-height:42px!important;
  padding:9px 14px!important;
  border:2.5px solid var(--dkwp-ink)!important;
  border-radius:11px!important;
  box-shadow:3px 3px 0 var(--dkwp-ink)!important;
  font-family:'Geist','Nunito',ui-sans-serif,system-ui,sans-serif!important;
  font-weight:900!important;
  transition:transform var(--dkwp-t) var(--dkwp-ease),box-shadow var(--dkwp-t) var(--dkwp-ease),background-color var(--dkwp-t) ease!important;
}
.dk-wp3-btn:hover,
.dk-wp3-notebook-action:hover,
.dk-wp3-save-slot>[id^="defter-badge-"]:hover{
  transform:translate(-2px,-2px)!important;
  box-shadow:5px 5px 0 var(--dkwp-ink)!important;
}
.dk-wp3-btn:active,
.dk-wp3-notebook-action:active,
.dk-wp3-save-slot>[id^="defter-badge-"]:active{
  transform:translate(2px,2px)!important;
  box-shadow:1px 1px 0 var(--dkwp-ink)!important;
}
.dk-wp3-btn svg,.dk-wp3-sentence-btn svg{transition:transform var(--dkwp-t) var(--dkwp-ease)}
.dk-wp3-btn:hover svg,.dk-wp3-sentence-btn:hover svg{transform:translateX(3px)}

.dk-wp3-more,
.dk-wp3-network-detail-toggle{
  width:100%;
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:12px;
  padding:10px 13px;
  border:2px solid var(--dkwp-ink);
  border-radius:10px;
  background:var(--dkwp-viol-soft);
  color:var(--dkwp-ink)!important;
  box-shadow:2px 2px 0 var(--dkwp-ink);
  cursor:pointer;
  font-family:'Geist','Nunito',ui-sans-serif,system-ui,sans-serif!important;
  font-size:var(--dkwp-f-12,12px);
  font-weight:900;
  text-align:left;
  transition:transform var(--dkwp-t) var(--dkwp-ease),box-shadow var(--dkwp-t) var(--dkwp-ease),background-color var(--dkwp-t) ease;
}
.dk-wp3-network-detail-toggle{width:calc(100% - 28px);margin:12px 14px 14px;border-top:2px solid var(--dkwp-ink)}
.dk-wp3-more:hover,.dk-wp3-network-detail-toggle:hover{
  background:var(--dkwp-peach);
  transform:translate(-2px,-2px);
  box-shadow:4px 4px 0 var(--dkwp-ink);
}
.dk-wp3-more:active,.dk-wp3-network-detail-toggle:active{
  transform:translate(1px,1px);
  box-shadow:1px 1px 0 var(--dkwp-ink);
}
.dk-wp3-more svg,.dk-wp3-network-detail-toggle svg{width:16px;height:16px;transition:transform var(--dkwp-t) var(--dkwp-ease)}
.dk-wp3-more:hover svg,.dk-wp3-network-detail-toggle:hover svg{animation:dkwp-action-bounce .48s ease}
.dk-wp3-examples-panel.show-all .dk-wp3-more svg,
.dk-wp3-network-compare.is-detail-open .dk-wp3-network-detail-toggle svg{transform:rotate(180deg)}
@keyframes dkwp-action-bounce{0%,100%{translate:0 0}50%{translate:0 3px}}

/* Deep-dive actions become unmistakable raised action rows. */
.dk-wp3-deep-list{display:grid;gap:11px}
.dk-wp3-deep-list .dk-wp3-accordion{
  margin-top:0;
  overflow:hidden;
  border:2px solid var(--dkwp-ink);
  border-radius:12px;
  background:var(--dkwp-paper);
  box-shadow:3px 3px 0 var(--dkwp-ink);
  transition:transform var(--dkwp-t) var(--dkwp-ease),box-shadow var(--dkwp-t) var(--dkwp-ease);
}
.dk-wp3-deep-list .dk-wp3-accordion:nth-child(1){background:#f3efff}
.dk-wp3-deep-list .dk-wp3-accordion:nth-child(2){background:#fff0e6}
.dk-wp3-deep-list .dk-wp3-accordion:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--dkwp-ink)}
.dk-wp3-deep-list .dk-wp3-accordion.is-open{transform:none;box-shadow:3px 3px 0 var(--dkwp-ink)}
.dk-wp3-accordion-head{
  min-height:48px;
  padding:11px 13px;
  font-family:'Geist','Nunito',ui-sans-serif,system-ui,sans-serif!important;
  font-weight:900;
  transition:background-color var(--dkwp-t) ease;
}
.dk-wp3-accordion-head:hover{background:rgba(255,255,255,.58)}
.dk-wp3-accordion-icon{
  width:30px;height:30px;display:grid;place-items:center;flex:0 0 auto;
  border:2px solid var(--dkwp-ink);border-radius:8px;background:var(--dkwp-paper);
  box-shadow:1.5px 1.5px 0 var(--dkwp-ink);
  transition:transform var(--dkwp-t) var(--dkwp-ease),background-color var(--dkwp-t) ease;
}
.dk-wp3-accordion-head:hover .dk-wp3-accordion-icon{background:var(--dkwp-peach);transform:translateY(2px)}
.dk-wp3-accordion.is-open .dk-wp3-accordion-icon{transform:rotate(180deg)}
.dk-wp3-accordion.is-open .dk-wp3-accordion-head:hover .dk-wp3-accordion-icon{transform:rotate(180deg) translateY(-2px)}

/* Tabs / selector cards also inherit physical affordance. */
.dk-wp3-noun-seg,.dk-wp3-article-family,.dk-wp3-adj-form,.dk-wp3-adj-strength,.dk-wp3-adj-gender,
.dk-wp3-prep-group,.dk-wp3-conj-group,.dk-wp3-tense-chip,.dk-wp3-mini-seg{
  border:2px solid rgba(21,22,23,.36);
  font-family:'Geist','Nunito',ui-sans-serif,system-ui,sans-serif!important;
  transition:transform var(--dkwp-t) var(--dkwp-ease),box-shadow var(--dkwp-t) var(--dkwp-ease),background-color var(--dkwp-t) ease,border-color var(--dkwp-t) ease;
}
.dk-wp3-noun-seg:hover,.dk-wp3-article-family:hover,.dk-wp3-adj-form:hover,.dk-wp3-adj-strength:hover,.dk-wp3-adj-gender:hover,
.dk-wp3-prep-group:hover,.dk-wp3-conj-group:hover,.dk-wp3-tense-chip:hover,.dk-wp3-mini-seg:hover{
  border-color:var(--dkwp-ink);
  transform:translate(-1px,-1px);
  box-shadow:3px 3px 0 var(--dkwp-ink);
  background:var(--dkwp-paper);
}

/* 6.4 · Micro typography: mono is no longer the generic UI voice.
   Technical labels remain compact, but use Geist with clearer weight. */
.dk-wp3-gram,
.dk-wp3-kicker,
.dk-wp3-mode small,
.dk-wp3-noun-fact>span,
.dk-wp3-article-fact>span,
.dk-wp3-pronoun-fact>span,
.dk-wp3-adj-fact>span,
.dk-wp3-snapshot span,
.dk-wp3-noun-case-head,
.dk-wp3-article-table-head>*,
.dk-wp3-pronoun-person-head,
.dk-wp3-network-type,
.dk-wp3-network-note span,
.dk-wp3-network-example>span,
.dk-wp3-network-difference>span,
.dk-wp3-network-detail>span,
.dk-wp3-network-group-head span,
.dk-wp3-article-use-top span,
.dk-wp3-mini-title,
.dk-wp3-reference-head,
.dk-lesson-level,
.dk-lesson-code{
  font-family:'Geist','Nunito',ui-sans-serif,system-ui,sans-serif!important;
}
.dk-wp3-kicker{
  font-size:var(--dkwp-f-10_5,10.5px);
  font-weight:850;
  letter-spacing:.09em;
  text-transform:uppercase;
  opacity:.58;
}
.dk-wp3-noun-fact>span,.dk-wp3-article-fact>span,.dk-wp3-pronoun-fact>span,.dk-wp3-adj-fact>span{
  font-size:var(--dkwp-f-9_5,9.5px);
  font-weight:800;
  letter-spacing:.075em;
  text-transform:uppercase;
  opacity:.54;
}
.dk-wp3-noun-seg small,.dk-wp3-article-family small,.dk-wp3-adj-strength small,.dk-wp3-prep-group small,.dk-wp3-conj-group small,
.dk-wp3-tense-chip small,.dk-wp3-mini-seg{
  font-family:'Geist','Nunito',ui-sans-serif,system-ui,sans-serif!important;
  font-weight:700!important;
  letter-spacing:0!important;
  text-transform:none!important;
  opacity:.62;
}
.dk-wp3-mode small{font-weight:700;letter-spacing:.02em;text-transform:none;opacity:.58}
.dk-wp3-deep-list .dk-wp3-accordion-head small{
  align-self:flex-start;
  display:inline-flex;
  width:max-content;
  margin-bottom:3px;
  padding:3px 7px;
  border:1.5px solid rgba(21,22,23,.24);
  border-radius:999px;
  background:var(--dkwp-paper);
  color:var(--dkwp-viol-deep)!important;
  font-family:'Geist','Nunito',ui-sans-serif,system-ui,sans-serif!important;
  font-size:var(--dkwp-f-9,9px);
  font-weight:900;
  letter-spacing:.05em;
  text-transform:uppercase;
  opacity:1;
}

/* Network cards: keep information-rich content, but move the visual emphasis
   from yellow text to DeuKlar stage colors. */
.dk-wp3-network-card--family{box-shadow:inset 0 5px 0 var(--dkwp-viol)}
.dk-wp3-network-card--component{box-shadow:inset 0 5px 0 var(--dkwp-peach)}
.dk-wp3-network-compare{box-shadow:4px 4px 0 var(--dkwp-ink)}
.dk-wp3-network-compare-head{background:#f3efff}
.dk-wp3-network-word{color:var(--dkwp-ink)!important}
.dk-wp3-network-word--compare{color:var(--dkwp-viol-deep)!important}
.dk-wp3-network-word:hover span{color:var(--dkwp-viol-deep)}
.dk-wp3-network-relation{background:#fff0e6;color:rgba(21,22,23,.78)}
.dk-wp3-network-detail{background:#f7f5ff!important}

/* Button-like selector sublines are readable UI copy, not code. */
.dk-wp3-noun-seg span,.dk-wp3-article-family strong,.dk-wp3-prep-group strong,.dk-wp3-conj-group strong{font-weight:900}
.dk-wp3-noun-seg small,.dk-wp3-article-family small{font-size:var(--dkwp-f-9_5,9.5px)}

@media (max-width:680px){
  .dk-wp3-section{padding-left:16px;padding-right:16px}
  .dk-wp3-section::before,.dk-wp3-section::after{left:-18px;right:-18px}
}
@media (prefers-reduced-motion:reduce){
  .dk-wp3-more:hover svg,.dk-wp3-network-detail-toggle:hover svg{animation:none}
  .dk-wp3-deep-list .dk-wp3-accordion:hover,.dk-wp3-btn:hover,.dk-wp3-notebook-action:hover,.dk-wp3-save-slot>[id^="defter-badge-"]:hover,
  .dk-wp3-more:hover,.dk-wp3-network-detail-toggle:hover{transform:none!important}
}

/* Phase 6 finishing pass · selector affordance + remaining UI-label typography */
.dk-wp3-noun-seg,.dk-wp3-article-family,.dk-wp3-adj-form,.dk-wp3-adj-strength,.dk-wp3-adj-gender,
.dk-wp3-prep-group,.dk-wp3-conj-group,.dk-wp3-tense-chip,.dk-wp3-mini-seg{
  box-shadow:1.5px 1.5px 0 rgba(21,22,23,.78);
}
.dk-wp3-noun-seg.is-active,.dk-wp3-article-family.is-active,.dk-wp3-adj-form.is-active,.dk-wp3-adj-strength.is-active,.dk-wp3-adj-gender.is-active,
.dk-wp3-prep-group.is-active,.dk-wp3-conj-group.is-active,.dk-wp3-tense-chip.is-active,.dk-wp3-mini-seg.is-active{
  box-shadow:3px 3px 0 var(--dkwp-ink);
}
.dk-wp3-article-family-head span,
.dk-wp3-pronoun-current span,
.dk-wp3-prep-fact>span,
.dk-wp3-prep-article>span,
.dk-wp3-prep-ref-item small,
.dk-wp3-conj-fact>span,
.dk-wp3-conj-token small,
.dk-lesson-eyebrow,
.dk-lesson-mini-title,
.dk-wp3-person,
.dk-wp3-article-cell.is-current::after,
.dk-wp3-pronoun-cell.is-current::after,
.dk-wp3-prep-ref-item i,
.dk-wp3-conj-ref-item i{
  font-family:'Geist','Nunito',ui-sans-serif,system-ui,sans-serif!important;
}
.dk-lesson-overlay{--dkwp-warn:#ffd8c2}

/* Host-page hardening: keep semantic text colors authoritative even when the
   host page ships !important rules for strong/a elements. */
#kelime-penceresi.dk-wp3-active .dk-wp3-noun-fact>strong,
#kelime-penceresi.dk-wp3-pending .dk-wp3-noun-fact>strong{color:var(--dkwp-ink)!important}
#kelime-penceresi.dk-wp3-active .dk-wp3-noun-fact--plural>strong,
#kelime-penceresi.dk-wp3-pending .dk-wp3-noun-fact--plural>strong,
#kelime-penceresi.dk-wp3-active .dk-wp3-noun-form--plural,
#kelime-penceresi.dk-wp3-pending .dk-wp3-noun-form--plural{color:var(--dkwp-accent-text)!important}
#kelime-penceresi.dk-wp3-active .dk-wp3-article,
#kelime-penceresi.dk-wp3-pending .dk-wp3-article{color:var(--dkwp-ink)!important}

/* ══════════════════════════════════════════════════════════════════════
   Phase 6.5 · Pixel-level polish
   Calmer stage transitions, more readable micro labels, balanced physical
   controls and tighter dense-content rhythm. No functional behavior changes.
   ══════════════════════════════════════════════════════════════════════ */

#kelime-penceresi.dk-wp3-active,
#kelime-penceresi.dk-wp3-pending{
  /* Slightly quieter scene colors: still recognisably DeuKlar, less tiring
     across long grammar panels. */
  --dkwp-stage-viol:#f1edff;
  --dkwp-stage-peach:#fff3eb;
  --dkwp-stage-sky:#f2f9ff;
  --dkwp-stage-green:#f0faf5;
  --dkwp-stage-paper:#fcfbfa;
}

/* 6.5.1 · Stage rhythm: the organic edge stays, but it no longer consumes
   nearly a full line of reading space between every section. */
.dk-wp3-section{
  margin-top:31px;
  padding:24px 20px 25px;
}
.dk-wp3-section::before,
.dk-wp3-section::after{
  height:18px;
}
.dk-wp3-section::before{top:-17px}
.dk-wp3-section::after{bottom:-17px}
.dk-wp3-section.dk-wp3-section--last{margin-bottom:18px}

.dk-wp3-section-head{
  gap:18px;
  margin-bottom:17px;
}
.dk-wp3-section-head h3{
  font-size:var(--dkwp-f-21,21px);
  line-height:1.16;
  letter-spacing:-.022em;
}
.dk-wp3-section-head p{
  max-width:350px;
  color:rgba(21,22,23,.68);
  font-size:var(--dkwp-f-13,13px);
  font-weight:620;
  line-height:1.55;
}
.dk-wp3-section-intro{
  margin:-3px 0 16px;
  font-size:var(--dkwp-f-13,13px);
  line-height:1.65;
  opacity:.7;
}

/* 6.5.2 · Micro UI labels. These are interface labels, not source code.
   Keep the German/Turkish words exactly as authored; remove forced uppercase
   and excessive tracking. */
.dk-wp3-kicker,
.dk-wp3-noun-fact>span,
.dk-wp3-article-fact>span,
.dk-wp3-pronoun-fact>span,
.dk-wp3-adj-fact>span,
.dk-wp3-prep-fact>span,
.dk-wp3-prep-article>span,
.dk-wp3-conj-fact>span,
.dk-wp3-snapshot span,
.dk-wp3-network-group-head span,
.dk-wp3-network-type,
.dk-wp3-network-note span,
.dk-wp3-network-example>span,
.dk-wp3-network-difference>span,
.dk-wp3-network-detail>span,
.dk-wp3-article-use-top span,
.dk-wp3-mini-title,
.dk-wp3-reference-head,
.dk-lesson-eyebrow,
.dk-lesson-mini-title{
  font-family:'Geist','Nunito',ui-sans-serif,system-ui,sans-serif!important;
  text-transform:none!important;
  letter-spacing:.018em!important;
}
.dk-wp3-kicker{
  color:var(--dkwp-viol-deep);
  font-size:var(--dkwp-f-10_5,10.5px);
  font-weight:850;
  opacity:.9;
}
.dk-wp3-noun-fact>span,
.dk-wp3-article-fact>span,
.dk-wp3-pronoun-fact>span,
.dk-wp3-adj-fact>span,
.dk-wp3-prep-fact>span,
.dk-wp3-conj-fact>span{
  margin-bottom:6px;
  color:rgba(21,22,23,.66);
  font-size:var(--dkwp-f-10,10px);
  font-weight:800;
  opacity:1;
}
.dk-wp3-network-group-head span,
.dk-wp3-network-type,
.dk-wp3-network-note span,
.dk-wp3-network-example>span,
.dk-wp3-network-difference>span,
.dk-wp3-network-detail>span{
  color:rgba(21,22,23,.62);
  font-size:var(--dkwp-f-9_5,9.5px);
  font-weight:780;
  opacity:1;
}

/* Dense table headers still need hierarchy, but not tiny all-caps code text. */
.dk-wp3-noun-case-head,
.dk-wp3-article-table-head>*,
.dk-wp3-pronoun-person-head,
.dk-wp3-pronoun-case-head{
  font-family:'Geist','Nunito',ui-sans-serif,system-ui,sans-serif!important;
  font-size:var(--dkwp-f-10,10px)!important;
  font-weight:800!important;
  text-transform:none!important;
  letter-spacing:.01em!important;
}
.dk-wp3-noun-case-name strong,
.dk-wp3-article-case strong{
  font-size:var(--dkwp-f-10_5,10.5px);
  font-weight:800;
}
.dk-wp3-noun-case-name small,
.dk-wp3-article-case small{
  font-size:var(--dkwp-f-9_5,9.5px);
  opacity:.58;
}

/* Selector cards: clearer internal hierarchy without shouting. */
.dk-wp3-noun-seg,
.dk-wp3-article-family,
.dk-wp3-adj-form,
.dk-wp3-adj-strength,
.dk-wp3-adj-gender,
.dk-wp3-prep-group,
.dk-wp3-conj-group,
.dk-wp3-tense-chip,
.dk-wp3-mini-seg{
  border-width:2px;
  box-shadow:1px 1px 0 rgba(21,22,23,.72);
}
.dk-wp3-noun-seg small,
.dk-wp3-article-family small,
.dk-wp3-adj-strength small,
.dk-wp3-prep-group small,
.dk-wp3-conj-group small{
  color:rgba(21,22,23,.66);
  font-size:var(--dkwp-f-10,10px)!important;
  font-weight:650!important;
  opacity:1!important;
}
.dk-wp3-noun-seg:hover,
.dk-wp3-article-family:hover,
.dk-wp3-adj-form:hover,
.dk-wp3-adj-strength:hover,
.dk-wp3-adj-gender:hover,
.dk-wp3-prep-group:hover,
.dk-wp3-conj-group:hover,
.dk-wp3-tense-chip:hover,
.dk-wp3-mini-seg:hover{
  transform:translate(-1px,-1px);
  box-shadow:3px 3px 0 var(--dkwp-ink);
}
.dk-wp3-noun-seg.is-active,
.dk-wp3-article-family.is-active,
.dk-wp3-adj-form.is-active,
.dk-wp3-adj-strength.is-active,
.dk-wp3-adj-gender.is-active,
.dk-wp3-prep-group.is-active,
.dk-wp3-conj-group.is-active,
.dk-wp3-tense-chip.is-active,
.dk-wp3-mini-seg.is-active{
  box-shadow:2.5px 2.5px 0 var(--dkwp-ink);
}

/* 6.5.3 · Secondary actions. Keep a strong silhouette but use a narrow color
   cue instead of filling the whole control with violet. */
.dk-wp3-more,
.dk-wp3-network-detail-toggle{
  min-height:44px;
  border-width:2px;
  background:
    linear-gradient(90deg,var(--dkwp-viol-soft) 0 8px,var(--dkwp-paper) 8px)!important;
  box-shadow:2px 2px 0 var(--dkwp-ink);
  font-size:var(--dkwp-f-12_5,12.5px);
  line-height:1.25;
}
.dk-wp3-network-detail-toggle{
  background:
    linear-gradient(90deg,var(--dkwp-peach) 0 8px,var(--dkwp-paper) 8px)!important;
}
.dk-wp3-more:hover,
.dk-wp3-network-detail-toggle:hover{
  background:
    linear-gradient(90deg,var(--dkwp-peach) 0 8px,#fff8f3 8px)!important;
  transform:translate(-1px,-1px);
  box-shadow:4px 4px 0 var(--dkwp-ink);
}
.dk-wp3-more:active,
.dk-wp3-network-detail-toggle:active{
  transform:translate(1px,1px);
  box-shadow:1px 1px 0 var(--dkwp-ink);
}

/* Primary actions stay physical but slightly less bulky than the Phase 6
   first pass, especially when several appear in one row. */
.dk-wp3-btn,
.dk-wp3-notebook-action,
.dk-wp3-save-slot>[id^="defter-badge-"]{
  min-height:40px!important;
  padding:8px 13px!important;
  border-width:2px!important;
  box-shadow:2.5px 2.5px 0 var(--dkwp-ink)!important;
}
.dk-wp3-btn:hover,
.dk-wp3-notebook-action:hover,
.dk-wp3-save-slot>[id^="defter-badge-"]:hover{
  transform:translate(-1px,-1px)!important;
  box-shadow:4px 4px 0 var(--dkwp-ink)!important;
}
.dk-wp3-btn:active,
.dk-wp3-notebook-action:active,
.dk-wp3-save-slot>[id^="defter-badge-"]:active{
  transform:translate(1px,1px)!important;
  box-shadow:1px 1px 0 var(--dkwp-ink)!important;
}

/* Deep-dive rows: retain obvious affordance, reduce the heavy stack effect. */
.dk-wp3-deep-list{gap:10px}
.dk-wp3-deep-list .dk-wp3-accordion{
  box-shadow:2px 2px 0 var(--dkwp-ink);
}
.dk-wp3-deep-list .dk-wp3-accordion:hover{
  transform:translate(-1px,-1px);
  box-shadow:4px 4px 0 var(--dkwp-ink);
}
.dk-wp3-deep-list .dk-wp3-accordion.is-open{
  box-shadow:2px 2px 0 var(--dkwp-ink);
}
.dk-wp3-deep-list .dk-wp3-accordion-head small{
  padding:3px 8px;
  color:var(--dkwp-viol-deep)!important;
  font-size:var(--dkwp-f-9_5,9.5px);
  font-weight:850;
  letter-spacing:.015em;
  text-transform:none;
}

/* Network surfaces: cards remain information-rich, but nested shadows no
   longer compete with section-stage waves. */
.dk-wp3-network-card,
.dk-wp3-network-compare{
  border-width:2px;
  box-shadow:2.5px 2.5px 0 var(--dkwp-ink);
}
.dk-wp3-network-card--family{box-shadow:inset 0 4px 0 var(--dkwp-viol),2px 2px 0 var(--dkwp-ink)}
.dk-wp3-network-card--component{box-shadow:inset 0 4px 0 var(--dkwp-peach),2px 2px 0 var(--dkwp-ink)}
.dk-wp3-network-compare-head{background:#f6f2ff}
.dk-wp3-network-relation{
  border-color:rgba(21,22,23,.24);
  background:#fff4ec;
  font-weight:750;
}

/* Hero spacing gets a small polish so the information cards breathe without
   increasing overall panel height. */
.dk-wp3-hero{padding:21px 22px 20px}
.dk-wp3-noun-facts{gap:9px;margin-top:18px}
.dk-wp3-noun-fact{padding:12px 13px}

@media (max-width:680px){
  .dk-wp3-section{
    margin-top:27px;
    padding:21px 16px 22px;
  }
  .dk-wp3-section::before,
  .dk-wp3-section::after{height:15px}
  .dk-wp3-section::before{top:-14px}
  .dk-wp3-section::after{bottom:-14px}
  .dk-wp3-section-head{gap:10px;margin-bottom:15px}
  .dk-wp3-section-head h3{font-size:var(--dkwp-f-20,20px)}
  .dk-wp3-section-head p{font-size:var(--dkwp-f-12_5,12.5px)}
}

@media (prefers-reduced-motion:reduce){
  .dk-wp3-more:hover,
  .dk-wp3-network-detail-toggle:hover,
  .dk-wp3-deep-list .dk-wp3-accordion:hover{
    transform:none!important;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   Phase 7.1 · Semantic Scene Color Map
   Landing-page colors are assigned by information role, never by DOM order.
   Transition geometry remains untouched until Phase 7.2/7.3.
   ══════════════════════════════════════════════════════════════════════ */

#kelime-penceresi.dk-wp3-active,
#kelime-penceresi.dk-wp3-pending{
  /* Exact deuklar.app landing-stage colors. */
  --dkwp-scene-grammar:#b09cfb;      /* dx-viol */
  --dkwp-scene-grammar-soft:#c1b3ff; /* dx-viol-soft */
  --dkwp-scene-usage:#ffbe98;        /* dx-peach */
  --dkwp-scene-reference:#f9c4a0;    /* dx-apricot */
  --dkwp-scene-network:#a5d8ff;      /* dx-sky */
  --dkwp-scene-deep:#f8ff98;         /* dx-lime */
  --dkwp-scene-sentence:#38d794;     /* dx-green */
  --dkwp-scene-neutral:#f5f2f0;      /* dx-cream */
  --dkwp-scene-context:#f7f5ff;      /* dx-mist */
}

/* Stop the old nth-child carousel from carrying semantic meaning.
   The ID-scoped selector intentionally outranks Phase 6 nth-child rules. */
#kelime-penceresi.dk-wp3-active .dk-wp3-word-view>.dk-wp3-section,
#kelime-penceresi.dk-wp3-active .dk-wp3-sentence-view>.dk-wp3-section{
  --dkwp-section-stage:var(--dkwp-scene-neutral);
  color:var(--dkwp-ink);
}

/* GRAMMAR · paradigms, declension, form systems, syntax mechanics. */
#kelime-penceresi.dk-wp3-active .dk-wp3-article-uses,
#kelime-penceresi.dk-wp3-active .dk-wp3-article-reference,
#kelime-penceresi.dk-wp3-active .dk-wp3-noun-grammar,
#kelime-penceresi.dk-wp3-active .dk-wp3-pronoun-reference,
#kelime-penceresi.dk-wp3-active .dk-wp3-prep-grammar,
#kelime-penceresi.dk-wp3-active .dk-wp3-conj-syntax,
#kelime-penceresi.dk-wp3-active .dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"],
#kelime-penceresi.dk-wp3-active .dk-wp3-section[aria-labelledby="dk-wp3-conj-title"]{
  --dkwp-section-stage:var(--dkwp-scene-grammar);
}

#kelime-penceresi.dk-wp3-active .dk-wp3-adj-steigerung,
#kelime-penceresi.dk-wp3-active .dk-wp3-adj-declension{
  --dkwp-section-stage:var(--dkwp-scene-neutral);
}

/* USAGE · examples and real-sentence application. */
#kelime-penceresi.dk-wp3-active .dk-wp3-adj-usage,
#kelime-penceresi.dk-wp3-active .dk-wp3-article-context,
#kelime-penceresi.dk-wp3-active .dk-wp3-section[aria-labelledby="dk-wp3-noun-examples-title"],
#kelime-penceresi.dk-wp3-active .dk-wp3-section[aria-labelledby="dk-wp3-adj-examples-title"],
#kelime-penceresi.dk-wp3-active .dk-wp3-section[aria-labelledby="dk-wp3-examples-title"],
#kelime-penceresi.dk-wp3-active .dk-wp3-section[aria-labelledby="dk-wp3-adverb-examples-title"],
#kelime-penceresi.dk-wp3-active .dk-wp3-section[aria-labelledby="dk-wp3-pronoun-examples-title"],
#kelime-penceresi.dk-wp3-active .dk-wp3-section[aria-labelledby="dk-wp3-prep-examples-title"],
#kelime-penceresi.dk-wp3-active .dk-wp3-section[aria-labelledby="dk-wp3-conj-examples-title"]{
  --dkwp-section-stage:var(--dkwp-scene-usage);
}

/* REFERENCE · broad maps / overview modules are distinct from the selected
   word's core grammar, so they get the landing apricot scene. */
#kelime-penceresi.dk-wp3-active .dk-wp3-prep-reference,
#kelime-penceresi.dk-wp3-active .dk-wp3-conj-reference{
  --dkwp-section-stage:var(--dkwp-scene-reference);
}

/* WORD NETWORK · semantic neighbours and morphology relationships. */
#kelime-penceresi.dk-wp3-active .dk-wp3-section.dk-wp3-network{
  --dkwp-section-stage:var(--dkwp-scene-network);
}

/* DEEP DIVE · memory, etymology and optional long-form learning. */
#kelime-penceresi.dk-wp3-active .dk-wp3-section.dk-wp3-section--last{
  --dkwp-section-stage:var(--dkwp-scene-deep);
}

/* SENTENCE / GRAMMAR LAB · separate mental mode from the word analysis. */
#kelime-penceresi.dk-wp3-active .dk-wp3-section.dk-wp3-section--sentence{
  --dkwp-section-stage:var(--dkwp-scene-sentence);
}

/* The sentence summary itself is deliberately calmer than its anatomy scene. */
#kelime-penceresi.dk-wp3-active .dk-wp3-sentence-summary{
  background:var(--dkwp-scene-context);
}

/* Active selector surfaces remain readable over vivid parent scenes. */
#kelime-penceresi.dk-wp3-active .dk-wp3-section .dk-wp3-noun-seg,
#kelime-penceresi.dk-wp3-active .dk-wp3-section .dk-wp3-article-family,
#kelime-penceresi.dk-wp3-active .dk-wp3-section .dk-wp3-adj-form,
#kelime-penceresi.dk-wp3-active .dk-wp3-section .dk-wp3-adj-strength,
#kelime-penceresi.dk-wp3-active .dk-wp3-section .dk-wp3-adj-gender,
#kelime-penceresi.dk-wp3-active .dk-wp3-section .dk-wp3-prep-group,
#kelime-penceresi.dk-wp3-active .dk-wp3-section .dk-wp3-conj-group,
#kelime-penceresi.dk-wp3-active .dk-wp3-section .dk-wp3-tense-chip,
#kelime-penceresi.dk-wp3-active .dk-wp3-section .dk-wp3-mini-seg,
#kelime-penceresi.dk-wp3-active .dk-wp3-section .dk-wp3-seg{
  background:var(--dkwp-paper);
}

/* Article blue/red/green remains grammar semantics, not scene decoration. */
#kelime-penceresi.dk-wp3-active .dk-wp3-article[data-gender="der"],
#kelime-penceresi.dk-wp3-active .dk-wp3-article[data-gender="die"],
#kelime-penceresi.dk-wp3-active .dk-wp3-article[data-gender="das"]{
  isolation:isolate;
}

/* ══════════════════════════════════════════════════════════════════════
   Phase 7.2 · Single Scene Transition Architecture
   One boundary = one transition. The incoming section owns the cut, so the
   transition color is always the next scene color (matching deuklar.app).
   Geometry intentionally remains the existing wide wave until Phase 7.3.
   ══════════════════════════════════════════════════════════════════════ */

/* Remove the Phase 6 double-edge model completely. A section no longer paints
   both an entrance and an exit strip. */
#kelime-penceresi.dk-wp3-active .dk-wp3-section::before,
#kelime-penceresi.dk-wp3-pending .dk-wp3-section::before{
  content:none;
}
#kelime-penceresi.dk-wp3-active .dk-wp3-section::after,
#kelime-penceresi.dk-wp3-pending .dk-wp3-section::after{
  content:none!important;
  display:none!important;
}

/* Consecutive scenes touch directly. The incoming scene then reaches upward
   with its own color; transparent parts of the mask reveal the outgoing scene
   underneath instead of exposing a neutral horizontal gap. */
#kelime-penceresi.dk-wp3-active .dk-wp3-word-view>.dk-wp3-section+.dk-wp3-section,
#kelime-penceresi.dk-wp3-active .dk-wp3-sentence-view>.dk-wp3-section+.dk-wp3-section,
#kelime-penceresi.dk-wp3-pending .dk-wp3-word-view>.dk-wp3-section+.dk-wp3-section,
#kelime-penceresi.dk-wp3-pending .dk-wp3-sentence-view>.dk-wp3-section+.dk-wp3-section{
  margin-top:0;
}

#kelime-penceresi.dk-wp3-active .dk-wp3-word-view>.dk-wp3-section+.dk-wp3-section::before,
#kelime-penceresi.dk-wp3-active .dk-wp3-sentence-view>.dk-wp3-section+.dk-wp3-section::before,
#kelime-penceresi.dk-wp3-pending .dk-wp3-word-view>.dk-wp3-section+.dk-wp3-section::before,
#kelime-penceresi.dk-wp3-pending .dk-wp3-sentence-view>.dk-wp3-section+.dk-wp3-section::before{
  content:'';
  display:block;
  position:absolute;
  z-index:0;
  left:-18px;
  right:-18px;
  top:-20px;
  height:21px;
  background:var(--dkwp-section-stage);
  pointer-events:none;
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 64' preserveAspectRatio='none'><path d='M0,38 C280,60 520,30 840,36 C1120,42 1290,32 1440,50 L1440,64 L0,64 Z' fill='black'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 64' preserveAspectRatio='none'><path d='M0,38 C280,60 520,30 840,36 C1120,42 1290,32 1440,50 L1440,64 L0,64 Z' fill='black'/></svg>");
  -webkit-mask-size:100% 100%;
  mask-size:100% 100%;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
}

/* Keep actual section content above the incoming transition layer. */
#kelime-penceresi.dk-wp3-active .dk-wp3-section>* ,
#kelime-penceresi.dk-wp3-pending .dk-wp3-section>*{
  position:relative;
  z-index:1;
}

/* The first scene still needs breathing room below the raised hero/summary;
   only section-to-section gaps are collapsed. */
#kelime-penceresi.dk-wp3-active .dk-wp3-word-view>.dk-wp3-section:first-child,
#kelime-penceresi.dk-wp3-active .dk-wp3-sentence-view>.dk-wp3-section:first-child,
#kelime-penceresi.dk-wp3-pending .dk-wp3-word-view>.dk-wp3-section:first-child,
#kelime-penceresi.dk-wp3-pending .dk-wp3-sentence-view>.dk-wp3-section:first-child{
  margin-top:31px;
}

@media (max-width:680px){
  #kelime-penceresi.dk-wp3-active .dk-wp3-word-view>.dk-wp3-section+.dk-wp3-section::before,
  #kelime-penceresi.dk-wp3-active .dk-wp3-sentence-view>.dk-wp3-section+.dk-wp3-section::before,
  #kelime-penceresi.dk-wp3-pending .dk-wp3-word-view>.dk-wp3-section+.dk-wp3-section::before,
  #kelime-penceresi.dk-wp3-pending .dk-wp3-sentence-view>.dk-wp3-section+.dk-wp3-section::before{
    left:-16px;
    right:-16px;
    top:-15px;
    height:16px;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   Phase 7.3 · Semantic Cut Engine — wave / torn / zig
   Exact cut geometries are taken from deuklar.app landing page.
   Shape is assigned by learning transition, never by nth-child rotation.
   ══════════════════════════════════════════════════════════════════════ */

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
  --dkwp-cut-wave:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'><path d='M0,52 C210,14 430,74 720,44 C980,17 1220,66 1440,30 L1440,80 L0,80 Z' fill='black'/></svg>");
  --dkwp-cut-torn:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 38'><path d='M0,38 L0,20 L14,11 L31,19 L46,9 L58,17 L74,7 L92,16 L107,10 L121,21 L138,13 L152,22 L169,12 L184,20 L199,8 L215,18 L229,10 L246,19 L261,11 L277,21 L292,14 L306,22 L320,15 L320,38 Z' fill='black'/></svg>");
  --dkwp-cut-zig:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 44'><path d='M0,44 L22,2 L44,44 Z' fill='black'/></svg>");
}

/* Default section-to-section transition: the landing page's single wide wave.
   Same-family learning steps (grammar→grammar, reference continuity and the
   network→deep descent) stay visually soft. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+.dk-wp3-section{
  --dkwp-cut-image:var(--dkwp-cut-wave);
  --dkwp-cut-height:24px;
  --dkwp-cut-size:100% 100%;
  --dkwp-cut-repeat:no-repeat;
}

/* Strong category change: DeuKlar's irregular torn-paper edge.
   Used when the learner moves between rule/application or into Wortnetz. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-article-reference+.dk-wp3-article-context,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-adj-usage+.dk-wp3-adj-steigerung,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-noun-examples-title"],
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-adj-examples-title"],
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-examples-title"],
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-adverb-examples-title"],
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-pronoun-examples-title"],
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-prep-examples-title"],
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-conj-examples-title"],
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+.dk-wp3-network{
  --dkwp-cut-image:var(--dkwp-cut-torn);
  --dkwp-cut-height:21px;
  --dkwp-cut-size:320px 100%;
  --dkwp-cut-repeat:repeat-x;
}

/* Apply whichever semantic cut the incoming section selected. The transition
   still belongs to the incoming scene, so its color is always the next scene. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+.dk-wp3-section::before{
  top:calc(1px - var(--dkwp-cut-height));
  height:var(--dkwp-cut-height);
  -webkit-mask-image:var(--dkwp-cut-image);
  mask-image:var(--dkwp-cut-image);
  -webkit-mask-size:var(--dkwp-cut-size);
  mask-size:var(--dkwp-cut-size);
  -webkit-mask-repeat:var(--dkwp-cut-repeat);
  mask-repeat:var(--dkwp-cut-repeat);
  -webkit-mask-position:0 0;
  mask-position:0 0;
}

/* SENTENCE MODE: summary → anatomy is intentionally the only hard saw cut.
   It marks the mental switch from reading to technical sentence dissection. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-sentence-view>.dk-wp3-sentence-summary+.dk-wp3-section--sentence{
  margin-top:0;
  --dkwp-cut-image:var(--dkwp-cut-zig);
  --dkwp-cut-height:22px;
  --dkwp-cut-size:44px 100%;
  --dkwp-cut-repeat:repeat-x;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-sentence-view>.dk-wp3-sentence-summary+.dk-wp3-section--sentence::before{
  content:'';
  display:block;
  position:absolute;
  z-index:0;
  left:-18px;
  right:-18px;
  top:calc(1px - var(--dkwp-cut-height));
  height:var(--dkwp-cut-height);
  background:var(--dkwp-section-stage);
  pointer-events:none;
  -webkit-mask-image:var(--dkwp-cut-image);
  mask-image:var(--dkwp-cut-image);
  -webkit-mask-size:var(--dkwp-cut-size);
  mask-size:var(--dkwp-cut-size);
  -webkit-mask-repeat:var(--dkwp-cut-repeat);
  mask-repeat:var(--dkwp-cut-repeat);
  -webkit-mask-position:0 0;
  mask-position:0 0;
}

@media (max-width:680px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-word-view>.dk-wp3-section+.dk-wp3-section{
    --dkwp-cut-height:18px;
  }

  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-word-view>.dk-wp3-article-reference+.dk-wp3-article-context,
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-word-view>.dk-wp3-adj-usage+.dk-wp3-adj-steigerung,
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-noun-examples-title"],
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-adj-examples-title"],
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-examples-title"],
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-adverb-examples-title"],
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-pronoun-examples-title"],
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-prep-examples-title"],
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-conj-examples-title"],
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-word-view>.dk-wp3-section+.dk-wp3-network{
    --dkwp-cut-height:17px;
    --dkwp-cut-size:240px 100%;
  }

  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-sentence-view>.dk-wp3-sentence-summary+.dk-wp3-section--sentence{
    --dkwp-cut-height:18px;
    --dkwp-cut-size:36px 100%;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-sentence-view>.dk-wp3-sentence-summary+.dk-wp3-section--sentence::before{
    left:-16px;
    right:-16px;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   Phase 7.4 · Semantic Inner Scenes
   Vivid landing-page colors now separate teaching layers *inside* a section.
   Rule/Memory = lime, Structure = apricot/peach, Context = sky.
   Dense tables/examples remain white for reading comfort.
   ══════════════════════════════════════════════════════════════════════ */

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
  --dkwp-subscene-rule:var(--dkwp-scene-deep);       /* lime */
  --dkwp-subscene-structure:var(--dkwp-scene-reference); /* apricot */
  --dkwp-subscene-usage:var(--dkwp-scene-usage);     /* peach */
  --dkwp-subscene-context:var(--dkwp-scene-network); /* sky */
}

/* Shared inner-scene cut. These are deliberately much shallower than the
   section-to-section cuts: they group a teaching idea without starting a new
   page scene. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-article-note,.dk-wp3-rektion-list,
    .dk-wp3-adj-form-head,.dk-wp3-pronoun-current,
    .dk-wp3-prep-rule,.dk-wp3-prep-contractions,.dk-wp3-conj-rule,
    .dk-wp3-conj-family-rule){
  --dkwp-inner-cut:var(--dkwp-cut-wave);
  --dkwp-inner-cut-size:100% 100%;
  --dkwp-inner-cut-repeat:no-repeat;
  position:relative;
  isolation:isolate;
  margin-top:19px;
  border-color:var(--dkwp-ink);
  border-top:0;
  box-shadow:2px 2px 0 var(--dkwp-ink);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-article-note,.dk-wp3-rektion-list,
    .dk-wp3-adj-form-head,.dk-wp3-pronoun-current,
    .dk-wp3-prep-rule,.dk-wp3-prep-contractions,.dk-wp3-conj-rule,
    .dk-wp3-conj-family-rule)::before{
  content:'';
  position:absolute;
  z-index:-1;
  left:-2px;
  right:-2px;
  top:-11px;
  height:12px;
  background:var(--dkwp-inner-bg,var(--dkwp-paper));
  pointer-events:none;
  -webkit-mask-image:var(--dkwp-inner-cut);
  mask-image:var(--dkwp-inner-cut);
  -webkit-mask-size:var(--dkwp-inner-cut-size);
  mask-size:var(--dkwp-inner-cut-size);
  -webkit-mask-repeat:var(--dkwp-inner-cut-repeat);
  mask-repeat:var(--dkwp-inner-cut-repeat);
  -webkit-mask-position:0 0;
  mask-position:0 0;
}

/* RULE / MEMORY sub-scenes — high-energy lime, used for a single takeaway. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-article-note,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-rule,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-rule,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-family-rule{
  --dkwp-inner-bg:var(--dkwp-subscene-rule);
  --dkwp-inner-cut:var(--dkwp-cut-torn);
  --dkwp-inner-cut-size:210px 100%;
  --dkwp-inner-cut-repeat:repeat-x;
  background:var(--dkwp-inner-bg);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-article-note{
  padding:13px 14px 12px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-rule,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-rule{
  padding:13px 14px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-family-rule{
  padding:10px 12px;
}

/* STRUCTURE sub-scenes — Rektion and adjective form explanation use the
   landing apricot/peach family. Inner examples stay paper white. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-rektion-list{
  --dkwp-inner-bg:var(--dkwp-subscene-structure);
  --dkwp-inner-cut:var(--dkwp-cut-torn);
  --dkwp-inner-cut-size:240px 100%;
  --dkwp-inner-cut-repeat:repeat-x;
  padding:11px;
  border:2px solid var(--dkwp-ink);
  border-top:0;
  border-radius:0 0 12px 12px;
  background:var(--dkwp-inner-bg);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-rektion-row{
  margin:0 0 8px;
  padding:12px;
  border:2px solid rgba(21,22,23,.2);
  border-radius:10px;
  background:var(--dkwp-paper);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-rektion-row:last-child{
  margin-bottom:0;
  padding-bottom:12px;
  border-bottom:2px solid rgba(21,22,23,.2);
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-degree-panel.is-active{
  background:var(--dkwp-paper,#fff);
  border:2px solid var(--dkwp-ink);
  border-radius:14px;
  box-shadow:3px 3px 0 var(--dkwp-ink);
  padding:18px 20px;
  margin-top:12px;
}

/* CONTEXT / ROLE sub-scenes — sky signals “how this form behaves here”. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-current{
  --dkwp-inner-bg:var(--dkwp-subscene-context);
  background:var(--dkwp-inner-bg);
  border:2px solid var(--dkwp-ink);
  border-top:0;
  border-radius:0 0 11px 11px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-current{
  padding:13px 14px;
}

/* Präposition is where the inner-scene distinction is most educational:
   Akkusativ and Dativ get separate vivid surfaces; their example cards remain
   white and therefore read like evidence placed on top of the rule scene. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-case-card{
  background:var(--dkwp-paper);
  box-shadow:3px 3px 0 var(--dkwp-ink);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-case-card[data-prep-case="akk"]{
  background:var(--dkwp-subscene-usage);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-case-card[data-prep-case="dat"]{
  background:var(--dkwp-subscene-context);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-case-card[data-prep-case="gen"]{
  background:var(--dkwp-subscene-rule);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-case-card .dk-wp3-example{
  background:var(--dkwp-paper);
}

/* The small Wo?/Wohin? reminder inside the broad reference map mirrors the
   same semantic colors, so the association is stable across the product. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-wechsel-note>div:first-child{
  background:var(--dkwp-subscene-usage);
  border-color:var(--dkwp-ink);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-wechsel-note>div:last-child{
  background:var(--dkwp-subscene-context);
  border-color:var(--dkwp-ink);
}

/* Contractions are a structure mini-scene rather than another plain divider. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-contractions{
  --dkwp-inner-bg:var(--dkwp-subscene-structure);
  background:var(--dkwp-inner-bg);
  border:2px solid var(--dkwp-ink);
  border-top:0;
  border-radius:0 0 11px 11px;
  padding:13px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-contract{
  background:var(--dkwp-paper);
}

/* Dense data remains paper even when surrounded by a vivid teaching scene. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-noun-case-table,.dk-wp3-article-table-wrap,.dk-wp3-pronoun-table-wrap,
    .dk-wp3-reference-table,.dk-wp3-conj-schema,.dk-wp3-degree-example,
    .dk-wp3-adj-case-table,.dk-wp3-example){
  background:var(--dkwp-paper);
}

@media (max-width:680px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  :is(.dk-wp3-article-note,.dk-wp3-rektion-list,
      .dk-wp3-adj-form-head,.dk-wp3-adverb-role-copy,.dk-wp3-pronoun-current,
      .dk-wp3-prep-rule,.dk-wp3-prep-contractions,.dk-wp3-conj-rule,
      .dk-wp3-conj-family-rule){
    margin-top:16px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  :is(.dk-wp3-article-note,.dk-wp3-rektion-list,
      .dk-wp3-adj-form-head,.dk-wp3-adverb-role-copy,.dk-wp3-pronoun-current,
      .dk-wp3-prep-rule,.dk-wp3-prep-contractions,.dk-wp3-conj-rule,
      .dk-wp3-conj-family-rule)::before{
    top:-9px;
    height:10px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-rektion-list{
    padding:9px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-rektion-row{
    padding:10px;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   Phase 7.5 · Paper Hierarchy & Scene Balance
   Vivid semantic scenes carry the mood; dense information sits on a calm,
   deliberately weighted paper hierarchy. Not every nested block is a card.
   ══════════════════════════════════════════════════════════════════════ */

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
  --dkwp-paper-edge:rgba(21,22,23,.30);
  --dkwp-paper-edge-soft:rgba(21,22,23,.20);
  --dkwp-paper-shadow:1.5px 1.5px 0 rgba(21,22,23,.86);
  --dkwp-paper-shadow-strong:2px 2px 0 var(--dkwp-ink);
}

/* Tier 1 · Main data frames. These are the anchors of a vivid section:
   one clear white sheet, one strong outline, one restrained physical shadow. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-noun-case-table,.dk-wp3-article-table-wrap,.dk-wp3-pronoun-table-wrap,
    .dk-wp3-conj-table,.dk-wp3-adj-case-table,.dk-wp3-reference-table){
  background:var(--dkwp-paper);
  border:2px solid var(--dkwp-ink);
  box-shadow:var(--dkwp-paper-shadow-strong);
}

/* Example-heavy usage scenes become a single paper stack rather than a row of
   floating white rectangles. The individual sentences stay lightweight. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section .dk-wp3-examples-panel.is-active{
  padding:1px 13px 13px;
  border:2px solid var(--dkwp-ink);
  border-radius:12px;
  background:var(--dkwp-paper);
  box-shadow:var(--dkwp-paper-shadow-strong);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section .dk-wp3-examples-panel.is-active .dk-wp3-example{
  background:transparent;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section .dk-wp3-examples-panel.is-active .dk-wp3-more{
  margin-bottom:0;
}

/* Tier 2 · Supporting paper. These blocks explain or support the main data,
   therefore their edge/shadow is deliberately quieter. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section :is(.dk-wp3-snapshot,.dk-wp3-prep-contract,.dk-wp3-rektion-row){
  background:var(--dkwp-paper);
  border:1.5px solid var(--dkwp-paper-edge);
  box-shadow:none;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-rektion-row:last-child{
  border-bottom:1.5px solid var(--dkwp-paper-edge);
}

/* Article semantic stripes stay meaningful, but the card itself becomes
   lighter so der/die/das color and section color do not compete. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-article-use-card{
  border:1.5px solid var(--dkwp-paper-edge);
  background:var(--dkwp-paper);
}

/* Adjective ↔ adverb comparison: paper first, semantic stripe second. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-adj-usage-card{
  border:1.5px solid var(--dkwp-paper-edge);
  background:var(--dkwp-paper);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-adj-usage-card--adj{
  box-shadow:inset 5px 0 0 var(--dkwp-viol-soft);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-adj-usage-card--adv{
  background:var(--dkwp-paper);
  box-shadow:inset 5px 0 0 #a7edc9;
}

/* Inner semantic scenes already carry vivid color. Their own physical lift is
   therefore subtle; white evidence cards inside them do the foreground work. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-article-note,.dk-wp3-rektion-list,
    .dk-wp3-adj-form-head,.dk-wp3-adverb-role-copy,.dk-wp3-pronoun-current,
    .dk-wp3-prep-rule,.dk-wp3-prep-contractions,.dk-wp3-conj-rule,
    .dk-wp3-conj-family-rule){
  box-shadow:var(--dkwp-paper-shadow);
}

/* Präposition case blocks are semantic mini-scenes, not three giant buttons. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-case-card{
  box-shadow:var(--dkwp-paper-shadow);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-prep-case-card .dk-wp3-example{
  border-color:var(--dkwp-paper-edge-soft);
  box-shadow:none;
}

/* Word Network: family/component cards are supporting paper; comparison cards
   remain stronger because they carry a multi-part reading task. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card{
  border:1.5px solid var(--dkwp-paper-edge);
  background:var(--dkwp-paper);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--family{
  box-shadow:inset 0 4px 0 var(--dkwp-viol),var(--dkwp-paper-shadow);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--component{
  box-shadow:inset 0 4px 0 var(--dkwp-peach),var(--dkwp-paper-shadow);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare{
  border:2px solid var(--dkwp-ink);
  background:var(--dkwp-paper);
  box-shadow:var(--dkwp-paper-shadow-strong);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-head{
  background:rgba(255,255,255,.66);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail{
  background:var(--dkwp-paper)!important;
  border-color:var(--dkwp-paper-edge);
}

/* Deep Dive sits on the highest-energy lime scene. Keep Merken/Herkunft as
   white sheets and let a side stripe carry their identity instead of adding
   two more pastel slabs. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:nth-child(1),
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:nth-child(2){
  background:var(--dkwp-paper);
  border:2px solid var(--dkwp-ink);
  box-shadow:inset 5px 0 0 var(--dkwp-viol),var(--dkwp-paper-shadow);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:nth-child(2){
  box-shadow:inset 5px 0 0 var(--dkwp-peach),var(--dkwp-paper-shadow);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:hover{
  transform:translate(-1px,-1px);
  box-shadow:inset 5px 0 0 var(--dkwp-viol),3px 3px 0 var(--dkwp-ink);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:nth-child(2):hover{
  box-shadow:inset 5px 0 0 var(--dkwp-peach),3px 3px 0 var(--dkwp-ink);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion.is-open{
  transform:none;
  box-shadow:inset 5px 0 0 var(--dkwp-viol),var(--dkwp-paper-shadow);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:nth-child(2).is-open{
  box-shadow:inset 5px 0 0 var(--dkwp-peach),var(--dkwp-paper-shadow);
}

/* Reference-map entries are interactive but numerous. Their resting state is
   flat paper; physical lift is reserved for hover/current state. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-prep-ref-item,.dk-wp3-conj-ref-item){
  border:1.5px solid var(--dkwp-paper-edge);
  background:var(--dkwp-paper);
  box-shadow:none;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-prep-ref-item,.dk-wp3-conj-ref-item):hover{
  border-color:var(--dkwp-ink);
  box-shadow:2.5px 2.5px 0 var(--dkwp-ink);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-prep-ref-item,.dk-wp3-conj-ref-item).is-current{
  border-color:var(--dkwp-ink);
  box-shadow:2px 2px 0 var(--dkwp-ink);
}

/* The technical sentence/conjunction schema should look like a worksheet,
   not another colorful scene. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-schema{
  background:var(--dkwp-paper);
  border-color:rgba(21,22,23,.34);
  box-shadow:none;
}

@media (max-width:680px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-section .dk-wp3-examples-panel.is-active{
    padding-left:10px;
    padding-right:10px;
    border-radius:10px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  :is(.dk-wp3-noun-case-table,.dk-wp3-article-table-wrap,.dk-wp3-pronoun-table-wrap,
      .dk-wp3-conj-table,.dk-wp3-adj-case-table,.dk-wp3-reference-table){
    box-shadow:1.5px 1.5px 0 var(--dkwp-ink);
  }
}

@media (prefers-reduced-motion:reduce){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:hover,
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  :is(.dk-wp3-prep-ref-item,.dk-wp3-conj-ref-item):hover{
    transform:none;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   Phase 7.6 · Container-responsive stress hardening
   The extension shell is user-resizable, so responsive behavior must follow
   the panel's own inline size rather than the host page viewport. Existing
   @media rules remain as a fallback for older engines / true small screens.
   ══════════════════════════════════════════════════════════════════════ */

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
  container-type:inline-size;
  container-name:dkwp-shell;
}

/* Long German compounds and long Turkish explanations may wrap, but are never
   clipped merely to preserve a card's original desktop geometry. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-meaning,.dk-wp3-mana,.dk-wp3-section-head h3,.dk-wp3-section-head p,
    .dk-wp3-section-intro,.dk-wp3-de,.dk-wp3-tr,.dk-wp3-article-word,
    .dk-wp3-article-lead,.dk-wp3-article-family-head p,.dk-wp3-adj-form-head p,
    .dk-wp3-adverb-role-copy,.dk-wp3-pronoun-current p,.dk-wp3-prep-rule,
    .dk-wp3-conj-rule,.dk-wp3-conj-schema,.dk-wp3-network-meaning,
    .dk-wp3-network-explain,.dk-wp3-network-difference p,.dk-wp3-network-detail p,
    .dk-wp3-network-example-de,.dk-wp3-network-example-tr,
    .dk-wp3-sentence-summary blockquote,.dk-wp3-sentence-translation,
    .dk-wp3-anatomy-target,.dk-wp3-anatomy-main p,.dk-wp3-reference-cta,
    .dk-wp3-accordion-head){
  min-width:0;
  overflow-wrap:anywhere;
  word-break:normal;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-section,.dk-wp3-hero,.dk-wp3-section-head,.dk-wp3-primary-actions,
    .dk-wp3-example-copy,.dk-wp3-example-actions,.dk-wp3-network-group-head,
    .dk-wp3-network-compare-head,.dk-wp3-network-compare-meta,
    .dk-wp3-article-identity,.dk-wp3-adj-gender-head,.dk-wp3-prep-case-top,
    .dk-wp3-conj-family-rule,.dk-wp3-sentence-summary-top)>*{
  min-width:0;
}

/* Expansion should not shift the content column when the vertical scrollbar
   appears. Horizontal teaching strips keep their own contained scroll. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-scroll{
  scrollbar-gutter:stable;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-segmented--scroll,.dk-wp3-tense-strip,.dk-wp3-mini-segmented,
    .dk-wp3-adj-gender-strip,.dk-wp3-degree-track,.dk-wp3-adj-form-strip,
    .dk-wp3-prep-group-strip,.dk-wp3-conj-group-strip,.dk-wp3-conj-lane,
    .dk-wp3-article-family-strip,.dk-wp3-article-table-wrap,
    .dk-wp3-pronoun-table-wrap){
  max-width:100%;
  overscroll-behavior-inline:contain;
  -webkit-overflow-scrolling:touch;
}

/* The two intentionally wide grammar matrices are scrollable data surfaces,
   not candidates for destructive compression at 130% type scale. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-article-table-wrap,.dk-wp3-pronoun-table-wrap){
  overflow-x:auto;
  overflow-y:hidden;
}

@container dkwp-shell (max-width:680px){
  #secilen-kelime{
    max-width:100%!important;
    font-size:var(--dkwp-f-22,22px)!important;
    line-height:1.25!important;
    padding:2px 0 6px 0!important;
  }
  .popup-header{padding:11px 12px!important;gap:8px}
  .popup-header>div:first-child{flex:1 1 0;min-width:0;overflow-x:hidden;overflow-y:visible}
  .popup-header>div:last-child{flex:0 0 auto;gap:5px!important}

  .dk-wp3-word-view,.dk-wp3-sentence-view{padding:12px 12px 24px}
  .dk-wp3-hero{padding:18px}
  .dk-wp3-section{margin-top:27px;padding:21px 16px 22px}
  .dk-wp3-sentence-summary{padding:17px}
  .dk-wp3-section-head{display:block;gap:10px;margin-bottom:15px}
  .dk-wp3-section-head p{max-width:none;margin-top:6px;text-align:left}
  .dk-wp3-section-head h3{font-size:var(--dkwp-f-20,20px)}

  .dk-wp3-relation-grid{grid-template-columns:1fr}
  .dk-wp3-example{grid-template-columns:26px minmax(0,1fr)}
  .dk-wp3-example-actions{grid-column:2;justify-content:flex-start}
  .dk-wp3-example--compact{grid-template-columns:1fr}
  .dk-wp3-example--compact .dk-wp3-example-actions{grid-column:1}
  .dk-wp3-sentence-btn span{display:none}

  .dk-wp3-noun-facts{grid-template-columns:90px minmax(0,1fr)}
  .dk-wp3-noun-fact--plural{grid-column:1/-1}
  .dk-wp3-noun-segments{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dk-wp3-noun-case-head,.dk-wp3-noun-case-row{grid-template-columns:100px minmax(0,1fr) minmax(0,1fr)}

  .dk-wp3-adj-facts{grid-template-columns:1fr 1fr}
  .dk-wp3-adj-fact:last-child{grid-column:1/-1}
  .dk-wp3-adj-usage-grid{grid-template-columns:1fr}
  .dk-wp3-degree-track{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dk-wp3-degree-track::before{display:none}
  .dk-wp3-degree-copy{grid-template-columns:1fr;gap:8px}
  .dk-wp3-adj-form-head{flex-direction:column;gap:7px}
  .dk-wp3-adj-form-head p{max-width:none}

  .dk-wp3-pronoun-facts{grid-template-columns:1fr 1fr}
  .dk-wp3-pronoun-fact:last-child{grid-column:1/-1}
  .dk-wp3-pronoun-current{grid-template-columns:1fr;gap:6px}
  .dk-wp3-reference-cta{grid-template-columns:1fr}
  .dk-wp3-reference-cta .dk-wp3-btn{width:100%;white-space:normal}

  .dk-wp3-prep-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dk-wp3-prep-fact--rule{grid-column:1/-1}
  .dk-wp3-prep-case-grid.is-wechsel{grid-template-columns:1fr}
  .dk-wp3-prep-contract-grid{grid-template-columns:1fr}
  .dk-wp3-prep-group-strip{display:flex;overflow-x:auto;padding:2px 2px 7px;scrollbar-width:thin}
  .dk-wp3-prep-group{flex:0 0 132px}

  .dk-wp3-conj-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dk-wp3-conj-fact--effect{grid-column:1/-1}
  .dk-wp3-conj-group-strip{display:flex;overflow-x:auto;padding:2px 2px 7px;scrollbar-width:thin}
  .dk-wp3-conj-group{flex:0 0 170px}
  .dk-wp3-conj-row{grid-template-columns:88px minmax(0,1fr)}

  .dk-wp3-article-facts{grid-template-columns:1fr 1fr}
  .dk-wp3-article-fact:nth-child(3){grid-column:1/-1}
  .dk-wp3-article-family-strip{display:flex;overflow-x:auto;padding:2px 2px 7px;scrollbar-width:thin}
  .dk-wp3-article-family{flex:0 0 145px}
  .dk-wp3-article-family-head{grid-template-columns:1fr;gap:5px}
  .dk-wp3-article-use-grid{grid-template-columns:1fr}

  .dk-wp3-network-family-grid,.dk-wp3-network-component-grid{grid-template-columns:1fr}
  .dk-wp3-network-compare-head{flex-direction:column;gap:8px}
  .dk-wp3-network-word--compare{justify-content:flex-start;text-align:left}
  .dk-wp3-network-relation{max-width:100%}

  /* Section-to-section and inner-scene cuts shrink with the panel, not with
     the YouTube viewport. */
  .dk-wp3-word-view>.dk-wp3-section+.dk-wp3-section{--dkwp-cut-height:18px}
  .dk-wp3-word-view>.dk-wp3-article-reference+.dk-wp3-article-context,
  .dk-wp3-word-view>.dk-wp3-adj-usage+.dk-wp3-adj-steigerung,
  .dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-noun-examples-title"],
  .dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-adj-examples-title"],
  .dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-examples-title"],
  .dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-adverb-examples-title"],
  .dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-pronoun-examples-title"],
  .dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-prep-examples-title"],
  .dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-conj-examples-title"],
  .dk-wp3-word-view>.dk-wp3-section+.dk-wp3-network{
    --dkwp-cut-height:17px;
    --dkwp-cut-size:240px 100%;
  }
  .dk-wp3-word-view>.dk-wp3-section+.dk-wp3-section::before,
  .dk-wp3-sentence-view>.dk-wp3-section+.dk-wp3-section::before{
    left:-16px;right:-16px;
  }
  .dk-wp3-sentence-view>.dk-wp3-sentence-summary+.dk-wp3-section--sentence{
    --dkwp-cut-height:18px;
    --dkwp-cut-size:36px 100%;
  }
  .dk-wp3-sentence-view>.dk-wp3-sentence-summary+.dk-wp3-section--sentence::before{
    left:-16px;right:-16px;
  }

  :is(.dk-wp3-article-note,.dk-wp3-rektion-list,
      .dk-wp3-adj-form-head,.dk-wp3-adverb-role-copy,.dk-wp3-pronoun-current,
      .dk-wp3-prep-rule,.dk-wp3-prep-contractions,.dk-wp3-conj-rule,
      .dk-wp3-conj-family-rule){margin-top:16px}
  :is(.dk-wp3-article-note,.dk-wp3-rektion-list,
      .dk-wp3-adj-form-head,.dk-wp3-adverb-role-copy,.dk-wp3-pronoun-current,
      .dk-wp3-prep-rule,.dk-wp3-prep-contractions,.dk-wp3-conj-rule,
      .dk-wp3-conj-family-rule)::before{top:-9px;height:10px}
  .dk-wp3-rektion-list{padding:9px}
  .dk-wp3-rektion-row{padding:10px}

  .dk-wp3-section .dk-wp3-examples-panel.is-active{padding-left:10px;padding-right:10px;border-radius:10px}
  :is(.dk-wp3-noun-case-table,.dk-wp3-article-table-wrap,.dk-wp3-pronoun-table-wrap,
      .dk-wp3-conj-table,.dk-wp3-adj-case-table,.dk-wp3-reference-table){
    box-shadow:1.5px 1.5px 0 var(--dkwp-ink);
  }
}

@container dkwp-shell (max-width:620px){
  .popup-header{padding-left:12px!important;padding-right:10px!important}
  .dk-wp3-font-controls{grid-template-columns:26px 20px 26px;height:34px}
  .dk-wp3-font-step{width:26px;height:26px}
}

@container dkwp-shell (max-width:480px){
  .popup-header>div:last-child{gap:4px!important}
  .dk-wp3-font-status{display:none}
  .dk-wp3-font-controls{grid-template-columns:26px 26px}

  .dk-wp3-word-view,.dk-wp3-sentence-view{padding:10px 10px 22px}
  .dk-wp3-hero{padding:15px}
  .dk-wp3-section{padding:19px 13px 20px}
  .dk-wp3-section-head h3{font-size:var(--dkwp-f-19,19px)}
  .dk-wp3-modebar{padding:8px}
  .dk-wp3-mode{padding:8px 6px}
  .dk-wp3-mode small{display:none}
  .dk-wp3-meaning{font-size:var(--dkwp-f-20,20px)}
  .dk-wp3-mana{font-size:var(--dkwp-f-14_5,14.5px)}

  .dk-wp3-primary-actions>:is(.dk-wp3-btn,.dk-wp3-notebook-action,[id^="defter-badge-"]){
    flex:1 1 150px;
    min-width:0;
    white-space:normal!important;
  }
  .dk-wp3-btn,.dk-wp3-more,.dk-wp3-network-detail-toggle,.dk-wp3-accordion-head{white-space:normal}

  .dk-wp3-snapshot-grid{grid-template-columns:1fr}
  .dk-wp3-snapshot--wide{grid-column:auto}
  .dk-wp3-rektion-row{grid-template-columns:28px minmax(0,1fr);gap:8px}
  .dk-wp3-reference-head,.dk-wp3-reference-row{grid-template-columns:1.1fr 1fr 1fr}

  .dk-wp3-noun-facts{grid-template-columns:1fr}
  .dk-wp3-noun-fact--plural{grid-column:auto}
  .dk-wp3-noun-segments{grid-template-columns:1fr 1fr}
  .dk-wp3-noun-case-head{display:none}
  .dk-wp3-noun-case-row{grid-template-columns:88px minmax(0,1fr)}
  .dk-wp3-noun-case-name{grid-row:1/3}
  .dk-wp3-noun-form,.dk-wp3-noun-form--plural{position:relative;padding-left:70px;overflow-wrap:anywhere}

  /* At high font scale, selector metadata wraps instead of silently ellipsizing. */
  :is(.dk-wp3-noun-seg span,.dk-wp3-noun-seg small,.dk-wp3-article-family small,
      .dk-wp3-adj-strength small,.dk-wp3-prep-group small,.dk-wp3-conj-group small){
    overflow:visible;
    text-overflow:clip;
    white-space:normal;
    overflow-wrap:anywhere;
  }

  .dk-wp3-adj-facts{grid-template-columns:1fr}
  .dk-wp3-adj-fact:last-child{grid-column:auto}
  .dk-wp3-degree-track{display:flex;overflow-x:auto;padding:2px 2px 7px;scrollbar-width:thin}
  .dk-wp3-degree-step{flex:0 0 142px}
  .dk-wp3-degree-example-top{grid-template-columns:30px minmax(0,1fr)}
  .dk-wp3-level-dot{width:30px}
  .dk-wp3-degree-example .dk-wp3-tr{margin-left:37px}
  .dk-wp3-adj-form-strip{display:flex;overflow-x:auto;padding:2px 2px 7px;scrollbar-width:thin}
  .dk-wp3-adj-form{flex:0 0 132px}
  .dk-wp3-adj-strength-strip{grid-template-columns:1fr}
  .dk-wp3-adj-strength{flex-direction:row;align-items:baseline;justify-content:space-between}
  .dk-wp3-adj-case-row{grid-template-columns:92px minmax(0,1fr)}
  .dk-wp3-adj-case-form{font-size:var(--dkwp-f-13,13px);padding:9px 10px}
  .dk-wp3-adj-usage-example{grid-template-columns:1fr}
  .dk-wp3-adj-usage-example .dk-wp3-example-actions{justify-content:flex-start}

  .dk-wp3-adverb-identity{width:100%;align-items:flex-start;flex-direction:column;gap:3px}
  .dk-wp3-adverb-role-copy{padding:12px 13px;font-size:var(--dkwp-f-13_5,13.5px)}

  .dk-wp3-pronoun-facts{grid-template-columns:1fr}
  .dk-wp3-pronoun-fact:last-child{grid-column:auto}
  .dk-wp3-pronoun-current{padding:11px 12px}
  .dk-wp3-pronoun-table{min-width:620px}
  .dk-wp3-pronoun-head,.dk-wp3-pronoun-row{grid-template-columns:112px repeat(4,minmax(104px,1fr))}

  .dk-wp3-prep-facts{grid-template-columns:1fr}
  .dk-wp3-prep-fact--rule{grid-column:auto}
  .dk-wp3-prep-rule{grid-template-columns:1fr;gap:5px}
  .dk-wp3-prep-case-top{flex-direction:column;gap:3px}
  .dk-wp3-prep-case-top>strong{text-align:left}
  .dk-wp3-prep-ref-grid{grid-template-columns:1fr}
  .dk-wp3-prep-wechsel-note{grid-template-columns:1fr}
  .dk-wp3-prep-contract-example{grid-template-columns:1fr}
  .dk-wp3-prep-contract-example .dk-wp3-icon-btn{justify-self:start}

  .dk-wp3-conj-facts{grid-template-columns:1fr}
  .dk-wp3-conj-fact--effect{grid-column:auto}
  .dk-wp3-conj-rule,.dk-wp3-conj-schema{grid-template-columns:1fr;gap:5px}
  .dk-wp3-conj-family-rule{align-items:flex-start;flex-direction:column;gap:4px}
  .dk-wp3-conj-family-rule strong{text-align:left}
  .dk-wp3-conj-ref-grid{grid-template-columns:1fr}

  .dk-wp3-article-word{font-size:var(--dkwp-f-29,29px)}
  .dk-wp3-article-facts{grid-template-columns:1fr}
  .dk-wp3-article-fact:nth-child(3){grid-column:auto}
  .dk-wp3-article-table{min-width:600px}
  .dk-wp3-article-table-head,.dk-wp3-article-table-row{grid-template-columns:104px repeat(4,minmax(108px,1fr))}
  .dk-wp3-article-note{grid-template-columns:1fr;gap:4px}

  .dk-wp3-network-group-head p{font-size:var(--dkwp-f-11,11px)}
  .dk-wp3-network-card{padding:11px}
  .dk-wp3-network-compare-head,.dk-wp3-network-difference{padding-left:11px;padding-right:11px}
  .dk-wp3-network-compare>.dk-wp3-network-example,.dk-wp3-network-detail{margin-left:11px;margin-right:11px}
  .dk-wp3-network-equation{padding:9px 10px}

  .dk-wp3-sentence-summary-top{align-items:flex-start;flex-direction:column}
  .dk-wp3-sentence-summary blockquote{font-size:var(--dkwp-f-19,19px)}

  /* The mask remains decorative and shallow at the minimum resizable shell. */
  .dk-wp3-word-view>.dk-wp3-section+.dk-wp3-section{--dkwp-cut-height:16px}
  .dk-wp3-word-view>.dk-wp3-section+[aria-labelledby$="examples-title"],
  .dk-wp3-word-view>.dk-wp3-section+.dk-wp3-network{
    --dkwp-cut-height:15px;
    --dkwp-cut-size:210px 100%;
  }
  :is(.dk-wp3-article-note,.dk-wp3-rektion-list,.dk-wp3-degree-panel.is-active,
      .dk-wp3-adj-form-head,.dk-wp3-adverb-role-copy,.dk-wp3-pronoun-current,
      .dk-wp3-prep-rule,.dk-wp3-prep-contractions,.dk-wp3-conj-rule,
      .dk-wp3-conj-family-rule){margin-top:14px}
  :is(.dk-wp3-article-note,.dk-wp3-rektion-list,.dk-wp3-degree-panel.is-active,
      .dk-wp3-adj-form-head,.dk-wp3-adverb-role-copy,.dk-wp3-pronoun-current,
      .dk-wp3-prep-rule,.dk-wp3-prep-contractions,.dk-wp3-conj-rule,
      .dk-wp3-conj-family-rule)::before{top:-8px;height:9px}
}


/* ══════════════════════════════════════════════════════════════════════
   Phase 7.7 · Production-state hardening
   Loading/error and Lesson Shell copy must remain readable at %130 and with
   long service messages / German compounds. Lesson title now shares the same
   typography scale tokens as the rest of the panel.
   ══════════════════════════════════════════════════════════════════════ */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-loading-title,.dk-wp3-loading-copy,.dk-wp3-sentence-state strong,.dk-wp3-sentence-state p){
  min-width:0;
  overflow-wrap:anywhere;
  word-break:normal;
}
.dk-lesson-shell :is(.dk-lesson-heading h2,.dk-lesson-heading p,.dk-lesson-rich,
  .dk-lesson-card-head h3,.dk-lesson-meaning-pill,.dk-lesson-de,.dk-lesson-tr,
  .dk-lesson-why,.dk-lesson-note){
  min-width:0;
  overflow-wrap:anywhere;
  word-break:normal;
}

/* =========================================================
   Phase 8.1 · Three-view shell + animated workspace tabs
   ========================================================= */
#dk-wp3-root{container-type:inline-size;container-name:dkwp-shell}

.dk-wp3-modebar{
  display:flex;
  flex:0 0 auto;
  gap:10px;
  padding:12px 14px;
  border-bottom:var(--dkwp-line);
  background:
    linear-gradient(180deg, rgba(255,255,255,.82), rgba(255,255,255,.55)),
    linear-gradient(90deg, rgba(172,151,243,.24), rgba(245,189,154,.22), rgba(183,216,246,.2));
  backdrop-filter:blur(8px);
}

.dk-wp3-mode{
  position:relative;
  isolation:isolate;
  flex:1 1 0;
  min-width:0;
  min-height:64px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:3px;
  padding:12px 14px;
  border:2px solid rgba(21,22,23,.16);
  border-radius:16px;
  background:rgba(255,255,255,.78);
  box-shadow:0 2px 0 rgba(21,22,23,.16);
  cursor:pointer;
  text-align:left;
  font-size:var(--dkwp-f-14,14px);
  font-weight:900;
  line-height:1.06;
  transition:transform .28s var(--dkwp-ease), box-shadow .28s var(--dkwp-ease), border-color .28s ease, background-color .28s ease, color .28s ease;
  overflow:hidden;
}
.dk-wp3-mode::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(255,255,255,.65), transparent 52%);
  opacity:.78;
  z-index:-2;
}
.dk-wp3-mode::after{
  content:"";
  position:absolute;
  inset:auto -18% 8px;
  height:28px;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.92), transparent);
  transform:translateX(-135%) skewX(-24deg);
  transition:transform .7s cubic-bezier(.22,.65,.2,1);
  z-index:-1;
  opacity:.72;
}
.dk-wp3-mode:hover,
.dk-wp3-mode:focus-visible{
  transform:translateY(-2px);
  box-shadow:0 6px 0 rgba(21,22,23,.18), 0 14px 24px rgba(21,22,23,.12);
  border-color:rgba(21,22,23,.42);
}
.dk-wp3-mode:hover::after,
.dk-wp3-mode:focus-visible::after,
.dk-wp3-mode.is-active::after{transform:translateX(135%) skewX(-24deg)}
.dk-wp3-mode.is-active{
  transform:translateY(-2px);
  border-color:var(--dkwp-ink);
  box-shadow:0 7px 0 var(--dkwp-ink), 0 16px 28px rgba(21,22,23,.14);
}
.dk-wp3-mode span{
  display:block;
  font-size:var(--dkwp-f-16,16px);
  font-weight:950;
  letter-spacing:.01em;
}
.dk-wp3-mode small{
  display:block;
  font-family:inherit;
  font-size:var(--dkwp-f-12,12px);
  font-weight:800;
  letter-spacing:.01em;
  text-transform:none;
  opacity:.78;
}
.dk-wp3-mode[data-dkwp-mode="word"]{background:linear-gradient(180deg, rgba(172,151,243,.16), rgba(255,255,255,.86));}
.dk-wp3-mode[data-dkwp-mode="examples"]{background:linear-gradient(180deg, rgba(245,189,154,.16), rgba(255,255,255,.86));}
.dk-wp3-mode[data-dkwp-mode="sentence"]{background:linear-gradient(180deg, rgba(183,216,246,.18), rgba(255,255,255,.86));}
.dk-wp3-mode[data-dkwp-mode="word"].is-active{background:linear-gradient(180deg, rgba(172,151,243,.52), rgba(255,255,255,.94));}
.dk-wp3-mode[data-dkwp-mode="examples"].is-active{background:linear-gradient(180deg, rgba(245,189,154,.56), rgba(255,255,255,.95));}
.dk-wp3-mode[data-dkwp-mode="sentence"].is-active{background:linear-gradient(180deg, rgba(183,216,246,.56), rgba(255,255,255,.95));}

.dk-wp3-stage-viewport{
  position:relative;
  flex:1 1 auto;
  min-height:0;
  overflow:hidden;
  background:linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,0));
}
.dk-wp3-stage{
  position:relative;
  width:100%;
  height:100%;
  min-height:0;
}
.dk-wp3-view-panel{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:rgba(21,22,23,.36) transparent;
  transform:none;
  opacity:.46;
  filter:saturate(.9) blur(.2px);
  transition:transform 520ms cubic-bezier(.22,.7,0,1), opacity 360ms ease, filter 360ms ease;
  pointer-events:none;
}
.dk-wp3-view-panel::-webkit-scrollbar{width:10px}
.dk-wp3-view-panel::-webkit-scrollbar-thumb{background:rgba(21,22,23,.28);border:2px solid var(--dkwp-cream);border-radius:99px}
.dk-wp3-view-panel.is-active{
  opacity:1;
  filter:none;
  pointer-events:auto;
}

.dk-wp3-word-view,
.dk-wp3-examples-view,
.dk-wp3-sentence-view{
  padding:18px 18px 30px !important;
  scrollbar-gutter:stable;
}

.dk-wp3-examples-view{background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0))}
.dk-wp3-examples-view>.dk-wp3-section,
.dk-wp3-examples-view>.dk-wp3-hero{--dkwp-section-stage:var(--dkwp-stage-peach)}
.dk-wp3-examples-view>.dk-wp3-section+.dk-wp3-section,
.dk-wp3-examples-view>.dk-wp3-hero+.dk-wp3-section{position:relative;margin-top:calc(var(--dkwp-cut-height, 24px) * -1);padding-top:calc(var(--dkwp-cut-height, 24px) + 30px)}
.dk-wp3-examples-view>.dk-wp3-section+.dk-wp3-section::before,
.dk-wp3-examples-view>.dk-wp3-hero+.dk-wp3-section::before{
  content:"";
  position:absolute;
  top:calc(var(--dkwp-cut-height, 24px) * -1);
  left:0;
  right:0;
  height:calc(var(--dkwp-cut-height, 24px) + 2px);
  background:var(--dkwp-section-stage);
  -webkit-mask-image:var(--dkwp-cut-mask,none);
  mask-image:var(--dkwp-cut-mask,none);
  -webkit-mask-repeat:repeat-x;
  mask-repeat:repeat-x;
  -webkit-mask-size:100% 100%;
  mask-size:100% 100%;
  -webkit-mask-position:center top;
  mask-position:center top;
}

.dk-wp3-hero--examples-empty{
  background:linear-gradient(180deg, rgba(245,189,154,.78), rgba(255,255,255,.94));
}

@media (prefers-reduced-motion:reduce){
  .dk-wp3-mode,
  .dk-wp3-mode::after,
  .dk-wp3-view-panel{transition:none !important}
}

@container dkwp-shell (max-width: 620px){
  .dk-wp3-modebar{padding:10px;gap:8px}
  .dk-wp3-mode{min-height:58px;padding:10px 11px;border-radius:14px}
  .dk-wp3-mode span{font-size:var(--dkwp-f-15,15px)}
  .dk-wp3-mode small{font-size:var(--dkwp-f-11,11px)}
  .dk-wp3-word-view,
  .dk-wp3-examples-view,
  .dk-wp3-sentence-view{padding:12px 12px 24px !important}
}

@container dkwp-shell (max-width: 470px){
  .dk-wp3-modebar{padding:8px;gap:6px}
  .dk-wp3-mode{min-height:54px;padding:9px 9px 10px;border-radius:13px}
  .dk-wp3-mode span{font-size:var(--dkwp-f-14,14px)}
  .dk-wp3-mode small{font-size:var(--dkwp-f-10_5,10.5px)}
}

/* =========================================================
   Phase 8.2 · Dedicated Examples workspace
   ========================================================= */
.dk-wp3-examples-view{
  background:
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,0)),
    var(--dkwp-stage-peach);
}

.dk-wp3-examples-workspace{
  display:flex;
  flex-direction:column;
  gap:16px;
  min-width:0;
}

.dk-wp3-examples-cover{
  position:relative;
  overflow:hidden;
  padding:20px 20px 18px;
  border:2px solid var(--dkwp-ink);
  border-radius:18px;
  background:
    radial-gradient(circle at 88% 18%, rgba(255,255,255,.82) 0 7%, transparent 7.5%),
    linear-gradient(145deg, rgba(255,255,255,.34), transparent 52%),
    var(--dkwp-peach);
  box-shadow:4px 4px 0 var(--dkwp-ink);
}
.dk-wp3-examples-cover::after{
  content:"";
  position:absolute;
  right:-22px;
  bottom:-28px;
  width:126px;
  height:82px;
  border:2px solid rgba(21,22,23,.18);
  border-radius:55% 45% 0 0 / 70% 70% 0 0;
  background:rgba(176,156,251,.38);
  transform:rotate(-8deg);
  pointer-events:none;
}
.dk-wp3-examples-cover-top{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:8px;
}
.dk-wp3-examples-eyebrow{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:6px 10px;
  border:1.5px solid rgba(21,22,23,.72);
  border-radius:999px;
  background:rgba(255,255,255,.84);
  font-family:'Geist',system-ui,sans-serif;
  font-size:var(--dkwp-f-11,11px);
  font-weight:900;
  line-height:1;
  letter-spacing:.01em;
}
.dk-wp3-examples-stats{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}
.dk-wp3-examples-stats span,
.dk-wp3-examples-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:6px 10px;
  border:1.5px solid var(--dkwp-ink);
  border-radius:999px;
  background:var(--dkwp-paper);
  font-family:'Geist',system-ui,sans-serif;
  font-size:var(--dkwp-f-11,11px);
  font-weight:900;
  line-height:1;
}
.dk-wp3-examples-cover h2{
  position:relative;
  z-index:1;
  margin:0;
  max-width:82%;
  color:var(--dkwp-ink);
  font-family:'Geist',system-ui,sans-serif;
  font-size:var(--dkwp-f-29,29px);
  font-weight:950;
  line-height:1.04;
  letter-spacing:-.025em;
  overflow-wrap:anywhere;
}
.dk-wp3-examples-cover>strong{
  position:relative;
  z-index:1;
  display:block;
  margin-top:8px;
  color:var(--dkwp-ink);
  font-family:'Geist',system-ui,sans-serif;
  font-size:var(--dkwp-f-15,15px);
  font-weight:950;
  line-height:1.25;
}
.dk-wp3-examples-cover>p{
  position:relative;
  z-index:1;
  margin:6px 0 0;
  max-width:720px;
  color:var(--dkwp-ink);
  font-family:'Geist',system-ui,sans-serif;
  font-size:var(--dkwp-f-13,13px);
  font-weight:700;
  line-height:1.55;
}
.dk-wp3-examples-capabilities{
  position:relative;
  z-index:1;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:14px;
}
.dk-wp3-examples-capabilities span{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:34px;
  padding:7px 10px;
  border:1.5px solid rgba(21,22,23,.76);
  border-radius:10px;
  background:rgba(255,255,255,.78);
  font-family:'Geist',system-ui,sans-serif;
  font-size:var(--dkwp-f-11_5,11.5px);
  font-weight:900;
}
.dk-wp3-examples-capabilities svg{width:16px;height:16px}

.dk-wp3-examples-workarea{
  min-width:0;
  padding:0 0 8px;
}
.dk-wp3-examples-workarea>.dk-wp3-section{
  margin:0;
  padding:18px;
  border:2px solid var(--dkwp-ink);
  border-radius:16px;
  background:rgba(255,255,255,.94);
  box-shadow:3px 3px 0 var(--dkwp-ink);
  --dkwp-section-stage:transparent;
}
.dk-wp3-examples-workarea>.dk-wp3-section::before,
.dk-wp3-examples-workarea>.dk-wp3-section::after{display:none!important}
.dk-wp3-examples-workarea .dk-wp3-section-head{
  margin-bottom:12px;
}
.dk-wp3-examples-workarea .dk-wp3-section-head h3{
  font-family:'Geist',system-ui,sans-serif;
  font-size:var(--dkwp-f-20,20px);
  font-weight:950;
  line-height:1.1;
  letter-spacing:-.015em;
}
.dk-wp3-examples-workarea .dk-wp3-kicker{
  font-family:'Geist',system-ui,sans-serif;
  font-size:var(--dkwp-f-11,11px);
  font-weight:900;
  letter-spacing:.02em;
  text-transform:none;
}
.dk-wp3-examples-workarea .dk-wp3-section-intro{
  color:rgba(21,22,23,.82);
  font-weight:700;
}

.dk-wp3-examples-workarea .dk-wp3-tense-strip{
  position:sticky;
  top:-1px;
  z-index:5;
  margin:0 -8px 10px;
  padding:8px;
  border:1.5px solid rgba(21,22,23,.15);
  border-radius:12px;
  background:rgba(255,255,255,.94);
  box-shadow:0 5px 14px rgba(21,22,23,.08);
  backdrop-filter:blur(8px);
}
.dk-wp3-examples-workarea .dk-wp3-tense-chip{
  min-height:48px;
  border-width:2px;
  border-color:rgba(21,22,23,.34);
  background:var(--dkwp-paper);
  box-shadow:1.5px 1.5px 0 rgba(21,22,23,.42);
  transition:transform .2s var(--dkwp-ease),box-shadow .2s var(--dkwp-ease),background-color .2s ease,border-color .2s ease;
}
.dk-wp3-examples-workarea .dk-wp3-tense-chip:hover{
  transform:translateY(-1px);
  border-color:var(--dkwp-ink);
  box-shadow:3px 3px 0 var(--dkwp-ink);
}
.dk-wp3-examples-workarea .dk-wp3-tense-chip.is-active{
  border-color:var(--dkwp-ink);
  background:var(--dkwp-viol-soft);
  box-shadow:3px 3px 0 var(--dkwp-ink);
}
.dk-wp3-examples-workarea .dk-wp3-tense-chip span{
  font-family:'Geist',system-ui,sans-serif;
  font-weight:950;
}
.dk-wp3-examples-workarea .dk-wp3-tense-chip small{
  font-family:'Geist',system-ui,sans-serif;
  font-weight:800;
  opacity:.74;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-examples-workarea .dk-wp3-examples-panel.is-active{
  padding:4px 14px 14px;
  border:2px solid var(--dkwp-ink);
  border-radius:14px;
  background:var(--dkwp-paper);
  box-shadow:2px 2px 0 var(--dkwp-ink);
}
.dk-wp3-examples-workarea .dk-wp3-example{
  grid-template-columns:38px minmax(0,1fr) auto;
  gap:12px;
  padding:16px 0;
}
.dk-wp3-examples-workarea .dk-wp3-example-index{
  display:flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  padding:0;
  border:1.5px solid rgba(21,22,23,.24);
  border-radius:9px;
  background:var(--dkwp-mist);
  font-family:'Geist',system-ui,sans-serif;
  font-size:var(--dkwp-f-10_5,10.5px);
  font-weight:900;
  opacity:.8;
}
.dk-wp3-examples-workarea .dk-wp3-de{
  font-family:'Geist',system-ui,sans-serif;
  font-size:var(--dkwp-f-16,16px);
  font-weight:850;
  line-height:1.52;
}
.dk-wp3-examples-workarea .dk-wp3-tr{
  margin-top:5px;
  color:rgba(21,22,23,.76);
  font-family:'Geist',system-ui,sans-serif;
  font-size:var(--dkwp-f-13,13px);
  font-weight:700;
  line-height:1.5;
  opacity:1;
}
.dk-wp3-examples-workarea .dk-wp3-example-actions{
  align-self:center;
}
.dk-wp3-examples-workarea .dk-wp3-sentence-btn{
  min-height:38px;
  font-family:'Geist',system-ui,sans-serif;
  font-weight:900;
}
.dk-wp3-examples-workarea .dk-wp3-icon-btn{
  min-width:38px;
  min-height:38px;
}

.dk-wp3-examples-empty-card{
  padding:18px;
  border:2px solid var(--dkwp-ink);
  border-radius:16px;
  background:var(--dkwp-paper);
  box-shadow:3px 3px 0 var(--dkwp-ink);
}
.dk-wp3-examples-empty-card strong{
  display:block;
  font-family:'Geist',system-ui,sans-serif;
  font-size:var(--dkwp-f-16,16px);
  font-weight:950;
}
.dk-wp3-examples-empty-card p{
  margin:6px 0 0;
  font-family:'Geist',system-ui,sans-serif;
  font-size:var(--dkwp-f-13,13px);
  font-weight:700;
  line-height:1.55;
}

@container dkwp-shell (max-width: 620px){
  .dk-wp3-examples-workspace{gap:12px}
  .dk-wp3-examples-cover{padding:17px 16px 16px;border-radius:16px}
  .dk-wp3-examples-cover h2{max-width:100%;font-size:var(--dkwp-f-24,24px)}
  .dk-wp3-examples-workarea>.dk-wp3-section{padding:14px;border-radius:14px}
  .dk-wp3-examples-workarea .dk-wp3-example{grid-template-columns:34px minmax(0,1fr);gap:10px}
  .dk-wp3-examples-workarea .dk-wp3-example-actions{grid-column:2;justify-content:flex-start}
}

@container dkwp-shell (max-width: 470px){
  .dk-wp3-examples-cover{padding:15px 14px}
  .dk-wp3-examples-cover-top{align-items:flex-start}
  .dk-wp3-examples-stats{width:100%}
  .dk-wp3-examples-workarea>.dk-wp3-section{padding:12px}
  .dk-wp3-examples-workarea .dk-wp3-tense-strip{margin-left:-4px;margin-right:-4px;padding:6px}
  .dk-wp3-examples-workarea .dk-wp3-de{font-size:var(--dkwp-f-15,15px)}
}

/* =========================================================
   Phase 8.3 · Text Color Firewall / Yellow-text removal
   Yellow/lime may exist as a surface accent, never as readable text.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
  --dkwp-text-main:#151617;
  --dkwp-text-muted:#4e5052;
  --dkwp-text-accent:#5f4b96;
  /* Legacy names are intentionally redirected so old component rules cannot
     reintroduce a yellow/gold foreground. */
  --dkwp-gold-text:var(--dkwp-text-accent);
  --dkwp-gold-bright:var(--dkwp-peach);
}

/* Host-page CSS isolation. The extension lives inside foreign pages, so common
   strong/b/grammar elements must not inherit YouTube/site emphasis colors. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :where(strong,b),
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root .dk-wp3-gram,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root .dk-wp3-noun-panel-head strong,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root .dk-wp3-noun-case-name strong,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root .dk-wp3-network-note strong,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root .dk-wp3-network-equation strong,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root .dk-wp3-network-count{
  color:var(--dkwp-text-main)!important;
  text-shadow:none!important;
  -webkit-text-fill-color:currentColor!important;
}

/* Selector labels and case labels are UI text, not warning/highlight text. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :where(
  .dk-wp3-noun-seg span,
  .dk-wp3-article-family strong,
  .dk-wp3-adj-form strong,
  .dk-wp3-adj-strength strong,
  .dk-wp3-adj-gender strong,
  .dk-wp3-prep-group strong,
  .dk-wp3-conj-group strong,
  .dk-wp3-tense-chip span,
  .dk-wp3-mini-seg,
  .dk-wp3-seg
){
  color:var(--dkwp-text-main)!important;
  -webkit-text-fill-color:currentColor!important;
}

/* Intentional readable accent roles. These are the only former “gold” text
   roles and are now DeuKlar violet. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root .dk-wp3-noun-fact--plural>strong,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root .dk-wp3-noun-form--plural,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root .dk-wp3-network-word--compare,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root .dk-wp3-network-word--compare span{
  color:var(--dkwp-text-accent)!important;
  -webkit-text-fill-color:currentColor!important;
}

/* Article gender colors are semantic grammar information and remain allowed.
   Plural deliberately uses violet instead of yellow. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root .dk-wp3-article-cell[data-article-gender="mask"] strong{
  color:#236da8!important;
  -webkit-text-fill-color:currentColor!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root .dk-wp3-article-cell[data-article-gender="fem"] strong{
  color:#b93838!important;
  -webkit-text-fill-color:currentColor!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root .dk-wp3-article-cell[data-article-gender="neut"] strong{
  color:#217536!important;
  -webkit-text-fill-color:currentColor!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root .dk-wp3-article-cell[data-article-gender="plural"] strong{
  color:var(--dkwp-text-accent)!important;
  -webkit-text-fill-color:currentColor!important;
}

/* Section micro-labels may use the brand violet, but never yellow. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root .dk-wp3-kicker{
  color:var(--dkwp-text-accent)!important;
  -webkit-text-fill-color:currentColor!important;
  opacity:.9;
}

/* Supporting text gets a fixed readable neutral instead of opacity-only color
   that can become weak over vivid stage backgrounds. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :where(
  .dk-wp3-noun-case-name small,
  .dk-wp3-noun-seg small,
  .dk-wp3-article-family small,
  .dk-wp3-tense-chip small,
  .dk-wp3-network-type,
  .dk-wp3-network-group-head p,
  .dk-wp3-network-relation
){
  color:var(--dkwp-text-muted)!important;
  -webkit-text-fill-color:currentColor!important;
}

/* Lesson Shell gets the same isolation boundary. */
.dk-lesson-overlay :where(strong,b,.dk-lesson-code,.dk-lesson-mini-title){
  color:#151617!important;
  text-shadow:none!important;
  -webkit-text-fill-color:currentColor!important;
}


/* =========================================================
   Phase 8.4 · Continuous transition geometry hardening
   One incoming scene = one full-width edge. Repeating masks are replaced
   by single no-repeat SVG strips to avoid segmented/gapped Chrome rendering.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
  --dkwp-cut-wave-84:var(--dkwp-cut-wave);
  --dkwp-cut-torn-84:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1280 38' preserveAspectRatio='none'><path d='M0,38 L0,20 L14,11 L31,19 L46,9 L58,17 L74,7 L92,16 L107,10 L121,21 L138,13 L152,22 L169,12 L184,20 L199,8 L215,18 L229,10 L246,19 L261,11 L277,21 L292,14 L306,22 L320,15 L320,20 L334,11 L351,19 L366,9 L378,17 L394,7 L412,16 L427,10 L441,21 L458,13 L472,22 L489,12 L504,20 L519,8 L535,18 L549,10 L566,19 L581,11 L597,21 L612,14 L626,22 L640,15 L640,20 L654,11 L671,19 L686,9 L698,17 L714,7 L732,16 L747,10 L761,21 L778,13 L792,22 L809,12 L824,20 L839,8 L855,18 L869,10 L886,19 L901,11 L917,21 L932,14 L946,22 L960,15 L960,20 L974,11 L991,19 L1006,9 L1018,17 L1034,7 L1052,16 L1067,10 L1081,21 L1098,13 L1112,22 L1129,12 L1144,20 L1159,8 L1175,18 L1189,10 L1206,19 L1221,11 L1237,21 L1252,14 L1266,22 L1280,15 L1280,38 Z' fill='black'/></svg>");
  --dkwp-cut-zig-84:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1232 44' preserveAspectRatio='none'><path d='M0,44 L22,2 L44,44 L66,2 L88,44 L110,2 L132,44 L154,2 L176,44 L198,2 L220,44 L242,2 L264,44 L286,2 L308,44 L330,2 L352,44 L374,2 L396,44 L418,2 L440,44 L462,2 L484,44 L506,2 L528,44 L550,2 L572,44 L594,2 L616,44 L638,2 L660,44 L682,2 L704,44 L726,2 L748,44 L770,2 L792,44 L814,2 L836,44 L858,2 L880,44 L902,2 L924,44 L946,2 L968,44 L990,2 L1012,44 L1034,2 L1056,44 L1078,2 L1100,44 L1122,2 L1144,44 L1166,2 L1188,44 L1210,2 L1232,44 L1232,44 L0,44 Z' fill='black'/></svg>");
}

/* All section cuts share one geometry contract. The cut aligns exactly with
   the incoming section; no negative inline overhang and no duplicated strip. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+.dk-wp3-section,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-examples-view .dk-wp3-examples-workarea>.dk-wp3-section+.dk-wp3-section{
  --dkwp-cut-image:var(--dkwp-cut-wave-84);
  --dkwp-cut-size:100% 100%;
  --dkwp-cut-repeat:no-repeat;
}

/* Category changes keep the landing-page torn-paper profile, but the profile
   is precomposed as one continuous full-width strip rather than repeat-x. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-article-reference+.dk-wp3-article-context,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-adj-usage+.dk-wp3-adj-steigerung,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+.dk-wp3-network{
  --dkwp-cut-image:var(--dkwp-cut-torn-84);
  --dkwp-cut-size:100% 100%;
  --dkwp-cut-repeat:no-repeat;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+.dk-wp3-section::before{
  left:0!important;
  right:0!important;
  width:auto!important;
  top:calc(1px - var(--dkwp-cut-height));
  height:var(--dkwp-cut-height);
  background:var(--dkwp-section-stage);
  -webkit-mask-image:var(--dkwp-cut-image)!important;
  mask-image:var(--dkwp-cut-image)!important;
  -webkit-mask-size:100% 100%!important;
  mask-size:100% 100%!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center top!important;
  mask-position:center top!important;
}

/* Sentence summary -> anatomy uses the same one-strip rule. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-sentence-view>.dk-wp3-sentence-summary+.dk-wp3-section--sentence{
  --dkwp-cut-image:var(--dkwp-cut-zig-84);
  --dkwp-cut-size:100% 100%;
  --dkwp-cut-repeat:no-repeat;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-sentence-view>.dk-wp3-sentence-summary+.dk-wp3-section--sentence::before{
  left:0!important;
  right:0!important;
  width:auto!important;
  -webkit-mask-image:var(--dkwp-cut-zig-84)!important;
  mask-image:var(--dkwp-cut-zig-84)!important;
  -webkit-mask-size:100% 100%!important;
  mask-size:100% 100%!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center top!important;
  mask-position:center top!important;
}

/* Inner teaching scenes also use continuous strips. This removes the same
   segmented repeat artifact from Rektion / rule / memory mini-scenes. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-article-note,.dk-wp3-rektion-list,.dk-wp3-degree-panel.is-active,
    .dk-wp3-adj-form-head,.dk-wp3-adverb-role-copy,.dk-wp3-pronoun-current,
    .dk-wp3-prep-rule,.dk-wp3-prep-contractions,.dk-wp3-conj-rule,
    .dk-wp3-conj-family-rule){
  --dkwp-inner-cut-size:100% 100%;
  --dkwp-inner-cut-repeat:no-repeat;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-article-note,.dk-wp3-rektion-list,.dk-wp3-prep-rule,
    .dk-wp3-conj-rule,.dk-wp3-conj-family-rule){
  --dkwp-inner-cut:var(--dkwp-cut-torn-84);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-degree-panel.is-active,.dk-wp3-adj-form-head,.dk-wp3-adverb-role-copy,
    .dk-wp3-pronoun-current,.dk-wp3-prep-contractions){
  --dkwp-inner-cut:var(--dkwp-cut-wave-84);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-article-note,.dk-wp3-rektion-list,.dk-wp3-degree-panel.is-active,
    .dk-wp3-adj-form-head,.dk-wp3-adverb-role-copy,.dk-wp3-pronoun-current,
    .dk-wp3-prep-rule,.dk-wp3-prep-contractions,.dk-wp3-conj-rule,
    .dk-wp3-conj-family-rule)::before{
  left:-2px;
  right:-2px;
  -webkit-mask-size:100% 100%!important;
  mask-size:100% 100%!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center top!important;
  mask-position:center top!important;
}

/* The examples workspace no longer owns an independent legacy cut mask.
   Any future adjacent example scene inherits the same full-width wave. */
.dk-wp3-examples-view>.dk-wp3-section+.dk-wp3-section::before,
.dk-wp3-examples-view>.dk-wp3-hero+.dk-wp3-section::before{
  left:0!important;
  right:0!important;
  -webkit-mask-image:var(--dkwp-cut-wave-84)!important;
  mask-image:var(--dkwp-cut-wave-84)!important;
  -webkit-mask-size:100% 100%!important;
  mask-size:100% 100%!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center top!important;
  mask-position:center top!important;
}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
    --dkwp-cut-torn-84:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 38' preserveAspectRatio='none'><path d='M0,38 L0,20 L14,11 L31,19 L46,9 L58,17 L74,7 L92,16 L107,10 L121,21 L138,13 L152,22 L169,12 L184,20 L199,8 L215,18 L229,10 L246,19 L261,11 L277,21 L292,14 L306,22 L320,15 L320,20 L334,11 L351,19 L366,9 L378,17 L394,7 L412,16 L427,10 L441,21 L458,13 L472,22 L489,12 L504,20 L519,8 L535,18 L549,10 L566,19 L581,11 L597,21 L612,14 L626,22 L640,15 L640,38 Z' fill='black'/></svg>");
    --dkwp-cut-zig-84:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 440 44' preserveAspectRatio='none'><path d='M0,44 L22,2 L44,44 L66,2 L88,44 L110,2 L132,44 L154,2 L176,44 L198,2 L220,44 L242,2 L264,44 L286,2 L308,44 L330,2 L352,44 L374,2 L396,44 L418,2 L440,44 L440,44 L0,44 Z' fill='black'/></svg>");
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-word-view>.dk-wp3-section+.dk-wp3-section{--dkwp-cut-height:18px}
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-sentence-view>.dk-wp3-sentence-summary+.dk-wp3-section--sentence{--dkwp-cut-height:18px}
}

/* =========================================================
   Phase 8.5 · Scene rhythm / color-area economy
   Vivid landing-page colors establish section identity; long reading bodies
   return to neutral paper so color never becomes a multi-screen wall.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
  --dkwp-rhythm-paper:#f5f2f0;
  --dkwp-rhythm-paper-soft:#fbfaf9;
  --dkwp-rhythm-white:#fff;
}

/* Grammar should read as a real DeuKlar scene, not an almost-white card.
   The two tones are the landing system's actual violet pair. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-article-uses,.dk-wp3-article-reference,.dk-wp3-noun-grammar,
    .dk-wp3-adj-steigerung,.dk-wp3-adj-declension,
    .dk-wp3-pronoun-reference,.dk-wp3-prep-grammar,.dk-wp3-conj-syntax,
    .dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"],
    .dk-wp3-section[aria-labelledby="dk-wp3-conj-title"]){
  background:linear-gradient(145deg,var(--dkwp-scene-grammar) 0%,var(--dkwp-scene-grammar-soft) 100%)!important;
}

/* Usage/reference scenes keep landing-page energy, but use a related pair
   instead of a flat block. Examples now live in their own workspace, so this
   mainly affects contextual teaching modules that remain on the Word page. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-adj-usage,.dk-wp3-article-context){
  background:linear-gradient(145deg,var(--dkwp-scene-usage) 0%,var(--dkwp-scene-reference) 100%)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-prep-reference,.dk-wp3-conj-reference){
  background:linear-gradient(145deg,var(--dkwp-scene-reference) 0%,var(--dkwp-scene-usage) 100%)!important;
}

/* WORD NETWORK: sky is the chapter color, not a full-page wall. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-network{
  background:var(--dkwp-scene-network)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-title{
  margin-bottom:0;
  padding-bottom:18px;
  border-bottom:0;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-groups{
  position:relative;
  z-index:1;
  margin:29px -20px -25px;
  padding:31px 20px 27px;
  background:linear-gradient(180deg,var(--dkwp-rhythm-paper) 0%,var(--dkwp-rhythm-paper-soft) 100%);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-groups::before{
  content:"";
  position:absolute;
  z-index:0;
  top:-18px;
  left:0;
  right:0;
  height:19px;
  background:var(--dkwp-rhythm-paper);
  pointer-events:none;
  -webkit-mask-image:var(--dkwp-cut-torn-84,var(--dkwp-cut-torn));
  mask-image:var(--dkwp-cut-torn-84,var(--dkwp-cut-torn));
  -webkit-mask-size:100% 100%;
  mask-size:100% 100%;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-position:center top;
  mask-position:center top;
}

/* Keep individual network groups visually connected to the neutral body.
   Section identity comes from the sky chapter header and semantic card accents. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-groups>*{position:relative;z-index:1}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-group + .dk-wp3-network-group{
  border-top-color:rgba(21,22,23,.18);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-group-head p{
  color:rgba(21,22,23,.70)!important;
  opacity:1;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section--last>.dk-wp3-deep-list>*{position:relative;z-index:1}

/* DEEP DIVE: lime remains a sharp chapter marker; long reading happens on
   cream paper. This avoids the fluorescent multi-screen surface seen in the
   acceptance screenshots while preserving the landing-page lime itself. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-section--last{
  background:var(--dkwp-scene-deep)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section--last>.dk-wp3-section-head{
  margin-bottom:0;
  padding-bottom:14px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section--last>.dk-wp3-deep-list{
  position:relative;
  z-index:1;
  margin:26px -20px -25px;
  padding:30px 20px 25px;
  background:linear-gradient(180deg,var(--dkwp-rhythm-paper) 0%,var(--dkwp-rhythm-paper-soft) 100%);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section--last>.dk-wp3-deep-list::before{
  content:"";
  position:absolute;
  z-index:0;
  top:-17px;
  left:0;
  right:0;
  height:18px;
  background:var(--dkwp-rhythm-paper);
  pointer-events:none;
  -webkit-mask-image:var(--dkwp-cut-wave-84,var(--dkwp-cut-wave));
  mask-image:var(--dkwp-cut-wave-84,var(--dkwp-cut-wave));
  -webkit-mask-size:100% 100%;
  mask-size:100% 100%;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-position:center top;
  mask-position:center top;
}

/* Sentence mode follows the same rhythm: vivid green anatomy chapter, calm
   sentence summary. Dense anatomy cards themselves remain paper. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-section--sentence{
  background:linear-gradient(145deg,var(--dkwp-scene-sentence) 0%,var(--dkwp-scene-network) 100%)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-card{
  background:rgba(255,255,255,.96);
}

/* The dedicated Examples workspace already owns peach as its page identity.
   Its actual work area remains paper so the workspace itself has the same
   vivid→neutral cadence as Word Network and Deep Dive. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-view{
  background:var(--dkwp-scene-usage)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea{
  position:relative;
  padding:18px 0 10px;
}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-groups{
    margin:25px -16px -22px;
    padding:28px 16px 23px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section--last>.dk-wp3-deep-list{
    margin:23px -16px -22px;
    padding:27px 16px 22px;
  }
}
@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-groups{
    margin:23px -13px -20px;
    padding:26px 13px 20px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section--last>.dk-wp3-deep-list{
    margin:22px -13px -20px;
    padding:25px 13px 20px;
  }
}

/* =========================================================
   Phase 8.6 · Wortnetz compact comparison system
   Information stays visible; repeated chrome becomes lighter.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-groups{
  gap:20px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-group + .dk-wp3-network-group{
  padding-top:20px;
}

/* Count belongs to the title, not to the far edge of the section. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-group-head{
  display:block;
  margin-bottom:12px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-group-head>div{
  width:100%;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-group-titleline{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-group-titleline h4{
  margin:0;
  font-size:var(--dkwp-f-17,17px);
  font-weight:950;
  line-height:1.18;
  letter-spacing:-.02em;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-count{
  min-width:0;
  width:auto;
  height:auto;
  padding:3px 8px 4px;
  border:1.5px solid rgba(21,22,23,.34);
  border-radius:999px;
  background:rgba(255,255,255,.76);
  box-shadow:none;
  color:var(--dkwp-ink)!important;
  font-size:var(--dkwp-f-10,10px);
  font-weight:950;
  line-height:1;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-group-head>div>span.dk-wp3-gram{
  margin-bottom:4px;
  font-size:var(--dkwp-f-10,10px);
  font-weight:850;
  letter-spacing:.015em;
  text-transform:none;
  opacity:.7;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-group-head p{
  max-width:720px;
  margin-top:5px;
  font-size:var(--dkwp-f-12,12px);
  font-weight:700;
  line-height:1.48;
}

/* Family / component cards: compact paper rows, still showing meaning, form and examples. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-network-family-grid,.dk-wp3-network-component-grid){
  gap:9px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card{
  padding:11px 12px;
  border-width:1.5px;
  border-color:rgba(21,22,23,.28);
  border-radius:11px;
  box-shadow:none;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--family{
  box-shadow:inset 0 3px 0 var(--dkwp-viol-soft);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--component{
  box-shadow:inset 0 3px 0 var(--dkwp-peach);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card-top{
  align-items:center;
  gap:10px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-type{
  padding-top:0;
  font-size:var(--dkwp-f-10,10px);
  font-weight:850;
  letter-spacing:.015em;
  text-transform:none;
  opacity:.66;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-word{
  font-size:var(--dkwp-f-15,15px);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-meaning{
  margin-top:7px;
  font-size:var(--dkwp-f-12,12px);
  font-weight:800;
  line-height:1.42;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-explain{
  margin-top:5px;
  font-size:var(--dkwp-f-11_5,11.5px);
  font-weight:700;
  line-height:1.45;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-note{
  margin-top:7px;
  padding:6px 8px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-example{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  column-gap:8px;
  row-gap:2px;
  margin-top:8px;
  padding-top:7px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-example>span{
  grid-row:1/3;
  align-self:start;
  margin:2px 0 0;
  font-size:var(--dkwp-f-9,9px);
  font-weight:850;
  text-transform:none;
  letter-spacing:.01em;
  opacity:.64;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-example-de{
  font-size:var(--dkwp-f-11_5,11.5px);
  font-weight:850;
  line-height:1.42;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-example-tr{
  margin-top:0;
  font-size:var(--dkwp-f-10_5,10.5px);
  font-weight:700;
  line-height:1.4;
  opacity:.68;
}

/* Similar words: full-width comparison rows rather than tall article cards. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-list{
  gap:9px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare{
  overflow:hidden;
  border:2px solid var(--dkwp-ink, #151617)!important;
  border-radius:14px!important;
  background:#ffffff!important;
  box-shadow:4px 4px 0 var(--dkwp-ink, #151617)!important;
  transition:transform var(--dkwp-t) var(--dkwp-ease),box-shadow var(--dkwp-t) var(--dkwp-ease),border-color var(--dkwp-t) ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare:hover{
  transform:translate(-1.5px, -1.5px)!important;
  border-color:var(--dkwp-ink)!important;
  box-shadow:6px 6px 0 var(--dkwp-ink, #151617)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-head{
  display:block!important;
  padding:12px 14px 10px!important;
  border-bottom:2px solid var(--dkwp-ink, #151617)!important;
  background:var(--dkwp-mist, #f7f5ff)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-title{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  min-width:0!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-word--compare{
  justify-content:flex-start;
  text-align:left;
  font-size:var(--dkwp-f-17,17px);
  font-weight:950;
  color:var(--dkwp-text-accent,#5f4b96)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-meta{
  justify-content:flex-end;
  flex:0 1 auto;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-meta .dk-wp3-network-type{
  padding:0;
  font-size:var(--dkwp-f-9_5,9.5px);
  font-weight:850;
  letter-spacing:.01em;
  text-transform:none;
  opacity:.68;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-relation{
  max-width:300px;
  padding:3px 7px;
  border-width:1.25px;
  background:rgba(255,190,152,.32);
  color:var(--dkwp-ink)!important;
  font-size:var(--dkwp-f-9_5,9.5px);
  font-weight:850;
  line-height:1.25;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-body{
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
  gap:0;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-difference{
  min-width:0;
  padding:10px 12px 11px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-network-difference>span,.dk-wp3-network-detail>span,.dk-wp3-network-example--compare>span){
  margin-bottom:4px;
  font-size:var(--dkwp-f-9_5,9.5px);
  font-weight:850;
  letter-spacing:.01em;
  text-transform:none;
  opacity:.66;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-difference p{
  font-size:var(--dkwp-f-12,12px);
  font-weight:800;
  line-height:1.48;
  color:rgba(21,22,23,.82)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare>.dk-wp3-network-example--compare{
  display:block;
  min-width:0;
  margin:0;
  padding:10px 12px 11px;
  border-top:0;
  border-left:1px dashed rgba(21,22,23,.22);
  background:rgba(247,245,255,.58);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-example--compare .dk-wp3-network-example-de{
  font-size:var(--dkwp-f-11_5,11.5px);
  font-weight:800;
  line-height:1.48;
}

/* Expanded detail stays complete, but no longer forces a full-width form-like CTA. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail{
  margin:0 12px 10px;
  padding:10px 11px;
  border:1.25px solid rgba(21,22,23,.2);
  border-radius:9px;
  background:var(--dkwp-mist)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail p{
  font-size:var(--dkwp-f-11_5,11.5px);
  font-weight:700;
  line-height:1.58;
  color:var(--dkwp-ink,#151617)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-footer{
  display:flex;
  justify-content:flex-end;
  padding:0 10px 9px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail-toggle{
  width:auto;
  min-height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  margin:0;
  padding:7px 10px;
  border:1.75px solid var(--dkwp-ink);
  border-radius:9px;
  background:var(--dkwp-paper);
  box-shadow:2px 2px 0 var(--dkwp-ink);
  color:var(--dkwp-ink)!important;
  font-size:var(--dkwp-f-10_5,10.5px);
  font-weight:900;
  line-height:1.2;
  transition:transform var(--dkwp-t) var(--dkwp-ease),box-shadow var(--dkwp-t) var(--dkwp-ease),background-color var(--dkwp-t) ease;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail-toggle:hover{
  transform:translate(-1px,-1px);
  background:var(--dkwp-peach);
  box-shadow:3px 3px 0 var(--dkwp-ink);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail-toggle:active{
  transform:translate(1px,1px);
  box-shadow:1px 1px 0 var(--dkwp-ink);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare.is-detail-open .dk-wp3-network-detail-toggle{
  background:var(--dkwp-viol-soft);
}

@container dkwp-shell (max-width: 620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-title{
    align-items:flex-start;
    flex-direction:column;
    gap:6px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-meta{
    justify-content:flex-start;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-body{
    grid-template-columns:1fr;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare>.dk-wp3-network-example--compare{
    border-left:0;
    border-top:1px dashed rgba(21,22,23,.22);
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-footer{
    justify-content:stretch;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail-toggle{
    width:100%;
  }
}

/* =========================================================
   Phase 8.7 · Final UI controls + micro-typography system
   One authoritative interaction language for labels, selectors and actions.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
  --dkwp-ui-font:'Geist','Nunito',ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --dkwp-ui-muted:rgba(21,22,23,.72);
  --dkwp-ui-soft:rgba(21,22,23,.58);
  --dkwp-ui-line:rgba(21,22,23,.34);
  --dkwp-ui-shadow:rgba(21,22,23,.86);
}

/* 8.7.1 — There is no generic "code-looking" UI voice anymore.
   Grammar labels are UI labels unless a dedicated technical component says otherwise. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-gram,.dk-wp3-kicker,.dk-wp3-mini-title,.dk-wp3-network-type,
  .dk-wp3-network-group-head span,.dk-wp3-network-note span,
  .dk-wp3-network-example>span,.dk-wp3-network-difference>span,
  .dk-wp3-network-detail>span,.dk-wp3-article-use-top span,
  .dk-wp3-noun-fact>span,.dk-wp3-article-fact>span,.dk-wp3-pronoun-fact>span,
  .dk-wp3-adj-fact>span,.dk-wp3-prep-fact>span,.dk-wp3-prep-article>span,
  .dk-wp3-conj-fact>span,.dk-wp3-snapshot span,.dk-wp3-reference-head,
  .dk-wp3-article-family-head span,.dk-wp3-pronoun-current span,
  .dk-wp3-prep-ref-item small,.dk-wp3-conj-token small,.dk-wp3-person,
  .dk-wp3-anatomy-role
){
  font-family:var(--dkwp-ui-font)!important;
  font-style:normal!important;
  text-shadow:none!important;
  letter-spacing:.008em!important;
  text-transform:none!important;
}

/* Section eyebrow: compact but never thin or washed out. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-kicker{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  width:max-content;
  max-width:100%;
  margin-bottom:4px;
  padding:3px 8px 4px;
  border:1.5px solid rgba(21,22,23,.22);
  border-radius:999px;
  background:rgba(255,255,255,.58);
  color:var(--dkwp-viol-deep)!important;
  font-size:var(--dkwp-f-10_5,10.5px)!important;
  font-weight:900!important;
  line-height:1.15;
  opacity:1!important;
}

/* Small field labels: minimum visual weight and readable contrast. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-noun-fact>span,.dk-wp3-article-fact>span,.dk-wp3-pronoun-fact>span,
  .dk-wp3-adj-fact>span,.dk-wp3-prep-fact>span,.dk-wp3-prep-article>span,
  .dk-wp3-conj-fact>span,.dk-wp3-snapshot span,.dk-wp3-network-type,
  .dk-wp3-network-note span,.dk-wp3-network-example>span,
  .dk-wp3-network-difference>span,.dk-wp3-network-detail>span,
  .dk-wp3-network-group-head>div>span.dk-wp3-gram
){
  color:var(--dkwp-ui-muted)!important;
  font-size:var(--dkwp-f-10_5,10.5px)!important;
  font-weight:850!important;
  line-height:1.25!important;
  opacity:1!important;
}

/* Case names and table micro-headings are labels, not terminal output. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-noun-case-head,.dk-wp3-article-table-head>*,.dk-wp3-pronoun-person-head,
  .dk-wp3-pronoun-case-head,.dk-wp3-noun-case-name strong,.dk-wp3-article-case strong,
  .dk-wp3-adj-case-name strong
){
  font-family:var(--dkwp-ui-font)!important;
  color:var(--dkwp-ink)!important;
  font-size:var(--dkwp-f-11,11px)!important;
  font-weight:900!important;
  letter-spacing:0!important;
  text-transform:none!important;
  opacity:1!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-noun-case-name small,.dk-wp3-article-case small,.dk-wp3-adj-case-name small
){
  font-family:var(--dkwp-ui-font)!important;
  color:var(--dkwp-ui-muted)!important;
  font-size:var(--dkwp-f-10,10px)!important;
  font-weight:750!important;
  opacity:1!important;
}

/* 8.7.2 — One selector-card language. Applies to all grammar navigation. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-noun-seg,.dk-wp3-article-family,.dk-wp3-adj-form,.dk-wp3-adj-strength,
  .dk-wp3-adj-gender,.dk-wp3-prep-group,.dk-wp3-conj-group,.dk-wp3-tense-chip,
  .dk-wp3-mini-seg,.dk-wp3-seg,.dk-wp3-degree-step
){
  position:relative;
  border:2px solid var(--dkwp-ui-line)!important;
  border-radius:11px!important;
  background:rgba(255,255,255,.9)!important;
  color:var(--dkwp-ink)!important;
  box-shadow:1.5px 1.5px 0 rgba(21,22,23,.64)!important;
  font-family:var(--dkwp-ui-font)!important;
  cursor:pointer;
  transition:
    transform 170ms var(--dkwp-ease),
    box-shadow 170ms var(--dkwp-ease),
    border-color 170ms ease,
    background-color 170ms ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-noun-seg,.dk-wp3-article-family,.dk-wp3-adj-form,.dk-wp3-adj-strength,
  .dk-wp3-adj-gender,.dk-wp3-prep-group,.dk-wp3-conj-group,.dk-wp3-tense-chip,
  .dk-wp3-mini-seg,.dk-wp3-seg,.dk-wp3-degree-step
):hover{
  border-color:var(--dkwp-ink)!important;
  background:#fff!important;
  transform:translate(-1px,-2px)!important;
  box-shadow:3px 4px 0 var(--dkwp-ink)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-noun-seg,.dk-wp3-article-family,.dk-wp3-adj-form,.dk-wp3-adj-strength,
  .dk-wp3-adj-gender,.dk-wp3-prep-group,.dk-wp3-conj-group,.dk-wp3-tense-chip,
  .dk-wp3-mini-seg,.dk-wp3-seg,.dk-wp3-degree-step
):active{
  transform:translate(1px,1px)!important;
  box-shadow:1px 1px 0 var(--dkwp-ink)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-noun-seg,.dk-wp3-article-family,.dk-wp3-adj-form,.dk-wp3-adj-strength,
  .dk-wp3-adj-gender,.dk-wp3-prep-group,.dk-wp3-conj-group,.dk-wp3-tense-chip,
  .dk-wp3-mini-seg,.dk-wp3-seg,.dk-wp3-degree-step
).is-active{
  border-color:var(--dkwp-ink)!important;
  background:linear-gradient(145deg,#fff 0%,rgba(193,179,255,.72) 100%)!important;
  box-shadow:3px 3px 0 var(--dkwp-ink)!important;
}

/* Selector copy never looks like tiny code. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-noun-seg span,.dk-wp3-article-family strong,.dk-wp3-adj-form strong,
  .dk-wp3-adj-strength span,.dk-wp3-adj-gender span,.dk-wp3-prep-group strong,
  .dk-wp3-conj-group strong,.dk-wp3-tense-chip span,.dk-wp3-seg,
  .dk-wp3-degree-step strong
){
  color:var(--dkwp-ink)!important;
  font-family:var(--dkwp-ui-font)!important;
  font-size:var(--dkwp-f-12,12px)!important;
  font-weight:900!important;
  line-height:1.25!important;
  letter-spacing:0!important;
  opacity:1!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-noun-seg small,.dk-wp3-article-family small,.dk-wp3-adj-strength small,
  .dk-wp3-adj-gender small,.dk-wp3-prep-group small,.dk-wp3-conj-group small,
  .dk-wp3-tense-chip small,.dk-wp3-degree-step small,.dk-wp3-degree-step .dk-wp3-gram,
  .dk-wp3-adj-form .dk-wp3-gram
){
  max-width:100%;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  color:var(--dkwp-ui-muted)!important;
  font-family:var(--dkwp-ui-font)!important;
  font-size:var(--dkwp-f-10_5,10.5px)!important;
  font-weight:750!important;
  line-height:1.28!important;
  letter-spacing:0!important;
  opacity:1!important;
}

/* 8.7.3 — Action hierarchy: main, secondary/expand, compact icon. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-btn,.dk-wp3-notebook-action,.dk-wp3-save-slot>[id^="defter-badge-"],
  .dk-wp3-sentence-btn,.dk-wp3-context-btn
){
  min-height:40px!important;
  border:2px solid var(--dkwp-ink)!important;
  border-radius:10px!important;
  background:#fff!important;
  color:var(--dkwp-ink)!important;
  box-shadow:2.5px 2.5px 0 var(--dkwp-ink)!important;
  font-family:var(--dkwp-ui-font)!important;
  font-size:var(--dkwp-f-12_5,12.5px)!important;
  font-weight:900!important;
  letter-spacing:0!important;
  text-transform:none!important;
  transition:transform 170ms var(--dkwp-ease),box-shadow 170ms var(--dkwp-ease),background-color 170ms ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-btn,.dk-wp3-notebook-action,.dk-wp3-save-slot>[id^="defter-badge-"],
  .dk-wp3-sentence-btn,.dk-wp3-context-btn
):hover{
  transform:translate(-1px,-2px)!important;
  background:var(--dkwp-peach)!important;
  box-shadow:4px 5px 0 var(--dkwp-ink)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-btn,.dk-wp3-notebook-action,.dk-wp3-save-slot>[id^="defter-badge-"],
  .dk-wp3-sentence-btn,.dk-wp3-context-btn
):active{
  transform:translate(1px,1px)!important;
  box-shadow:1px 1px 0 var(--dkwp-ink)!important;
}

/* Expand/reveal controls: explicit button silhouette, not input/select chrome. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-more,.dk-wp3-network-detail-toggle
){
  min-height:40px!important;
  width:auto!important;
  max-width:100%;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  margin-top:11px;
  padding:8px 12px!important;
  border:2px solid var(--dkwp-ink)!important;
  border-radius:10px!important;
  background:#fff!important;
  color:var(--dkwp-ink)!important;
  box-shadow:2px 2px 0 var(--dkwp-ink)!important;
  font-family:var(--dkwp-ui-font)!important;
  font-size:var(--dkwp-f-12,12px)!important;
  font-weight:900!important;
  line-height:1.2!important;
  letter-spacing:0!important;
  text-align:center!important;
  transition:transform 170ms var(--dkwp-ease),box-shadow 170ms var(--dkwp-ease),background-color 170ms ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-panel .dk-wp3-more{
  margin-left:auto;
  margin-right:auto;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-footer .dk-wp3-network-detail-toggle{
  margin:0!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-more,.dk-wp3-network-detail-toggle
):hover{
  transform:translate(-1px,-2px)!important;
  background:var(--dkwp-peach)!important;
  box-shadow:4px 4px 0 var(--dkwp-ink)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-more,.dk-wp3-network-detail-toggle
):active{
  transform:translate(1px,1px)!important;
  box-shadow:1px 1px 0 var(--dkwp-ink)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-more,.dk-wp3-network-detail-toggle
) svg{
  width:16px!important;
  height:16px!important;
  transition:transform 190ms var(--dkwp-ease)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-panel.show-all .dk-wp3-more svg,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare.is-detail-open .dk-wp3-network-detail-toggle svg{
  transform:rotate(180deg)!important;
}

/* Icon-only buttons stay clearly tactile without overpowering content. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-icon-btn{
  width:36px!important;
  height:36px!important;
  border:2px solid var(--dkwp-ink)!important;
  border-radius:9px!important;
  background:#fff!important;
  box-shadow:2px 2px 0 var(--dkwp-ink)!important;
  transition:transform 160ms var(--dkwp-ease),box-shadow 160ms var(--dkwp-ease),background-color 160ms ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-icon-btn:hover{
  transform:translate(-1px,-2px)!important;
  background:var(--dkwp-sky)!important;
  box-shadow:3px 4px 0 var(--dkwp-ink)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-icon-btn--sentence:hover{
  background:var(--dkwp-peach)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-icon-btn:active{
  transform:translate(1px,1px)!important;
  box-shadow:1px 1px 0 var(--dkwp-ink)!important;
}

/* 8.7.4 — Merken / Herkunft become unmistakable action rows. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion{
  overflow:hidden;
  border:2px solid var(--dkwp-ink)!important;
  border-radius:12px!important;
  background:#fff!important;
  box-shadow:2px 2px 0 var(--dkwp-ink)!important;
  transition:transform 170ms var(--dkwp-ease),box-shadow 170ms var(--dkwp-ease),background-color 170ms ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:nth-child(1){
  box-shadow:inset 7px 0 0 var(--dkwp-viol-soft),2px 2px 0 var(--dkwp-ink)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:nth-child(2){
  box-shadow:inset 7px 0 0 var(--dkwp-peach),2px 2px 0 var(--dkwp-ink)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:hover{
  transform:translate(-1px,-2px)!important;
  box-shadow:inset 7px 0 0 var(--dkwp-viol-soft),4px 4px 0 var(--dkwp-ink)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:nth-child(2):hover{
  box-shadow:inset 7px 0 0 var(--dkwp-peach),4px 4px 0 var(--dkwp-ink)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-head{
  min-height:62px;
  padding:12px 13px 12px 18px!important;
  background:transparent!important;
  color:var(--dkwp-ink)!important;
  font-family:var(--dkwp-ui-font)!important;
  font-size:var(--dkwp-f-13,13px)!important;
  font-weight:950!important;
  line-height:1.25!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-head small{
  margin:0 0 4px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:var(--dkwp-viol-deep)!important;
  font-family:var(--dkwp-ui-font)!important;
  font-size:var(--dkwp-f-10_5,10.5px)!important;
  font-weight:900!important;
  line-height:1.15!important;
  letter-spacing:.01em!important;
  text-transform:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-icon{
  width:32px!important;
  height:32px!important;
  border:2px solid var(--dkwp-ink)!important;
  border-radius:9px!important;
  background:#fff!important;
  box-shadow:1.5px 1.5px 0 var(--dkwp-ink)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion.is-open{
  transform:none!important;
}

/* 8.7.5 — Interactive inline words get a clean, readable affordance. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-link{
  color:inherit!important;
  font-weight:inherit!important;
  text-decoration:none!important;
  border-bottom:2px solid rgba(106,86,167,.38)!important;
  transition:background-color 140ms ease,border-color 140ms ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-link:hover,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-link:focus-visible{
  background:rgba(193,179,255,.34)!important;
  border-bottom-color:var(--dkwp-viol-deep)!important;
}

/* Keep technical sentence layout readable too; no thin mono labels. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-schema{
  font-family:var(--dkwp-ui-font)!important;
  font-weight:800!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-role{
  color:var(--dkwp-ui-muted)!important;
  font-size:var(--dkwp-f-10_5,10.5px)!important;
  font-weight:900!important;
  opacity:1!important;
}

/* Responsive: preserve readability, don't hide button subtitles solely for density. */
@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
    .dk-wp3-noun-seg,.dk-wp3-article-family,.dk-wp3-adj-form,.dk-wp3-adj-strength,
    .dk-wp3-adj-gender,.dk-wp3-prep-group,.dk-wp3-conj-group,.dk-wp3-tense-chip,
    .dk-wp3-degree-step
  ){
    min-height:52px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
    .dk-wp3-more,.dk-wp3-network-detail-toggle
  ){
    width:100%!important;
  }
}

@media (prefers-reduced-motion:reduce){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
    .dk-wp3-noun-seg,.dk-wp3-article-family,.dk-wp3-adj-form,.dk-wp3-adj-strength,
    .dk-wp3-adj-gender,.dk-wp3-prep-group,.dk-wp3-conj-group,.dk-wp3-tense-chip,
    .dk-wp3-mini-seg,.dk-wp3-seg,.dk-wp3-degree-step,.dk-wp3-btn,
    .dk-wp3-notebook-action,.dk-wp3-sentence-btn,.dk-wp3-context-btn,.dk-wp3-more,
    .dk-wp3-network-detail-toggle,.dk-wp3-icon-btn,.dk-wp3-deep-list .dk-wp3-accordion
  ){
    transition:none!important;
  }
}

/* Three-view navigation keeps both language lines readable at every panel size. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode span{
  font-family:var(--dkwp-ui-font)!important;
  font-weight:950!important;
  letter-spacing:0!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode small{
  display:block!important;
  font-family:var(--dkwp-ui-font)!important;
  color:var(--dkwp-ui-muted)!important;
  font-weight:800!important;
  letter-spacing:0!important;
  opacity:1!important;
}

/* =========================================================
   Phase 8.8 · Scene color dosage
   The landing-page colors stay exact at scene entry; long reading surfaces
   taper into related washes / paper instead of remaining fully saturated.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
  --dkwp-dose-grammar:#e8e1ff;
  --dkwp-dose-grammar-soft:#f3efff;
  --dkwp-dose-usage:#ffe3d2;
  --dkwp-dose-reference:#ffe7d6;
  --dkwp-dose-network:#dff1ff;
  --dkwp-dose-deep:#fbffc9;
  --dkwp-dose-sentence:#d8f8e9;
  --dkwp-dose-paper:#f8f6f3;
}

/* Grammar gets a confident DeuKlar-violet entrance, then becomes a calm
   reading surface. Dense tables/cards remain white above this scene. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-article-uses,.dk-wp3-article-reference,.dk-wp3-noun-grammar,
  .dk-wp3-adj-steigerung,.dk-wp3-adj-declension,
  .dk-wp3-pronoun-reference,.dk-wp3-prep-grammar,.dk-wp3-conj-syntax,
  .dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"],
  .dk-wp3-section[aria-labelledby="dk-wp3-conj-title"]
){
  background:linear-gradient(180deg,
    var(--dkwp-scene-grammar) 0,
    var(--dkwp-scene-grammar-soft) 82px,
    var(--dkwp-dose-grammar) 190px,
    var(--dkwp-dose-grammar-soft) 100%)!important;
}

/* Contextual teaching modules retain peach/apricot identity without turning
   into a full-height orange wall. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-adj-usage,.dk-wp3-article-context){
  background:linear-gradient(180deg,
    var(--dkwp-scene-usage) 0,
    var(--dkwp-scene-reference) 74px,
    var(--dkwp-dose-usage) 180px,
    var(--dkwp-dose-paper) 100%)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-prep-reference,.dk-wp3-conj-reference){
  background:linear-gradient(180deg,
    var(--dkwp-scene-reference) 0,
    var(--dkwp-scene-usage) 76px,
    var(--dkwp-dose-reference) 190px,
    var(--dkwp-dose-paper) 100%)!important;
}

/* Word Network: exact sky at the chapter header, then a softer sky before the
   existing torn cut drops into neutral paper. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-network{
  background:linear-gradient(180deg,
    var(--dkwp-scene-network) 0,
    var(--dkwp-scene-network) 72px,
    var(--dkwp-dose-network) 150px,
    var(--dkwp-dose-network) 100%)!important;
}

/* Deep Dive: preserve landing lime as a short chapter marker only. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-section--last{
  background:linear-gradient(180deg,
    var(--dkwp-scene-deep) 0,
    var(--dkwp-scene-deep) 58px,
    var(--dkwp-dose-deep) 132px,
    var(--dkwp-dose-deep) 100%)!important;
}

/* Sentence anatomy uses green as the technical scene marker; the longer body
   moves toward a soft green/sky wash behind the white anatomy cards. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-section--sentence{
  background:linear-gradient(180deg,
    var(--dkwp-scene-sentence) 0,
    var(--dkwp-scene-sentence) 68px,
    var(--dkwp-dose-sentence) 178px,
    var(--dkwp-dose-network) 100%)!important;
}

/* Dedicated Examples workspace: peach is unmistakable at the cover/top, while
   scrolling downward naturally lands on cream rather than continuous peach. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-view{
  background:linear-gradient(180deg,
    var(--dkwp-scene-usage) 0,
    var(--dkwp-scene-usage) 128px,
    var(--dkwp-dose-usage) 255px,
    var(--dkwp-scene-neutral) 470px,
    var(--dkwp-scene-neutral) 100%)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-cover{
  background:
    radial-gradient(circle at 88% 18%, rgba(255,255,255,.82) 0 7%, transparent 7.5%),
    linear-gradient(145deg,rgba(255,255,255,.26),transparent 54%),
    var(--dkwp-scene-usage)!important;
}

/* Inner teaching scenes get the same dose principle. They remain semantically
   colorful, but paragraphs never sit on a large fluorescent slab. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-article-note,.dk-wp3-prep-rule,.dk-wp3-conj-rule,.dk-wp3-conj-family-rule
){
  --dkwp-inner-bg:var(--dkwp-dose-deep);
  background:linear-gradient(180deg,var(--dkwp-scene-deep) 0%,var(--dkwp-dose-deep) 100%)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-rektion-list,.dk-wp3-prep-contractions
){
  --dkwp-inner-bg:var(--dkwp-dose-reference);
  background:linear-gradient(180deg,var(--dkwp-scene-reference) 0%,var(--dkwp-dose-reference) 100%)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-degree-panel.is-active{
  --dkwp-inner-bg:var(--dkwp-paper,#fff);
  background:var(--dkwp-paper,#fff)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-adj-form-head,.dk-wp3-adverb-role-copy,.dk-wp3-pronoun-current
){
  --dkwp-inner-bg:var(--dkwp-dose-network);
  background:linear-gradient(180deg,var(--dkwp-scene-network) 0%,var(--dkwp-dose-network) 100%)!important;
}

/* Präposition case colors keep their learning semantics, with strong color at
   the top edge and a calmer body for multi-line explanations. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-case-card[data-prep-case="akk"]{
  background:linear-gradient(180deg,var(--dkwp-scene-usage) 0%,var(--dkwp-dose-usage) 100%)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-case-card[data-prep-case="dat"]{
  background:linear-gradient(180deg,var(--dkwp-scene-network) 0%,var(--dkwp-dose-network) 100%)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-case-card[data-prep-case="gen"]{
  background:linear-gradient(180deg,var(--dkwp-scene-deep) 0%,var(--dkwp-dose-deep) 100%)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-wechsel-note>div:first-child{
  background:linear-gradient(180deg,var(--dkwp-scene-usage),var(--dkwp-dose-usage))!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-wechsel-note>div:last-child{
  background:linear-gradient(180deg,var(--dkwp-scene-network),var(--dkwp-dose-network))!important;
}

/* Keep paper islands genuinely neutral; vividness should come from the scene,
   never from tinting dense data cards. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-noun-case-table,.dk-wp3-article-table,.dk-wp3-reference-table,
  .dk-wp3-adj-case-table,.dk-wp3-conj-schema,.dk-wp3-anatomy-card,
  .dk-wp3-examples-workarea>.dk-wp3-section,.dk-wp3-examples-panel.is-active,
  .dk-wp3-network-card,.dk-wp3-network-compare,.dk-wp3-deep-list .dk-wp3-accordion
){
  background-color:#fff;
}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-view{
    background:linear-gradient(180deg,
      var(--dkwp-scene-usage) 0,
      var(--dkwp-scene-usage) 102px,
      var(--dkwp-dose-usage) 210px,
      var(--dkwp-scene-neutral) 360px,
      var(--dkwp-scene-neutral) 100%)!important;
  }
}

@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-network{
    background:linear-gradient(180deg,var(--dkwp-scene-network) 0 58px,var(--dkwp-dose-network) 126px)!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-section--last{
    background:linear-gradient(180deg,var(--dkwp-scene-deep) 0 48px,var(--dkwp-dose-deep) 112px)!important;
  }
}

/* =========================================================
   Phase 8.9 · Workspace state / scroll / responsive hardening
   ========================================================= */
.dk-wp3-stage{
  --dkwp-stage-shift:0%;
  transform:translate3d(var(--dkwp-stage-shift),0,0);
  transition:transform 520ms cubic-bezier(.22,.7,0,1);
  will-change:transform;
}
.dk-wp3-view-panel{
  left:var(--dkwp-panel-offset,0%);
  right:auto;
  top:0;
  bottom:0;
  transform:none !important;
  contain:layout paint;
  overscroll-behavior-y:contain;
}
.dk-wp3-view-panel.is-active{z-index:2}
.dk-wp3-view-panel:not(.is-active){z-index:1}

.dk-wp3-sentence-nav-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:8px;
}
.dk-wp3-context-btn{
  min-height:34px;
  padding:7px 11px;
  font-size:var(--dkwp-f-11,11px);
  font-weight:900;
  line-height:1.15;
  white-space:nowrap;
}
.dk-wp3-context-btn--back{
  background:linear-gradient(180deg,rgba(183,216,246,.58),rgba(255,255,255,.96));
}
.dk-wp3-context-btn--back:hover,
.dk-wp3-context-btn--back:focus-visible{
  background:linear-gradient(180deg,rgba(183,216,246,.9),rgba(255,255,255,.98));
}

@container dkwp-shell (max-width:620px){
  .dk-wp3-sentence-summary-top{gap:10px}
  .dk-wp3-sentence-nav-actions{width:100%;justify-content:flex-start}
  .dk-wp3-context-btn{min-height:36px}
}

@container dkwp-shell (max-width:470px){
  .dk-wp3-sentence-nav-actions{display:grid;grid-template-columns:1fr}
  .dk-wp3-context-btn{width:100%;white-space:normal;text-align:left}
}

@media (prefers-reduced-motion:reduce){
  .dk-wp3-stage{transition:none !important;will-change:auto}
}

/* =========================================================
   Phase 8.10 · Full-bleed scene backgrounds
   Colored scenes must reach the panel edges; only the content stays inset.
   ========================================================= */
.dk-wp3-word-view,
.dk-wp3-examples-view,
.dk-wp3-sentence-view{
  --dkwp-view-gutter:18px;
}

.dk-wp3-word-view > :is(.dk-wp3-hero,.dk-wp3-section,.dk-wp3-sentence-summary,.dk-wp3-sentence-state),
.dk-wp3-examples-view > :is(.dk-wp3-hero,.dk-wp3-section,.dk-wp3-sentence-summary,.dk-wp3-sentence-state),
.dk-wp3-sentence-view > :is(.dk-wp3-hero,.dk-wp3-section,.dk-wp3-sentence-summary,.dk-wp3-sentence-state){
  box-sizing:border-box;
  margin-inline:calc(var(--dkwp-view-gutter) * -1);
  border-top-left-radius:0;
  border-top-right-radius:0;
  border-bottom-left-radius:0;
  border-bottom-right-radius:0;
}

.dk-wp3-word-view > .dk-wp3-hero,
.dk-wp3-examples-view > .dk-wp3-hero,
.dk-wp3-sentence-view > .dk-wp3-hero{
  padding-left:calc(22px + var(--dkwp-view-gutter));
  padding-right:calc(22px + var(--dkwp-view-gutter));
}

.dk-wp3-word-view > .dk-wp3-section,
.dk-wp3-examples-view > .dk-wp3-section,
.dk-wp3-sentence-view > .dk-wp3-section,
.dk-wp3-sentence-summary{
  padding-left:calc(20px + var(--dkwp-view-gutter));
  padding-right:calc(20px + var(--dkwp-view-gutter));
}

.dk-wp3-word-view > .dk-wp3-sentence-state,
.dk-wp3-examples-view > .dk-wp3-sentence-state,
.dk-wp3-sentence-view > .dk-wp3-sentence-state{
  padding-left:calc(36px + var(--dkwp-view-gutter));
  padding-right:calc(36px + var(--dkwp-view-gutter));
}

/* Keep the first scene flush under the mode bar and the last scene flush near
   the panel bottom so there is no pale gutter beside vivid sections. */
.dk-wp3-word-view > :first-child,
.dk-wp3-examples-view > :first-child,
.dk-wp3-sentence-view > :first-child{
  margin-top:0;
}

.dk-wp3-word-view > :last-child,
.dk-wp3-examples-view > :last-child,
.dk-wp3-sentence-view > :last-child{
  margin-bottom:0;
}

@container dkwp-shell (max-width:620px){
  .dk-wp3-word-view,
  .dk-wp3-examples-view,
  .dk-wp3-sentence-view{
    --dkwp-view-gutter:12px;
  }

  .dk-wp3-word-view > .dk-wp3-hero,
  .dk-wp3-examples-view > .dk-wp3-hero,
  .dk-wp3-sentence-view > .dk-wp3-hero{
    padding-left:calc(18px + var(--dkwp-view-gutter));
    padding-right:calc(18px + var(--dkwp-view-gutter));
  }

  .dk-wp3-word-view > .dk-wp3-section,
  .dk-wp3-examples-view > .dk-wp3-section,
  .dk-wp3-sentence-view > .dk-wp3-section,
  .dk-wp3-sentence-summary{
    padding-left:calc(16px + var(--dkwp-view-gutter));
    padding-right:calc(16px + var(--dkwp-view-gutter));
  }

  .dk-wp3-word-view > .dk-wp3-sentence-state,
  .dk-wp3-examples-view > .dk-wp3-sentence-state,
  .dk-wp3-sentence-view > .dk-wp3-sentence-state{
    padding-left:calc(22px + var(--dkwp-view-gutter));
    padding-right:calc(22px + var(--dkwp-view-gutter));
  }
}

@container dkwp-shell (max-width:470px){
  .dk-wp3-word-view,
  .dk-wp3-examples-view,
  .dk-wp3-sentence-view{
    --dkwp-view-gutter:10px;
  }

  .dk-wp3-word-view > .dk-wp3-hero,
  .dk-wp3-examples-view > .dk-wp3-hero,
  .dk-wp3-sentence-view > .dk-wp3-hero{
    padding-left:calc(15px + var(--dkwp-view-gutter));
    padding-right:calc(15px + var(--dkwp-view-gutter));
  }

  .dk-wp3-word-view > .dk-wp3-section,
  .dk-wp3-examples-view > .dk-wp3-section,
  .dk-wp3-sentence-view > .dk-wp3-section,
  .dk-wp3-sentence-summary{
    padding-left:calc(13px + var(--dkwp-view-gutter));
    padding-right:calc(13px + var(--dkwp-view-gutter));
  }

  .dk-wp3-word-view > .dk-wp3-sentence-state,
  .dk-wp3-examples-view > .dk-wp3-sentence-state,
  .dk-wp3-sentence-view > .dk-wp3-sentence-state{
    padding-left:calc(18px + var(--dkwp-view-gutter));
    padding-right:calc(18px + var(--dkwp-view-gutter));
  }
}

/* =========================================================
   Phase 8.11 · Scene/content unification
   One section = one scene. The full-bleed chapter background owns the canvas;
   only real information cards remain paper islands. This removes the nested
   cream slab / colored side-rail effect introduced by the old inner workarea.
   ========================================================= */

/* WORD NETWORK · keep the sky chapter and let the content live directly on
   its softened sky body. The section-to-section torn edge from 8.4 remains;
   the obsolete second torn edge inside the same section is removed. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-network{
  background:linear-gradient(180deg,
    var(--dkwp-scene-network) 0,
    var(--dkwp-scene-network) 78px,
    var(--dkwp-dose-network) 170px,
    #eef8ff 100%)!important;
  padding-bottom:24px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-title{
  margin-bottom:0;
  padding-bottom:10px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-groups{
  position:relative;
  z-index:1;
  margin:10px 0 0!important;
  padding:8px 0 4px!important;
  background:transparent!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-groups::before{
  content:none!important;
  display:none!important;
}

/* The first information group should feel attached to the chapter heading,
   not like a new cream page starting underneath it. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-group:first-child{
  padding-top:0;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-group + .dk-wp3-network-group{
  margin-top:20px;
  padding-top:20px;
  border-top:1.5px solid rgba(21,22,23,.16);
}

/* DEEP DIVE · same rule: lime is the scene, white accordions are the actual
   objects. No second cream stage and no second wave inside the section. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-section--last{
  background:linear-gradient(180deg,
    var(--dkwp-scene-deep) 0,
    var(--dkwp-scene-deep) 62px,
    var(--dkwp-dose-deep) 142px,
    #feffe7 100%)!important;
  padding-bottom:24px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section--last>.dk-wp3-section-head{
  margin-bottom:0;
  padding-bottom:8px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section--last>.dk-wp3-deep-list{
  position:relative;
  z-index:1;
  margin:10px 0 0!important;
  padding:6px 0 4px!important;
  background:transparent!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section--last>.dk-wp3-deep-list::before{
  content:none!important;
  display:none!important;
}

/* The cards remain neutral islands, but the whitespace between them belongs
   to the scene color rather than to a second boxed wrapper. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-network-card,
  .dk-wp3-network-compare,
  .dk-wp3-deep-list .dk-wp3-accordion
){
  background-color:var(--dkwp-paper)!important;
}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-network,
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-section--last{
    padding-bottom:21px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-groups,
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section--last>.dk-wp3-deep-list{
    margin-top:8px!important;
    padding-top:5px!important;
  }
}

@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-network{
    background:linear-gradient(180deg,
      var(--dkwp-scene-network) 0 58px,
      var(--dkwp-dose-network) 124px,
      #eef8ff 100%)!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-section--last{
    background:linear-gradient(180deg,
      var(--dkwp-scene-deep) 0 50px,
      var(--dkwp-dose-deep) 112px,
      #feffe7 100%)!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-title,
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section--last>.dk-wp3-section-head{
    padding-bottom:6px;
  }
}

/* =========================================================
   Phase 8.12 · Visual weight + typography hierarchy
   Readable never means uniformly heavy. Titles, values, labels and support
   copy now have distinct voices; micro information surfaces stop competing
   with primary cards. Functional layout and scene architecture stay intact.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
  --dkwp-weight-display:950;
  --dkwp-weight-title:900;
  --dkwp-weight-value:825;
  --dkwp-weight-control:800;
  --dkwp-weight-label:750;
  --dkwp-weight-copy:675;
  --dkwp-line-primary:rgba(21,22,23,.78);
  --dkwp-line-secondary:rgba(21,22,23,.28);
  --dkwp-line-micro:rgba(21,22,23,.18);
}

/* 8.12.1 · Chapter hierarchy. Real headings remain dominant; descriptive
   copy becomes calmer without reverting to thin/low-contrast typography. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section-head h3,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-group-titleline h4{
  font-weight:var(--dkwp-weight-title)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section-head p,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section-intro,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-group-head p{
  color:rgba(21,22,23,.72)!important;
  font-weight:var(--dkwp-weight-copy)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-kicker{
  font-weight:800!important;
  border-color:var(--dkwp-line-micro)!important;
  background:rgba(255,255,255,.5)!important;
}

/* 8.12.2 · Field labels are signposts, not mini headlines. Keep them dark
   and readable while giving the actual values more visual authority. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-noun-fact>span,.dk-wp3-article-fact>span,.dk-wp3-pronoun-fact>span,
  .dk-wp3-adj-fact>span,.dk-wp3-prep-fact>span,.dk-wp3-prep-article>span,
  .dk-wp3-conj-fact>span,.dk-wp3-snapshot span,.dk-wp3-network-type,
  .dk-wp3-network-note span,.dk-wp3-network-example>span,
  .dk-wp3-network-difference>span,.dk-wp3-network-detail>span,
  .dk-wp3-network-group-head>div>span.dk-wp3-gram,.dk-wp3-anatomy-role
){
  color:rgba(21,22,23,.68)!important;
  font-weight:var(--dkwp-weight-label)!important;
}

/* Primary values: strong, but no longer indistinguishable from section titles. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-noun-fact>strong,.dk-wp3-article-fact>strong,.dk-wp3-adj-fact>strong,
  .dk-wp3-pronoun-fact>strong,.dk-wp3-prep-fact>strong,.dk-wp3-conj-fact>strong,
  .dk-wp3-snapshot>strong,.dk-wp3-article-use-top strong,.dk-wp3-pronoun-current strong,
  .dk-wp3-adverb-identity strong,.dk-wp3-prep-case-top>strong,
  .dk-wp3-prep-subhead strong,.dk-wp3-conj-token strong
){
  font-weight:var(--dkwp-weight-value)!important;
}

/* Table/case micro-headings sit between labels and values. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-noun-case-head,.dk-wp3-article-table-head>*,.dk-wp3-pronoun-person-head,
  .dk-wp3-pronoun-case-head,.dk-wp3-noun-case-name strong,.dk-wp3-article-case strong,
  .dk-wp3-adj-case-name strong
){
  font-weight:800!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-noun-case-name small,.dk-wp3-article-case small,.dk-wp3-adj-case-name small
){
  color:rgba(21,22,23,.64)!important;
  font-weight:700!important;
}

/* 8.12.3 · Selector typography: selected controls stay obvious through shape
   and fill, so every line of copy no longer needs 900 weight. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-noun-seg span,.dk-wp3-article-family strong,.dk-wp3-adj-form strong,
  .dk-wp3-adj-strength span,.dk-wp3-adj-gender span,.dk-wp3-prep-group strong,
  .dk-wp3-conj-group strong,.dk-wp3-tense-chip span,.dk-wp3-seg,
  .dk-wp3-degree-step strong
){
  font-weight:var(--dkwp-weight-control)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-noun-seg small,.dk-wp3-article-family small,.dk-wp3-adj-strength small,
  .dk-wp3-adj-gender small,.dk-wp3-prep-group small,.dk-wp3-conj-group small,
  .dk-wp3-tense-chip small,.dk-wp3-degree-step small,.dk-wp3-degree-step .dk-wp3-gram,
  .dk-wp3-adj-form .dk-wp3-gram
){
  color:rgba(21,22,23,.66)!important;
  font-weight:700!important;
}

/* Selector chrome moves from “small card” to “interactive control”: still
   tactile, but its frame no longer competes with real information cards. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-noun-seg,.dk-wp3-article-family,.dk-wp3-adj-form,.dk-wp3-adj-strength,
  .dk-wp3-adj-gender,.dk-wp3-prep-group,.dk-wp3-conj-group,.dk-wp3-tense-chip,
  .dk-wp3-mini-seg,.dk-wp3-seg,.dk-wp3-degree-step
){
  border-width:1.5px!important;
  border-color:rgba(21,22,23,.32)!important;
  box-shadow:1px 1px 0 rgba(21,22,23,.48)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-noun-seg,.dk-wp3-article-family,.dk-wp3-adj-form,.dk-wp3-adj-strength,
  .dk-wp3-adj-gender,.dk-wp3-prep-group,.dk-wp3-conj-group,.dk-wp3-tense-chip,
  .dk-wp3-mini-seg,.dk-wp3-seg,.dk-wp3-degree-step
):hover{
  transform:translate(-1px,-1px)!important;
  box-shadow:2px 3px 0 rgba(21,22,23,.78)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-noun-seg,.dk-wp3-article-family,.dk-wp3-adj-form,.dk-wp3-adj-strength,
  .dk-wp3-adj-gender,.dk-wp3-prep-group,.dk-wp3-conj-group,.dk-wp3-tense-chip,
  .dk-wp3-mini-seg,.dk-wp3-seg,.dk-wp3-degree-step
).is-active{
  border-width:2px!important;
  border-color:var(--dkwp-ink)!important;
  box-shadow:2px 2px 0 rgba(21,22,23,.82)!important;
}

/* 8.12.4 · Dense fact tiles are secondary information surfaces. Their content
   provides the hierarchy; thick outlines are unnecessary. Primary grammar
   tables and actual action cards keep their stronger frames. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-noun-fact,.dk-wp3-article-fact,.dk-wp3-adj-fact,.dk-wp3-pronoun-fact,
  .dk-wp3-prep-fact,.dk-wp3-prep-article,.dk-wp3-conj-fact,.dk-wp3-snapshot
){
  border-width:1.5px!important;
  border-color:var(--dkwp-line-secondary)!important;
  box-shadow:none!important;
}

/* Compact explanatory notes should read as notes, not another nested card. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-article-note,.dk-wp3-prep-wechsel-note,.dk-wp3-network-detail
){
  border-width:1.25px!important;
  border-color:var(--dkwp-line-micro)!important;
  box-shadow:none!important;
}

/* 8.12.5 · Reading typography: German example is the anchor, translation and
   explanation are supporting voices. Nothing becomes faint or lightweight. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-de,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-de{
  font-weight:800!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-tr,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-tr{
  color:rgba(21,22,23,.68)!important;
  font-weight:650!important;
  opacity:1!important;
}

/* Wortnetz copy follows the same information ladder. Card architecture itself
   is intentionally left for Phase 8.13. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-word{
  font-weight:850!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-meaning,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-difference p,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-example--compare .dk-wp3-network-example-de{
  font-weight:750!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-explain,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail p,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-example-tr{
  color:rgba(21,22,23,.68)!important;
  font-weight:650!important;
  opacity:1!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-word--compare{
  font-weight:900!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-count{
  font-weight:800!important;
  border-color:rgba(21,22,23,.26)!important;
}

/* Preserve clearly actionable buttons. Their text stays stronger than passive
   labels, while secondary reveal actions drop one step below primary actions. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-btn,.dk-wp3-notebook-action,.dk-wp3-save-slot>[id^="defter-badge-"],
  .dk-wp3-sentence-btn,.dk-wp3-context-btn
){
  font-weight:850!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-more,.dk-wp3-network-detail-toggle
){
  font-weight:800!important;
}

/* 8.12.6 · Cross-POS value normalization. Local grammar values are important
   content, not chapter headings; keep them consistently one step below h3. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-article-cell strong,.dk-wp3-noun-panel-head strong,
  .dk-wp3-adj-usage-head strong,.dk-wp3-adj-form-head strong,
  .dk-wp3-adj-gender-head strong,.dk-wp3-pronoun-person strong,
  .dk-wp3-prep-contract-form strong,.dk-wp3-prep-wechsel-note strong,
  .dk-wp3-conj-row strong,.dk-wp3-conj-family-rule strong
){
  font-weight:850!important;
}

/* Secondary local headings retain a clear anchor without matching h3 weight. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root :is(
  .dk-wp3-article-family-head strong,.dk-wp3-prep-subhead strong,
  .dk-wp3-adverb-identity strong
){
  font-weight:800!important;
}

/* =========================================================
   Phase 8.13 · Card system + physical-shadow refinement
   One card = one primary accent. Keep DeuKlar tactility, remove stacked
   border + stripe + shadow + icon-box emphasis from dense reading surfaces.
   ========================================================= */

/* 8.13.1 · Wortnetz family/component cards: quiet paper rows with one
   semantic left accent. The old top stripe and extra physical weight go. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card{
  border:1.25px solid rgba(21,22,23,.24)!important;
  border-radius:10px!important;
  background:rgba(255,255,255,.9)!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--family{
  border-left:4px solid var(--dkwp-viol-soft)!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--component{
  border-left:4px solid var(--dkwp-peach)!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-note{
  border:0!important;
  border-radius:7px!important;
  background:rgba(247,245,255,.68)!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-example{
  border-top:1px solid rgba(21,22,23,.13)!important;
}

/* Count is attached to the heading, but should read as metadata rather than
   a notification badge. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-count{
  padding:2px 7px 3px!important;
  border:1px solid rgba(21,22,23,.22)!important;
  border-radius:7px!important;
  background:rgba(255,255,255,.58)!important;
  box-shadow:none!important;
  font-weight:750!important;
}

/* 8.13.2 · Confusable-word comparisons: still clearly actionable, but no
   longer a second generation of heavy cards inside Wortnetz. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare{
  border:1.5px solid rgba(21,22,23,.34)!important;
  border-radius:11px!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:1px 1.5px 0 rgba(21,22,23,.34)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare:hover{
  transform:translateY(-1px)!important;
  border-color:rgba(21,22,23,.62)!important;
  box-shadow:2px 2px 0 rgba(21,22,23,.52)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-head{
  border-bottom:1px solid rgba(21,22,23,.12)!important;
  background:rgba(193,179,255,.24)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-relation{
  border:1px solid rgba(21,22,23,.2)!important;
  background:rgba(255,190,152,.26)!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare>.dk-wp3-network-example--compare{
  border-left:1px solid rgba(21,22,23,.13)!important;
  background:rgba(247,245,255,.42)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail{
  border:0!important;
  background:rgba(247,245,255,.74)!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail-toggle{
  min-height:36px!important;
  border:1.5px solid rgba(21,22,23,.68)!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:1px 1px 0 rgba(21,22,23,.54)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail-toggle:hover{
  transform:translate(-1px,-1px)!important;
  background:rgba(255,190,152,.72)!important;
  box-shadow:2px 2px 0 rgba(21,22,23,.66)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail-toggle:active{
  transform:translate(0,0)!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare.is-detail-open .dk-wp3-network-detail-toggle{
  background:rgba(193,179,255,.66)!important;
}

/* 8.13.3 · Deep Dive action rows: the semantic left accent is the hero.
   Border and chevron remain tactile, but neither gets a second heavy shadow. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion{
  border:1.5px solid rgba(21,22,23,.58)!important;
  border-radius:11px!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:nth-child(1){
  box-shadow:inset 5px 0 0 var(--dkwp-viol-soft)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:nth-child(2){
  box-shadow:inset 5px 0 0 var(--dkwp-peach)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:hover{
  transform:translate(-1px,-1px)!important;
  border-color:rgba(21,22,23,.78)!important;
  box-shadow:inset 5px 0 0 var(--dkwp-viol-soft),2px 2px 0 rgba(21,22,23,.52)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:nth-child(2):hover{
  box-shadow:inset 5px 0 0 var(--dkwp-peach),2px 2px 0 rgba(21,22,23,.52)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion.is-open{
  transform:none!important;
  border-color:rgba(21,22,23,.72)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:nth-child(1).is-open{
  box-shadow:inset 5px 0 0 var(--dkwp-viol-soft)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:nth-child(2).is-open{
  box-shadow:inset 5px 0 0 var(--dkwp-peach)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-head{
  min-height:58px!important;
  padding:11px 12px 11px 16px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-icon{
  width:29px!important;
  height:29px!important;
  border:1.5px solid rgba(21,22,23,.68)!important;
  border-radius:8px!important;
  background:rgba(255,255,255,.9)!important;
  box-shadow:none!important;
}

/* 8.13.4 · Generic icon-only controls keep their affordance but stop behaving
   like mini primary buttons inside already framed cards. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-icon-btn{
  border-width:1.5px!important;
  border-color:rgba(21,22,23,.68)!important;
  box-shadow:1px 1px 0 rgba(21,22,23,.5)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-icon-btn:hover{
  transform:translate(-1px,-1px)!important;
  box-shadow:2px 2px 0 rgba(21,22,23,.64)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-icon-btn:active{
  transform:none!important;
  box-shadow:none!important;
}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare>.dk-wp3-network-example--compare{
    border-left:0!important;
    border-top:1px solid rgba(21,22,23,.13)!important;
  }
}

@media (prefers-reduced-motion:reduce){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
    .dk-wp3-network-compare,.dk-wp3-network-detail-toggle,
    .dk-wp3-deep-list .dk-wp3-accordion,.dk-wp3-icon-btn
  ){
    transition:none!important;
  }
}

/* =========================================================
   Phase 8.14 · Vertical rhythm + transition refinement
   Keep the 8.4 one-strip engine, reduce decorative frequency and remove
   excess scene height. Reading surfaces stay roomy; only dead air shrinks.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
  --dkwp-cut-torn-814:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1280 30' preserveAspectRatio='none'><path d='M0,30 L0,18 L72,10 L146,19 L232,7 L318,16 L406,11 L498,20 L592,9 L688,17 L782,6 L876,16 L968,10 L1062,19 L1152,8 L1232,15 L1280,12 L1280,30 Z' fill='black'/></svg>");
  --dkwp-cut-zig-814:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 960 28' preserveAspectRatio='none'><path d='M0,28 L60,5 L120,28 L180,8 L240,28 L300,3 L360,28 L420,7 L480,28 L540,4 L600,28 L660,9 L720,28 L780,5 L840,28 L900,7 L960,28 L960,28 L0,28 Z' fill='black'/></svg>");
  --dkwp-cut-standard-h:17px;
  --dkwp-cut-torn-h:15px;
  --dkwp-cut-zig-h:14px;
}

/* 8.14.1 · Global section rhythm. Dense internal tables/cards keep their own
   spacing; only the section canvas and heading gaps become more intentional. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section{
  padding-top:24px;
  padding-bottom:24px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section-head{
  gap:16px;
  margin-bottom:12px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section-intro{
  margin-bottom:11px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-section:first-child,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-view>.dk-wp3-section:first-child{
  margin-top:24px;
}

/* 8.14.2 · Section-to-section cuts: exact same ownership/one-strip contract
   from 8.4, but shallower and less repetitive. The wide wave remains the
   landing-page wave; only its display height is reduced. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+.dk-wp3-section,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-examples-view .dk-wp3-examples-workarea>.dk-wp3-section+.dk-wp3-section{
  --dkwp-cut-image:var(--dkwp-cut-wave-84)!important;
  --dkwp-cut-height:var(--dkwp-cut-standard-h)!important;
  --dkwp-cut-size:100% 100%!important;
  --dkwp-cut-repeat:no-repeat!important;
}

/* Torn is reserved for real category changes and Wortnetz entry. Fewer,
   larger irregular breaks read as torn paper instead of decorative teeth. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-article-reference+.dk-wp3-article-context,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-adj-usage+.dk-wp3-adj-steigerung,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-noun-examples-title"],
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-adj-examples-title"],
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-examples-title"],
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-adverb-examples-title"],
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-pronoun-examples-title"],
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-prep-examples-title"],
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+[aria-labelledby="dk-wp3-conj-examples-title"],
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+.dk-wp3-network{
  --dkwp-cut-image:var(--dkwp-cut-torn-814)!important;
  --dkwp-cut-height:var(--dkwp-cut-torn-h)!important;
}

/* Sentence anatomy keeps the intentional technical saw-cut, but with fewer,
   wider irregular teeth so it no longer reads like a repeated border. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-sentence-view>.dk-wp3-sentence-summary+.dk-wp3-section--sentence{
  --dkwp-cut-image:var(--dkwp-cut-zig-814)!important;
  --dkwp-cut-height:var(--dkwp-cut-zig-h)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-sentence-view>.dk-wp3-sentence-summary+.dk-wp3-section--sentence::before{
  -webkit-mask-image:var(--dkwp-cut-zig-814)!important;
  mask-image:var(--dkwp-cut-zig-814)!important;
}

/* 8.14.3 · Inner teaching cuts stay secondary. They use the continuous engine
   but are deliberately shallower than chapter boundaries. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-article-note,.dk-wp3-rektion-list,.dk-wp3-degree-panel.is-active,
    .dk-wp3-adj-form-head,.dk-wp3-adverb-role-copy,.dk-wp3-pronoun-current,
    .dk-wp3-prep-rule,.dk-wp3-prep-contractions,.dk-wp3-conj-rule,
    .dk-wp3-conj-family-rule){
  margin-top:15px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-article-note,.dk-wp3-rektion-list,.dk-wp3-degree-panel.is-active,
    .dk-wp3-adj-form-head,.dk-wp3-adverb-role-copy,.dk-wp3-pronoun-current,
    .dk-wp3-prep-rule,.dk-wp3-prep-contractions,.dk-wp3-conj-rule,
    .dk-wp3-conj-family-rule)::before{
  top:-8px;
  height:9px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-article-note,.dk-wp3-rektion-list,.dk-wp3-prep-rule,
    .dk-wp3-conj-rule,.dk-wp3-conj-family-rule){
  --dkwp-inner-cut:var(--dkwp-cut-torn-814)!important;
}

/* 8.14.4 · Wortnetz / Deep Dive specific vertical rhythm after 8.11's
   scene-content unification. Their headings now feel attached to first content. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-network{
  padding-top:22px;
  padding-bottom:21px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-title{
  padding-bottom:4px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-groups{
  margin-top:4px!important;
  padding-top:3px!important;
  padding-bottom:2px!important;
  gap:18px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-group-head{
  margin-bottom:9px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-group + .dk-wp3-network-group{
  margin-top:16px;
  padding-top:16px;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-section--last{
  padding-top:22px;
  padding-bottom:21px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section--last>.dk-wp3-section-head{
  padding-bottom:4px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section--last>.dk-wp3-deep-list{
  margin-top:5px!important;
  padding-top:3px!important;
  padding-bottom:2px!important;
  gap:9px;
}

/* Examples workspace follows the same compact scene cadence. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-examples-view>.dk-wp3-section+.dk-wp3-section,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-examples-view>.dk-wp3-hero+.dk-wp3-section{
  padding-top:calc(var(--dkwp-cut-height,17px) + 22px);
}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
    --dkwp-cut-standard-h:14px;
    --dkwp-cut-torn-h:13px;
    --dkwp-cut-zig-h:12px;
    --dkwp-cut-torn-814:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 28' preserveAspectRatio='none'><path d='M0,28 L0,17 L70,9 L145,18 L228,7 L312,16 L398,10 L486,19 L568,8 L640,14 L640,28 Z' fill='black'/></svg>");
    --dkwp-cut-zig-814:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 26' preserveAspectRatio='none'><path d='M0,26 L53,5 L106,26 L160,8 L213,26 L267,3 L320,26 L373,7 L427,26 L480,4 L533,26 L587,8 L640,26 L640,26 L0,26 Z' fill='black'/></svg>");
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section{
    padding-top:21px;
    padding-bottom:21px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section-head{
    gap:10px;
    margin-bottom:10px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-section:first-child,
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-view>.dk-wp3-section:first-child{
    margin-top:20px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-network,
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-section--last{
    padding-top:19px;
    padding-bottom:19px;
  }
}

@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section{
    padding-top:19px;
    padding-bottom:20px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section-head{
    margin-bottom:9px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-groups,
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section--last>.dk-wp3-deep-list{
    margin-top:3px!important;
  }
}

/* =========================================================
   Phase 8.15 · Header + three-view navigation final balance
   Reduce vertical/physical weight; active state is carried by a semantic
   accent rail instead of oversized elevation.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .popup-header{
  min-height:60px;
  padding:10px 14px 10px 16px !important;
  align-items:center !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dkwp-shell-title-group{
  overflow-y:visible !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) #secilen-kelime{
  font-size:var(--dkwp-f-24,24px) !important;
  line-height:1.25 !important;
  padding:2px 0 6px 0 !important;
  letter-spacing:-.03em !important;
}

/* Header controls stay tactile, but no longer compete with the word title. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-font-controls{
  grid-template-columns:26px 22px 26px;
  height:34px;
  border-radius:9px;
  box-shadow:1px 1px 0 rgba(21,22,23,.72);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-font-step{
  width:26px;
  height:26px;
  font-size:var(--dkwp-f-17,17px);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-font-status{
  height:24px;
  font-size:var(--dkwp-f-10_5,10.5px);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(#ses-oku-btn,#report-word-btn,#popup-yenile,#popup-kapat){
  width:34px !important;
  height:34px !important;
  min-width:34px;
  border-radius:9px !important;
  box-shadow:1px 1px 0 rgba(21,22,23,.72) !important;
}
#kelime-penceresi.dk-wp3-active
:is(#ses-oku-btn,#report-word-btn,#popup-yenile,#popup-kapat):hover{
  transform:translate(-1px,-1px) !important;
  box-shadow:2px 2px 0 var(--dkwp-ink) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
:is(#ses-oku-btn,#report-word-btn,#popup-yenile,#popup-kapat) svg{
  width:17px;
  height:17px;
}

/* Navigation is now a compact workspace switcher, not a second card shelf. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-modebar{
  gap:8px;
  padding:9px 12px 10px;
  background:rgba(255,255,255,.94);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  border-bottom:2px solid var(--dkwp-ink);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode{
  --dkwp-mode-accent:var(--dkwp-viol);
  min-height:52px;
  gap:2px;
  padding:8px 11px 9px;
  border:1.5px solid rgba(21,22,23,.24);
  border-radius:12px;
  background:rgba(255,255,255,.9);
  box-shadow:0 1px 0 rgba(21,22,23,.16);
  transform:none;
  overflow:hidden;
  transition:transform .2s var(--dkwp-ease), box-shadow .2s var(--dkwp-ease), border-color .2s ease, background-color .2s ease;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode[data-dkwp-mode="examples"]{
  --dkwp-mode-accent:var(--dkwp-peach);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode[data-dkwp-mode="sentence"]{
  --dkwp-mode-accent:var(--dkwp-sky);
}

/* Remove the old glossy sweep. The semantic rail becomes the only selected
   decoration, closer to the flat physical language of deuklar.app. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode::after{
  display:none;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode::before{
  content:"";
  position:absolute;
  left:9px;
  right:9px;
  bottom:4px;
  top:auto;
  height:4px;
  border-radius:999px;
  background:var(--dkwp-mode-accent);
  opacity:.28;
  transform:scaleX(.34);
  transform-origin:left center;
  transition:transform .24s var(--dkwp-ease), opacity .2s ease;
  z-index:0;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode:hover,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode:focus-visible{
  transform:translateY(-1px);
  border-color:rgba(21,22,23,.5);
  box-shadow:0 2px 0 rgba(21,22,23,.22);
  background:rgba(255,255,255,.98);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode:hover::before,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode:focus-visible::before{
  opacity:.58;
  transform:scaleX(.58);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode.is-active{
  transform:none;
  border:2px solid var(--dkwp-ink);
  background:var(--dkwp-paper);
  box-shadow:0 3px 0 var(--dkwp-ink);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode.is-active::before{
  opacity:1;
  transform:scaleX(1);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode span{
  position:relative;
  z-index:1;
  font-size:var(--dkwp-f-15,15px);
  font-weight:900;
  letter-spacing:-.01em;
  line-height:1.05;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode small{
  position:relative;
  z-index:1;
  display:block !important;
  font-size:var(--dkwp-f-10_5,10.5px);
  font-weight:700;
  line-height:1.1;
  color:rgba(21,22,23,.66);
  opacity:1;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode.is-active small{
  color:rgba(21,22,23,.76);
}

/* A small neutral reset keeps the compact navigation from visually colliding
   with the first full-bleed scene without adding another card/container. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-stage-viewport{
  border-top:4px solid var(--dkwp-cream);
}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-modebar{
    gap:6px;
    padding:7px 9px 8px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode{
    min-height:48px;
    padding:7px 9px 8px;
    border-radius:11px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode span{
    font-size:var(--dkwp-f-14,14px);
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode small{
    font-size:var(--dkwp-f-10,10px);
  }
}

@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .popup-header{
    min-height:56px;
    padding:8px 10px 8px 12px !important;
    align-items:center !important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) #secilen-kelime{
    font-size:var(--dkwp-f-21,21px) !important;
    line-height:1.25 !important;
    padding:2px 0 6px 0 !important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-modebar{
    gap:5px;
    padding:6px 7px 7px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode{
    min-height:46px;
    padding:6px 7px 7px;
    border-radius:10px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode span{
    font-size:var(--dkwp-f-13_5,13.5px);
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode small{
    font-size:var(--dkwp-f-9_5,9.5px);
  }
}

@media (prefers-reduced-motion:reduce){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode,
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mode::before{
    transition:none !important;
  }
}

/* =========================================================
   Phase 8.16 · Action hierarchy system
   One interaction language, six semantic roles.
   Behaviour is unchanged; visual weight follows user intent.
   ========================================================= */

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
  --dkwp-action-border:rgba(21,22,23,.72);
  --dkwp-action-border-soft:rgba(21,22,23,.38);
  --dkwp-action-shadow:rgba(21,22,23,.70);
  --dkwp-action-hover-shadow:rgba(21,22,23,.78);
  --dkwp-action-secondary:#fffaf6;
  --dkwp-action-tertiary:rgba(255,255,255,.64);
  --dkwp-action-disclosure:rgba(255,255,255,.52);
  --dkwp-action-nav:rgba(255,255,255,.72);
}

/* 8.16.1 · Shared tactile contract. Role styles below choose the dosage. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action{
  box-sizing:border-box;
  font-family:'Geist','Nunito',ui-sans-serif,system-ui,sans-serif!important;
  color:var(--dkwp-ink)!important;
  cursor:pointer;
  text-decoration:none!important;
  -webkit-tap-highlight-color:transparent;
  transition:
    transform var(--dkwp-t) var(--dkwp-ease),
    box-shadow var(--dkwp-t) var(--dkwp-ease),
    background-color var(--dkwp-t) ease,
    border-color var(--dkwp-t) ease,
    color var(--dkwp-t) ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action:focus-visible{
  outline:3px solid rgba(106,86,167,.38)!important;
  outline-offset:2px!important;
}

/* PRIMARY · a deliberate destination/action. Keep DeuKlar's physical object. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--primary{
  min-height:40px!important;
  padding:8px 13px!important;
  border:2px solid var(--dkwp-ink)!important;
  border-radius:10px!important;
  background:var(--dkwp-paper)!important;
  box-shadow:2px 2px 0 var(--dkwp-ink)!important;
  font-weight:850!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--primary:hover{
  transform:translate(-1px,-1px)!important;
  background:var(--dkwp-peach)!important;
  box-shadow:3px 3px 0 var(--dkwp-ink)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--primary:active{
  transform:translate(1px,1px)!important;
  box-shadow:1px 1px 0 var(--dkwp-ink)!important;
}

/* SECONDARY · useful next step, not the visual destination of the row. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--secondary{
  min-height:34px!important;
  padding:6px 9px!important;
  border:1.5px solid var(--dkwp-action-border)!important;
  border-radius:8px!important;
  background:var(--dkwp-action-secondary)!important;
  box-shadow:1px 1px 0 rgba(21,22,23,.48)!important;
  font-size:var(--dkwp-f-10_5,10.5px)!important;
  font-weight:750!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--secondary:hover{
  transform:translateY(-1px)!important;
  border-color:var(--dkwp-ink)!important;
  background:rgba(255,190,152,.48)!important;
  box-shadow:1px 2px 0 rgba(21,22,23,.58)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--secondary:active{
  transform:translateY(0)!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--secondary svg{
  width:13px!important;
  height:13px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--secondary:hover svg{
  transform:translateX(2px)!important;
}

/* TERTIARY · supportive action. No raised-card treatment. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--tertiary{
  min-height:32px!important;
  padding:5px 8px!important;
  border:1px solid var(--dkwp-action-border-soft)!important;
  border-radius:8px!important;
  background:var(--dkwp-action-tertiary)!important;
  box-shadow:none!important;
  font-size:var(--dkwp-f-10_5,10.5px)!important;
  font-weight:700!important;
  width:max-content!important;
  max-width:100%;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--tertiary svg{
  transform:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--tertiary:hover svg{
  transform:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--tertiary:hover{
  transform:none!important;
  border-color:rgba(21,22,23,.64)!important;
  background:rgba(193,179,255,.30)!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--tertiary:active{
  transform:translateY(1px)!important;
}

/* DISCLOSURE · expands content; it must read like a control, not a CTA. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--disclosure{
  min-height:32px!important;
  padding:6px 8px!important;
  border:0!important;
  border-top:1px solid rgba(21,22,23,.18)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:rgba(21,22,23,.72)!important;
  font-size:var(--dkwp-f-10_5,10.5px)!important;
  font-weight:750!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--disclosure:hover{
  transform:none!important;
  background:rgba(255,255,255,.46)!important;
  box-shadow:none!important;
  color:var(--dkwp-ink)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--disclosure:active{
  transform:none!important;
  background:rgba(193,179,255,.20)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--disclosure svg{
  width:14px!important;
  height:14px!important;
  opacity:.72;
  animation:none!important;
}

/* NAVIGATION · directional, compact and quiet. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--navigation{
  min-height:31px!important;
  padding:5px 8px!important;
  border:1px solid rgba(21,22,23,.38)!important;
  border-radius:999px!important;
  background:var(--dkwp-action-nav)!important;
  box-shadow:none!important;
  font-size:var(--dkwp-f-10_5,10.5px)!important;
  font-weight:750!important;
  width:max-content!important;
  max-width:100%;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--navigation:hover{
  transform:translateX(-1px)!important;
  border-color:rgba(69,52,115,.62)!important;
  background:rgba(165,216,255,.42)!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--navigation:active{
  transform:translateX(0)!important;
}

/* ICON ACTION · utility controls stay tactile without becoming mini CTAs. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--icon{
  width:32px!important;
  height:32px!important;
  min-width:32px!important;
  min-height:32px!important;
  padding:0!important;
  border:1.5px solid rgba(21,22,23,.56)!important;
  border-radius:8px!important;
  background:rgba(255,255,255,.78)!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--icon:hover{
  transform:translateY(-1px)!important;
  border-color:var(--dkwp-ink)!important;
  background:rgba(165,216,255,.52)!important;
  box-shadow:0 1px 0 rgba(21,22,23,.38)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-icon-btn--sentence.dk-wp3-action--icon:hover{
  background:rgba(255,190,152,.55)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--icon:active{
  transform:translateY(0)!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--icon svg{
  width:14px!important;
  height:14px!important;
  transform:none!important;
}

/* 8.16.2 · Concrete controls that motivated this system. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-btn{
  white-space:nowrap;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-more{
  width:max-content!important;
  max-width:100%;
  margin:8px auto 0!important;
  justify-content:center!important;
  border-top:0!important;
  border-radius:8px!important;
  padding:6px 9px!important;
  background:rgba(255,255,255,.38)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-more:hover{
  background:rgba(193,179,255,.24)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-footer{
  padding:0 12px 10px!important;
  display:flex!important;
  justify-content:flex-start!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail-toggle{
  width:max-content!important;
  max-width:100%;
  margin:4px 0 0!important;
  border-top:0!important;
  border-radius:8px!important;
  padding:5px 7px!important;
  background:rgba(247,245,255,.66)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail-toggle:hover{
  background:rgba(193,179,255,.30)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare.is-detail-open .dk-wp3-network-detail-toggle{
  background:rgba(193,179,255,.30)!important;
}

/* Accordion headers are disclosure rows, but unlike tiny inline reveals they
   own the whole row. Keep the semantic role while preserving the row geometry. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-accordion-head.dk-wp3-action--disclosure{
  width:100%;
  min-height:52px!important;
  padding:10px 11px 10px 16px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:var(--dkwp-ink)!important;
  font-size:inherit!important;
  font-weight:800!important;
  text-align:left;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-accordion-head.dk-wp3-action--disclosure:hover{
  background:rgba(255,255,255,.42)!important;
}

/* Existing quiet word-audio buttons should now be genuinely quiet. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-btn--quiet.dk-wp3-action--tertiary{
  min-height:34px!important;
  padding:6px 9px!important;
}

@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--secondary{
    min-height:32px!important;
    padding:5px 7px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--icon{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    min-height:30px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action--navigation{
    min-height:30px!important;
    padding:5px 7px!important;
  }
}

@media (prefers-reduced-motion:reduce){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-action{
    transition:none!important;
  }
}

/* =========================================================
   Phase 8.17 · Examples workspace composition
   Peach is the workspace scene; paper belongs to real example rows only.
   ========================================================= */

/* 8.17.1 · Remove the nested white-page architecture. The workspace scene
   itself supplies the background; section/panel wrappers only organize content. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-view{
  background:
    linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,0) 170px),
    var(--dkwp-stage-peach)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea{
  padding:0 0 10px!important;
  background:transparent!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea>.dk-wp3-section{
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-examples-panel.is-active{
  display:grid!important;
  gap:9px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

/* 8.17.2 · Section copy belongs to the scene, not to another card. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-section-head{
  margin:0 2px 8px!important;
  padding:0 2px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-section-intro{
  max-width:680px!important;
  margin:0 4px 11px!important;
color:var(--dkwp-ink,#151617)!important;
}

/* Sticky filters remain a tool shelf, but no longer look like a white panel
   sitting inside the peach panel. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-tense-strip{
  top:-1px!important;
  margin:0 0 11px!important;
  padding:6px 2px 7px!important;
  border:0!important;
  border-bottom:1px solid rgba(21,22,23,.18)!important;
  border-radius:0!important;
  background:rgba(255,232,216,.92)!important;
  box-shadow:none!important;
  backdrop-filter:blur(10px)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-tense-chip{
  min-height:42px!important;
  padding:7px 9px!important;
  border:1px solid rgba(21,22,23,.28)!important;
  border-radius:9px!important;
  background:rgba(255,255,255,.66)!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-tense-chip:hover{
  transform:translateY(-1px)!important;
  border-color:rgba(21,22,23,.58)!important;
  background:rgba(255,255,255,.88)!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-tense-chip.is-active{
  border-color:rgba(69,52,115,.60)!important;
  background:rgba(193,179,255,.68)!important;
  box-shadow:inset 0 -2px 0 rgba(69,52,115,.34)!important;
}

/* 8.17.3 · The sentence itself is now the paper object. No second list frame. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-example{
  grid-template-columns:32px minmax(0,1fr) auto!important;
  gap:10px!important;
  align-items:center!important;
  padding:12px 12px!important;
  border:1px solid rgba(21,22,23,.24)!important;
  border-radius:11px!important;
  background:rgba(255,255,255,.88)!important;
  box-shadow:0 1px 0 rgba(21,22,23,.12)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-example:last-of-type{
  border-bottom:1px solid rgba(21,22,23,.24)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-example:hover{
  border-color:rgba(21,22,23,.38)!important;
  background:rgba(255,255,255,.96)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-example-index{
  width:28px!important;
  height:28px!important;
  border:1px solid rgba(21,22,23,.20)!important;
  border-radius:8px!important;
  background:rgba(247,245,255,.86)!important;
  font-weight:800!important;
  opacity:.74!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-example-copy{
  padding-right:2px!important;
}

/* 8.17.4 · Word-level recursion stays available without turning every sentence
   into a field of purple underlines. Interaction appears on hover/focus only. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-word-link{
  border:0!important;
  border-radius:4px!important;
  background:transparent!important;
  text-decoration:none!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-word-link:hover{
  background:rgba(193,179,255,.34)!important;
  box-shadow:0 0 0 2px rgba(193,179,255,.18)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-word-link:focus-visible{
  background:rgba(193,179,255,.28)!important;
  box-shadow:0 0 0 2px rgba(106,86,167,.34)!important;
  outline:0!important;
}

/* 8.17.5 · Row actions stay visible, but stop forming a heavy right-hand rail. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-example-actions{
  align-self:center!important;
  gap:5px!important;
  flex-wrap:nowrap!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-action--icon{
  width:30px!important;
  height:30px!important;
  min-width:30px!important;
  min-height:30px!important;
  border-color:rgba(21,22,23,.42)!important;
  background:rgba(255,255,255,.70)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-sentence-btn.dk-wp3-action--secondary{
  min-height:30px!important;
  padding:5px 7px!important;
  border:1px solid rgba(21,22,23,.42)!important;
  border-radius:8px!important;
  background:rgba(255,244,237,.76)!important;
  box-shadow:none!important;
  font-size:var(--dkwp-f-10_5,10.5px)!important;
  font-weight:750!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-sentence-btn.dk-wp3-action--secondary:hover{
  border-color:rgba(21,22,23,.62)!important;
  background:rgba(255,190,152,.50)!important;
  box-shadow:none!important;
}

/* More/less belongs to the list rhythm, not to the CTA hierarchy. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-more{
  margin:2px 0 0 42px!important;
  padding:5px 7px!important;
  min-height:28px!important;
  border:0!important;
  border-radius:7px!important;
  background:rgba(255,255,255,.36)!important;
  color:rgba(21,22,23,.68)!important;
  box-shadow:none!important;
  justify-self:start!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-more:hover{
  background:rgba(193,179,255,.24)!important;
  color:var(--dkwp-ink)!important;
}

/* The cover is allowed to be a branded object, but should not reintroduce a
   second heavy physical card before the lightweight workspace below. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-cover{
  border:1.5px solid rgba(21,22,23,.70)!important;
  box-shadow:2px 2px 0 rgba(21,22,23,.72)!important;
}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-example{
    grid-template-columns:30px minmax(0,1fr)!important;
    gap:9px!important;
    align-items:start!important;
    padding:11px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-example-actions{
    grid-column:2!important;
    justify-content:flex-start!important;
    margin-top:4px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-more{
    margin-left:39px!important;
  }
}

@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-section-head{
    margin-left:0!important;
    margin-right:0!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-section-intro{
    margin-left:2px!important;
    margin-right:2px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-tense-strip{
    margin-left:0!important;
    margin-right:0!important;
    padding-left:0!important;
    padding-right:0!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-example{
    grid-template-columns:27px minmax(0,1fr)!important;
    padding:10px 9px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-example-index{
    width:26px!important;
    height:26px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-more{
    margin-left:36px!important;
  }
}

/* =========================================================
   Phase 8.18 · Wortnetz geometry + adaptive information flow
   Natural-height comparison rows; 1/2-column cards respond to content density.
   ========================================================= */

/* 8.18.1 · Chapter copy is one composition. Keep the explanatory sentence
   attached to the Wortnetz heading instead of parking it at the far right. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-title{
  display:block!important;
  max-width:720px!important;
  padding-bottom:5px!important;
  border-bottom:0!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-title>p{
  max-width:590px!important;
  margin:6px 0 0!important;
  text-align:left!important;
  line-height:1.48!important;
  color:rgba(21,22,23,.68)!important;
}

/* 8.18.2 · Short family/component records may share a row. Dense records get
   the whole row so long German/Turkish examples never become narrow columns. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-network-family-grid,.dk-wp3-network-component-grid){
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  align-items:start!important;
  gap:9px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--wide{
  grid-column:1 / -1!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--wide .dk-wp3-network-example{
  grid-template-columns:72px minmax(0,1fr)!important;
  column-gap:9px!important;
}

/* 8.18.3 · Confusable words use natural vertical information rows. The old
   two-column body made the short difference inherit the long example height,
   creating the large empty lower-left area seen in screenshots. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-list{
  gap:10px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare{
  overflow:hidden!important;
  min-height:0!important;
  border:2px solid var(--dkwp-ink, #151617)!important;
  border-radius:14px!important;
  background:#ffffff!important;
  box-shadow:3px 3px 0 var(--dkwp-ink, #151617)!important;
  transition:transform 0.12s ease, box-shadow 0.12s ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare:hover{
  transform:translate(-1.5px, -1.5px)!important;
  box-shadow:5px 5px 0 var(--dkwp-ink, #151617)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-head{
  padding:11px 14px 10px!important;
  border-bottom:2px solid var(--dkwp-ink, #151617)!important;
  background:var(--dkwp-mist, #f7f5ff)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-word--compare{
  font-size:var(--dkwp-f-16_5, 16.5px)!important;
  font-weight:950!important;
  color:var(--dkwp-ink, #151617)!important;
  letter-spacing:-.02em!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-meta .dk-wp3-network-type{
  display:inline-flex!important;
  align-items:center!important;
  padding:3px 9px!important;
  border:1.5px solid var(--dkwp-ink, #151617)!important;
  border-radius:999px!important;
  background:var(--dkwp-viol-soft, #c1b3ff)!important;
  color:var(--dkwp-ink, #151617)!important;
  font-size:10.5px!important;
  font-weight:900!important;
  opacity:1!important;
  line-height:1.2!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-body{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:0!important;
  align-items:start!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-difference{
  display:grid!important;
  grid-template-columns:92px minmax(0,1fr)!important;
  gap:10px!important;
  align-items:start!important;
  min-width:0!important;
  padding:11px 14px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-difference>span{
  margin:2px 0 0!important;
  font-size:10px!important;
  font-weight:900!important;
  color:var(--dkwp-viol-deep, #453473)!important;
  text-transform:uppercase!important;
  letter-spacing:.045em!important;
  opacity:1!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-difference p{
  margin:0!important;
  font-size:var(--dkwp-f-13_5, 13.5px)!important;
  font-weight:800!important;
  line-height:1.5!important;
  color:var(--dkwp-ink, #151617)!important;
  opacity:1!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare>.dk-wp3-network-example--compare{
  display:grid!important;
  grid-template-columns:92px minmax(0,1fr)!important;
  gap:10px!important;
  align-items:start!important;
  min-width:0!important;
  margin:0!important;
  padding:11px 14px!important;
  border-left:0!important;
  border-top:1.5px solid var(--dkwp-ink, #151617)!important;
  background:#ffffff!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-example--compare>span{
  margin:2px 0 0!important;
  font-size:10px!important;
  font-weight:900!important;
  color:var(--dkwp-viol-deep, #453473)!important;
  text-transform:uppercase!important;
  letter-spacing:.045em!important;
  opacity:1!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-example--compare .dk-wp3-network-example-de{
  min-width:0!important;
  font-size:var(--dkwp-f-13, 13px)!important;
  font-weight:750!important;
  line-height:1.5!important;
  color:var(--dkwp-ink, #151617)!important;
  opacity:1!important;
}

/* Detail is a continuation of the card, not another card inside it. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail{
  margin:0!important;
  padding:11px 14px!important;
  border:0!important;
  border-top:1.5px solid var(--dkwp-ink, #151617)!important;
  border-radius:0!important;
  background:#fffdf5!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare.is-detail-open .dk-wp3-network-detail{
  display:grid!important;
  grid-template-columns:92px minmax(0,1fr)!important;
  gap:10px!important;
  align-items:start!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail>span{
  margin:2px 0 0!important;
  font-size:10px!important;
  font-weight:900!important;
  color:var(--dkwp-viol-deep, #453473)!important;
  text-transform:uppercase!important;
  letter-spacing:.045em!important;
  opacity:1!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail p{
  margin:0!important;
  font-size:var(--dkwp-f-13, 13px)!important;
  font-weight:750!important;
  line-height:1.55!important;
  color:var(--dkwp-ink, #151617)!important;
  opacity:1!important;
}

/* Disclosure is now a quiet inline text control. It no longer creates a
   separate CTA block or dictates the card's height. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-footer{
  display:flex!important;
  justify-content:flex-start!important;
  padding:7px 14px 9px 116px!important;
  border-top:1px solid rgba(21,22,23,.12)!important;
  background:var(--dkwp-mist, #f7f5ff)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail-toggle.dk-wp3-action--disclosure{
  width:max-content!important;
  min-height:28px!important;
  margin:0!important;
  padding:4px 8px!important;
  border:1px solid rgba(21,22,23,.22)!important;
  border-radius:6px!important;
  background:#ffffff!important;
  box-shadow:none!important;
  color:var(--dkwp-ink, #151617)!important;
  font-size:11px!important;
  font-weight:850!important;
  transition:background-color 0.12s ease, border-color 0.12s ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail-toggle.dk-wp3-action--disclosure:hover,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare.is-detail-open .dk-wp3-network-detail-toggle.dk-wp3-action--disclosure{
  transform:none!important;
  background:var(--dkwp-peach, #ffbe98)!important;
  border-color:var(--dkwp-ink, #151617)!important;
  box-shadow:none!important;
  color:var(--dkwp-ink, #151617)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail-toggle.dk-wp3-action--disclosure svg{
  width:12px!important;
  height:12px!important;
}

@container dkwp-shell (max-width:760px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-network-family-grid,.dk-wp3-network-component-grid){
    grid-template-columns:1fr!important;
  }
}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-title{
    max-width:none!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-title>p{
    max-width:none!important;
    margin-top:5px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-difference,
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare>.dk-wp3-network-example--compare{
    grid-template-columns:76px minmax(0,1fr)!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare.is-detail-open .dk-wp3-network-detail{
    grid-template-columns:76px minmax(0,1fr)!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-footer{
    padding-left:96px!important;
  }
}

@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-difference,
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare>.dk-wp3-network-example--compare{
    display:block!important;
    padding:9px 10px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-difference>span,
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-example--compare>span{
    display:block!important;
    margin:0 0 3px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare.is-detail-open .dk-wp3-network-detail{
    display:block!important;
    padding:9px 10px 10px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail>span{
    display:block!important;
    margin:0 0 3px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-footer{
    padding:5px 10px 8px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--wide .dk-wp3-network-example{
    grid-template-columns:auto minmax(0,1fr)!important;
  }
}

/* =========================================================
   Phase 8.19 · Hero + section transition final geometry
   One visual seam per chapter boundary. Hero decoration no longer competes
   with the incoming learning scene; sentence anatomy uses an organic ridge.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
  --dkwp-cut-hero-819:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 24' preserveAspectRatio='none'><path d='M0,24 L0,15 C170,4 300,21 470,12 C650,2 790,20 960,10 C1130,1 1270,18 1440,8 L1440,24 Z' fill='black'/></svg>");
  --dkwp-cut-anatomy-819:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 24' preserveAspectRatio='none'><path d='M0,24 L0,13 C62,7 116,3 176,11 C236,19 292,17 354,8 C420,0 478,18 544,10 C612,2 674,17 742,8 C810,0 874,19 944,10 C1010,2 1070,15 1128,8 C1158,5 1182,6 1200,9 L1200,24 Z' fill='black'/></svg>");
  --dkwp-hero-cut-h:15px;
  --dkwp-anatomy-cut-h:13px;
}

/* 8.19.1 · Hero becomes the calm opening canvas, not another raised card.
   The old inner wave and outlined orb caused two extra decorative layers at
   exactly the point where the first grammar chapter needs visual ownership. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-word-view,.dk-wp3-examples-view,.dk-wp3-sentence-view)>.dk-wp3-hero,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-hero{
  overflow:hidden!important;
  border:0!important;
  box-shadow:none!important;
  padding-top:26px!important;
  padding-bottom:25px!important;
  background:#ffffff!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-hero::before,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-hero::after{
  content:none!important;
  display:none!important;
}

/* 8.19.2 · Long dictionary copy keeps all information but reads as two clear
   levels instead of one dense article block. No truncation or data change. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-hero .dk-wp3-meaning{
  max-width:780px!important;
  font-weight:850!important;
  line-height:1.32!important;
  letter-spacing:-.021em!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-hero .dk-wp3-mana{
  max-width:100%!important;
  width:100%!important;
  text-align:justify!important;
  text-justify:inter-word!important;
  hyphens:auto;
  margin-top:11px!important;
  color:var(--dkwp-ink,#151617)!important;
  font-weight:600!important;
  line-height:1.62!important;
}

/* 8.19.3 · Hero -> first learning chapter is ONE seam. Eliminate the pale
   spacer and let the incoming section cut directly into the hero canvas. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-hero+.dk-wp3-section{
  --dkwp-hero-bridge:var(--dkwp-scene-grammar);
  margin-top:0!important;
  padding-top:29px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-hero+.dk-wp3-adj-usage{
  --dkwp-hero-bridge:var(--dkwp-scene-usage);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-hero+.dk-wp3-section::before{
  content:""!important;
  display:block!important;
  z-index:0!important;
  top:calc(-1 * var(--dkwp-hero-cut-h))!important;
  left:0!important;
  right:0!important;
  width:auto!important;
  height:calc(var(--dkwp-hero-cut-h) + 1px)!important;
  background:var(--dkwp-hero-bridge)!important;
  -webkit-mask-image:var(--dkwp-cut-hero-819)!important;
  mask-image:var(--dkwp-cut-hero-819)!important;
  -webkit-mask-size:100% 100%!important;
  mask-size:100% 100%!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center top!important;
  mask-position:center top!important;
  pointer-events:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-hero+.dk-wp3-adverb-role::before{
  content:none!important;
  display:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-hero+.dk-wp3-section>*{
  position:relative;
  z-index:1;
}

/* 8.19.4 · Sentence -> anatomy remains a meaningful scene change, but the
   repeated saw teeth are replaced by one low-amplitude irregular ridge. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-sentence-view>.dk-wp3-sentence-summary+.dk-wp3-section--sentence{
  --dkwp-cut-image:var(--dkwp-cut-anatomy-819)!important;
  --dkwp-cut-height:var(--dkwp-anatomy-cut-h)!important;
  --dkwp-cut-size:100% 100%!important;
  --dkwp-cut-repeat:no-repeat!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-sentence-view>.dk-wp3-sentence-summary+.dk-wp3-section--sentence::before{
  top:calc(1px - var(--dkwp-anatomy-cut-h))!important;
  height:var(--dkwp-anatomy-cut-h)!important;
  -webkit-mask-image:var(--dkwp-cut-anatomy-819)!important;
  mask-image:var(--dkwp-cut-anatomy-819)!important;
  -webkit-mask-size:100% 100%!important;
  mask-size:100% 100%!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center top!important;
  mask-position:center top!important;
}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
    --dkwp-hero-cut-h:13px;
    --dkwp-anatomy-cut-h:11px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-hero{
    padding-top:22px!important;
    padding-bottom:22px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-hero+.dk-wp3-section{
    padding-top:25px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-hero .dk-wp3-meaning{
    line-height:1.3!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-hero .dk-wp3-mana{
    line-height:1.58!important;
  }
}

@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
    --dkwp-hero-cut-h:11px;
    --dkwp-anatomy-cut-h:10px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-hero{
    padding-top:19px!important;
    padding-bottom:20px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-hero+.dk-wp3-section{
    padding-top:23px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-hero .dk-wp3-mana{
    margin-top:9px!important;
  }
}

/* =========================================================
   Phase 8.20 · Sentence workspace + Grammar Anatomy disclosure
   The context summary is compact navigation/content, while long teaching notes
   reveal progressively without deleting or rewriting any model-provided text.
   ========================================================= */

/* 8.20.1 · The sentence context is a full-bleed scene, not another raised card.
   Reduce vertical overhead while keeping sentence, translation and grammar tags
   readable as one compact context unit. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-summary{
  border:0!important;
  box-shadow:none!important;
  padding-top:15px!important;
  padding-bottom:17px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-summary-top{
  align-items:center!important;
  gap:8px!important;
  margin-bottom:5px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-nav-actions{
  gap:6px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-summary .dk-wp3-context-btn{
  min-height:29px!important;
  padding:4px 8px!important;
  font-size:var(--dkwp-f-10,10px)!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-summary blockquote{
  margin:5px 0 6px!important;
  max-width:900px;
  font-size:var(--dkwp-f-20,20px)!important;
  line-height:1.4!important;
  letter-spacing:-.018em!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-translation{
  max-width:900px;
  font-size:var(--dkwp-f-13_5,13.5px)!important;
  font-weight:650!important;
  line-height:1.48!important;
  color:rgba(21,22,23,.78)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-tags{
  gap:6px!important;
  margin-top:9px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-tags span{
  padding:4px 7px!important;
  border:1.5px solid var(--dkwp-ink,#151617)!important;
  background:#ffffff!important;
  color:var(--dkwp-ink,#151617)!important;
  font-size:var(--dkwp-f-10,10px)!important;
  font-weight:750!important;
}

/* 8.20.2 · Anatomy sequence numbers become meaningful inline sequence metadata
   instead of occupying an entire left column. Cards grow only from their content. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy{
  gap:8px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-card{
  display:block!important;
  min-height:0!important;
  padding:12px 13px 12px 15px!important;
  border:1.5px solid var(--dkwp-ink,#151617)!important;
  border-radius:10px!important;
  background:linear-gradient(90deg,var(--accent) 0 5px,#ffffff 5px)!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-main{
  min-width:0;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-meta{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:7px;
  min-width:0;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-no{
  flex:0 0 auto;
  padding:0!important;
color:var(--dkwp-ink,#151617)!important;
  opacity:1!important;
  font-size:var(--dkwp-f-9_5,9.5px)!important;
  font-weight:700!important;
  line-height:1.2!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-role{
  min-width:0;
  font-size:var(--dkwp-f-10,10px)!important;
  font-weight:800!important;
  line-height:1.25!important;
  text-transform:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-target{
  margin-top:4px!important;
  font-size:var(--dkwp-f-16,16px)!important;
  font-weight:850!important;
  line-height:1.34!important;
}

/* 8.20.3 · Full lesson text remains in the DOM unchanged. Long notes show a
   three-line reading preview, then expand in-place via a disclosure action. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-note-wrap{
  margin-top:5px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-note{
  margin:0!important;
  color:rgba(21,22,23,.76)!important;
  font-size:var(--dkwp-f-12_5,12.5px)!important;
  font-weight:600!important;
  line-height:1.56!important;
  opacity:1!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-note-toggle.dk-wp3-action--disclosure{
  width:max-content!important;
  max-width:100%;
  min-height:27px!important;
  margin-top:4px!important;
  padding:3px 6px!important;
  border:0!important;
  border-radius:6px!important;
  background:transparent!important;
  color:var(--dkwp-viol-night)!important;
  font-size:var(--dkwp-f-10,10px)!important;
  font-weight:750!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-note-toggle.dk-wp3-action--disclosure:hover,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-card.is-note-open .dk-wp3-anatomy-note-toggle{
  background:rgba(193,179,255,.22)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-note-toggle svg{
  transition:transform 160ms ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-card.is-note-open .dk-wp3-anatomy-note-toggle svg{
  transform:rotate(180deg)!important;
}

/* 8.20.4 · Bring anatomy content closer to its chapter heading without
   touching the organic 8.19 scene seam. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section--sentence>.dk-wp3-section-head{
  margin-bottom:11px!important;
}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-summary{
    padding-top:13px!important;
    padding-bottom:15px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-summary-top{
    flex-direction:row!important;
    align-items:center!important;
    flex-wrap:wrap;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-nav-actions{
    width:auto!important;
    margin-left:auto;
    justify-content:flex-end!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-summary blockquote{
    font-size:var(--dkwp-f-18_5,18.5px)!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-card{
    padding:11px 11px 11px 13px!important;
  }
}

@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-summary-top{
    align-items:flex-start!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-nav-actions{
    display:flex!important;
    width:100%!important;
    margin-left:0;
    justify-content:flex-start!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-summary .dk-wp3-context-btn{
    width:max-content!important;
    white-space:nowrap!important;
    text-align:left;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-summary blockquote{
    font-size:var(--dkwp-f-17_5,17.5px)!important;
    line-height:1.42!important;
  }
}

@media (prefers-reduced-motion:reduce){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-note-toggle svg{
    transition:none!important;
  }
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-note [hidden]{
  display:none!important;
}

/* =========================================================
   Phase 8.21 · Network render correctness + comparison cleanup
   Translation rows are de-duplicated in JS. Comparison rows use the actual
   DOM hierarchy, so the old dashed example divider can no longer leak through.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-body > .dk-wp3-network-example--compare{
  display:grid!important;
  grid-template-columns:88px minmax(0,1fr)!important;
  gap:9px!important;
  align-items:start!important;
  min-width:0!important;
  margin:0!important;
  padding:9px 11px 10px!important;
  border:0!important;
  border-top:1px solid rgba(21,22,23,.14)!important;
  background:rgba(247,245,255,.30)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-body > .dk-wp3-network-example--compare::before,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-body > .dk-wp3-network-example--compare::after{
  content:none!important;
  display:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-network-difference > span,
  .dk-wp3-network-compare-body > .dk-wp3-network-example--compare > span,
  .dk-wp3-network-detail > span
){
  color:rgba(21,22,23,.58)!important;
  opacity:1!important;
  font-size:var(--dkwp-f-10,10px)!important;
  font-weight:800!important;
  letter-spacing:.012em!important;
  line-height:1.25!important;
  text-transform:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-difference p{
  color:rgba(21,22,23,.82)!important;
  font-weight:775!important;
  line-height:1.45!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-body > .dk-wp3-network-example--compare .dk-wp3-network-example-de{
  color:var(--dkwp-ink)!important;
  font-weight:760!important;
  line-height:1.46!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail-toggle.dk-wp3-action--disclosure{
  min-height:28px!important;
  padding:4px 6px!important;
  color:var(--dkwp-viol-deep)!important;
  font-size:var(--dkwp-f-10_5,10.5px)!important;
  font-weight:825!important;
  opacity:1!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail-toggle.dk-wp3-action--disclosure:focus-visible{
  outline:2px solid rgba(106,86,167,.40)!important;
  outline-offset:2px!important;
}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-body > .dk-wp3-network-example--compare{
    grid-template-columns:76px minmax(0,1fr)!important;
  }
}

@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-body > .dk-wp3-network-example--compare{
    display:block!important;
    padding:9px 10px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-body > .dk-wp3-network-example--compare > span{
    display:block!important;
    margin:0 0 3px!important;
  }
}

/* =========================================================
   Phase 8.22 · Rektion scene/content unification
   Rektion is a list of real paper cards, not an inner colored scene. The
   grammar section owns the violet scene; peach survives only as the semantic
   structure accent on each rection card.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] > .dk-wp3-rektion-list{
  display:grid!important;
  gap:9px!important;
  margin-top:10px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  isolation:auto!important;
  --dkwp-inner-bg:transparent!important;
  --dkwp-inner-cut:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] > .dk-wp3-rektion-list::before,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] > .dk-wp3-rektion-list::after{
  content:none!important;
  display:none!important;
  -webkit-mask-image:none!important;
  mask-image:none!important;
}

/* One information object = one paper card = one structure accent. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] .dk-wp3-rektion-row{
  display:flex!important;
  flex-direction:column!important;
  gap:10px!important;
  min-width:0!important;
  margin:0 0 12px 0!important;
  padding:14px 16px!important;
  border:2px solid var(--dkwp-ink, #151617)!important;
  border-left:5px solid var(--dkwp-peach, #ffbe98)!important;
  border-radius:14px!important;
  background:#ffffff!important;
  box-shadow:3px 3px 0 var(--dkwp-ink, #151617)!important;
  cursor:pointer!important;
  transition:transform 0.1s ease, box-shadow 0.1s ease, border-color 0.15s ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] .dk-wp3-rektion-row:hover{
  transform:translate(-1px, -1px)!important;
  box-shadow:4.5px 4.5px 0 var(--dkwp-ink, #151617)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] .dk-wp3-rektion-row:active{
  transform:translate(2.5px, 2.5px)!important;
  box-shadow:0.5px 0.5px 0 var(--dkwp-ink, #151617)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] .dk-wp3-rektion-row:last-child{
  margin-bottom:0!important;
  padding-bottom:14px!important;
  border-bottom:2px solid var(--dkwp-ink, #151617)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] .dk-wp3-rektion-head{
  display:flex!important;
  flex-direction:column!important;
  gap:6px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] .dk-wp3-rektion-badge-wrap{
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:8px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] .dk-wp3-rektion-number{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:24px!important;
  height:22px!important;
  padding:0 5px!important;
  border-radius:6px!important;
  background:var(--dkwp-mist, #f2eeff)!important;
  border:1.5px solid var(--dkwp-ink, #151617)!important;
  box-shadow:1px 1px 0 var(--dkwp-ink, #151617)!important;
  font-family:'Fira Code',ui-monospace,monospace!important;
  font-size:10.5px!important;
  font-weight:900!important;
  color:var(--dkwp-viol-deep, #6a56a7)!important;
  line-height:1!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] .dk-wp3-rektion-yapi{
  display:inline-flex!important;
  align-items:center!important;
  padding:3px 10px!important;
  border-radius:8px!important;
  background:#fff8ef!important;
  border:1.5px solid var(--dkwp-ink, #151617)!important;
  box-shadow:1.5px 1.5px 0 var(--dkwp-ink, #151617)!important;
  font-size:14.5px!important;
  font-weight:900!important;
  line-height:1.25!important;
  color:var(--dkwp-ink, #151617)!important;
  letter-spacing:-.01em!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] .dk-wp3-rektion-meaning{
  margin:2px 0 2px 0!important;
  font-size:13.5px!important;
  font-weight:600!important;
  line-height:1.4!important;
  color:rgba(21,22,23,.82)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] .dk-wp3-rektion-example-box{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:12px!important;
  padding:10px 12px!important;
  border-radius:10px!important;
  background:var(--dkwp-mist, #f7f5ff)!important;
  border:1.5px solid rgba(21,22,23,.14)!important;
  border-left:4px solid var(--dkwp-viol, #845ef7)!important;
  box-sizing:border-box!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] .dk-wp3-rektion-example-copy{
  min-width:0!important;
  flex:1 1 auto!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] .dk-wp3-rektion-de{
  font-size:13.5px!important;
  font-weight:700!important;
  line-height:1.45!important;
  color:var(--dkwp-ink, #151617)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] .dk-wp3-rektion-tr{
  margin-top:4px!important;
  font-size:12px!important;
  font-weight:550!important;
  line-height:1.35!important;
  color:rgba(21,22,23,.72)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] .dk-wp3-rektion-actions{
  flex:0 0 auto!important;
  display:flex!important;
  align-items:center!important;
}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] > .dk-wp3-rektion-list{
    gap:8px!important;
    margin-top:9px!important;
    padding:0!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] .dk-wp3-rektion-row{
    grid-template-columns:26px minmax(0,1fr)!important;
    gap:8px!important;
    padding:10px 10px 10px 11px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] .dk-wp3-rektion-row:last-child{
    padding-bottom:10px!important;
  }
}

@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"] .dk-wp3-rektion-row{
    grid-template-columns:22px minmax(0,1fr)!important;
    padding-left:10px!important;
  }
}

/* =========================================================
   Phase 8.23 · Examples workspace final cleanup
   Native scroll chrome disappears without removing horizontal access; the
   cover becomes a calm workspace header, repeated headings are resolved in
   render copy, and row actions keep meaning without forming a text rail.
   ========================================================= */

/* 8.23.1 · The filter remains horizontally scrollable, keyboard reachable and
   touch friendly. Hide OS chrome; reserve blank space under the right fade so
   the final chip can still settle fully into view. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-examples-workarea .dk-wp3-tense-strip{
  overflow-x:auto!important;
  overflow-y:hidden!important;
  overscroll-behavior-inline:contain!important;
  scrollbar-width:none!important;
  -ms-overflow-style:none!important;
  scroll-snap-type:x proximity!important;
  scroll-padding-inline:2px 30px!important;
  padding-right:30px!important;
  -webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 25px),transparent 100%)!important;
  mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 25px),transparent 100%)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-examples-workarea .dk-wp3-tense-strip::-webkit-scrollbar{
  width:0!important;
  height:0!important;
  display:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-examples-workarea .dk-wp3-tense-chip{
  scroll-snap-align:start!important;
  scroll-snap-stop:normal!important;
}

/* 8.23.2 · The cover communicates context; it is not another physical promo
   card. Decorative orbs are removed and non-interactive capability labels no
   longer impersonate buttons. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-cover{
  padding:18px 18px 17px!important;
  border:1px solid rgba(21,22,23,.34)!important;
  border-radius:16px!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.20),transparent 56%),
    var(--dkwp-scene-usage)!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-cover::after{
  content:none!important;
  display:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-cover h2{
  max-width:100%!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-capabilities{
  gap:13px!important;
  margin-top:11px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-capabilities span{
  min-height:0!important;
  gap:5px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:rgba(21,22,23,.66)!important;
  font-size:var(--dkwp-f-10_5,10.5px)!important;
  font-weight:725!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-capabilities svg{
  width:13px!important;
  height:13px!important;
}

/* 8.23.3 · Repeated sentence actions remain explicit and touch-safe but read
   as a compact row utility. The DOM text stays "Cümleyi incele" for assistive
   technology; only the visual label is shortened to "İncele". */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-examples-workarea .dk-wp3-sentence-btn.dk-wp3-action--secondary{
  min-width:0!important;
  min-height:30px!important;
  gap:4px!important;
  padding:4px 6px!important;
  color:rgba(21,22,23,.72)!important;
  font-size:0!important;
  font-weight:775!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-examples-workarea .dk-wp3-sentence-btn.dk-wp3-action--secondary::before{
  content:"İncele";
  font-size:var(--dkwp-f-10,10px)!important;
  line-height:1!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-examples-workarea .dk-wp3-sentence-btn.dk-wp3-action--secondary svg{
  width:12px!important;
  height:12px!important;
  opacity:.72!important;
  transform:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-examples-workarea .dk-wp3-sentence-btn.dk-wp3-action--secondary:hover svg{
  transform:translateX(2px)!important;
}

/* Tighten the bridge from cover to the first real control shelf now that the
   duplicate title wording is gone. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workspace{
  gap:13px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-examples-workarea .dk-wp3-section-head{
  margin-bottom:7px!important;
}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-cover{
    padding:16px 15px 15px!important;
    border-radius:14px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-examples-workarea .dk-wp3-tense-strip{
    scroll-padding-right:27px!important;
    padding-right:27px!important;
    -webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 22px),transparent 100%)!important;
    mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 22px),transparent 100%)!important;
  }
}

@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-cover{
    padding:14px 13px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-examples-workarea .dk-wp3-tense-strip{
    padding-left:0!important;
    padding-right:24px!important;
    scroll-padding-right:24px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-examples-workarea .dk-wp3-sentence-btn.dk-wp3-action--secondary{
    min-height:29px!important;
    padding:4px 5px!important;
  }
}

@media (prefers-reduced-motion:reduce){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
  .dk-wp3-examples-workarea .dk-wp3-tense-strip{
    scroll-behavior:auto!important;
  }
}

/* =========================================================
   Phase 8.24 · Grammar Anatomy disclosure calibration
   Disclosure is now exceptional rather than the default. Closed cards stay
   compact; expanded long lessons regain breathing room without hiding data.
   ========================================================= */

/* 8.24.1 · A denser default rhythm now that short/medium notes remain inline. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy{
  gap:7px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-card{
  padding:10px 12px 10px 14px!important;
  transition:padding 160ms ease,background-color 160ms ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-card.is-note-open{
  padding:12px 13px 13px 15px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-meta{
  gap:6px!important;
}

/* 8.24.2 · Sequence + role are quiet metadata, but no longer near the
   readability floor. They should be scannable before the anatomy target. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-no{
  color:var(--dkwp-ink,#151617)!important;
  font-size:var(--dkwp-f-10,10px)!important;
  font-weight:760!important;
  letter-spacing:.015em!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-role{
  color:var(--dkwp-ink,#151617)!important;
  font-size:var(--dkwp-f-10_5,10.5px)!important;
  font-weight:790!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-target{
  margin-top:3px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-note-wrap{
  margin-top:4px!important;
}

/* 8.24.3 · A disclosure control is a compact reading affordance, not a repeated
   footer row. The expanded state remains clear and keyboard-visible. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-note-toggle.dk-wp3-action--disclosure{
  min-height:24px!important;
  margin-top:3px!important;
  padding:2px 5px!important;
  font-size:var(--dkwp-f-9_5,9.5px)!important;
  font-weight:760!important;
  gap:3px!important;
  text-decoration:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-note-toggle.dk-wp3-action--disclosure svg{
  width:11px!important;
  height:11px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-note-toggle.dk-wp3-action--disclosure:focus-visible{
  outline:2px solid var(--dkwp-ink)!important;
  outline-offset:2px!important;
}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-card{
    padding:9px 10px 9px 12px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-card.is-note-open{
    padding:11px 11px 12px 13px!important;
  }
}

@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-role{
    font-size:var(--dkwp-f-10,10px)!important;
  }
}

@media (prefers-reduced-motion:reduce){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-card{
    transition:none!important;
  }
}

/* =========================================================
   Phase 8.25 · Deep Dive transition + semantic accent consistency
   The network-to-deep boundary gets one shallow organic incoming cut. Deep
   Dive accents are role-based rather than nth-child-based, so missing data
   can never shift Merken/Herkunft/Grammatik color meaning.
   ========================================================= */

/* 8.25.1 · Wortnetz -> Vertiefung is a chapter descent, but not a hard torn
   category jump. Keep the one-strip/no-repeat transition engine and give the
   incoming lime scene a low-amplitude irregular ridge. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
  --dkwp-cut-deep-825:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 24' preserveAspectRatio='none'><path d='M0,24 L0,13 C64,7 122,8 184,12 C250,17 306,5 374,9 C442,14 500,18 566,10 C632,2 694,15 758,11 C824,7 884,3 950,10 C1016,17 1076,7 1136,9 C1162,10 1184,12 1200,10 L1200,24 Z' fill='black'/></svg>");
  --dkwp-cut-deep-825-h:12px;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-network+.dk-wp3-section--last{
  --dkwp-cut-image:var(--dkwp-cut-deep-825)!important;
  --dkwp-cut-height:var(--dkwp-cut-deep-825-h)!important;
  --dkwp-cut-size:100% 100%!important;
  --dkwp-cut-repeat:no-repeat!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-network+.dk-wp3-section--last::before{
  top:calc(1px - var(--dkwp-cut-deep-825-h))!important;
  height:var(--dkwp-cut-deep-825-h)!important;
  background:var(--dkwp-section-stage)!important;
  -webkit-mask-image:var(--dkwp-cut-deep-825)!important;
  mask-image:var(--dkwp-cut-deep-825)!important;
  -webkit-mask-size:100% 100%!important;
  mask-size:100% 100%!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center top!important;
  mask-position:center top!important;
}

/* 8.25.2 · Semantic accent contract. The renderer supplies the role class;
   CSS owns the visual token. One card = one primary accent. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion{
  --dkwp-deep-accent:var(--dkwp-viol-soft);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:is(
  .dk-wp3-accordion--memory,.dk-wp3-accordion--origin,.dk-wp3-accordion--grammar
){
  box-shadow:inset 4px 0 0 var(--dkwp-deep-accent)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion--memory{
  --dkwp-deep-accent:var(--dkwp-viol-soft);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion--origin{
  --dkwp-deep-accent:var(--dkwp-peach);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion--grammar{
  --dkwp-deep-accent:var(--dkwp-sky);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:is(
  .dk-wp3-accordion--memory,.dk-wp3-accordion--origin,.dk-wp3-accordion--grammar
):hover{
  box-shadow:inset 4px 0 0 var(--dkwp-deep-accent),2px 2px 0 rgba(21,22,23,.42)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:is(
  .dk-wp3-accordion--memory,.dk-wp3-accordion--origin,.dk-wp3-accordion--grammar
).is-open{
  box-shadow:inset 4px 0 0 var(--dkwp-deep-accent)!important;
}

/* The tiny German role label echoes the same semantic token without turning
   the whole header into a colored badge. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-head small{
  display:inline-flex!important;
  align-items:center!important;
  gap:5px!important;
  color:rgba(21,22,23,.68)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-head small::before{
  content:"";
  flex:0 0 auto;
  width:6px;
  height:6px;
  border-radius:999px;
  background:var(--dkwp-deep-accent);
  box-shadow:0 0 0 1px rgba(21,22,23,.18);
}

/* Slightly calmer deep rows: semantic color, not elevation, is the primary
   differentiator. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:hover{
  transform:translateY(-1px)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-icon{
  border-color:rgba(21,22,23,.48)!important;
  background:rgba(255,255,255,.74)!important;
}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
    --dkwp-cut-deep-825-h:10px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:is(
    .dk-wp3-accordion--memory,.dk-wp3-accordion--origin,.dk-wp3-accordion--grammar
  ){
    box-shadow:inset 3px 0 0 var(--dkwp-deep-accent)!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:is(
    .dk-wp3-accordion--memory,.dk-wp3-accordion--origin,.dk-wp3-accordion--grammar
  ):hover{
    box-shadow:inset 3px 0 0 var(--dkwp-deep-accent),1.5px 1.5px 0 rgba(21,22,23,.36)!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:is(
    .dk-wp3-accordion--memory,.dk-wp3-accordion--origin,.dk-wp3-accordion--grammar
  ).is-open{
    box-shadow:inset 3px 0 0 var(--dkwp-deep-accent)!important;
  }
}

@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
    --dkwp-cut-deep-825-h:9px;
  }
}

@media (prefers-reduced-motion:reduce){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion{
    transition:none!important;
  }
}

/* =========================================================
   Phase 8.26 · Cross-POS final acceptance
   Horizontal navigation surfaces share one scrollbar contract. Wide data
   tables keep a visible thin scrollbar; chip/segment lanes keep native scroll
   behavior without exposing OS chrome on one POS but not another.
   ========================================================= */

/* 8.26.1 · Navigation/chip scrollers: preserve wheel/touch/keyboard access,
   remove native horizontal scrollbar chrome consistently across POS views. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-mini-segmented,
  .dk-wp3-tense-strip,
  .dk-wp3-adj-gender-strip,
  .dk-wp3-degree-track,
  .dk-wp3-adj-form-strip,
  .dk-wp3-prep-group-strip,
  .dk-wp3-conj-lane,
  .dk-wp3-conj-group-strip,
  .dk-wp3-article-family-strip,
  .dk-wp3-segmented--scroll
),
.dk-lesson-tabs{
  scrollbar-width:none!important;
  -ms-overflow-style:none!important;
  overscroll-behavior-inline:contain;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-mini-segmented,
  .dk-wp3-tense-strip,
  .dk-wp3-adj-gender-strip,
  .dk-wp3-degree-track,
  .dk-wp3-adj-form-strip,
  .dk-wp3-prep-group-strip,
  .dk-wp3-conj-lane,
  .dk-wp3-conj-group-strip,
  .dk-wp3-article-family-strip,
  .dk-wp3-segmented--scroll
)::-webkit-scrollbar,
.dk-lesson-tabs::-webkit-scrollbar{
  width:0!important;
  height:0!important;
  display:none!important;
}

/* Keep genuinely wide grammar matrices recognizably scrollable. These are
   data surfaces, not navigation strips, so their existing thin scrollbar is
   intentionally retained for discoverability at large type scales. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-article-table-wrap,
  .dk-wp3-pronoun-table-wrap
){
  scrollbar-width:thin;
}

@media (prefers-reduced-motion:reduce){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
    .dk-wp3-mini-segmented,
    .dk-wp3-tense-strip,
    .dk-wp3-adj-gender-strip,
    .dk-wp3-degree-track,
    .dk-wp3-adj-form-strip,
    .dk-wp3-prep-group-strip,
    .dk-wp3-conj-lane,
    .dk-wp3-conj-group-strip,
    .dk-wp3-article-family-strip,
    .dk-wp3-segmented--scroll
  ),
  .dk-lesson-tabs{
    scroll-behavior:auto!important;
  }
}

/* =========================================================
   Phase 9.1 · Wortfamilie / network card redesign
   Stronger card hierarchy: word left, type badge right, meaning leads.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-title{
  max-width:760px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-title>p{
  max-width:620px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card{
  display:flex!important;
  flex-direction:column!important;
  gap:10px!important;
  padding:14px 15px 15px!important;
  border:1.5px solid rgba(21,22,23,.14)!important;
  border-radius:16px!important;
  box-shadow:0 1px 0 rgba(21,22,23,.14)!important;
  cursor:pointer!important;
  transition:transform var(--dkwp-t) var(--dkwp-ease), box-shadow var(--dkwp-t) var(--dkwp-ease)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card:hover{
  transform:translateY(-2px)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--family{
  background:linear-gradient(180deg,rgba(247,244,255,.96) 0%,rgba(255,255,255,.98) 100%)!important;
  box-shadow:0 1px 0 rgba(21,22,23,.14)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--family:hover{
  box-shadow:inset 0 4px 0 var(--dkwp-viol),0 3px 0 rgba(21,22,23,.18)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--component{
  background:linear-gradient(180deg,rgba(255,245,238,.96) 0%,rgba(255,255,255,.98) 100%)!important;
  box-shadow:0 1px 0 rgba(21,22,23,.14)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--component:hover{
  box-shadow:inset 0 4px 0 var(--dkwp-peach),0 3px 0 rgba(21,22,23,.18)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card-top{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:10px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-word{
  min-width:0!important;
  flex:1 1 auto!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  text-align:left!important;
  gap:8px!important;
  padding:0!important;
  font-size:var(--dkwp-f-18,18px)!important;
  line-height:1.18!important;
  letter-spacing:-.025em!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-word svg{
  width:14px!important;
  height:14px!important;
  margin-top:3px!important;
  flex:0 0 auto!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-type-badge{
  flex:0 0 auto!important;
  display:inline-flex!important;
  align-items:center!important;
  min-height:24px!important;
  padding:4px 10px!important;
  border:1.5px solid rgba(21,22,23,.16)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.9)!important;
  color:rgba(21,22,23,.72)!important;
  font-size:var(--dkwp-f-9_5,9.5px)!important;
  font-weight:850!important;
  line-height:1!important;
  letter-spacing:.03em!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--family .dk-wp3-network-type-badge{
  background:rgba(193,179,255,.18)!important;
  color:var(--dkwp-viol-night)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--component .dk-wp3-network-type-badge{
  background:rgba(242,190,156,.22)!important;
  color:rgba(111,63,31,.86)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-meaning{
  margin:0!important;
  font-size:var(--dkwp-f-13_5,13.5px)!important;
  font-weight:900!important;
  line-height:1.42!important;
  color:rgba(21,22,23,.92)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-explain{
  margin:-2px 0 0!important;
  font-size:var(--dkwp-f-11_5,11.5px)!important;
  font-weight:650!important;
  line-height:1.52!important;
  color:rgba(21,22,23,.66)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-note{
  display:block!important;
  margin:0!important;
  padding:9px 10px!important;
  border:1px solid rgba(21,22,23,.08)!important;
  border-radius:11px!important;
  background:rgba(255,255,255,.66)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-note strong{
  display:block!important;
  font-size:var(--dkwp-f-11_3,11.3px)!important;
  font-weight:780!important;
  line-height:1.45!important;
  color:rgba(21,22,23,.76)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-example{
  margin:0!important;
  padding:10px 11px!important;
  border:1px solid rgba(21,22,23,.08)!important;
  border-top:0!important;
  border-radius:12px!important;
  background:rgba(255,255,255,.72)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-example--compact{
  display:block!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-example--compact .dk-wp3-network-example-de{
  font-size:var(--dkwp-f-11_8,11.8px)!important;
  font-weight:820!important;
  line-height:1.5!important;
  color:rgba(21,22,23,.82)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-example--compact .dk-wp3-network-example-tr{
  margin-top:4px!important;
  font-size:var(--dkwp-f-10_7,10.7px)!important;
  font-weight:650!important;
  line-height:1.46!important;
  color:rgba(21,22,23,.58)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-group--family .dk-wp3-network-group-head h4{
  letter-spacing:-.025em!important;
}
@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card{
    padding:13px 13px 14px!important;
    gap:9px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card .dk-wp3-network-word{
    font-size:var(--dkwp-f-16_5,16.5px)!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-type-badge{
    min-height:22px!important;
    padding:4px 8px!important;
  }
}
@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card-top{
    flex-direction:column!important;
    align-items:flex-start!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-type-badge{
    align-self:flex-start!important;
  }
}

/* =========================================================
   Phase 9.2 · Examples workspace simplification
   Real content starts immediately; example groups are expanded by default.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workspace:not(.is-empty){
  gap:0!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workspace:not(.is-empty) .dk-wp3-examples-workarea{
  padding-top:0!important;
}
/* All example groups render open on first visit. Removing show-all via the
   disclosure button restores the existing compact 3/4-row state. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-panel.show-all .dk-wp3-example.is-extra{
  display:grid!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-panel.show-all .dk-wp3-more{
  color:rgba(21,22,23,.62)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-panel.show-all .dk-wp3-more svg{
  transform:rotate(180deg)!important;
}
/* Empty state stays informative but no longer reuses the removed promo cover. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workspace.is-empty{
  padding-top:2px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-empty-card{
  padding:16px 17px!important;
  border:1.25px solid rgba(21,22,23,.25)!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.84)!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-empty-card .dk-wp3-examples-eyebrow{
  min-height:0!important;
  margin-bottom:10px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:rgba(21,22,23,.58)!important;
  font-size:var(--dkwp-f-9_5,9.5px)!important;
  letter-spacing:.055em!important;
  text-transform:uppercase!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-empty-card h2{
  margin:0 0 7px!important;
  font-size:var(--dkwp-f-20,20px)!important;
  font-weight:950!important;
  line-height:1.15!important;
  letter-spacing:-.02em!important;
}
@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-empty-card{
    padding:14px!important;
  }
}

/* =========================================================
   Phase 9.3 · Nomen semantic identity
   Article color carries into the panel title; Plural is always yellow.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) #secilen-kelime.dk-wp3-header--noun{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) #secilen-kelime .dk-wp3-header-article{
  flex:0 0 auto!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:38px!important;
  height:29px!important;
  padding:0 8px!important;
  border:1.75px solid var(--dkwp-ink)!important;
  border-radius:8px!important;
  box-shadow:1px 1px 0 rgba(21,22,23,.82)!important;
  color:var(--dkwp-ink)!important;
  -webkit-text-fill-color:currentColor!important;
  font-size:.68em!important;
  font-weight:950!important;
  line-height:1!important;
  letter-spacing:-.01em!important;
  text-transform:lowercase!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) #secilen-kelime .dk-wp3-header-article--der{
  background:var(--dkwp-sky,#a5d8ff)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) #secilen-kelime .dk-wp3-header-article--die{
  background:var(--dkwp-err,#ff6b6b)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) #secilen-kelime .dk-wp3-header-article--das{
  background:#a7edc9!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) #secilen-kelime .dk-wp3-header-noun{
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  line-height:1.25!important;
  padding:2px 0 6px 0!important;
}

/* Plural is a fixed Nomen semantic surface, independent of scene palette. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root .dk-wp3-noun-fact--plural{
  background:var(--dkwp-scene-deep,#f8ff98)!important;
  border-color:rgba(21,22,23,.28)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root .dk-wp3-noun-fact--plural>span,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root .dk-wp3-noun-fact--plural>strong{
  color:var(--dkwp-ink)!important;
  -webkit-text-fill-color:currentColor!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root .dk-wp3-noun-case-head>span:nth-child(3){
  background:var(--dkwp-scene-deep,#f8ff98)!important;
  color:var(--dkwp-ink)!important;
  -webkit-text-fill-color:currentColor!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-root .dk-wp3-noun-form--plural{
  background:rgba(248,255,152,.56)!important;
  color:var(--dkwp-ink)!important;
  -webkit-text-fill-color:currentColor!important;
}
@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) #secilen-kelime.dk-wp3-header--noun{
    gap:6px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) #secilen-kelime .dk-wp3-header-article{
    min-width:34px!important;
    height:25px!important;
    padding:0 7px!important;
    border-radius:7px!important;
  }
}

/* =========================================================
   Phase 9.4 · Extended text scale spectrum
   Keep the existing 90% minimum; add 145% and 160% readable modes.
   Large-type states reflow dense compositions instead of shrinking text.
   ========================================================= */

/* At the two new upper levels, sentence actions move below the copy even on
   wider panels. This preserves readable line length instead of squeezing the
   enlarged sentence between the index and the action rail. */
#kelime-penceresi.dk-wp3-font-large:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-example{
  grid-template-columns:34px minmax(0,1fr)!important;
  align-items:start!important;
}
#kelime-penceresi.dk-wp3-font-large:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-example-actions{
  grid-column:2!important;
  justify-content:flex-start!important;
  margin-top:4px!important;
}

/* Wortfamilie cards become single-column at accessibility-size text. The
   content remains identical; only available reading measure changes. */
#kelime-penceresi.dk-wp3-font-large:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-network-family-grid,.dk-wp3-network-component-grid){
  grid-template-columns:1fr!important;
}

/* At 160%, dense fact grids and two-column explanatory compositions should
   prefer vertical reading order rather than narrow text columns. */
#kelime-penceresi.dk-wp3-font-xlarge:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-snapshot-grid,.dk-wp3-noun-facts,.dk-wp3-adj-facts,
    .dk-wp3-pronoun-facts,.dk-wp3-prep-facts,.dk-wp3-conj-facts,
    .dk-wp3-relation-grid){
  grid-template-columns:1fr!important;
}
#kelime-penceresi.dk-wp3-font-xlarge:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-snapshot--wide,.dk-wp3-noun-fact--plural,.dk-wp3-adj-fact:last-child,
    .dk-wp3-pronoun-fact:last-child,.dk-wp3-prep-fact--rule,.dk-wp3-conj-fact--effect){
  grid-column:auto!important;
}

/* Section heading + explanatory copy becomes a vertical reading block at the
   maximum scale. This prevents the description from becoming a narrow right
   column while keeping the same information hierarchy. */
#kelime-penceresi.dk-wp3-font-xlarge:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section-head{
  display:block!important;
}
#kelime-penceresi.dk-wp3-font-xlarge:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section-head>p{
  max-width:680px!important;
  margin-top:6px!important;
  text-align:left!important;
}

/* 9.3's noun article badge follows the enlarged title instead of remaining a
   fixed 29px control. Geometry grows only at the two new upper levels. */
#kelime-penceresi.dk-wp3-font-large:is(.dk-wp3-active,.dk-wp3-pending) #secilen-kelime .dk-wp3-header-article{
  min-width:43px!important;
  height:33px!important;
  padding:0 9px!important;
}
#kelime-penceresi.dk-wp3-font-xlarge:is(.dk-wp3-active,.dk-wp3-pending) #secilen-kelime .dk-wp3-header-article{
  min-width:47px!important;
  height:36px!important;
  padding:0 10px!important;
}

/* Large text is allowed to wrap metadata that was designed around 100–130%.
   Do not ellipsize instructional labels merely because the user enlarged it. */
#kelime-penceresi.dk-wp3-font-large:is(.dk-wp3-active,.dk-wp3-pending)
:is(.dk-wp3-noun-seg span,.dk-wp3-noun-seg small,.dk-wp3-article-family small,
    .dk-wp3-adj-strength small,.dk-wp3-prep-group small,.dk-wp3-conj-group small,
    .dk-wp3-network-type-badge){
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}

/* Wide data tables keep horizontal scrolling at large type. Increasing their
   reading canvas avoids compressed cells while preserving every column. */
#kelime-penceresi.dk-wp3-font-large:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-noun-case-table{min-width:680px!important}
#kelime-penceresi.dk-wp3-font-large:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-article-table{min-width:720px!important}
#kelime-penceresi.dk-wp3-font-large:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-table{min-width:760px!important}
#kelime-penceresi.dk-wp3-font-large:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-adj-case-table{min-width:720px!important}
#kelime-penceresi.dk-wp3-font-large:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-reference-table{min-width:680px!important}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi.dk-wp3-font-large:is(.dk-wp3-active,.dk-wp3-pending) #secilen-kelime{
    max-width:100%!important;
  }
  #kelime-penceresi.dk-wp3-font-large:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card-top{
    flex-wrap:wrap!important;
  }
}

/* =========================================================
   Phase 9.5 · Report / feedback dialog refresh
   Accessible modal, DeuKlar visual language, explicit status states.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-overlay--95{
  inset:0!important;
  width:auto!important;
  height:auto!important;
  padding:14px!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:auto!important;
  background:rgba(21,22,23,.46)!important;
  backdrop-filter:blur(7px)!important;
  -webkit-backdrop-filter:blur(7px)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-modal--95{
  position:relative!important;
  width:min(100%,460px)!important;
  max-width:460px!important;
  max-height:calc(100% - 4px)!important;
  padding:0!important;
  overflow:auto!important;
  border:1.5px solid rgba(21,22,23,.24)!important;
  border-radius:18px!important;
  background:var(--dkwp-paper)!important;
  color:var(--dkwp-ink)!important;
  box-shadow:0 8px 0 rgba(21,22,23,.18)!important;
  scrollbar-width:thin!important;
  scrollbar-color:rgba(69,52,115,.34) transparent!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-modal--95::-webkit-scrollbar{width:7px!important}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-modal--95::-webkit-scrollbar-thumb{
  border-radius:999px!important;
  background:rgba(69,52,115,.28)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-modal-head{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:14px!important;
  padding:18px 18px 15px!important;
  border-bottom:1px solid rgba(21,22,23,.10)!important;
  background:var(--dkwp-viol-soft)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-modal-head>div{min-width:0!important}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-kicker{
  display:block!important;
  margin:0 0 4px!important;
  color:var(--dkwp-viol-night)!important;
  font-size:var(--dkwp-f-9,9px)!important;
  font-weight:900!important;
  letter-spacing:.08em!important;
  line-height:1.2!important;
  text-transform:uppercase!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-modal--95 h3{
  display:block!important;
  margin:0!important;
  color:var(--dkwp-ink)!important;
  font-size:var(--dkwp-f-19,19px)!important;
  font-weight:950!important;
  line-height:1.18!important;
  letter-spacing:-.025em!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-modal--95 .report-subtitle{
  max-width:370px!important;
  margin:6px 0 0!important;
  color:rgba(21,22,23,.66)!important;
  font-size:var(--dkwp-f-11_5,11.5px)!important;
  font-weight:650!important;
  line-height:1.5!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-close-btn{
  flex:0 0 auto!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:32px!important;
  height:32px!important;
  padding:0!important;
  border:1.5px solid rgba(21,22,23,.18)!important;
  border-radius:10px!important;
  background:rgba(255,255,255,.72)!important;
  color:var(--dkwp-ink)!important;
  box-shadow:none!important;
  cursor:pointer!important;
  font:900 20px/1 Geist,system-ui,sans-serif!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-close-btn:hover{
  background:var(--dkwp-paper)!important;
  border-color:rgba(21,22,23,.34)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-word-display{
  display:flex!important;
  align-items:baseline!important;
  gap:10px!important;
  margin:14px 18px 12px!important;
  padding:10px 12px!important;
  border:1px solid rgba(21,22,23,.10)!important;
  border-left:4px solid var(--dkwp-peach)!important;
  border-radius:11px!important;
  background:var(--dkwp-mist)!important;
  color:var(--dkwp-ink)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-word-display .rw-label{
  flex:0 0 auto!important;
  color:rgba(21,22,23,.50)!important;
  font-size:var(--dkwp-f-9,9px)!important;
  font-weight:800!important;
  letter-spacing:.04em!important;
  text-transform:uppercase!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-word-display strong{
  min-width:0!important;
  overflow-wrap:anywhere!important;
  font-size:var(--dkwp-f-14,14px)!important;
  font-weight:900!important;
  line-height:1.35!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-fieldset{
  display:grid!important;
  gap:7px!important;
  padding:0 18px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-option{
  display:grid!important;
  grid-template-columns:30px minmax(0,1fr)!important;
  align-items:start!important;
  gap:10px!important;
  width:100%!important;
  min-height:0!important;
  margin:0!important;
  padding:10px 11px!important;
  border:1.25px solid rgba(21,22,23,.12)!important;
  border-radius:12px!important;
  background:rgba(247,245,255,.58)!important;
  color:var(--dkwp-ink)!important;
  box-shadow:none!important;
  cursor:pointer!important;
  text-align:left!important;
  transition:border-color var(--dkwp-t) ease,background var(--dkwp-t) ease,transform var(--dkwp-t) ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-option:hover{
  transform:translateY(-1px)!important;
  border-color:rgba(69,52,115,.32)!important;
  background:rgba(193,179,255,.16)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-option.selected,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-option[aria-pressed="true"]{
  transform:none!important;
  border-color:rgba(21,22,23,.28)!important;
  background:rgba(255,190,152,.32)!important;
  box-shadow:inset 4px 0 0 var(--dkwp-peach)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-option:focus-visible,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.report-close-btn,.report-btn-send,.report-btn-cancel):focus-visible,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-message-box:focus-visible{
  outline:3px solid rgba(77,171,247,.34)!important;
  outline-offset:2px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .ro-mark{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:28px!important;
  height:24px!important;
  border-radius:8px!important;
  background:rgba(193,179,255,.22)!important;
  color:var(--dkwp-viol-night)!important;
  font-size:var(--dkwp-f-8_5,8.5px)!important;
  font-weight:900!important;
  letter-spacing:.04em!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-option.selected .ro-mark{
  background:var(--dkwp-paper)!important;
  color:rgba(111,63,31,.88)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-option .ro-text{
  display:block!important;
  min-width:0!important;
  color:var(--dkwp-ink)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-option .ro-text strong{
  display:block!important;
  font-size:var(--dkwp-f-11_8,11.8px)!important;
  font-weight:880!important;
  line-height:1.3!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-option .ro-text small{
  display:block!important;
  margin-top:2px!important;
  color:rgba(21,22,23,.58)!important;
  font-size:var(--dkwp-f-9_5,9.5px)!important;
  font-weight:620!important;
  line-height:1.4!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-message-wrap[hidden]{display:none!important}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-message-wrap{
  display:block!important;
  padding:12px 18px 0!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-message-label{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
  margin-bottom:5px!important;
  color:rgba(21,22,23,.78)!important;
  font-size:var(--dkwp-f-9_5,9.5px)!important;
  font-weight:850!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-message-label em{
  color:rgba(21,22,23,.48)!important;
  font-style:normal!important;
  font-weight:650!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-message-box{
  width:100%!important;
  min-height:76px!important;
  max-height:140px!important;
  margin:0!important;
  padding:10px 11px!important;
  resize:vertical!important;
  border:1.25px solid rgba(21,22,23,.18)!important;
  border-radius:11px!important;
  background:var(--dkwp-paper)!important;
  color:var(--dkwp-ink)!important;
  box-shadow:none!important;
  font:650 var(--dkwp-f-10_5,10.5px)/1.5 Geist,system-ui,sans-serif!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-message-box::placeholder{color:rgba(21,22,23,.40)!important}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-actions{
  display:flex!important;
  justify-content:flex-end!important;
  gap:8px!important;
  margin:0!important;
  padding:14px 18px 17px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.report-btn-cancel,.report-btn-send){
  min-height:36px!important;
  margin:0!important;
  padding:8px 13px!important;
  border:1.5px solid rgba(21,22,23,.22)!important;
  border-radius:10px!important;
  box-shadow:none!important;
  color:var(--dkwp-ink)!important;
  font-size:var(--dkwp-f-10_5,10.5px)!important;
  font-weight:880!important;
  line-height:1.2!important;
  cursor:pointer!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-btn-cancel{
  background:var(--dkwp-paper)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-btn-send{
  min-width:126px!important;
  background:var(--dkwp-peach)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-btn-send:hover:not(:disabled){
  transform:translateY(-1px)!important;
  background:#ffc9a8!important;
  box-shadow:0 2px 0 rgba(21,22,23,.18)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.report-btn-send,.report-btn-cancel,.report-close-btn):disabled{
  opacity:.48!important;
  cursor:wait!important;
  transform:none!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-live{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
  white-space:nowrap!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-modal--status{
  overflow:hidden!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-status{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:260px!important;
  padding:30px 24px!important;
  text-align:center!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-status-mark{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:52px!important;
  height:52px!important;
  margin-bottom:12px!important;
  border:1.5px solid rgba(21,22,23,.16)!important;
  border-radius:16px!important;
  background:var(--dkwp-mist)!important;
  color:var(--dkwp-viol-night)!important;
  font-size:26px!important;
  font-weight:950!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-status--success .report-status-mark{
  background:rgba(56,215,148,.18)!important;
  color:#137a4d!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-status--error .report-status-mark,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-status--auth .report-status-mark{
  background:rgba(255,107,107,.14)!important;
  color:#a93c3c!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-status h3{
  margin:0!important;
  font-size:var(--dkwp-f-20,20px)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-status p{
  max-width:330px!important;
  margin:8px 0 16px!important;
  color:rgba(21,22,23,.66)!important;
  font-size:var(--dkwp-f-11,11px)!important;
  font-weight:650!important;
  line-height:1.55!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-status p strong{color:var(--dkwp-ink)!important;font-weight:900!important}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-status-close{min-width:94px!important}

@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-overlay--95{padding:8px!important;align-items:flex-start!important}
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-modal--95{margin:auto 0!important;border-radius:14px!important}
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-modal-head{padding:15px 14px 13px!important}
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-word-display{margin:11px 14px 10px!important}
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-fieldset{padding:0 14px!important}
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-message-wrap{padding:11px 14px 0!important}
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-actions{padding:12px 14px 14px!important}
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-option{padding:9px 10px!important}
}

@media (prefers-reduced-motion:reduce){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.report-overlay--95,.report-modal--95,.report-option,.report-btn-send){
    animation:none!important;
    transition:none!important;
  }
}

/* =========================================================
   Phase 9.6 · Final integration acceptance fixes
   Normalize legacy report-button flex and keep status dialog ARIA coherent.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-actions > :is(.report-btn-cancel,.report-btn-send),
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .report-status .report-status-close{
  flex:0 0 auto!important;
}

/* =========================================================
   Phase 9.7 · Visual rhythm / background cadence
   Strong semantic chapters keep DeuKlar color. Consecutive technical chapters
   alternate into quiet tinted scenes so the panel breathes instead of forming
   long violet/peach color walls. Incoming quiet scenes own one shallow organic
   edge; the global transition engine remains unchanged.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
  --dkwp-rhythm-rest:#fbfaf8;
  --dkwp-rhythm-mist:#f7f5ff;
  --dkwp-rhythm-violet-wash:#eee9ff;
  --dkwp-rhythm-peach-wash:#fff1e7;
  --dkwp-cut-rest-97:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 22' preserveAspectRatio='none'><path d='M0,22 L0,12 C78,8 144,14 218,10 C292,6 354,13 430,11 C506,9 566,5 642,10 C720,15 782,8 858,10 C936,12 1000,6 1072,9 C1122,11 1164,10 1200,8 L1200,22 Z' fill='black'/></svg>");
  --dkwp-cut-rest-97-h:11px;
}

/* 9.7.1 · Quiet grammar chapters. These are deliberately not another full
   violet scene when a strong grammar chapter sits immediately above them. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-article-reference,
  .dk-wp3-adj-declension,
  .dk-wp3-section[aria-labelledby="dk-wp3-conj-title"]
){
  --dkwp-section-stage:var(--dkwp-rhythm-violet-wash)!important;
  background:linear-gradient(180deg,
    var(--dkwp-rhythm-violet-wash) 0,
    var(--dkwp-rhythm-mist) 84px,
    var(--dkwp-rhythm-rest) 210px,
    var(--dkwp-rhythm-rest) 100%)!important;
}

/* 9.7.2 · Reference maps retain their apricot identity as a short wash, not a
   second saturated orange wall after purple syntax/grammar. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-prep-reference,
  .dk-wp3-conj-reference
){
  --dkwp-section-stage:var(--dkwp-rhythm-peach-wash)!important;
  background:linear-gradient(180deg,
    var(--dkwp-rhythm-peach-wash) 0,
    #fff7f1 88px,
    var(--dkwp-rhythm-rest) 218px,
    var(--dkwp-rhythm-rest) 100%)!important;
}

/* 9.7.3 · Strong -> quiet boundaries use a single low-amplitude organic edge.
   This is intentionally calmer than the standard chapter wave/torn cuts. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-article-uses+.dk-wp3-article-reference,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-adj-steigerung+.dk-wp3-adj-declension,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"]+.dk-wp3-section[aria-labelledby="dk-wp3-conj-title"],
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-prep-grammar+.dk-wp3-prep-reference,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-conj-syntax+.dk-wp3-conj-reference{
  --dkwp-cut-image:var(--dkwp-cut-rest-97)!important;
  --dkwp-cut-height:var(--dkwp-cut-rest-97-h)!important;
  --dkwp-cut-size:100% 100%!important;
  --dkwp-cut-repeat:no-repeat!important;
}

/* The incoming quiet color must own the separator itself. This also prevents
   the previous saturated scene from visually leaking into the next chapter. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>:is(
  .dk-wp3-article-reference,
  .dk-wp3-adj-declension,
  .dk-wp3-section[aria-labelledby="dk-wp3-conj-title"],
  .dk-wp3-prep-reference,
  .dk-wp3-conj-reference
)::before{
  -webkit-mask-image:var(--dkwp-cut-rest-97)!important;
  mask-image:var(--dkwp-cut-rest-97)!important;
  -webkit-mask-size:100% 100%!important;
  mask-size:100% 100%!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
}

/* 9.7.4 · Keep strong chapters strong, but shorten the saturated entrance.
   Dense reading content reaches a softer field sooner. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-section[aria-labelledby="dk-wp3-rektion-title"],
  .dk-wp3-conj-syntax,
  .dk-wp3-prep-grammar,
  .dk-wp3-adj-steigerung,
  .dk-wp3-article-uses
){
  background:linear-gradient(180deg,
    var(--dkwp-scene-grammar) 0,
    var(--dkwp-scene-grammar-soft) 66px,
    var(--dkwp-dose-grammar) 150px,
    var(--dkwp-dose-grammar-soft) 100%)!important;
}

/* A little more neutral air at the bottom of quiet chapters makes the next
   strong scene read as a new chapter rather than another color stripe. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-article-reference,
  .dk-wp3-adj-declension,
  .dk-wp3-section[aria-labelledby="dk-wp3-conj-title"],
  .dk-wp3-prep-reference,
  .dk-wp3-conj-reference
){
  padding-bottom:28px!important;
}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
    --dkwp-cut-rest-97-h:10px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
    .dk-wp3-article-reference,
    .dk-wp3-adj-declension,
    .dk-wp3-section[aria-labelledby="dk-wp3-conj-title"],
    .dk-wp3-prep-reference,
    .dk-wp3-conj-reference
  ){
    padding-bottom:24px!important;
  }
}

@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
    --dkwp-cut-rest-97-h:9px;
  }
}

/* =========================================================
   Phase 9.8 · Action cleanup + press feedback contract
   Remove hover lift from header utilities; every real panel button still
   communicates activation through a short, physical press state.
   ========================================================= */

/* 9.8.1 · Header utilities are utilities, not content CTAs. Hover must not
   recolor, lift or cast a larger shadow. Keyboard focus remains explicit. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  #ses-oku-btn,
  #report-word-btn,
  #popup-yenile,
  #popup-kapat
):hover{
  transform:none!important;
  background:var(--dkwp-paper)!important;
  color:var(--dkwp-ink)!important;
  box-shadow:2px 2px 0 var(--dkwp-ink)!important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  #ses-oku-btn,
  #report-word-btn,
  #popup-yenile,
  #popup-kapat
):active:not(:disabled){
  transform:translate(1px,1px) scale(.97)!important;
  box-shadow:0 0 0 var(--dkwp-ink)!important;
  background:rgba(176,156,251,.12)!important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-font-controls, .dk-wp3-font-status, .dk-wp3-font-step):hover{
  transform:none!important;
  background:transparent!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-font-controls:hover{
  transform:none!important;
  box-shadow:1px 1px 0 rgba(21,22,23,.72)!important;
  background:rgba(255,255,255,.72)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-font-controls, .dk-wp3-font-status, .dk-wp3-font-step)::before,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-font-controls, .dk-wp3-font-status, .dk-wp3-font-step)::after{
  display:none!important;
  content:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-font-step:active:not(:disabled){
  transform:translateY(1px) scale(.93)!important;
  background:rgba(176,156,251,.16)!important;
}

/* 9.8.2 · Universal press feedback. Existing semantic hover styles remain for
   content actions, but pointer-down always compresses instead of floating up. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) button:not(:disabled):not(.dk-wp3-conj-mode):not(.dk-wp3-conj-tense):not(.dk-wp3-example-mood):not(.dk-wp3-example-time):not(.dk-wp3-tense-chip):not(.dk-wp3-more):not(.dk-wp3-article-ex-filter-btn):not(.dk-wp3-article-family):not(.dk-wp3-noun-seg):not(.dk-wp3-adj-form):not(.dk-wp3-adj-strength):not(.dk-wp3-adj-gender):not(.dk-wp3-prep-group):not(.dk-wp3-conj-group):not(.dk-wp3-degree-step):active,
.dk-lesson-shell button:not(:disabled):active{
  transform:translateY(1px) scale(.985)!important;
  transition-duration:70ms!important;
}

/* Raised action roles also lose elevation while physically pressed. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-action--primary,
  .dk-wp3-action--secondary,
  .dk-wp3-btn,
  .dk-wp3-notebook-action,
  .dk-wp3-save-slot > [id^="defter-badge-"],
  .dk-wp3-icon-btn,
  .report-btn-send,
  .report-btn-cancel,
  .report-close-btn,
  .report-status-close
):not(:disabled):active{
  box-shadow:none!important;
}

/* Segmented/selectable controls should feel pressed without acquiring a new
   hover color or losing their selected-state identity. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-mode,
  .dk-wp3-mini-seg,
  .dk-wp3-seg
):not(:disabled):active{
  box-shadow:inset 0 0 0 1px rgba(21,22,23,.18)!important;
}

/* Example rows now expose listening only. Keep that single utility anchored
   cleanly at the row edge instead of reserving space for a removed action. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-actions{
  min-width:32px;
  justify-content:flex-end;
}

@media (prefers-reduced-motion:reduce){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) button,
  .dk-lesson-shell button{
    transition-duration:0s!important;
  }
}

/* =========================================================
   Phase 9.9 · Verb examples: mood -> tense/form picker
   The examples workspace teaches one decision at a time instead of flattening
   every mood and tense into one long horizontal rail.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-verb-examples .dk-wp3-section-head{
  align-items:flex-end!important;
  gap:18px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-verb-examples .dk-wp3-section-head>p{
  max-width:390px!important;
  margin:0!important;
  color:rgba(21,22,23,.66)!important;
  font-size:var(--dkwp-f-11_5,11.5px)!important;
  font-weight:680!important;
  line-height:1.45!important;
  text-align:right!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-picker{
  display:grid!important;
  gap:12px!important;
  margin-top:14px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-picker-step{
  display:grid!important;
  gap:8px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-picker-step--time{
  padding-top:11px!important;
  border-top:1px solid rgba(21,22,23,.12)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-picker-label{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  color:rgba(21,22,23,.68)!important;
  font-size:var(--dkwp-f-10_5,10.5px)!important;
  font-weight:840!important;
  letter-spacing:.01em!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-picker-label>b{
  display:inline-grid!important;
  place-items:center!important;
  width:20px!important;
  height:20px!important;
  border:1.25px solid rgba(21,22,23,.24)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.82)!important;
  color:var(--dkwp-ink)!important;
  font-size:var(--dkwp-f-9_5,9.5px)!important;
  line-height:1!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-mood-strip{
  display:grid!important;
  grid-template-columns:repeat(4,1fr)!important;
  gap:8px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-mood{
  min-width:0!important;
  min-height:50px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  gap:2px!important;
  padding:8px 10px!important;
  border:2px solid var(--dkwp-ink,#151617)!important;
  border-radius:12px!important;
  background:#ffffff!important;
  color:var(--dkwp-ink,#151617)!important;
  box-shadow:4px 4px 0 var(--dkwp-ink,#151617)!important;
  text-align:left!important;
  cursor:pointer!important;
  user-select:none!important;
  -webkit-user-select:none!important;
  transform:translate(0, 0)!important;
  transition:transform 0.14s cubic-bezier(.2, .9, .3, 1.2), box-shadow 0.14s cubic-bezier(.2, .9, .3, 1.2), background-color 0.14s ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-mood:hover{
  transform:translate(-2px, -2px)!important;
  box-shadow:6px 6px 0 var(--dkwp-ink,#151617)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-mood:not(.is-active):hover{
  background:var(--dkwp-mist,#f7f5ff)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-mood.is-active{
  border-color:var(--dkwp-ink,#151617)!important;
  background:var(--dkwp-viol-soft,#c1b3ff)!important;
  color:var(--dkwp-ink,#151617)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-mood:is(:active, .is-pressed){
  transform:translate(3px, 3px)!important;
  box-shadow:1px 1px 0 var(--dkwp-ink,#151617)!important;
  transition-duration:0.05s!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-mood strong{
  font-size:var(--dkwp-f-11_5,11.5px)!important;
  font-weight:900!important;
  line-height:1.2!important;
  letter-spacing:-.01em!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-mood small{
  color:rgba(21,22,23,.6)!important;
  font-size:var(--dkwp-f-9,9px)!important;
  font-weight:650!important;
  line-height:1.2!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-tense-group[hidden]{
  display:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-tense-strip{
  display:flex!important;
  gap:8px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  overscroll-behavior-inline:contain!important;
  scrollbar-width:none!important;
  -ms-overflow-style:none!important;
  padding:2px 3px 6px!important;
  scroll-padding-inline:2px!important;
  -webkit-mask-image:none!important;
  mask-image:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-tense-strip::-webkit-scrollbar{
  display:none!important;
  width:0!important;
  height:0!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-time{
  flex:0 0 auto!important;
  min-height:36px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:7px 14px!important;
  border:2px solid var(--dkwp-ink, #151617)!important;
  border-radius:999px!important;
  background:#ffffff!important;
  color:var(--dkwp-ink, #151617)!important;
  box-shadow:4px 4px 0 var(--dkwp-ink, #151617)!important;
  cursor:pointer!important;
  user-select:none!important;
  -webkit-user-select:none!important;
  white-space:nowrap!important;
  transform:translate(0, 0)!important;
  transition:transform 0.14s cubic-bezier(.2, .9, .3, 1.2), box-shadow 0.14s cubic-bezier(.2, .9, .3, 1.2), background-color 0.14s ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-time:hover{
  transform:translate(-2px, -2px)!important;
  box-shadow:6px 6px 0 var(--dkwp-ink, #151617)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-time:not(.is-active):hover{
  background:var(--dkwp-mist, #f7f5ff)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-time.is-active{
  border-color:var(--dkwp-ink, #151617)!important;
  background:var(--dkwp-peach, #ffbe98)!important;
  color:var(--dkwp-ink, #151617)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-time:is(:active, .is-pressed){
  transform:translate(3px, 3px)!important;
  box-shadow:1px 1px 0 var(--dkwp-ink, #151617)!important;
  transition-duration:0.05s!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-time span{
  font-size:var(--dkwp-f-10_5,10.5px)!important;
  font-weight:850!important;
  line-height:1.1!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-mood:focus-visible,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-time:focus-visible{
  outline:2px solid var(--dkwp-ink)!important;
  outline-offset:2px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-verb-examples .dk-wp3-examples-panels{
  margin-top:14px!important;
}

/* Large-type mode should simplify the first decision rather than squeezing
   five pedagogical options into tiny columns. */
#kelime-penceresi.dk-wp3-font-large .dk-wp3-example-mood-strip{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
#kelime-penceresi.dk-wp3-font-xlarge .dk-wp3-example-mood-strip{
  grid-template-columns:1fr!important;
}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-verb-examples .dk-wp3-section-head{
    align-items:flex-start!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-verb-examples .dk-wp3-section-head>p{
    max-width:none!important;
    text-align:left!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-mood-strip{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-mood-strip{
    grid-template-columns:1fr!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-mood{
    min-height:54px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-time{
    min-height:34px!important;
    padding-inline:10px!important;
  }
}
@media (prefers-reduced-motion:reduce){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-example-mood,.dk-wp3-example-time){
    transition:none!important;
  }
}

/* =========================================================
   Phase 9.10 · Verb conjugation redesign
   One decision at a time: mood -> tense -> one clean conjugation scene.
   No nested tables, no row/grid lines; hierarchy comes from spacing, type and
   quiet learning tiles that stay readable at large font scales.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conjugation .dk-wp3-section-head{
  align-items:flex-end!important;
  gap:18px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conjugation .dk-wp3-section-head>p{
  max-width:390px!important;
  margin:0!important;
  color:rgba(21,22,23,.62)!important;
  font-size:var(--dkwp-f-11_5,11.5px)!important;
  font-weight:680!important;
  line-height:1.45!important;
  text-align:right!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-picker{
  display:grid!important;
  gap:12px!important;
  margin-top:15px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-picker-step{
  display:grid!important;
  gap:8px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-picker-step--tense{
  padding-top:11px!important;
  border-top:1px solid rgba(21,22,23,.10)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-picker-label{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  color:rgba(21,22,23,.66)!important;
  font-size:var(--dkwp-f-10_5,10.5px)!important;
  font-weight:850!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-picker-label>b{
  display:inline-grid!important;
  place-items:center!important;
  width:20px!important;
  height:20px!important;
  border:1.25px solid rgba(21,22,23,.22)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.82)!important;
  color:var(--dkwp-ink)!important;
  font-size:var(--dkwp-f-9_5,9.5px)!important;
  line-height:1!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-mode-strip{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(145px,1fr))!important;
  gap:10px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-mode{
  min-width:0!important;
  min-height:64px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  gap:4px!important;
  padding:10px 14px!important;
  border:2px solid var(--dkwp-ink, #151617)!important;
  border-radius:13px!important;
  background:#ffffff!important;
  color:var(--dkwp-ink, #151617)!important;
  box-shadow:4px 4px 0 var(--dkwp-ink, #151617)!important;
  text-align:left!important;
  cursor:pointer!important;
  user-select:none!important;
  -webkit-user-select:none!important;
  transform:translate(0, 0)!important;
  transition:transform 0.14s cubic-bezier(.2, .9, .3, 1.2), box-shadow 0.14s cubic-bezier(.2, .9, .3, 1.2), background-color 0.14s ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-mode:hover{
  transform:translate(-2px, -2px)!important;
  box-shadow:6px 6px 0 var(--dkwp-ink, #151617)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-mode:not(.is-active):hover{
  background:var(--dkwp-mist, #f7f5ff)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-mode.is-active{
  background:var(--dkwp-viol-soft, #c1b3ff)!important;
  color:var(--dkwp-ink, #151617)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-mode:is(:active, .is-pressed){
  transform:translate(3px, 3px)!important;
  box-shadow:1px 1px 0 var(--dkwp-ink, #151617)!important;
  transition-duration:0.05s!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-mode strong{
  font-size:var(--dkwp-f-13,13px)!important;
  font-weight:950!important;
  line-height:1.22!important;
  color:var(--dkwp-ink, #151617)!important;
  letter-spacing:-.015em!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-mode small{
  color:var(--dkwp-ink, #151617)!important;
  opacity:.82!important;
  font-size:var(--dkwp-f-10,10px)!important;
  font-weight:700!important;
  line-height:1.35!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-tense-group[hidden],
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-tense-panel[hidden]{
  display:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-tense-group{
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:center!important;
  align-items:center!important;
  gap:8px 10px!important;
  width:100%!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-tense{
  flex:1 1 calc(16.66% - 10px)!important;
  min-width:105px!important;
  max-width:160px!important;
  min-height:38px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:7px 12px!important;
  border:2px solid var(--dkwp-ink, #151617)!important;
  border-radius:999px!important;
  background:#ffffff!important;
  color:var(--dkwp-ink, #151617)!important;
  box-shadow:4px 4px 0 var(--dkwp-ink, #151617)!important;
  cursor:pointer!important;
  user-select:none!important;
  -webkit-user-select:none!important;
  text-align:center!important;
  transform:translate(0, 0)!important;
  transition:transform 0.14s cubic-bezier(.2, .9, .3, 1.2), box-shadow 0.14s cubic-bezier(.2, .9, .3, 1.2), background-color 0.14s ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-tense:hover{
  transform:translate(-2px, -2px)!important;
  box-shadow:6px 6px 0 var(--dkwp-ink, #151617)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-tense:not(.is-active):hover{
  background:var(--dkwp-mist, #f7f5ff)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-tense.is-active{
  background:var(--dkwp-peach, #ffbe98)!important;
  color:var(--dkwp-ink, #151617)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-tense:is(:active, .is-pressed){
  transform:translate(3px, 3px)!important;
  box-shadow:1px 1px 0 var(--dkwp-ink, #151617)!important;
  transition-duration:0.05s!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-tense span{
  font-size:var(--dkwp-f-12,12px)!important;
  font-weight:900!important;
  line-height:1.2!important;
  letter-spacing:-.012em!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-stage{
  margin-top:16px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-tense-panel{
  padding:20px 22px 22px!important;
  border:2.5px solid var(--dkwp-ink, #151617)!important;
  border-radius:20px!important;
  background:#ffffff!important;
  box-shadow:5px 5px 0 var(--dkwp-ink, #151617)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-tense-head{
  display:flex!important;
  align-items:flex-end!important;
  justify-content:space-between!important;
  gap:14px!important;
  margin-bottom:16px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-mood-label{
  display:block!important;
  margin-bottom:4px!important;
  color:var(--dkwp-viol-deep, #6a56a7)!important;
  font-size:var(--dkwp-f-10_5,10.5px)!important;
  font-weight:900!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-tense-head h4{
  margin:0!important;
  color:var(--dkwp-ink, #151617)!important;
  font-size:var(--dkwp-f-22,22px)!important;
  font-weight:950!important;
  line-height:1.08!important;
  letter-spacing:-.035em!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-count{
  flex:0 0 auto!important;
  padding:5px 11px!important;
  border:1.5px solid var(--dkwp-ink, #151617)!important;
  border-radius:999px!important;
  background:var(--dkwp-mist, #f7f5ff)!important;
  color:var(--dkwp-ink, #151617)!important;
  font-family:'Fira Code',ui-monospace,monospace!important;
  font-size:var(--dkwp-f-10,10px)!important;
  font-weight:850!important;
  white-space:nowrap!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-forms{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-form{
  min-width:0!important;
  min-height:54px!important;
  display:grid!important;
  grid-template-columns:minmax(68px,.34fr) minmax(0,1fr)!important;
  align-items:center!important;
  gap:12px!important;
  padding:11px 15px!important;
  border:2px solid var(--dkwp-ink, #151617)!important;
  border-radius:14px!important;
  background:#ffffff!important;
  box-shadow:3px 3px 0 var(--dkwp-ink, #151617)!important;
  cursor:pointer!important;
  transition:transform 0.1s ease, box-shadow 0.1s ease, background-color 0.15s ease, border-color 0.15s ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-form:nth-child(4n+2):not(:hover):not(:active),
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-form:nth-child(4n+3):not(:hover):not(:active){
  background:color-mix(in srgb, var(--dkwp-mist, #f7f5ff) 55%, #ffffff)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-form:hover{
  transform:translate(-1.5px, -1.5px)!important;
  box-shadow:4.5px 4.5px 0 var(--dkwp-ink, #151617)!important;
  background:var(--dkwp-mist, #f7f5ff)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-form:active{
  transform:translate(2.5px, 2.5px)!important;
  box-shadow:0.5px 0.5px 0 var(--dkwp-ink, #151617)!important;
  transition-duration:0.05s!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-form--full{
  grid-column:1/-1!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-person{
  min-width:0!important;
  color:var(--dkwp-viol-deep, #453473)!important;
  font-family:'Fira Code',ui-monospace,monospace!important;
  font-size:var(--dkwp-f-11_5,11.5px)!important;
  font-weight:900!important;
  line-height:1.2!important;
  opacity:1!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-value{
  min-width:0!important;
  overflow-wrap:anywhere!important;
  color:var(--dkwp-ink, #151617)!important;
  font-size:var(--dkwp-f-15,15px)!important;
  font-weight:950!important;
  line-height:1.35!important;
  letter-spacing:-.012em!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-conj-mode,.dk-wp3-conj-tense):focus-visible{
  outline:2px solid var(--dkwp-ink)!important;
  outline-offset:2px!important;
}

/* Retire the old accordion/table visual contract inside the new conjugation
   section even if legacy selectors remain elsewhere for other components. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conjugation :is(
  .dk-wp3-conj-table,.dk-wp3-conj-row,.dk-wp3-person,.dk-wp3-conj-panel,.dk-wp3-tense-strip
){
  border:0!important;
  box-shadow:none!important;
}

#kelime-penceresi.dk-wp3-font-large .dk-wp3-conj-mode-strip{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
#kelime-penceresi.dk-wp3-font-xlarge .dk-wp3-conj-mode-strip,
#kelime-penceresi.dk-wp3-font-xlarge .dk-wp3-conj-forms{
  grid-template-columns:1fr!important;
}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conjugation .dk-wp3-section-head{
    align-items:flex-start!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conjugation .dk-wp3-section-head>p{
    max-width:none!important;
    text-align:left!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-mode-strip{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-forms{
    grid-template-columns:1fr!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-form--full{
    grid-column:auto!important;
  }
}
@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-mode-strip{
    grid-template-columns:1fr!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-tense-group{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-tense-panel{
    padding:14px!important;
    border-radius:15px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-tense-head{
    align-items:flex-start!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-tense-head h4{
    font-size:var(--dkwp-f-20,20px)!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-form{
    grid-template-columns:58px minmax(0,1fr)!important;
    min-height:50px!important;
    padding:9px 10px!important;
  }
}
@media (prefers-reduced-motion:reduce){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-conj-mode,.dk-wp3-conj-tense){
    transition:none!important;
  }
}

/* =========================================================
   Phase 9.11 · Deep Dive scene + disclosure card redesign
   One organic incoming wave, no terminal white gutter, and calm learning
   cards instead of heavy button-like accordions.
   ========================================================= */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
  --dkwp-cut-deep-911:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 38' preserveAspectRatio='none'><path d='M0,38 L0,21 C74,10 134,12 198,18 C266,25 324,8 392,14 C462,20 522,27 590,15 C662,3 724,23 794,17 C866,11 928,6 998,17 C1064,27 1126,12 1200,15 L1200,38 Z' fill='black'/></svg>");
  --dkwp-cut-deep-911-h:19px;
  --dkwp-deep-rest:#fbffd2;
  --dkwp-deep-rest-soft:#fdffe8;
}

/* 9.11.1 · The incoming Deep Dive scene owns one visible, low-frequency wave.
   Apply it regardless of which learning section happens to precede Deep Dive. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+.dk-wp3-section--last{
  --dkwp-cut-image:var(--dkwp-cut-deep-911)!important;
  --dkwp-cut-height:var(--dkwp-cut-deep-911-h)!important;
  --dkwp-cut-size:100% 100%!important;
  --dkwp-cut-repeat:no-repeat!important;
  border-top:0!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending)
.dk-wp3-word-view>.dk-wp3-section+.dk-wp3-section--last::before{
  content:""!important;
  display:block!important;
  left:0!important;
  right:0!important;
  top:calc(1px - var(--dkwp-cut-deep-911-h))!important;
  height:var(--dkwp-cut-deep-911-h)!important;
  background:var(--dkwp-scene-deep)!important;
  -webkit-mask-image:var(--dkwp-cut-deep-911)!important;
  mask-image:var(--dkwp-cut-deep-911)!important;
  -webkit-mask-size:100% 100%!important;
  mask-size:100% 100%!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center top!important;
  mask-position:center top!important;
}

/* 9.11.2 · Deep Dive is one continuous scene. The vivid lime is a chapter
   marker; reading quickly settles into a soft lime/cream field. The former
   nested cream scene inside .dk-wp3-deep-list is retired. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-section--last{
  margin-bottom:0!important;
  padding-top:25px!important;
  padding-bottom:28px!important;
  background:linear-gradient(180deg,
    var(--dkwp-scene-deep) 0,
    var(--dkwp-scene-deep) 72px,
    var(--dkwp-deep-rest) 168px,
    var(--dkwp-deep-rest-soft) 100%)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section--last>.dk-wp3-section-head{
  margin-bottom:13px!important;
  padding-bottom:0!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section--last>.dk-wp3-section-head h3{
  letter-spacing:-.03em!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section--last>.dk-wp3-deep-list{
  display:grid!important;
  gap:10px!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section--last>.dk-wp3-deep-list::before,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section--last>.dk-wp3-deep-list::after{
  content:none!important;
  display:none!important;
}

/* 9.11.3 · If Deep Dive is the terminal scene, let it truly meet the panel
   bottom. The view's generic scroll padding is useful elsewhere but was the
   source of the visible white strip below this last chapter. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-word-view,
  .dk-wp3-sentence-view
):has(> .dk-wp3-section--last:last-child){
  padding-bottom:0!important;
}

/* 9.11.4 · Disclosure cards: lightweight learning objects, not mini CTAs. */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion{
  --dkwp-deep-accent:var(--dkwp-viol-soft);
  position:relative!important;
  overflow:hidden!important;
  margin:0!important;
  border:1.25px solid rgba(21,22,23,.14)!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.84)!important;
  box-shadow:0 1px 0 rgba(21,22,23,.09)!important;
  transform:none!important;
  transition:border-color 140ms ease,background-color 140ms ease,transform 70ms ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion::before{
  content:"";
  position:absolute;
  z-index:2;
  left:0;
  top:14px;
  bottom:14px;
  width:4px;
  border-radius:0 999px 999px 0;
  background:var(--dkwp-deep-accent);
  pointer-events:none;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion--memory{
  --dkwp-deep-accent:var(--dkwp-viol-soft);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion--origin{
  --dkwp-deep-accent:var(--dkwp-peach);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion--grammar{
  --dkwp-deep-accent:var(--dkwp-sky);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:hover{
  transform:none!important;
  border-color:rgba(21,22,23,.22)!important;
  background:rgba(255,255,255,.93)!important;
  box-shadow:0 1px 0 rgba(21,22,23,.09)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion.is-open{
  border-color:rgba(21,22,23,.22)!important;
  background:rgba(255,255,255,.95)!important;
  box-shadow:0 1px 0 rgba(21,22,23,.10)!important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-head{
  min-height:68px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 32px!important;
  align-items:center!important;
  gap:12px!important;
  padding:13px 13px 13px 18px!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  text-align:left!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-head:hover{
  background:transparent!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-head>span:first-child{
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  gap:4px!important;
  color:var(--dkwp-ink)!important;
  font-size:var(--dkwp-f-14,14px)!important;
  font-weight:930!important;
  line-height:1.24!important;
  letter-spacing:-.018em!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-head small{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  margin:0!important;
  padding:3px 7px!important;
  border:1px solid color-mix(in srgb,var(--dkwp-deep-accent) 58%,rgba(21,22,23,.12))!important;
  border-radius:999px!important;
  background:color-mix(in srgb,var(--dkwp-deep-accent) 18%,white)!important;
  color:rgba(21,22,23,.64)!important;
  font-size:var(--dkwp-f-9_5,9.5px)!important;
  font-weight:820!important;
  line-height:1!important;
  letter-spacing:.025em!important;
  text-transform:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-head small::before{
  content:""!important;
  width:6px!important;
  height:6px!important;
  border-radius:999px!important;
  background:var(--dkwp-deep-accent)!important;
  box-shadow:none!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-icon{
  width:30px!important;
  height:30px!important;
  display:grid!important;
  place-items:center!important;
  border:1.25px solid rgba(21,22,23,.15)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.70)!important;
  color:rgba(21,22,23,.66)!important;
  box-shadow:none!important;
  transition:transform 150ms ease,background-color 130ms ease!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-icon svg{
  width:15px!important;
  height:15px!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion.is-open .dk-wp3-accordion-icon{
  background:color-mix(in srgb,var(--dkwp-deep-accent) 20%,white)!important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-body{
  padding:0 15px 15px 18px!important;
  border-top:1px solid rgba(21,22,23,.08)!important;
  background:rgba(255,255,255,.42)!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-long-copy{
  padding:13px 2px 1px!important;
  color:rgba(21,22,23,.78)!important;
  font-size:var(--dkwp-f-12_5,12.5px)!important;
  font-weight:620!important;
  line-height:1.68!important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-reference-table{
  margin-top:13px!important;
  border-color:rgba(21,22,23,.12)!important;
  box-shadow:none!important;
}

@container dkwp-shell (max-width:620px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
    --dkwp-cut-deep-911-h:16px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-section.dk-wp3-section--last{
    padding-top:22px!important;
    padding-bottom:24px!important;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-head{
    min-height:64px!important;
    padding:12px 12px 12px 16px!important;
  }
}
@container dkwp-shell (max-width:470px){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending){
    --dkwp-cut-deep-911-h:14px;
  }
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-head{
    grid-template-columns:minmax(0,1fr) 30px!important;
    gap:9px!important;
    padding-left:15px!important;
  }
}
@media (prefers-reduced-motion:reduce){
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list :is(.dk-wp3-accordion,.dk-wp3-accordion-icon){
    transition:none!important;
  }
}

/* =========================================================
   Phase 9.12 · High-Contrast Solid Text System (Word, Examples & Sentence)
   Eliminates all eye-straining transparencies (rgba alphas,
   hazy opacities, backdrop-filter blurs) across all three views.
   Preserves all font families ('Geist', 'Nunito', 'Fira Code')
   and font weights, giving crisp, jet-ink legibility like the
   transcript panel.
   ========================================================= */

/* Global Panel Typography & Rendering */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) {
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  text-rendering: optimizeLegibility !important;
}

/* ─────────────────────────────────────────────────────────
   1. KELİME (WORD) VIEW
   ───────────────────────────────────────────────────────── */
/* Hero meaning, secondary meaning, meta chips, form path */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-meaning {
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-word-view,.dk-wp3-root) :is(.dk-wp3-hero,section) .dk-wp3-mana,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view>.dk-wp3-hero .dk-wp3-mana,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-mana {
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
  text-align: justify !important;
  text-justify: inter-word !important;
  hyphens: auto !important;
  max-width: 100% !important;
  width: 100% !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-meta-chip {
  color: var(--dkwp-ink, #151617) !important;
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-form-path span {
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}

/* Section titles, descriptions, and kickers */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-kicker {
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-section-head h3 {
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-section-head p,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-section-intro {
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}

/* Noun facts, segments, and declension tables */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view :is(.dk-wp3-noun-fact, .dk-wp3-noun-seg) {
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  background: #ffffff !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view :is(.dk-wp3-noun-fact, .dk-wp3-noun-seg) :is(span, strong, small) {
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view :is(
  .dk-wp3-noun-case-table,
  .dk-wp3-article-table,
  .dk-wp3-reference-table,
  .dk-wp3-adj-case-table,
  .dk-wp3-conj-schema
) {
  background: #ffffff !important;
  color: var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view :is(
  .dk-wp3-noun-case-table,
  .dk-wp3-article-table,
  .dk-wp3-reference-table,
  .dk-wp3-adj-case-table,
  .dk-wp3-conj-schema
) :is(th, td, span, strong, small, div) {
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}

/* Rektion rows (Verbs) — Clean Hierarchy & Tactile Press Effect */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-rektion-row {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  min-width: 0 !important;
  margin: 0 0 12px 0 !important;
  padding: 14px 16px !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-left: 5px solid var(--dkwp-peach, #ffbe98) !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  box-shadow: 3px 3px 0 var(--dkwp-ink, #151617) !important;
  cursor: pointer !important;
  transition: transform 0.1s ease, box-shadow 0.1s ease, border-color 0.15s ease !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-rektion-row:hover {
  transform: translate(-1px, -1px) !important;
  box-shadow: 4.5px 4.5px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-rektion-row:active {
  transform: translate(2.5px, 2.5px) !important;
  box-shadow: 0.5px 0.5px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-rektion-head {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-rektion-badge-wrap {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-rektion-number {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 24px !important;
  height: 22px !important;
  padding: 0 5px !important;
  border-radius: 6px !important;
  background: var(--dkwp-mist, #f2eeff) !important;
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  box-shadow: 1px 1px 0 var(--dkwp-ink, #151617) !important;
  font-family: 'Fira Code', ui-monospace, monospace !important;
  font-size: 10.5px !important;
  font-weight: 900 !important;
  color: var(--dkwp-viol-deep, #6a56a7) !important;
  line-height: 1 !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-rektion-yapi {
  display: inline-flex !important;
  align-items: center !important;
  padding: 3px 10px !important;
  border-radius: 8px !important;
  background: #fff8ef !important;
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  box-shadow: 1.5px 1.5px 0 var(--dkwp-ink, #151617) !important;
  font-size: 14.5px !important;
  font-weight: 900 !important;
  line-height: 1.25 !important;
  color: var(--dkwp-ink, #151617) !important;
  letter-spacing: -0.01em !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-rektion-meaning {
  margin: 2px 0 2px 0 !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  color: rgba(21, 22, 23, 0.82) !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-rektion-example-box {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 10px 12px !important;
  border-radius: 10px !important;
  background: var(--dkwp-mist, #f7f5ff) !important;
  border: 1.5px solid rgba(21, 22, 23, 0.14) !important;
  border-left: 4px solid var(--dkwp-viol, #845ef7) !important;
  box-sizing: border-box !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-rektion-example-copy {
  min-width: 0 !important;
  flex: 1 1 auto !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-rektion-de {
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  color: var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-rektion-tr {
  margin-top: 4px !important;
  font-size: 12px !important;
  font-weight: 550 !important;
  line-height: 1.35 !important;
  color: rgba(21, 22, 23, 0.72) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-rektion-actions {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
}

/* Snapshot grid */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-snapshot {
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  background: #ffffff !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-snapshot :is(span, strong) {
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}

/* Wortfamilie (Kelime Ailesi) & Karıştırılabilecek Kelimeler (Similar Words) */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view :is(.dk-wp3-network-card, .dk-wp3-network-compare) {
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  box-shadow: 3px 3px 0 var(--dkwp-ink, #151617) !important;
  overflow: hidden !important;
  transition: transform 0.12s ease, box-shadow 0.12s ease !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view :is(.dk-wp3-network-card, .dk-wp3-network-compare):hover {
  transform: translate(-1.5px, -1.5px) !important;
  box-shadow: 5px 5px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view :is(.dk-wp3-network-card, .dk-wp3-network-compare) :is(
  .dk-wp3-network-word,
  .dk-wp3-network-word--compare,
  .dk-wp3-network-meaning,
  .dk-wp3-network-note span,
  .dk-wp3-network-example span,
  .dk-wp3-network-example-tr,
  .dk-wp3-network-difference p,
  .dk-wp3-network-example-de,
  .dk-wp3-network-detail p
) {
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view :is(.dk-wp3-network-card, .dk-wp3-network-compare) :is(
  .dk-wp3-network-difference > span,
  .dk-wp3-network-detail > span,
  .dk-wp3-network-example--compare > span
) {
  color: var(--dkwp-viol-deep, #453473) !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.045em !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view :is(.dk-wp3-network-card, .dk-wp3-network-compare) .dk-wp3-network-type {
  display: inline-flex !important;
  align-items: center !important;
  padding: 3px 9px !important;
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  border-radius: 999px !important;
  background: var(--dkwp-viol-soft, #c1b3ff) !important;
  color: var(--dkwp-ink, #151617) !important;
  font-size: 10.5px !important;
  font-weight: 900 !important;
  opacity: 1 !important;
  line-height: 1.2 !important;
}

/* Vertiefung (Derine İn Accordions) */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-deep-list .dk-wp3-accordion {
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  background: #ffffff !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-deep-list .dk-wp3-accordion :is(strong, span, p) {
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}

/* ─────────────────────────────────────────────────────────
   2. ÖRNEKLER (EXAMPLES) VIEW — DeuKlar Neo-Brutalist Redesign
   ───────────────────────────────────────────────────────── */
/* Tense navigation strip — clean 4-column / 6-column grid spanning 100% width */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-tense-strip {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 10px !important;
  background: transparent !important;
  border: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  padding: 2px 2px 14px 2px !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-tense-strip.dk-wp3-conj-level-strip {
  grid-template-columns: repeat(6, 1fr) !important;
  gap: 8px !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-tense-chip {
  width: 100% !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  padding: 10px 8px !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  color: var(--dkwp-ink, #151617) !important;
  box-shadow: 2.5px 2.5px 0 var(--dkwp-ink, #151617) !important;
  cursor: pointer !important;
  transition: transform 0.14s ease, box-shadow 0.14s ease, background-color 0.14s ease !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-tense-chip:not(.is-active):hover {
  transform: translate(-1px, -1px) !important;
  box-shadow: 4px 4px 0 var(--dkwp-ink, #151617) !important;
  background: var(--dkwp-mist, #f7f5ff) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-tense-chip.is-active,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-tense-chip.is-active:hover {
  background: var(--dkwp-viol-soft, #c1b3ff) !important;
  color: var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-tense-chip:active:not(:disabled) {
  transform: translate(2.5px, 2.5px) !important;
  box-shadow: 0.5px 0.5px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-tense-chip span {
  font-size: var(--dkwp-f-12, 12px) !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-tense-chip small {
  font-size: var(--dkwp-f-9_5, 9.5px) !important;
  font-weight: 650 !important;
  opacity: 0.65 !important;
  margin-top: 2px !important;
}

/* Example panels — remove outer box container so cards stand independently */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-examples-panel.is-active {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  padding: 0 !important;
}

/* Individual example sentence card — independent elevated DeuKlar card */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-examples-workarea, .dk-wp3-examples-view, .dk-wp3-verb-examples, .dk-wp3-examples-panels) .dk-wp3-example,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example {
  display: grid !important;
  grid-template-columns: 36px minmax(0, 1fr) auto !important;
  gap: 14px !important;
  align-items: center !important;
  padding: 14px 16px !important;
  background: #ffffff !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 14px !important;
  box-shadow: 3px 3px 0 var(--dkwp-ink, #151617) !important;
  cursor: pointer !important;
  transition: transform 0.08s ease, box-shadow 0.08s ease, background-color 0.12s ease !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-examples-workarea, .dk-wp3-examples-view, .dk-wp3-verb-examples, .dk-wp3-examples-panels) .dk-wp3-example:hover,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example:hover {
  transform: translate(-1.5px, -1.5px) !important;
  box-shadow: 4.5px 4.5px 0 var(--dkwp-ink, #151617) !important;
  background: var(--dkwp-mist, #f7f5ff) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-examples-workarea, .dk-wp3-examples-view, .dk-wp3-verb-examples, .dk-wp3-examples-panels) .dk-wp3-example:active,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example:active {
  transform: translate(2.5px, 2.5px) !important;
  box-shadow: 0.5px 0.5px 0 var(--dkwp-ink, #151617) !important;
  transition-duration: 0.05s !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-examples-workarea, .dk-wp3-examples-view, .dk-wp3-verb-examples, .dk-wp3-examples-panels) .dk-wp3-example:last-of-type,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example:last-of-type {
  border-bottom: 2px solid var(--dkwp-ink, #151617) !important;
}

/* CEFR Level Badges (A1 - C2) */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-examples-workarea, .dk-wp3-examples-view) .dk-wp3-level-badge,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-examples-workarea, .dk-wp3-examples-view) .dk-wp3-example-index {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 32px !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 9px !important;
  box-shadow: 1.5px 1.5px 0 var(--dkwp-ink, #151617) !important;
  font-family: 'Fira Code', 'Geist', ui-monospace, monospace !important;
  font-size: var(--dkwp-f-11_5, 11.5px) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  color: var(--dkwp-ink, #151617) !important;
  user-select: none !important;
  flex-shrink: 0 !important;
}

.dk-wp3-level-badge--a1 { background: #a8e6a3 !important; }
.dk-wp3-level-badge--a2 { background: #f8ff98 !important; }
.dk-wp3-level-badge--b1 { background: #a5d8ff !important; }
.dk-wp3-level-badge--b2 { background: #ffbe98 !important; }
.dk-wp3-level-badge--c1 { background: #c1b3ff !important; }
.dk-wp3-level-badge--c2 { background: #fb86b0 !important; }

/* German example sentence */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-examples-workarea, .dk-wp3-examples-view) .dk-wp3-de {
  color: var(--dkwp-ink, #151617) !important;
  font-size: var(--dkwp-f-15_5, 15.5px) !important;
  font-weight: 800 !important;
  line-height: 1.5 !important;
}

/* Target Word Highlighter inside example sentences */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-link.is-target-word {
  background: #ffbe98 !important;
  color: #151617 !important;
  font-weight: 900 !important;
  padding: 1px 6px !important;
  border-radius: 6px !important;
  border-bottom: 2px solid #151617 !important;
  box-shadow: 1px 1px 0 #151617 !important;
  display: inline-block !important;
  transition: background-color 0.12s ease, transform 0.12s ease !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-link.is-target-word:hover {
  background: #f8ff98 !important;
  transform: translateY(-1px) !important;
}

/* Turkish translation of example sentence */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-examples-workarea, .dk-wp3-examples-view) .dk-wp3-tr {
  color: rgba(21, 22, 23, 0.72) !important;
  font-size: var(--dkwp-f-13, 13px) !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  margin-top: 4px !important;
}

/* Audio listen button */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-examples-workarea, .dk-wp3-examples-view) .dk-wp3-action--icon {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  color: var(--dkwp-ink, #151617) !important;
  box-shadow: 2px 2px 0 var(--dkwp-ink, #151617) !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: transform 0.12s ease, box-shadow 0.12s ease, background-color 0.12s ease !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-examples-workarea, .dk-wp3-examples-view) .dk-wp3-action--icon:hover {
  background: var(--dkwp-sky, #a5d8ff) !important;
  transform: translate(-1px, -1px) !important;
  box-shadow: 3.5px 3.5px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-examples-workarea, .dk-wp3-examples-view) .dk-wp3-action--icon:active {
  transform: translate(1px, 1px) !important;
  box-shadow: 1px 1px 0 var(--dkwp-ink, #151617) !important;
}

/* Example picker (verbs) */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-verb-examples .dk-wp3-section-head p {
  display: none !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-picker-step--time {
  padding-top: 8px !important;
  border-top: 1.5px dashed rgba(21, 22, 23, 0.18) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-tense-strip {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 8px 10px !important;
  width: 100% !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-time {
  flex: 1 1 calc(16.66% - 10px) !important;
  min-width: 105px !important;
  max-width: 160px !important;
  min-height: 38px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 999px !important;
  padding: 6px 14px !important;
  background: #ffffff !important;
  color: var(--dkwp-ink, #151617) !important;
  box-shadow: 4px 4px 0 var(--dkwp-ink, #151617) !important;
  font-size: var(--dkwp-f-11_5, 11.5px) !important;
  font-weight: 850 !important;
  cursor: pointer !important;
  user-select: none !important;
  -webkit-user-select: none !important;
  text-align: center !important;
  transform: translate(0, 0) !important;
  transition: transform 0.14s cubic-bezier(.2, .9, .3, 1.2), box-shadow 0.14s cubic-bezier(.2, .9, .3, 1.2), background-color 0.14s ease !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-time:hover {
  transform: translate(-2px, -2px) !important;
  box-shadow: 6px 6px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-time:not(.is-active):hover {
  background: var(--dkwp-mist, #f7f5ff) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-time.is-active {
  background: var(--dkwp-peach, #ffbe98) !important;
  color: var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-time:is(:active, .is-pressed) {
  transform: translate(3px, 3px) !important;
  box-shadow: 1px 1px 0 var(--dkwp-ink, #151617) !important;
  transition-duration: 0.05s !important;
}

/* "Daha fazla göster" button */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-more {
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  color: var(--dkwp-ink, #151617) !important;
  box-shadow: 2.5px 2.5px 0 var(--dkwp-ink, #151617) !important;
  font-weight: 850 !important;
  font-size: var(--dkwp-f-12, 12px) !important;
  padding: 11px 16px !important;
  margin-top: 14px !important;
  cursor: pointer !important;
  transition: transform 0.1s ease, box-shadow 0.1s ease, background-color 0.12s ease !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-more:hover {
  background: var(--dkwp-peach, #ffbe98) !important;
  transform: translate(-1px, -1px) !important;
  box-shadow: 4px 4px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-more:active {
  transform: translate(2.5px, 2.5px) !important;
  box-shadow: 0.5px 0.5px 0 var(--dkwp-ink, #151617) !important;
}

/* ─────────────────────────────────────────────────────────
   3. CÜMLE (SENTENCE) VIEW
   ───────────────────────────────────────────────────────── */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-summary blockquote {
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-translation {
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-tags span {
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  background: #ffffff !important;
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-card {
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  background: linear-gradient(90deg, var(--accent) 0 5px, #ffffff 5px) !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-no {
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-role {
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-target {
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-note,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-anatomy-main p {
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}

/* ─────────────────────────────────────────────────────────
   4. PRONOMEN PERSONALPRONOMEN TABLE — Neo-Brutalist Redesign
   ───────────────────────────────────────────────────────── */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-reference {
  background: transparent !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-current {
  display: none !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-table-wrap {
  width: 100% !important;
  overflow-x: auto !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  box-shadow: 3px 3px 0 var(--dkwp-ink, #151617) !important;
  margin-top: 12px !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-table {
  min-width: 580px !important;
  width: 100% !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-head {
  min-height: 52px !important;
  border-bottom: 2px solid var(--dkwp-ink, #151617) !important;
  background: #f4f0ff !important;
  display: grid !important;
  grid-template-columns: 120px repeat(4, minmax(0, 1fr)) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-person-head {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: 'Fira Code', 'Geist', monospace !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: #151617 !important;
  background: #eae3ff !important;
  border-right: 2px solid var(--dkwp-ink, #151617) !important;
  border-left: 0 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-case-head {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 8px 6px !important;
  border-left: 1.5px solid rgba(21, 22, 23, 0.14) !important;
  background: transparent !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-case-head:nth-child(2) { background: #f3efff !important; }
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-case-head:nth-child(3) { background: #fff4e8 !important; }
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-case-head:nth-child(4) { background: #fffde6 !important; }
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-case-head:nth-child(5) { background: #eef7ff !important; }

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-case-head strong {
  font-size: 11.5px !important;
  font-weight: 900 !important;
  color: #151617 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-case-head small {
  font-size: 9.5px !important;
  font-weight: 700 !important;
  opacity: 0.65 !important;
  margin-top: 1px !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-row {
  display: grid !important;
  grid-template-columns: 120px repeat(4, minmax(0, 1fr)) !important;
  min-height: 48px !important;
  border-top: 1.5px solid rgba(21, 22, 23, 0.12) !important;
  transition: background-color 0.1s ease !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-row:nth-child(even) {
  background: #fcfbff !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-row:nth-child(odd) {
  background: #ffffff !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-row:hover {
  background: #f4efff !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-person {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  padding: 8px 14px !important;
  border-right: 2px solid var(--dkwp-ink, #151617) !important;
  background: transparent !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-person strong {
  font-size: 14px !important;
  font-weight: 900 !important;
  color: #151617 !important;
  line-height: 1.2 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-person small {
  font-size: 9.5px !important;
  font-weight: 650 !important;
  opacity: 0.55 !important;
  margin-top: 2px !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-cell {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 8px !important;
  font-size: 13.5px !important;
  font-weight: 750 !important;
  color: #151617 !important;
  border: 0 !important;
  border-left: 1.5px solid rgba(21, 22, 23, 0.12) !important;
  background: transparent !important;
  cursor: default !important;
  user-select: text !important;
  text-align: center !important;
  box-shadow: none !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-cell::after {
  display: none !important;
  content: none !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-pronoun-cell:hover {
  background: transparent !important;
  box-shadow: none !important;
}

/* ─────────────────────────────────────────────────────────
   5. KONJUNKTION SYNTAX & REFERENCE — Neo-Brutalist Redesign
   ───────────────────────────────────────────────────────── */
/* Fiil nerede durur? Section */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-syntax {
  background: transparent !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-lane {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  overflow-x: auto !important;
  padding: 4px 4px 14px 4px !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-lane > i {
  color: var(--dkwp-ink, #151617) !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  opacity: 0.6 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-token {
  flex: 0 0 auto !important;
  min-width: 90px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 3px !important;
  padding: 10px 14px !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: 2.5px 2.5px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-token small {
  font-family: 'Fira Code', monospace !important;
  font-size: 9.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  color: rgba(21, 22, 23, 0.58) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-token strong {
  font-size: 13.5px !important;
  font-weight: 900 !important;
  color: #151617 !important;
  white-space: nowrap !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-token[data-kind="connector"] {
  background: var(--dkwp-peach, #ffbe98) !important;
  border: 2.5px solid var(--dkwp-ink, #151617) !important;
  box-shadow: 3px 3px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-token[data-kind="verb-v2"] {
  background: var(--dkwp-viol-soft, #c1b3ff) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-token[data-kind="verb-now"] {
  background: #ffe0cd !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-token[data-kind="verb-end"] {
  background: #dff0ff !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-token[data-kind="punct"] {
  min-width: 32px !important;
  align-items: center !important;
  padding: 10px 8px !important;
  background: #fbfaff !important;
  border-style: solid !important;
}

/* =========================================================
   Conjunction Syntax & Reference Refinements
   - Clean DeuKlar Neo-Brutalist cards (no unwanted cut/top lines)
   - Scalable typography via var(--dkwp-f-*) responding to font-controls
   - High legibility for "Grundregel", "Cümle Kalıbı", and "Hauptsatz + Hauptsatz"
   - Article badges for Nomen in network sections
   ========================================================= */

/* Remove any unwanted pseudo-element cut lines above conjunction cards */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-conj-rule, .dk-wp3-conj-family-rule, .dk-wp3-conj-schema, .dk-wp3-conj-explain)::before,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(.dk-wp3-conj-rule, .dk-wp3-conj-family-rule, .dk-wp3-conj-schema, .dk-wp3-conj-explain)::after {
  content: none !important;
  display: none !important;
}

/* Conjunction Syntax Lane & Tokens */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-lane {
  gap: 8px !important;
  padding: 6px 4px 12px !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-token {
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 10px !important;
  box-shadow: 2px 2px 0 var(--dkwp-ink, #151617) !important;
  padding: 10px 12px !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-token small {
  font-family: 'Fira Code', monospace !important;
  font-size: var(--dkwp-f-10, 10px) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  opacity: 0.7 !important;
  color: #151617 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-token strong {
  font-size: var(--dkwp-f-13, 13px) !important;
  font-weight: 900 !important;
  color: #151617 !important;
}

/* Grundregel Box */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-rule {
  position: relative !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  gap: 14px !important;
  align-items: center !important;
  margin-top: 10px !important;
  padding: 12px 16px !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 12px !important;
  background: #fffdf5 !important;
  box-shadow: 2.5px 2.5px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-rule > span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: 'Fira Code', monospace !important;
  font-size: var(--dkwp-f-11, 11px) !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  color: #151617 !important;
  background: #fdf0a6 !important;
  padding: 4px 9px !important;
  border-radius: 6px !important;
  border: 1.5px solid #151617 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-rule > p {
  margin: 0 !important;
  font-size: var(--dkwp-f-14, 14px) !important;
  font-weight: 850 !important;
  color: #151617 !important;
  line-height: 1.5 !important;
}

/* Cümle Kalıbı (Schema) Box */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-schema {
  position: relative !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  gap: 14px !important;
  align-items: center !important;
  margin-top: 10px !important;
  padding: 12px 16px !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: 2.5px 2.5px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-schema > span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: 'Fira Code', monospace !important;
  font-size: var(--dkwp-f-11, 11px) !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  color: #151617 !important;
  background: #eef4ff !important;
  padding: 4px 9px !important;
  border-radius: 6px !important;
  border: 1.5px solid #151617 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-schema code {
  font-family: 'Fira Code', monospace !important;
  font-size: var(--dkwp-f-13_5, 13.5px) !important;
  font-weight: 850 !important;
  color: #151617 !important;
  line-height: 1.5 !important;
}

/* Erklärung (Detaylı söz dizimi açıklaması) Accordion */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-explain {
  position: relative !important;
  margin-top: 10px !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: 2.5px 2.5px 0 var(--dkwp-ink, #151617) !important;
  overflow: hidden !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-explain .dk-wp3-accordion-head {
  padding: 12px 16px !important;
  min-height: 52px !important;
  font-size: var(--dkwp-f-14, 14px) !important;
  font-weight: 900 !important;
  color: #151617 !important;
  transition: background-color 0.12s ease !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-explain .dk-wp3-accordion-head:hover {
  background: var(--dkwp-mist, #f7f5ff) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-explain .dk-wp3-accordion-head small {
  font-family: 'Fira Code', monospace !important;
  font-size: var(--dkwp-f-10_5, 10.5px) !important;
  font-weight: 850 !important;
  background: #f0ecff !important;
  border: 1.5px solid #151617 !important;
  border-radius: 6px !important;
  padding: 2px 7px !important;
  display: inline-block !important;
  margin-bottom: 4px !important;
  color: #151617 !important;
  opacity: 1 !important;
  width: fit-content !important;
}

/* Bağlaç Haritası Section */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-reference {
  background: transparent !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-group-strip {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-bottom: 12px !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-group {
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: 2.5px 2.5px 0 var(--dkwp-ink, #151617) !important;
  padding: 12px 14px !important;
  cursor: pointer !important;
  transition: transform 0.14s ease, box-shadow 0.14s ease, background-color 0.14s ease !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-group:hover {
  transform: translate(-1px, -1px) !important;
  box-shadow: 4px 4px 0 var(--dkwp-ink, #151617) !important;
  background: var(--dkwp-mist, #f7f5ff) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-group[data-dkwp-conj-group="konj"].is-active {
  background: var(--dkwp-viol-soft, #c1b3ff) !important;
  transform: translate(1px, 1px) !important;
  box-shadow: 1.5px 1.5px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-group[data-dkwp-conj-group="kadv"].is-active {
  background: var(--dkwp-peach, #ffbe98) !important;
  transform: translate(1px, 1px) !important;
  box-shadow: 1.5px 1.5px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-group[data-dkwp-conj-group="subj"].is-active {
  background: var(--dkwp-sky, #a5d8ff) !important;
  transform: translate(1px, 1px) !important;
  box-shadow: 1.5px 1.5px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-group strong {
  font-size: var(--dkwp-f-14, 14px) !important;
  font-weight: 900 !important;
  color: #151617 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-group small {
  font-size: var(--dkwp-f-11, 11px) !important;
  font-weight: 700 !important;
  opacity: 0.75 !important;
  color: #151617 !important;
  margin-top: 3px !important;
}

/* Hauptsatz + Hauptsatz Rule Box */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-family-rule {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  margin-bottom: 12px !important;
  padding: 12px 16px !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: 2.5px 2.5px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-family-rule span {
  display: inline-flex !important;
  align-items: center !important;
  padding: 4px 10px !important;
  background: #f0ecff !important;
  border: 1.5px solid #151617 !important;
  border-radius: 8px !important;
  font-family: 'Fira Code', monospace !important;
  font-size: var(--dkwp-f-11_5, 11.5px) !important;
  font-weight: 900 !important;
  color: #151617 !important;
  opacity: 1 !important;
  white-space: nowrap !important;
  flex: 0 0 auto !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-family-rule strong {
  font-size: var(--dkwp-f-13_5, 13.5px) !important;
  font-weight: 850 !important;
  color: #151617 !important;
  line-height: 1.4 !important;
  text-align: right !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-ref-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-ref-item {
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: 2.5px 2.5px 0 var(--dkwp-ink, #151617) !important;
  padding: 12px 16px !important;
  display: flex !important;
  align-items: baseline !important;
  gap: 10px !important;
  cursor: pointer !important;
  transition: transform 0.12s ease, box-shadow 0.12s ease, background-color 0.12s ease !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-ref-item:hover {
  transform: translate(-1px, -1px) !important;
  box-shadow: 4px 4px 0 var(--dkwp-ink, #151617) !important;
  background: #fdfcff !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-ref-item.is-current {
  background: #eae3ff !important;
  border: 2.5px solid var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-ref-word {
  font-size: var(--dkwp-f-15, 15px) !important;
  font-weight: 900 !important;
  color: #151617 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-ref-tr {
  font-size: var(--dkwp-f-12, 12px) !important;
  font-weight: 700 !important;
  color: rgba(21, 22, 23, 0.75) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-conj-ref-item i {
  position: absolute !important;
  right: 8px !important;
  top: 8px !important;
  padding: 2px 7px !important;
  border-radius: 6px !important;
  border: 1.5px solid #151617 !important;
  background: var(--dkwp-peach, #ffbe98) !important;
  color: #151617 !important;
  font-family: 'Fira Code', monospace !important;
  font-size: var(--dkwp-f-9, 9px) !important;
  font-weight: 900 !important;
  font-style: normal !important;
  text-transform: uppercase !important;
}

/* =========================================================
   Article Badges for Nomen in Network Sections (Wortfamilie & Abgrenzung)
   Matches DeuKlar brand system:
   der -> Blue (#a5d8ff)
   die -> Coral/Red (#ff9d9d)
   das -> Mint Green (#a7edc9)
   ========================================================= */
.dk-wp3-word-with-art {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}

.dk-wp3-art-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 2px 8px !important;
  font-family: 'Geist', 'Nunito', ui-sans-serif, system-ui, sans-serif !important;
  font-size: var(--dkwp-f-12, 12px) !important;
  font-weight: 900 !important;
  line-height: 1.15 !important;
  text-transform: lowercase !important;
  color: var(--dkwp-ink, #151617) !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 6px !important;
  box-shadow: 1.5px 1.5px 0 var(--dkwp-ink, #151617) !important;
  vertical-align: middle !important;
}

.dk-wp3-art-badge--der {
  background: var(--dkwp-sky, #a5d8ff) !important;
}

.dk-wp3-art-badge--die {
  background: var(--dkwp-err, #ff9d9d) !important;
}

.dk-wp3-art-badge--das {
  background: #a7edc9 !important;
}

.dk-wp3-noun-lemma {
  font-weight: 900 !important;
  color: #151617 !important;
}

/* =========================================================
   Präposition Word Panel Refinements (DeuKlar Brand System)
   - Eliminates awkward white box container in case cards
   - Seamless article shift pills (der -> dem, die -> der, etc.)
   - Eliminates wavy mask line above Grundregel
   - Full dynamic font scaling with dk-wp3-font-controls
   - Polished neo-brutalist case cards, buttons, & reference map
   ========================================================= */

/* 1. Grundregel in Präposition: Clean neo-brutalist card, NO wavy top line */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-rule::before,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-rule::after {
  content: none !important;
  display: none !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-rule {
  position: relative !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  gap: 14px !important;
  align-items: center !important;
  margin-top: 10px !important;
  margin-bottom: 12px !important;
  padding: 12px 16px !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 12px !important;
  background: #fffdf5 !important;
  box-shadow: 2.5px 2.5px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-rule > span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: 'Fira Code', monospace !important;
  font-size: var(--dkwp-f-11, 11px) !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  color: #151617 !important;
  background: #fdf0a6 !important;
  padding: 4px 9px !important;
  border-radius: 6px !important;
  border: 1.5px solid #151617 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-rule > p {
  margin: 0 !important;
  font-size: var(--dkwp-f-14, 14px) !important;
  font-weight: 850 !important;
  color: #151617 !important;
  line-height: 1.5 !important;
}

/* 2. Case Cards (Akkusativ, Dativ, Genitiv) */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-case-card {
  padding: 14px 16px !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 12px !important;
  box-shadow: 3px 3px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-case-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding-bottom: 10px !important;
  border-bottom: 1.5px solid rgba(21, 22, 23, 0.18) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-case-top > span.dk-wp3-gram {
  font-family: 'Fira Code', monospace !important;
  font-size: var(--dkwp-f-11, 11px) !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  background: #ffffff !important;
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  border-radius: 6px !important;
  padding: 2px 8px !important;
  color: #151617 !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-case-top > strong {
  font-size: var(--dkwp-f-15, 15px) !important;
  font-weight: 950 !important;
  color: #151617 !important;
  text-align: right !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-case-meaning {
  margin: 10px 0 0 !important;
  font-size: var(--dkwp-f-13, 13px) !important;
  font-weight: 750 !important;
  line-height: 1.5 !important;
  color: #151617 !important;
}

/* 3. Artikel Değişimi: NO white container box! Clean seamless badge row */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-case-card .dk-wp3-prep-article {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin-top: 10px !important;
  margin-bottom: 10px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-article-label {
  font-family: 'Fira Code', monospace !important;
  font-size: var(--dkwp-f-10, 10px) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  color: #151617 !important;
  opacity: 0.7 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-article-pills {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-shift {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 4px 9px !important;
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  box-shadow: 1.5px 1.5px 0 var(--dkwp-ink, #151617) !important;
  line-height: 1.2 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-shift .dk-wp3-shift-from {
  font-family: 'Fira Code', monospace !important;
  font-size: var(--dkwp-f-11_5, 11.5px) !important;
  font-weight: 800 !important;
  color: #2b2e33 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-shift .dk-wp3-shift-arrow {
  font-size: var(--dkwp-f-11, 11px) !important;
  font-weight: 900 !important;
  color: #555555 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-shift .dk-wp3-shift-to {
  font-family: 'Fira Code', monospace !important;
  font-size: var(--dkwp-f-13, 13px) !important;
  font-weight: 950 !important;
  color: #151617 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-shift.dk-wp3-shift--masc {
  background: var(--dkwp-sky, #a5d8ff) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-shift.dk-wp3-shift--fem {
  background: var(--dkwp-err, #ff9d9d) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-shift.dk-wp3-shift--neut {
  background: #a7edc9 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-shift.dk-wp3-shift--plur {
  background: #e9d5ff !important;
}

/* 4. Example inside Case Card: Crisp audio sentence player card */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-case-card .dk-wp3-example {
  background: #ffffff !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 10px !important;
  box-shadow: 2px 2px 0 var(--dkwp-ink, #151617) !important;
  margin-top: 8px !important;
  padding: 10px 12px !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-case-card .dk-wp3-example .dk-wp3-de {
  font-size: var(--dkwp-f-13_5, 13.5px) !important;
  font-weight: 900 !important;
  color: #151617 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-case-card .dk-wp3-example .dk-wp3-tr {
  font-size: var(--dkwp-f-11_5, 11.5px) !important;
  font-weight: 650 !important;
  color: #4b5563 !important;
  margin-top: 3px !important;
}

/* 5. Erklärung Accordion in Präposition (Detaylı gramer açıklaması) */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-explain {
  position: relative !important;
  margin-top: 10px !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: 2.5px 2.5px 0 var(--dkwp-ink, #151617) !important;
  overflow: hidden !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-explain .dk-wp3-accordion-head {
  padding: 12px 16px !important;
  min-height: 52px !important;
  font-size: var(--dkwp-f-14, 14px) !important;
  font-weight: 900 !important;
  color: #151617 !important;
  transition: background-color 0.12s ease !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-explain .dk-wp3-accordion-head:hover {
  background: var(--dkwp-mist, #f7f5ff) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-explain .dk-wp3-accordion-head small {
  font-family: 'Fira Code', monospace !important;
  font-size: var(--dkwp-f-10_5, 10.5px) !important;
  font-weight: 850 !important;
  background: #f0ecff !important;
  border: 1.5px solid #151617 !important;
  border-radius: 6px !important;
  padding: 2px 7px !important;
  display: inline-block !important;
  margin-bottom: 4px !important;
  color: #151617 !important;
  opacity: 1 !important;
  width: fit-content !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-explain .dk-wp3-long-copy {
  font-size: var(--dkwp-f-13_5, 13.5px) !important;
  line-height: 1.6 !important;
  color: #151617 !important;
}

/* 6. Verschmelzung (Birleşme Biçimleri): NO wavy top line, clean cards */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-contractions::before,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-contractions::after {
  content: none !important;
  display: none !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-contractions {
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: 2.5px 2.5px 0 var(--dkwp-ink, #151617) !important;
  padding: 14px !important;
  margin-top: 14px !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-subhead strong {
  font-size: var(--dkwp-f-13_5, 13.5px) !important;
  font-weight: 900 !important;
  color: #151617 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-subhead span {
  font-family: 'Fira Code', monospace !important;
  font-size: var(--dkwp-f-10, 10px) !important;
  font-weight: 800 !important;
  background: #eef5ff !important;
  border: 1.5px solid #151617 !important;
  border-radius: 6px !important;
  padding: 2px 7px !important;
  color: #151617 !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-contract {
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 10px !important;
  box-shadow: 2px 2px 0 var(--dkwp-ink, #151617) !important;
  background: #fbfbfc !important;
  padding: 10px 12px !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-contract-form strong {
  font-size: var(--dkwp-f-16, 16px) !important;
  font-weight: 950 !important;
  color: #151617 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-contract-form span {
  font-size: var(--dkwp-f-12, 12px) !important;
  font-weight: 800 !important;
  color: #4b5563 !important;
  opacity: 1 !important;
}

/* 7. Edat Haritası (Reference Map) Buttons & Cards */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-reference {
  background: transparent !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-group {
  padding: 10px 12px !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 10px !important;
  box-shadow: 2px 2px 0 var(--dkwp-ink, #151617) !important;
  background: #ffffff !important;
  transition: transform 0.12s ease, box-shadow 0.12s ease !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-group:hover {
  transform: translate(-1px, -1px) !important;
  box-shadow: 3px 3px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-group strong {
  font-size: var(--dkwp-f-13, 13px) !important;
  font-weight: 900 !important;
  color: #151617 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-group small {
  font-size: var(--dkwp-f-10_5, 10.5px) !important;
  font-weight: 700 !important;
  opacity: 0.7 !important;
  color: #151617 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-ref-item {
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 10px !important;
  box-shadow: 2px 2px 0 var(--dkwp-ink, #151617) !important;
  background: #ffffff !important;
  padding: 10px 12px !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-ref-word {
  font-size: var(--dkwp-f-14, 14px) !important;
  font-weight: 950 !important;
  color: #151617 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-ref-tr {
  font-size: var(--dkwp-f-11_5, 11.5px) !important;
  font-weight: 700 !important;
  color: #4b5563 !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-ref-item small {
  font-size: var(--dkwp-f-9_5, 9.5px) !important;
  font-weight: 700 !important;
  color: #6b7280 !important;
  opacity: 1 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-ref-item i {
  font-size: var(--dkwp-f-8_5, 8.5px) !important;
  font-weight: 900 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-wechsel-note > div {
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 10px !important;
  box-shadow: 2px 2px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-wechsel-note span {
  font-family: 'Fira Code', monospace !important;
  font-size: var(--dkwp-f-10, 10px) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  opacity: 0.7 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-prep-wechsel-note strong {
  font-size: var(--dkwp-f-13, 13px) !important;
  font-weight: 900 !important;
  line-height: 1.4 !important;
}

/* ─────────────────────────────────────────────────────────────
   Network Cards & Word Hover Refinements
   ───────────────────────────────────────────────────────────── */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare{
  cursor: pointer !important;
  transition: transform var(--dkwp-t) var(--dkwp-ease), box-shadow var(--dkwp-t) var(--dkwp-ease) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare:hover{
  transform: translateY(-2px) !important;
  box-shadow: inset 0 4px 0 var(--dkwp-viol, #7b61ff), 4px 4px 0 var(--dkwp-ink) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-word,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-word span,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card:hover .dk-wp3-network-word span,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare:hover .dk-wp3-network-word span,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-word:hover span,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-word:focus-visible span{
  text-decoration: none !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card:hover .dk-wp3-network-word svg,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare:hover .dk-wp3-network-word svg{
  transform: translateX(3px) !important;
}

/* Redundant single tab suppression */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-tense-strip:empty{
  display: none !important;
}

/* ─────────────────────────────────────────────────────────────
   Admin Purge Button (Only for av.ahmetkabakci@gmail.com)
   ───────────────────────────────────────────────────────────── */
.dk-wp3-admin-purge-btn{
  display: none;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 1.5px solid rgba(220, 38, 38, 0.35);
  border-radius: 8px;
  background: rgba(254, 242, 242, 0.9);
  color: #dc2626;
  cursor: pointer;
  transition: all var(--dkwp-t) var(--dkwp-ease);
}
.dk-wp3-admin-purge-btn:hover{
  background: #dc2626 !important;
  color: #ffffff !important;
  border-color: #b91c1c !important;
  transform: scale(1.08) !important;
}
.dk-wp3-admin-purge-btn svg{
  width: 14px;
  height: 14px;
}

/* ─────────────────────────────────────────────────────────────
/* ─────────────────────────────────────────────────────────────
   Wortfamilie (Kelime Ailesi) Modern Minimal Redesign
   - Dynamic 2-column grid layout (No dead horizontal space)
   - Fully scalable with dk-wp3-font-controls (--dkwp-f-*)
   - Distinct badges and compact example block
   ───────────────────────────────────────────────────────────── */
/* ─────────────────────────────────────────────────────────────
   Neo-Brutalist Design Upgrades (Steigerung, Kelime Ailesi, Karşılaştırma, Derine İn)
   ───────────────────────────────────────────────────────────── */

/* 1. Derecelendirme (Steigerung) Görsel Netlik & Çizgisiz Cümleler */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-degree-example {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 12px 16px !important;
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: 2px 2px 0 var(--dkwp-ink, #151617) !important;
  margin-bottom: 10px !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-degree-example:hover {
  background: var(--dkwp-cream, #fbf9f5) !important;
  transform: translate(-1px, -1px) !important;
  box-shadow: 3px 3px 0 var(--dkwp-ink, #151617) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-degree-example .dk-wp3-degree-example-text {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-degree-example :is(.dk-wp3-word-link, .dk-wp3-word-link:hover, .dk-wp3-de, .dk-wp3-tr) {
  border-bottom: none !important;
  text-decoration: none !important;
  box-shadow: none !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-degree-example .dk-wp3-de {
  font-size: var(--dkwp-f-14, 14px) !important;
  font-weight: 850 !important;
  line-height: 1.45 !important;
  color: var(--dkwp-ink, #151617) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-degree-example .dk-wp3-tr {
  margin-top: 4px !important;
  font-size: var(--dkwp-f-12_5, 12.5px) !important;
  font-weight: 650 !important;
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
  line-height: 1.4 !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-degree-copy-desc {
  color: var(--dkwp-ink, #151617) !important;
  font-size: 13px !important;
  font-weight: 650 !important;
  line-height: 1.55 !important;
  opacity: 1 !important;
  background: var(--dkwp-mist, #f7f5ff) !important;
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  border-left: 4.5px solid var(--dkwp-peach, #ffbe98) !important;
  box-shadow: 2px 2px 0 var(--dkwp-ink, #151617) !important;
  border-radius: 10px !important;
  padding: 10px 14px !important;
}

/* Evrensel Yüksek Kontrast: Hiçbir Türkçe çeviri soluk veya tozlu kalmayacak */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-tr,
  .dk-wp3-network-family-tr,
  .dk-wp3-network-example-tr,
  .dk-wp3-adj-usage-example .dk-wp3-tr
) {
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
  font-weight: 650 !important;
}

/* 2. Kelime Ailesi (Word Family) Yeniden Tasarımı & İşlevsiz Basma Efekti */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-family-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  align-items: stretch !important;
}
@container dkwp-shell (max-width: 420px) {
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-family-grid {
    grid-template-columns: 1fr !important;
  }
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--family {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  padding: 13px 15px !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  box-shadow: 3px 3px 0 var(--dkwp-ink, #151617) !important;
  cursor: default !important;
  user-select: text !important;
  box-sizing: border-box !important;
  transition: transform 0.1s ease, box-shadow 0.1s ease, border-color 0.15s ease !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--family:hover {
  transform: translate(-1px, -1px) !important;
  box-shadow: 4px 4px 0 var(--dkwp-ink, #151617) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--family:active {
  transform: translate(2.5px, 2.5px) !important;
  box-shadow: 0.5px 0.5px 0 var(--dkwp-ink, #151617) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--family .dk-wp3-network-card-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  margin-bottom: 6px !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--family .dk-wp3-network-family-word {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: var(--dkwp-f-16, 16px) !important;
  font-weight: 850 !important;
  line-height: 1.25 !important;
  color: var(--dkwp-ink, #151617) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--family .dk-wp3-network-type-badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2.5px 8px !important;
  border-radius: 999px !important;
  background: var(--dkwp-viol-soft, #c1b3ff) !important;
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  font-size: var(--dkwp-f-9_5, 9.5px) !important;
  font-weight: 850 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  color: var(--dkwp-ink, #151617) !important;
  box-shadow: 1px 1px 0 var(--dkwp-ink, #151617) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--family .dk-wp3-network-info-tag {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 7px !important;
  border-radius: 6px !important;
  background: #fff8df !important;
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  font-size: var(--dkwp-f-10, 10px) !important;
  font-weight: 750 !important;
  color: var(--dkwp-ink, #151617) !important;
  margin-left: 4px !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--family .dk-wp3-network-meaning {
  margin: 4px 0 10px 0 !important;
  font-size: var(--dkwp-f-13, 13px) !important;
  font-weight: 600 !important;
  line-height: 1.48 !important;
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--family .dk-wp3-network-family-ex {
  margin-top: auto !important;
  padding: 8px 12px !important;
  border-radius: 10px !important;
  background: var(--dkwp-mist, #f7f5ff) !important;
  border: 1.5px solid rgba(21, 22, 23, 0.12) !important;
  border-left: 3.5px solid var(--dkwp-viol, #845ef7) !important;
  box-sizing: border-box !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--family .dk-wp3-network-family-de {
  font-size: var(--dkwp-f-13, 13px) !important;
  font-weight: 750 !important;
  line-height: 1.4 !important;
  color: var(--dkwp-ink, #151617) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--family .dk-wp3-network-family-tr {
  margin-top: 3px !important;
  font-size: var(--dkwp-f-11_5, 11.5px) !important;
  font-weight: 650 !important;
  line-height: 1.35 !important;
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}

/* 3. Karıştırılabilecek Kelimeler (Kutucuk Tasarımı & İşlevli Basma Efekti) */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare {
  display: block !important;
  padding: 0 !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  box-shadow: 3px 3px 0 var(--dkwp-ink, #151617) !important;
  cursor: pointer !important;
  margin-bottom: 12px !important;
  overflow: hidden !important;
  transition: transform 0.1s ease, box-shadow 0.1s ease, border-color 0.15s ease !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare:hover {
  transform: translate(-1px, -1px) !important;
  box-shadow: 4.5px 4.5px 0 var(--dkwp-ink, #151617) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare:active {
  transform: translate(2.5px, 2.5px) !important;
  box-shadow: 0.5px 0.5px 0 var(--dkwp-ink, #151617) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-head {
  padding: 12px 16px !important;
  background: var(--dkwp-mist, #f7f5ff) !important;
  border-bottom: 2px solid var(--dkwp-ink, #151617) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-difference,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-body > .dk-wp3-network-example--compare,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare.is-detail-open .dk-wp3-network-detail {
  display: grid !important;
  grid-template-columns: 135px minmax(0, 1fr) !important;
  gap: 14px !important;
  align-items: start !important;
  padding: 11px 16px !important;
  min-width: 0 !important;
}
@container dkwp-shell (max-width: 500px) {
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-difference,
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-body > .dk-wp3-network-example--compare,
  #kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare.is-detail-open .dk-wp3-network-detail {
    grid-template-columns: 115px minmax(0, 1fr) !important;
    gap: 10px !important;
    padding: 10px 12px !important;
  }
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-network-difference > span,
  .dk-wp3-network-compare-body > .dk-wp3-network-example--compare > span,
  .dk-wp3-network-detail > span
) {
  margin: 2px 0 0 !important;
  font-size: var(--dkwp-f-10_5, 10.5px) !important;
  font-weight: 800 !important;
  color: var(--dkwp-viol-deep, #453473) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  opacity: 1 !important;
  line-height: 1.3 !important;
  white-space: normal !important;
  word-break: normal !important;
}
/* İçerik metinleri rahat okuma için regular/medium (bold değil) */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-difference p {
  margin: 0 !important;
  font-size: var(--dkwp-f-13_5, 13.5px) !important;
  font-weight: 550 !important;
  line-height: 1.55 !important;
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-body > .dk-wp3-network-example--compare .dk-wp3-network-example-de {
  font-size: var(--dkwp-f-13_5, 13.5px) !important;
  font-weight: 750 !important;
  line-height: 1.5 !important;
  color: var(--dkwp-ink, #151617) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail {
  margin: 0 !important;
  border: 0 !important;
  border-top: 1.5px solid var(--dkwp-ink, #151617) !important;
  background: #fffdf5 !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail p {
  margin: 0 !important;
  font-size: var(--dkwp-f-13_5, 13.5px) !important;
  font-weight: 550 !important;
  line-height: 1.6 !important;
  color: var(--dkwp-ink, #151617) !important;
  opacity: 1 !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare-footer {
  display: flex !important;
  justify-content: flex-start !important;
  padding: 8px 16px 12px 16px !important;
  border-top: 1px dashed rgba(21, 22, 23, 0.15) !important;
  background: #ffffff !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail-toggle.dk-wp3-action--disclosure {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 5px 12px !important;
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  border-radius: 999px !important;
  background: var(--dkwp-peach, #ffbe98) !important;
  color: var(--dkwp-ink, #151617) !important;
  font-size: var(--dkwp-f-11, 11px) !important;
  font-weight: 850 !important;
  box-shadow: 1.5px 1.5px 0 var(--dkwp-ink, #151617) !important;
  cursor: pointer !important;
  transition: transform 0.1s ease, box-shadow 0.1s ease !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-detail-toggle.dk-wp3-action--disclosure:active {
  transform: translate(1.5px, 1.5px) !important;
  box-shadow: 0px 0px 0 var(--dkwp-ink, #151617) !important;
}

/* 4. Sıfat Çekimleri & Rol Butonları Derin Basma Efekti (3px Travel) */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-degree-step,
  .dk-wp3-adj-form,
  .dk-wp3-adj-strength,
  .dk-wp3-adj-gender,
  .dk-wp3-examples-workarea .dk-wp3-tense-chip
) {
  transition: transform 0.1s ease, box-shadow 0.1s ease, background-color 0.12s ease !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-degree-step:active,
  .dk-wp3-adj-form:active,
  .dk-wp3-adj-strength:active,
  .dk-wp3-adj-gender:active,
  .dk-wp3-examples-workarea .dk-wp3-tense-chip:active
) {
  transform: translate(3px, 3px) !important;
  box-shadow: 0px 0px 0 var(--dkwp-ink, #151617) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-tense-strip.dk-wp3-role-strip {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 16px !important;
  width: 100% !important;
  margin: 0 auto 14px auto !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-examples-workarea .dk-wp3-tense-strip.dk-wp3-role-strip .dk-wp3-tense-chip {
  flex: 0 1 190px !important;
  max-width: 220px !important;
  width: 190px !important;
}

/* 5. "Derine İn" Bölümü Butonları Yeniden Tasarımı */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion {
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  box-shadow: 3px 3px 0 var(--dkwp-ink, #151617) !important;
  margin-bottom: 12px !important;
  transform: none !important;
  overflow: hidden !important;
  transition: box-shadow 0.15s ease, border-color 0.15s ease !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:hover {
  transform: none !important;
  box-shadow: 4px 4px 0 var(--dkwp-ink, #151617) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion:active {
  transform: none !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  min-height: 56px !important;
  padding: 12px 16px !important;
  width: 100% !important;
  background: #ffffff !important;
  border: none !important;
  cursor: pointer !important;
  text-align: left !important;
  box-shadow: none !important;
  transform: none !important;
  transition: background-color 0.15s ease !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-head:hover {
  background: var(--dkwp-mist, #f7f5ff) !important;
  box-shadow: none !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion.is-open .dk-wp3-accordion-head {
  border-bottom: 1.5px solid var(--dkwp-ink, #151617) !important;
  background: var(--dkwp-mist, #f7f5ff) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-head > span:first-child {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 4px !important;
  font-size: 15px !important;
  font-weight: 850 !important;
  color: var(--dkwp-ink, #151617) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-head small {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2.5px 8px !important;
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  border-radius: 999px !important;
  background: var(--dkwp-viol-soft, #c1b3ff) !important;
  color: var(--dkwp-ink, #151617) !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  box-shadow: 1px 1px 0 var(--dkwp-ink, #151617) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion--origin .dk-wp3-accordion-head small {
  background: var(--dkwp-peach, #ffbe98) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-icon {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  color: var(--dkwp-ink, #151617) !important;
  box-shadow: 1.5px 1.5px 0 var(--dkwp-ink, #151617) !important;
  transition: transform 0.2s ease, background-color 0.2s ease !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion.is-open .dk-wp3-accordion-icon {
  transform: rotate(180deg) !important;
  background: var(--dkwp-peach, #ffbe98) !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-accordion-body {
  padding: 14px 18px !important;
  background: #fcfbfe !important;
  border-top: none !important;
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-deep-list .dk-wp3-long-copy {
  color: var(--dkwp-ink, #151617) !important;
  font-size: 13.5px !important;
  font-weight: 550 !important;
  line-height: 1.6 !important;
  opacity: 1 !important;
}

/* DeuKlar Neo-Brutalist Custom Tooltips */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) [data-dkwp-tooltip] {
  position: relative !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) [data-dkwp-tooltip]::after {
  content: attr(data-dkwp-tooltip);
  position: absolute;
  bottom: calc(100% + 7px);
  left: 50%;
  transform: translateX(-50%) translateY(4px);
  background: #151617;
  color: #ffffff;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  font-size: 11px;
  font-weight: 750;
  line-height: 1;
  letter-spacing: 0.02em;
  white-space: nowrap;
  padding: 6px 9px;
  border-radius: 7px;
  border: 1.5px solid #151617;
  box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.28);
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.14s ease, transform 0.14s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.14s;
  z-index: 99999;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) [data-dkwp-tooltip]::before {
  content: '';
  position: absolute;
  bottom: calc(100% + 2px);
  left: 50%;
  transform: translateX(-50%) translateY(4px);
  border-width: 5px 5px 0 5px;
  border-style: solid;
  border-color: #151617 transparent transparent transparent;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.14s ease, transform 0.14s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.14s;
  z-index: 99999;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) [data-dkwp-tooltip]:hover::after,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) [data-dkwp-tooltip]:hover::before {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}

/* Right-align tooltip on the last action button in example rows to avoid right clipping */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-actions > [data-dkwp-tooltip]:last-child::after {
  left: auto;
  right: 0;
  transform: translateY(4px);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-actions > [data-dkwp-tooltip]:last-child::before {
  left: auto;
  right: 12px;
  transform: translateY(4px);
}
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-actions > [data-dkwp-tooltip]:last-child:hover::after,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-actions > [data-dkwp-tooltip]:last-child:hover::before {
  transform: translateY(0);
}

/* DeuKlar Sentence History Back Button */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-nav-bar {
  padding: 10px 16px 0 !important;
  display: flex !important;
  align-items: center !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-back-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 4px 10px !important;
  height: 28px !important;
  min-height: 28px !important;
  background: var(--dkwp-paper, #ffffff) !important;
  color: var(--dkwp-ink, #151617) !important;
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  border-radius: 8px !important;
  font-family: inherit !important;
  font-size: 11.5px !important;
  font-weight: 750 !important;
  line-height: 1 !important;
  box-shadow: 2px 2px 0 var(--dkwp-ink, #151617) !important;
  cursor: pointer !important;
  text-decoration: none !important;
  transition: transform 0.12s ease, box-shadow 0.12s ease, background-color 0.12s ease !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-back-btn:hover {
  background: var(--dkwp-peach, #ffbe98) !important;
  transform: translate(-1px, -1px) !important;
  box-shadow: 3px 3px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-back-btn:active {
  transform: translate(2px, 2px) !important;
  box-shadow: 0 0 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-sentence-back-btn svg {
  width: 13px !important;
  height: 13px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.8px !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  flex-shrink: 0 !important;
}

/* Components (Bestandteile) Equation Centered & Article Badges */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-equation {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  flex-wrap: wrap !important;
  gap: 8px 10px !important;
  margin: 0 0 14px !important;
  padding: 12px 16px !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 14px !important;
  background: var(--dkwp-mist, #fff6ef) !important;
  box-shadow: 2.5px 2.5px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-equation-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 5px 11px !important;
  background: #ffffff !important;
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  border-radius: 10px !important;
  box-shadow: 1.5px 1.5px 0 var(--dkwp-ink, #151617) !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  color: var(--dkwp-ink, #151617) !important;
  line-height: 1.2 !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-equation-chip--result {
  border: 2px solid var(--dkwp-ink, #151617) !important;
  box-shadow: 2px 2px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-equation-chip .dk-wp3-art-badge {
  padding: 2px 7px !important;
  font-size: 11.5px !important;
  font-weight: 850 !important;
  border: 1.5px solid var(--dkwp-ink, #151617) !important;
  border-radius: 6px !important;
  box-shadow: 1px 1px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-equation-chip .dk-wp3-noun-lemma {
  font-size: 13.5px !important;
  font-weight: 850 !important;
  color: var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-equation-op {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 16px !important;
  font-weight: 950 !important;
  color: var(--dkwp-ink, #151617) !important;
  padding: 0 4px !important;
  user-select: none !important;
}

/* Karıştırılabilecek Kelimeler (Similar Words) & Kelime Kartları Kesintisiz Basma Efekti */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view .dk-wp3-network-compare:active,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-word-view :is(.dk-wp3-network-card, .dk-wp3-network-compare):active,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare:active,
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) [data-dkwp-network-card]:active {
  transform: translate(2.5px, 2.5px) !important;
  box-shadow: 0.5px 0.5px 0 var(--dkwp-ink, #151617) !important;
}

/* Bileşenler (Components) — Tıklama özelliği kaldırıldı, salt okunur & basma efekti */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--component {
  cursor: default !important;
  user-select: none !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--component:hover {
  cursor: default !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--component .dk-wp3-network-component-word {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 2px 0;
  font-size: var(--dkwp-f-16, 16px);
  font-weight: 950;
  line-height: 1.25;
  letter-spacing: -0.015em;
  color: var(--dkwp-ink, #151617);
  cursor: default !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--component .dk-wp3-network-component-word span {
  min-width: 0;
  overflow-wrap: anywhere;
  cursor: default !important;
}

/* ══════════════════════════════════════════════════════════════════════
   ÇEKİMLER VE ÖRNEKLER — MEKANİK "BASMATİK" EFEKTİ & AKTİF RENK KORUMASI
   Reaktion, Kelime Ailesi ve Bileşenler ile Birebir Aynı Dokunsal Mekanik
   ══════════════════════════════════════════════════════════════════════ */

/* 1. Diğer Yardımcı Butonlar — Dinamik Geçiş ve İmleç */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  button.dk-wp3-tense-chip,
  button.dk-wp3-more,
  button.dk-wp3-article-ex-filter-btn,
  button.dk-wp3-article-family,
  button.dk-wp3-noun-seg,
  button.dk-wp3-adj-form,
  button.dk-wp3-adj-strength,
  button.dk-wp3-adj-gender,
  button.dk-wp3-prep-group,
  button.dk-wp3-conj-group,
  button.dk-wp3-degree-step,
  .dk-wp3-tense-chip,
  .dk-wp3-more,
  .dk-wp3-article-ex-filter-btn,
  .dk-wp3-article-family,
  .dk-wp3-noun-seg,
  .dk-wp3-adj-form,
  .dk-wp3-adj-strength,
  .dk-wp3-adj-gender,
  .dk-wp3-prep-group,
  .dk-wp3-conj-group,
  .dk-wp3-degree-step
) {
  cursor: pointer !important;
  transition: transform 0.08s ease, box-shadow 0.08s ease, background-color 0.12s ease !important;
}

/* 2. Dinlenme Hali (Resting State) — Yardımcı Butonlar */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  button.dk-wp3-tense-chip,
  button.dk-wp3-more,
  button.dk-wp3-article-ex-filter-btn,
  button.dk-wp3-article-family,
  button.dk-wp3-noun-seg,
  button.dk-wp3-adj-form,
  button.dk-wp3-adj-strength,
  button.dk-wp3-adj-gender,
  button.dk-wp3-prep-group,
  button.dk-wp3-conj-group,
  button.dk-wp3-degree-step,
  .dk-wp3-tense-chip,
  .dk-wp3-more,
  .dk-wp3-article-ex-filter-btn,
  .dk-wp3-article-family,
  .dk-wp3-noun-seg,
  .dk-wp3-adj-form,
  .dk-wp3-adj-strength,
  .dk-wp3-adj-gender,
  .dk-wp3-prep-group,
  .dk-wp3-conj-group,
  .dk-wp3-degree-step
):not(:hover):not(:active) {
  transform: translate(0, 0) !important;
  box-shadow: 2.5px 2.5px 0 var(--dkwp-ink, #151617) !important;
}

/* 3. Aktiflik Renk Koruması — Yardımcı Butonlar */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  button.dk-wp3-tense-chip,
  button.dk-wp3-article-family,
  button.dk-wp3-article-ex-filter-btn,
  button.dk-wp3-prep-group,
  button.dk-wp3-conj-group,
  button.dk-wp3-noun-seg,
  button.dk-wp3-adj-form,
  button.dk-wp3-adj-strength,
  button.dk-wp3-adj-gender,
  .dk-wp3-tense-chip,
  .dk-wp3-article-family,
  .dk-wp3-article-ex-filter-btn,
  .dk-wp3-prep-group,
  .dk-wp3-conj-group,
  .dk-wp3-noun-seg,
  .dk-wp3-adj-form,
  .dk-wp3-adj-strength,
  .dk-wp3-adj-gender
).is-active {
  background: var(--dkwp-viol-soft, #c1b3ff) !important;
  color: var(--dkwp-ink, #151617) !important;
  border-color: var(--dkwp-ink, #151617) !important;
}

/* 4. Üzerine Gelme Hali (Hover) — Yardımcı Butonlar */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  button.dk-wp3-tense-chip,
  button.dk-wp3-more,
  button.dk-wp3-article-ex-filter-btn,
  button.dk-wp3-article-family,
  button.dk-wp3-noun-seg,
  button.dk-wp3-adj-form,
  button.dk-wp3-adj-strength,
  button.dk-wp3-adj-gender,
  button.dk-wp3-prep-group,
  button.dk-wp3-conj-group,
  button.dk-wp3-degree-step,
  .dk-wp3-tense-chip,
  .dk-wp3-more,
  .dk-wp3-article-ex-filter-btn,
  .dk-wp3-article-family,
  .dk-wp3-noun-seg,
  .dk-wp3-adj-form,
  .dk-wp3-adj-strength,
  .dk-wp3-adj-gender,
  .dk-wp3-prep-group,
  .dk-wp3-conj-group,
  .dk-wp3-degree-step
):hover:not(:disabled) {
  transform: translate(-1.5px, -1.5px) !important;
  box-shadow: 4px 4px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  button.dk-wp3-tense-chip,
  button.dk-wp3-more,
  button.dk-wp3-article-ex-filter-btn,
  button.dk-wp3-article-family,
  button.dk-wp3-noun-seg,
  button.dk-wp3-adj-form,
  button.dk-wp3-adj-strength,
  button.dk-wp3-adj-gender,
  button.dk-wp3-prep-group,
  button.dk-wp3-conj-group,
  button.dk-wp3-degree-step,
  .dk-wp3-tense-chip,
  .dk-wp3-more,
  .dk-wp3-article-ex-filter-btn,
  .dk-wp3-article-family,
  .dk-wp3-noun-seg,
  .dk-wp3-adj-form,
  .dk-wp3-adj-strength,
  .dk-wp3-adj-gender,
  .dk-wp3-prep-group,
  .dk-wp3-conj-group,
  .dk-wp3-degree-step
):not(.is-active):hover:not(:disabled) {
  background: var(--dkwp-mist, #f7f5ff) !important;
}

/* 5. Basma / Gömülme (:active) — Yardımcı Butonlar */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  button.dk-wp3-tense-chip,
  button.dk-wp3-more,
  button.dk-wp3-article-ex-filter-btn,
  button.dk-wp3-article-family,
  button.dk-wp3-noun-seg,
  button.dk-wp3-adj-form,
  button.dk-wp3-adj-strength,
  button.dk-wp3-adj-gender,
  button.dk-wp3-prep-group,
  button.dk-wp3-conj-group,
  button.dk-wp3-degree-step,
  .dk-wp3-tense-chip,
  .dk-wp3-more,
  .dk-wp3-article-ex-filter-btn,
  .dk-wp3-article-family,
  .dk-wp3-noun-seg,
  .dk-wp3-adj-form,
  .dk-wp3-adj-strength,
  .dk-wp3-adj-gender,
  .dk-wp3-prep-group,
  .dk-wp3-conj-group,
  .dk-wp3-degree-step
):active:not(:disabled) {
  transform: translate(2.5px, 2.5px) !important;
  box-shadow: 0.5px 0.5px 0 var(--dkwp-ink, #151617) !important;
  transition-duration: 0.05s !important;
}

/* 6. Odaklanma (Focus) arka plan bozulumunu engelleme */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  button.dk-wp3-tense-chip,
  button.dk-wp3-more,
  .dk-wp3-tense-chip,
  .dk-wp3-more
):focus:not(:focus-visible) {
  outline: none !important;
}

/* ══════════════════════════════════════════════════════════════════════
   DEUKLAR İMZA BUTON MEKANİĞİ: ÇEKİMLER (KİP & ZAMAN) & ÖRNEKLER (KİP & ZAMAN)
   Kaynak: deuklar-web (.dx-raise)
   • Dinlenme (Resting):  transform: translate(0, 0)       | box-shadow: 4px 4px 0 ink
   • Havalanma (Hover):   transform: translate(-2px, -2px) | box-shadow: 6px 6px 0 ink
   • Basma (Active):      transform: translate(3px, 3px)   | box-shadow: 1px 1px 0 ink (0.05s)
   • Toplam Hareket:      5px net fiziksel çökme & 5px gölge kapanması
   • Rebound (Geri Tepki): cubic-bezier(.2, .9, .3, 1.2) tok ve elastik yaylanma
   • Çift Tetik Desteği:  :is(:active, .is-pressed) ile hem mousedown hem dokunsal pulse
   ══════════════════════════════════════════════════════════════════════ */

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  button.dk-wp3-conj-mode,
  button.dk-wp3-conj-tense,
  button.dk-wp3-example-mood,
  button.dk-wp3-example-time,
  .dk-wp3-conj-mode,
  .dk-wp3-conj-tense,
  .dk-wp3-example-mood,
  .dk-wp3-example-time
) {
  cursor: pointer !important;
  user-select: none !important;
  -webkit-user-select: none !important;
  -webkit-tap-highlight-color: transparent !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  box-shadow: 4px 4px 0 var(--dkwp-ink, #151617) !important;
  transform: translate(0, 0) !important;
  transition:
    transform 0.14s cubic-bezier(.2, .9, .3, 1.2),
    box-shadow 0.14s cubic-bezier(.2, .9, .3, 1.2),
    background-color 0.14s ease !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  button.dk-wp3-conj-mode,
  button.dk-wp3-conj-tense,
  button.dk-wp3-example-mood,
  button.dk-wp3-example-time,
  .dk-wp3-conj-mode,
  .dk-wp3-conj-tense,
  .dk-wp3-example-mood,
  .dk-wp3-example-time
):not(:hover):not(:active):not(.is-pressed) {
  transform: translate(0, 0) !important;
  box-shadow: 4px 4px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  button.dk-wp3-conj-mode,
  button.dk-wp3-example-mood,
  .dk-wp3-conj-mode,
  .dk-wp3-example-mood
).is-active {
  background: var(--dkwp-viol-soft, #c1b3ff) !important;
  color: var(--dkwp-ink, #151617) !important;
  border-color: var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  button.dk-wp3-conj-tense,
  button.dk-wp3-example-time,
  .dk-wp3-conj-tense,
  .dk-wp3-example-time
).is-active {
  background: var(--dkwp-peach, #ffbe98) !important;
  color: var(--dkwp-ink, #151617) !important;
  border-color: var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  button.dk-wp3-conj-mode,
  button.dk-wp3-conj-tense,
  button.dk-wp3-example-mood,
  button.dk-wp3-example-time,
  .dk-wp3-conj-mode,
  .dk-wp3-conj-tense,
  .dk-wp3-example-mood,
  .dk-wp3-example-time
):hover:not(:disabled) {
  transform: translate(-2px, -2px) !important;
  box-shadow: 6px 6px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  button.dk-wp3-conj-mode,
  button.dk-wp3-conj-tense,
  button.dk-wp3-example-mood,
  button.dk-wp3-example-time,
  .dk-wp3-conj-mode,
  .dk-wp3-conj-tense,
  .dk-wp3-example-mood,
  .dk-wp3-example-time
):not(.is-active):hover:not(:disabled) {
  background: var(--dkwp-mist, #f7f5ff) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  button.dk-wp3-conj-mode,
  button.dk-wp3-conj-tense,
  button.dk-wp3-example-mood,
  button.dk-wp3-example-time,
  .dk-wp3-conj-mode,
  .dk-wp3-conj-tense,
  .dk-wp3-example-mood,
  .dk-wp3-example-time
):is(:active, .is-pressed):not(:disabled) {
  transform: translate(3px, 3px) !important;
  box-shadow: 1px 1px 0 var(--dkwp-ink, #151617) !important;
  transition-duration: 0.05s !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  button.dk-wp3-conj-mode,
  button.dk-wp3-conj-tense,
  button.dk-wp3-example-mood,
  button.dk-wp3-example-time,
  .dk-wp3-conj-mode,
  .dk-wp3-conj-tense,
  .dk-wp3-example-mood,
  .dk-wp3-example-time
):focus:not(:focus-visible) {
  outline: none !important;
}

/* 7. Çekimler (Conjugation) ve Örnek Cümle (Example) Kutuları — Birebir Aynı "Basmatik" Dokunsal Mekanik */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-conj-form,
  .dk-wp3-example,
  .dk-wp3-example--article
) {
  cursor: pointer !important;
  transition: transform 0.08s ease, box-shadow 0.08s ease, background-color 0.12s ease !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-conj-form,
  .dk-wp3-example,
  .dk-wp3-example--article
):not(:hover):not(:active) {
  transform: translate(0, 0) !important;
  box-shadow: 3px 3px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-conj-form,
  .dk-wp3-example,
  .dk-wp3-example--article
):hover {
  transform: translate(-1.5px, -1.5px) !important;
  box-shadow: 4.5px 4.5px 0 var(--dkwp-ink, #151617) !important;
  background: var(--dkwp-mist, #f7f5ff) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-conj-form,
  .dk-wp3-example,
  .dk-wp3-example--article
):active {
  transform: translate(2.5px, 2.5px) !important;
  box-shadow: 0.5px 0.5px 0 var(--dkwp-ink, #151617) !important;
  transition-duration: 0.05s !important;
}

/* 8. Örnek İçi Eylem Butonları (Icon Buttons: Dinle / Analiz) Dokunsal Basma Hissi */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-actions .dk-wp3-icon-btn {
  cursor: pointer !important;
  transition: transform 0.08s ease, box-shadow 0.08s ease, background-color 0.12s ease !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-actions .dk-wp3-icon-btn:hover {
  transform: translate(-1px, -1px) !important;
  box-shadow: 3.5px 3.5px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-example-actions .dk-wp3-icon-btn:active {
  transform: translate(2px, 2px) !important;
  box-shadow: 0.5px 0.5px 0 var(--dkwp-ink, #151617) !important;
  transition-duration: 0.05s !important;
}

/* 9. Kelime Ailesi (Word Family / Components) Kutucukları — Dokunsal Basmatik Efekti */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card {
  cursor: pointer !important;
  user-select: none !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 12px !important;
  transition: transform 0.08s ease, box-shadow 0.08s ease, background-color 0.12s ease !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--family {
  box-shadow: inset 0 4px 0 var(--dkwp-viol, #7c3aed), 2.5px 2.5px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--component {
  box-shadow: inset 0 4px 0 var(--dkwp-peach, #f59e0b), 2.5px 2.5px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card:hover {
  transform: translate(-1.5px, -1.5px) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--family:hover {
  box-shadow: inset 0 4px 0 var(--dkwp-viol, #7c3aed), 4px 4px 0 var(--dkwp-ink, #151617) !important;
  background: #fdfcff !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--component:hover {
  box-shadow: inset 0 4px 0 var(--dkwp-peach, #f59e0b), 4px 4px 0 var(--dkwp-ink, #151617) !important;
  background: #fffdf9 !important;
}

/* Kelime ailesi işlevsiz basma efekti (tactile active press) */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card:active {
  transform: translate(2px, 2px) !important;
  transition-duration: 0.05s !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--family:active {
  box-shadow: inset 0 4px 0 var(--dkwp-viol, #7c3aed), 0.5px 0.5px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-card--component:active {
  box-shadow: inset 0 4px 0 var(--dkwp-peach, #f59e0b), 0.5px 0.5px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare {
  cursor: pointer !important;
  user-select: none !important;
  border: 2px solid var(--dkwp-ink, #151617) !important;
  border-radius: 12px !important;
  box-shadow: 2.5px 2.5px 0 var(--dkwp-ink, #151617) !important;
  transition: transform 0.08s ease, box-shadow 0.08s ease, background-color 0.12s ease !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare:hover {
  transform: translate(-1.5px, -1.5px) !important;
  box-shadow: 4px 4px 0 var(--dkwp-ink, #151617) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-network-compare:active {
  transform: translate(2px, 2px) !important;
  box-shadow: 0.5px 0.5px 0 var(--dkwp-ink, #151617) !important;
  transition-duration: 0.05s !important;
}

/* 10. Yazı Boyutu Ölçeği (Font Scale) Uyumlaması — Kelime Ailesi, Bileşenler ve Cümledeki Rolü */
#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-network-family-word,
  .dk-wp3-network-component-word
) {
  font-size: var(--dkwp-f-16, 16px) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-network-meaning,
  .dk-wp3-network-card--family .dk-wp3-network-family-de,
  .dk-wp3-network-difference p,
  .dk-wp3-network-detail p
) {
  font-size: var(--dkwp-f-13, 13px) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-network-explain,
  .dk-wp3-network-card--family .dk-wp3-network-family-tr,
  .dk-wp3-network-example-de
) {
  font-size: var(--dkwp-f-11_5, 11.5px) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) :is(
  .dk-wp3-network-example-tr,
  .dk-wp3-network-detail-toggle,
  .dk-wp3-network-detail-toggle span
) {
  font-size: var(--dkwp-f-11, 11px) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) .dk-wp3-adverb-role-text {
  font-size: var(--dkwp-f-14_5, 14.5px) !important;
}

#kelime-penceresi:is(.dk-wp3-active,.dk-wp3-pending) #dk-wp3-adverb-role-title {
  font-size: var(--dkwp-f-18, 18px) !important;
}