:root {
--kk-paper: #FAF7F2;
--kk-ink: #191410;
--kk-ink-soft: #4A4038;
--kk-muted: #7A7067;
--kk-line: #E7DFD3;
--kk-accent: #C2452D;
--kk-accent-dark: #9C3320;
--kk-gold: #D9A441;
--kk-teal: #2F6F62;
--kk-tint: #F3EDE3;
--kk-font-display: 'Fraunces', Georgia, 'Noto Serif Tamil', serif;
--kk-font-body: 'Inter', 'Noto Sans Tamil', system-ui, sans-serif;
--kk-font-tamil: 'Noto Serif Tamil', 'Noto Sans Tamil', serif;
--kk-radius: 8px;
--kk-shadow-sm: 0 1px 3px rgba(0,0,0,.06);
--kk-shadow: 0 2px 8px rgba(0,0,0,.08);
--kk-shadow-lg: 0 8px 24px rgba(0,0,0,.12);
--kk-max-width: 1200px;
--kk-reading-width: 720px;
}
*,*::before,*::after { box-sizing: border-box; }
body { margin:0; font-family:var(--kk-font-body); background:var(--kk-paper); color:var(--kk-ink); line-height:1.65; -webkit-font-smoothing:antialiased; }
.skip-link { position:absolute; top:-100px; left:16px; background:var(--kk-ink); color:#fff; padding:8px 16px; z-index:9999; border-radius:var(--kk-radius); }
.skip-link:focus { top:8px; }
img { max-width:100%; height:auto; }
a { color:var(--kk-accent); text-decoration:none; transition:color .2s; }
a:hover { color:var(--kk-accent-dark); }
:focus-visible { outline:3px solid var(--kk-accent); outline-offset:2px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration:0.01ms !important; transition-duration:0.01ms !important; } }
.kk-container { max-width:var(--kk-max-width); margin:0 auto; padding:0 16px; }

/* Navbar */
.kk-header { z-index:1030; background:rgba(250,247,242,.97); backdrop-filter:blur(8px); border-bottom:1px solid var(--kk-line); }
.kk-nav-inner { max-width:var(--kk-max-width); }
.kk-brand { font-family:var(--kk-font-display); font-weight:700; font-size:1.35rem; color:var(--kk-ink); letter-spacing:-.02em; }
.kk-brand span { color:var(--kk-accent); }
.kk-brand-dot { color:var(--kk-gold); }
.kk-brand-light, .kk-brand-light span { color:#fff !important; }
.kk-brand-light .kk-brand-dot { color:var(--kk-gold); }
.kk-nav-links .kk-nav-link { font-size:.9rem; font-weight:500; color:var(--kk-ink-soft); padding:6px 12px !important; border-radius:var(--kk-radius); transition:background .2s,color .2s; }
.kk-nav-links .kk-nav-link:hover, .kk-nav-links .kk-nav-link.active { color:var(--kk-ink); background:var(--kk-tint); }
.kk-search-form { position:relative; }
.kk-search-input { width:180px; border-radius:999px; border-color:var(--kk-line); background:var(--kk-paper); font-size:.85rem; padding-right:36px; }
.kk-search-input:focus { border-color:var(--kk-accent); box-shadow:0 0 0 3px rgba(194,69,45,.1); width:220px; }
.kk-search-btn { position:absolute; right:4px; top:50%; transform:translateY(-50%); border:none; background:none; color:var(--kk-muted); padding:4px 8px; }
.kk-user-btn { border:none; background:var(--kk-tint); color:var(--kk-ink); font-weight:500; font-size:.85rem; border-radius:999px; padding:4px 14px 4px 8px; }
.kk-dropdown { border:1px solid var(--kk-line); border-radius:var(--kk-radius); box-shadow:var(--kk-shadow); }

/* Buttons */
.btn-kk { background:var(--kk-ink); color:#fff; border:none; border-radius:var(--kk-radius); font-weight:600; padding:10px 24px; transition:background .2s,transform .1s; }
.btn-kk:hover { background:var(--kk-accent-dark); color:#fff; transform:translateY(-1px); }
.btn-kk-accent { background:var(--kk-accent); color:#fff; border:none; border-radius:var(--kk-radius); font-weight:600; padding:10px 24px; }
.btn-kk-accent:hover { background:var(--kk-accent-dark); color:#fff; }
.btn-kk-outline { background:transparent; color:var(--kk-ink); border:2px solid var(--kk-ink); border-radius:var(--kk-radius); font-weight:600; padding:8px 22px; }
.btn-kk-outline:hover { background:var(--kk-ink); color:#fff; }
.btn-primary { background:var(--kk-ink); border-color:var(--kk-ink); }
.btn-primary:hover { background:var(--kk-accent-dark); border-color:var(--kk-accent-dark); }
.btn-success { background:#2E7D5B; border-color:#2E7D5B; }
.btn-success:hover { background:#236B4A; border-color:#236B4A; }
.btn-danger { background:var(--kk-accent); border-color:var(--kk-accent); }
.btn-danger:hover { background:var(--kk-accent-dark); border-color:var(--kk-accent-dark); }

/* Hero */
.kk-hero { padding:80px 0 60px; position:relative; overflow:hidden; }
.kk-hero-compact { padding:48px 0 32px; }
.kk-hero::before { content:'குரல்'; position:absolute; right:-40px; bottom:-30px; font-family:var(--kk-font-tamil); font-size:14rem; font-weight:700; color:var(--kk-ink); opacity:.03; pointer-events:none; line-height:1; }
.kk-kicker { display:inline-flex; align-items:center; gap:10px; font-size:.75rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:var(--kk-accent); margin-bottom:16px; }
.kk-kicker::before { content:''; width:28px; height:2px; background:var(--kk-accent); }
.kk-hero h1 { font-family:var(--kk-font-display); font-size:clamp(2.4rem,5.5vw,4.2rem); font-weight:700; line-height:1.12; margin-bottom:20px; letter-spacing:-.02em; }
.kk-hero h1 .accent { color:var(--kk-accent); }
.kk-hero .lede { font-size:1.15rem; color:var(--kk-ink-soft); max-width:520px; margin-bottom:32px; line-height:1.7; }
.kk-hero-cta { display:flex; gap:12px; flex-wrap:wrap; }
.kk-hero-cards { position:relative; min-height:280px; }
.kk-hero-issue { background:var(--kk-ink); color:#fff; border-radius:12px; padding:28px; margin-bottom:16px; }
.kk-hero-issue-label { font-size:.7rem; text-transform:uppercase; letter-spacing:.12em; color:var(--kk-gold); font-weight:700; margin-bottom:12px; }
.kk-hero-issue h3 { font-family:var(--kk-font-display); font-size:1.5rem; margin-bottom:8px; }
.kk-hero-mini-cards .kk-card-mini { background:#fff; border-radius:var(--kk-radius); overflow:hidden; box-shadow:var(--kk-shadow-sm); border:1px solid var(--kk-line); }
.kk-hero-mini-cards .kk-card-mini-thumb { height:100px; overflow:hidden; }
.kk-hero-mini-cards .kk-card-mini-thumb img { width:100%; height:100%; object-fit:cover; }
.kk-hero-mini-cards .kk-cover-fallback { height:100px; }
.kk-hero-mini-cards .kk-card-mini-body { padding:12px 16px; }
.kk-hero-mini-cards .kk-card-mini-body h3 { font-size:.95rem; margin:4px 0 0; }
.kk-hero-mini-cards .kk-card-mini-body h3 a { color:var(--kk-ink); }
.kk-hero-mini-cards .kk-card-mini-body h3 a:hover { color:var(--kk-accent); }

/* Sections */
.kk-section { padding:56px 0; }
.kk-section-header { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:32px; flex-wrap:wrap; gap:8px; }
.kk-section-header h2 { font-family:var(--kk-font-display); font-size:1.8rem; font-weight:700; margin:0; letter-spacing:-.01em; }
.kk-section-header .kk-kicker { margin-bottom:4px; }
.kk-link-more { font-size:.85rem; font-weight:600; color:var(--kk-accent); white-space:nowrap; }
.kk-link-more:hover { text-decoration:underline; }
.kk-band { background:var(--kk-tint); }
.kk-band-gold { background:linear-gradient(135deg,#FBF4EA,#F3EDE3); }

/* Cards */
.kk-card { border:1px solid var(--kk-line); border-radius:12px; overflow:hidden; background:#fff; transition:transform .2s,box-shadow .2s; }
.kk-card:hover { transform:translateY(-3px); box-shadow:var(--kk-shadow); }
.kk-card-img { position:relative; padding-top:62%; overflow:hidden; background:var(--kk-tint); }
.kk-card-img img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.kk-card:hover .kk-card-img img { transform:scale(1.04); }
.kk-cover-fallback { display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg, hsl(var(--hue,0),40%,85%), hsl(calc(var(--hue,0) + 30),35%,75%)); }
.kk-cover-letter { font-family:var(--kk-font-display); font-size:3rem; font-weight:700; color:rgba(255,255,255,.7); }
.kk-card-body { padding:20px; }
.kk-card-cat { display:inline-block; font-size:.7rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--kk-accent); margin-bottom:8px; }
.kk-card-cat-inline { font-size:.65rem; }
.kk-card-featured { display:inline-block; font-size:.7rem; font-weight:700; letter-spacing:.08em; color:var(--kk-gold); margin-left:8px; }
.kk-card-title { font-family:var(--kk-font-display); font-size:1.1rem; font-weight:700; line-height:1.3; margin:0 0 8px; }
.kk-card-title a { color:var(--kk-ink); }
.kk-card-title a:hover { color:var(--kk-accent); }
.kk-card-title-sm { font-family:var(--kk-font-display); font-size:1rem; font-weight:600; line-height:1.3; margin:0 0 4px; }
.kk-card-title-sm a { color:var(--kk-ink); }
.kk-card-title-sm a:hover { color:var(--kk-accent); }
.kk-card-title-lg { font-family:var(--kk-font-display); font-size:1.3rem; font-weight:700; line-height:1.25; margin:0 0 8px; }
.kk-card-title-lg a { color:var(--kk-ink); }
.kk-card-title-lg a:hover { color:var(--kk-accent); }
.kk-card-title-xl { font-family:var(--kk-font-display); font-size:1.6rem; font-weight:700; line-height:1.2; margin:0 0 12px; }
.kk-card-title-xl a { color:var(--kk-ink); }
.kk-card-title-xl a:hover { color:var(--kk-accent); }
.kk-card-excerpt { font-size:.9rem; color:var(--kk-ink-soft); line-height:1.6; margin:0 0 12px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.kk-link-arrow { font-size:.85rem; font-weight:600; color:var(--kk-accent); display:inline-flex; align-items:center; gap:4px; }
.kk-link-arrow:hover { gap:8px; }
.kk-meta { display:flex; align-items:center; flex-wrap:wrap; gap:2px; font-size:.8rem; color:var(--kk-muted); }
.kk-meta-sm { font-size:.75rem; }
.kk-meta-sep { margin:0 4px; opacity:.5; }

/* Card wide */
.kk-card-wide { display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--kk-line); border-radius:12px; overflow:hidden; background:#fff; }
.kk-card-wide-img { position:relative; min-height:320px; overflow:hidden; background:var(--kk-tint); }
.kk-card-wide-img img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.kk-card-wide-body { padding:32px; display:flex; flex-direction:column; justify-content:center; }
.kk-card-top-labels { margin-bottom:12px; }

/* Card poem */
.kk-card-poem { border:1px solid var(--kk-line); border-radius:12px; background:#fff; transition:transform .2s,box-shadow .2s; }
.kk-card-poem:hover { transform:translateY(-3px); box-shadow:var(--kk-shadow); }
.kk-card-poem-inner { padding:28px 28px 24px; position:relative; }
.kk-quote-mark { font-family:var(--kk-font-display); font-size:4rem; line-height:1; color:var(--kk-gold); opacity:.3; position:absolute; top:8px; left:20px; }
.kk-card-poem-text { font-family:var(--kk-font-tamil); font-size:1rem; line-height:1.8; color:var(--kk-ink-soft); white-space:pre-line; margin:24px 0 16px; font-style:italic; }

/* Card mini */
.kk-card-mini { display:flex; gap:12px; align-items:center; padding:10px; border-radius:var(--kk-radius); border:1px solid var(--kk-line); background:#fff; transition:box-shadow .2s; }
.kk-card-mini:hover { box-shadow:var(--kk-shadow-sm); }
.kk-card-mini-thumb { width:72px; height:72px; border-radius:6px; overflow:hidden; flex-shrink:0; background:var(--kk-tint); }
.kk-card-mini-thumb img { width:100%; height:100%; object-fit:cover; }
.kk-card-mini-body { flex:1; min-width:0; }
.kk-card-mini-body .kk-card-cat { font-size:.6rem; margin-bottom:2px; }

/* Pick rows */
.kk-pick-row { display:flex; align-items:center; gap:16px; padding:14px 0; border-bottom:1px solid var(--kk-line); color:var(--kk-ink); text-decoration:none; transition:background .15s; }
.kk-pick-row:hover { background:var(--kk-tint); color:var(--kk-ink); border-radius:var(--kk-radius); }
.kk-pick-num { font-family:var(--kk-font-display); font-size:1.3rem; font-weight:700; color:var(--kk-line); min-width:36px; }
.kk-pick-row:hover .kk-pick-num { color:var(--kk-accent); }
.kk-pick-body { flex:1; min-width:0; }
.kk-pick-title { font-family:var(--kk-font-display); font-size:1rem; font-weight:600; margin:2px 0 0; line-height:1.3; }
.kk-pick-arrow { color:var(--kk-muted); transition:transform .2s, color .2s; }
.kk-pick-row:hover .kk-pick-arrow { color:var(--kk-accent); transform:translateX(3px); }

/* Content detail */
.kk-detail { padding:48px 0 64px; }
.kk-detail-inner { max-width:var(--kk-reading-width); margin:0 auto; }
.kk-breadcrumb { font-size:.8rem; color:var(--kk-muted); margin-bottom:24px; }
.kk-breadcrumb a { color:var(--kk-muted); }
.kk-breadcrumb a:hover { color:var(--kk-accent); }
.kk-detail-cat { display:inline-block; font-size:.7rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--kk-accent); margin-bottom:12px; background:rgba(194,69,45,.08); padding:4px 12px; border-radius:999px; }
.kk-detail h1 { font-family:var(--kk-font-display); font-size:clamp(1.8rem,4vw,2.6rem); font-weight:700; line-height:1.15; margin-bottom:16px; letter-spacing:-.015em; }
.kk-detail-cover { border-radius:12px; overflow:hidden; margin:24px 0; background:var(--kk-tint); }
.kk-detail-cover img { width:100%; display:block; }
.kk-detail-content { font-size:1.05rem; line-height:1.85; }
.kk-detail-content p { margin-bottom:1.4em; }
.kk-detail-content p:first-of-type::first-letter { font-family:var(--kk-font-display); font-size:3.4em; float:left; line-height:.85; margin:6px 10px 0 0; color:var(--kk-accent); font-weight:700; }
.kk-detail-author { display:flex; align-items:center; gap:16px; background:var(--kk-tint); border-radius:12px; padding:24px; margin:40px 0; border:1px solid var(--kk-line); }
.kk-detail-author-avatar { width:56px; height:56px; border-radius:50%; background:var(--kk-accent); color:#fff; display:flex; align-items:center; justify-content:center; font-family:var(--kk-font-display); font-weight:700; font-size:1.3rem; flex-shrink:0; }
.kk-detail-author h4 { font-size:1rem; margin:0 0 2px; }
.kk-detail-author p { font-size:.85rem; color:var(--kk-muted); margin:0; }
.kk-related-title { font-family:var(--kk-font-display); font-size:1.4rem; font-weight:700; margin:48px 0 24px; padding-top:32px; border-top:1px solid var(--kk-line); }

/* Kavithai band */
.kk-poem-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:24px; }

/* Login */
.kk-auth { min-height:100vh; }
.kk-auth-left { background:var(--kk-ink); color:#fff; display:flex; flex-direction:column; justify-content:center; padding:60px 48px; }
.kk-auth-left .kk-brand { font-size:2rem; margin-bottom:32px; display:inline-block; }
.kk-auth-quote { font-family:var(--kk-font-display); font-size:1.6rem; line-height:1.3; margin-bottom:24px; }
.kk-auth-features { list-style:none; padding:0; margin:0; }
.kk-auth-features li { padding:8px 0; font-size:.95rem; color:rgba(255,255,255,.7); display:flex; align-items:center; gap:10px; }
.kk-auth-features li i { color:var(--kk-gold); }
.kk-auth-right { display:flex; align-items:center; justify-content:center; padding:40px 24px; }
.kk-auth-form { width:100%; max-width:400px; }
.kk-auth-form h2 { font-family:var(--kk-font-display); font-size:1.8rem; margin-bottom:4px; }
.kk-auth-form .subtitle { color:var(--kk-muted); margin-bottom:28px; }
.kk-auth-form .form-label { font-weight:600; font-size:.85rem; }
.kk-auth-form .form-control { border-color:var(--kk-line); border-radius:var(--kk-radius); padding:10px 14px; }
.kk-auth-form .form-control:focus { border-color:var(--kk-accent); box-shadow:0 0 0 3px rgba(194,69,45,.1); }
.kk-demo-box { background:var(--kk-tint); border:1px dashed var(--kk-line); border-radius:var(--kk-radius); padding:16px; margin-top:24px; font-size:.85rem; }
.kk-demo-box h6 { font-weight:700; margin-bottom:8px; font-size:.8rem; text-transform:uppercase; letter-spacing:.08em; color:var(--kk-ink-soft); }

/* Flash */
.kk-flash-wrap { padding-top:8px; }

/* Badges */
.kk-badge { display:inline-flex; align-items:center; gap:5px; font-size:.75rem; font-weight:600; padding:3px 10px; border-radius:999px; border:1px solid transparent; }
.kk-badge-draft { background:#EEE7DA; color:#6B5E4E; border-color:#DDD5C6; }
.kk-badge-pending { background:#FFF3D6; color:#8A6116; border-color:#F0DCA0; }
.kk-badge-approved { background:#DDEBE6; color:#20594B; border-color:#BFDACD; }
.kk-badge-published { background:#E2EFDB; color:#33691E; border-color:#C5DFB8; }
.kk-badge-rejected { background:#FBE3E1; color:#A33327; border-color:#F0C4C0; }
.kk-badge-unpublished { background:#E8E4EE; color:#5A4E74; border-color:#D4CDE2; }

/* Empty state */
.kk-empty { text-align:center; padding:48px 24px; border:2px dashed var(--kk-line); border-radius:12px; background:var(--kk-paper); }
.kk-empty-icon { font-size:3rem; color:var(--kk-line); display:block; margin-bottom:16px; }
.kk-empty-title { font-family:var(--kk-font-display); font-size:1.2rem; font-weight:600; color:var(--kk-ink-soft); margin:0; }
.kk-empty-hint { color:var(--kk-muted); font-size:.9rem; margin-top:8px; }

/* Footer */
.kk-footer { background:var(--kk-ink); color:rgba(255,255,255,.7); }
.kk-footer .kk-brand { font-size:1.3rem; display:inline-block; margin-bottom:12px; }
.kk-footer-tagline { font-family:var(--kk-font-display); font-size:1rem; color:var(--kk-gold); margin-bottom:8px; }
.kk-footer-desc { font-size:.9rem; line-height:1.7; }
.kk-footer-heading { font-weight:700; font-size:.8rem; text-transform:uppercase; letter-spacing:.1em; color:#fff; margin-bottom:16px; }
.kk-footer-links { list-style:none; padding:0; margin:0; }
.kk-footer-links li { margin-bottom:8px; }
.kk-footer-links a { color:rgba(255,255,255,.6); font-size:.9rem; }
.kk-footer-links a:hover { color:var(--kk-gold); }
.kk-footer-cta-text { font-size:.9rem; line-height:1.6; margin-bottom:16px; }
.kk-footer-divider { border-color:rgba(255,255,255,.1); margin:0; }
.kk-footer-copy { font-size:.8rem; margin:0; color:rgba(255,255,255,.4); }

/* Back to top */
.kk-back-to-top { position:fixed; bottom:24px; right:24px; width:44px; height:44px; border-radius:50%; background:var(--kk-ink); color:#fff; display:none; align-items:center; justify-content:center; box-shadow:var(--kk-shadow-lg); z-index:99; font-size:1.1rem; transition:background .2s; }
.kk-back-to-top:hover { background:var(--kk-accent); color:#fff; }
.kk-back-to-top.visible { display:flex; }

/* Search page */
.kk-search-page { padding:48px 0; }
.kk-search-page h1 { font-family:var(--kk-font-display); font-size:2rem; margin-bottom:8px; }
.kk-search-count { color:var(--kk-muted); margin-bottom:32px; }

/* About page */
.kk-about-hero { padding:64px 0 48px; text-align:center; }
.kk-about-hero h1 { font-family:var(--kk-font-display); font-size:clamp(2rem,4vw,3rem); margin-bottom:12px; }
.kk-about-hero .lede { font-size:1.15rem; color:var(--kk-ink-soft); max-width:600px; margin:0 auto; }
.kk-steps { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:32px; }
.kk-step { text-align:center; padding:24px; }
.kk-step-num { font-family:var(--kk-font-display); font-size:2.5rem; font-weight:700; color:var(--kk-accent); opacity:.2; }
.kk-step h3 { font-family:var(--kk-font-display); font-size:1.1rem; margin:8px 0; }
.kk-step p { font-size:.9rem; color:var(--kk-ink-soft); }

/* Flash message */
.alert { border-radius:var(--kk-radius); font-size:.9rem; }

/* Pagination */
.pagination .page-link { border-color:var(--kk-line); color:var(--kk-ink); font-size:.85rem; border-radius:var(--kk-radius) !important; margin:0 2px; }
.pagination .page-link:hover { background:var(--kk-tint); border-color:var(--kk-accent); color:var(--kk-accent); }
.pagination .page-item.active .page-link { background:var(--kk-ink); border-color:var(--kk-ink); color:#fff; }

/* ============================================
   DASHBOARD STYLES
   ============================================ */
.kk-dash-body { background:#F0EDE5; }
.kk-dash { min-height:100vh; }
.kk-sidebar { width:260px; background:#fff; color:var(--kk-ink); display:flex; flex-direction:column; border-right:1px solid var(--kk-line); }
@media (min-width:992px) { .kk-sidebar { position:fixed; top:0; bottom:0; left:0; z-index:1040; } }
.kk-side-label { font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.12em; color:var(--kk-muted); margin:16px 0 8px; padding-left:12px; }
.kk-side-nav { list-style:none; padding:0; margin:0; }
.kk-side-nav li { margin-bottom:2px; }
.kk-side-nav a { display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:var(--kk-radius); color:var(--kk-ink-soft); font-size:.88rem; font-weight:500; transition:background .15s,color .15s; text-decoration:none; border-left:3px solid transparent; }
.kk-side-nav a:hover { background:var(--kk-tint); color:var(--kk-ink); }
.kk-side-nav a.active { background:rgba(194,69,45,.06); color:var(--kk-accent); border-left:3px solid var(--kk-accent); font-weight:600; }
.kk-side-nav a i { font-size:1rem; width:20px; text-align:center; }
.kk-side-badge { background:var(--kk-accent); color:#fff; font-size:.7rem; font-weight:700; padding:1px 7px; border-radius:999px; margin-left:auto; }
.kk-side-user { border-top:1px solid var(--kk-line); padding-top:16px; }
.kk-side-user-info { display:flex; align-items:center; gap:10px; }
.kk-side-user-name { font-size:.85rem; font-weight:600; color:var(--kk-ink); }
.kk-side-user-role { font-size:.75rem; color:var(--kk-muted); }
.kk-avatar-sm { width:36px; height:36px; border-radius:50%; background:var(--kk-accent); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.9rem; flex-shrink:0; }
.kk-dash-main { margin-left:0; display:flex; flex-direction:column; min-height:100vh; overflow-x:hidden; min-width:0; }
@media (min-width:992px) { .kk-dash-main { margin-left:260px; } }
.kk-topbar { background:#fff; border-bottom:1px solid var(--kk-line); padding:12px 20px; min-height:56px; flex-shrink:0; }
.kk-topbar h1 { font-family:var(--kk-font-display); font-size:1.1rem; font-weight:700; margin:0; }
.kk-dash-content { max-width:1400px; flex:1 0 auto; min-width:0; overflow-x:hidden; }

/* Stat cards */
.kk-stat-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:16px; margin-bottom:32px; width:100%; min-width:0; }
@media (max-width:1199px) { .kk-stat-grid { grid-template-columns:repeat(3,1fr); } }
@media (max-width:767px) { .kk-stat-grid { grid-template-columns:repeat(3,1fr); gap:10px; } }
@media (max-width:479px) { .kk-stat-grid { grid-template-columns:repeat(3,1fr); gap:8px; } }
.kk-stat { background:#fff; border:1px solid var(--kk-line); border-radius:12px; padding:20px; display:flex; align-items:center; gap:14px; min-width:0; overflow:hidden; }
.kk-stat-icon { width:44px; height:44px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:1.2rem; flex-shrink:0; }
.kk-stat-icon.total { background:#E8E4EE; color:#5A4E74; }
.kk-stat-icon.pending { background:#FFF3D6; color:#8A6116; }
.kk-stat-icon.approved { background:#DDEBE6; color:#20594B; }
.kk-stat-icon.published { background:#E2EFDB; color:#33691E; }
.kk-stat-icon.rejected { background:#FBE3E1; color:#A33327; }
.kk-stat-icon.drafts { background:#EEE7DA; color:#6B5E4E; }
.kk-stat-icon.students { background:#DDEBE6; color:#20594B; }
.kk-stat-num { font-family:var(--kk-font-display); font-size:1.6rem; font-weight:700; line-height:1; min-width:0; }
.kk-stat-label { font-size:.78rem; color:var(--kk-muted); margin-top:2px; min-width:0; overflow-wrap:break-word; }
@media (max-width:767px) { .kk-stat { padding:14px 12px; gap:10px; min-width:0; overflow:hidden; } .kk-stat-icon { width:30px; height:30px; font-size:.85rem; } .kk-stat-num { font-size:1.25rem; min-width:0; } .kk-stat-label { font-size:.7rem; min-width:0; overflow-wrap:break-word; } }

/* Dash tables */
.kk-table-wrap { background:#fff; border:1px solid var(--kk-line); border-radius:12px; overflow:hidden; }
.kk-table-header { padding:16px 20px; border-bottom:1px solid var(--kk-line); display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; }
.kk-table-header h3 { font-family:var(--kk-font-display); font-size:1.1rem; font-weight:700; margin:0; }
.kk-table { width:100%; border-collapse:collapse; }
.kk-table th { font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--kk-muted); padding:14px 20px; background:var(--kk-paper); border-bottom:1px solid var(--kk-line); text-align:left; white-space:nowrap; }
.kk-table td { padding:14px 20px; border-bottom:1px solid var(--kk-line); font-size:.88rem; vertical-align:middle; }
.kk-table tr:last-child td { border-bottom:none; }
.kk-table tr:hover td { background:rgba(243,237,227,.3); }
.kk-table-thumb { width:48px; height:48px; border-radius:6px; overflow:hidden; background:var(--kk-tint); flex-shrink:0; }
.kk-table-thumb img { width:100%; height:100%; object-fit:cover; }
.kk-table-title-cell { display:flex; align-items:center; gap:12px; }
.kk-table-title-cell .title { font-weight:600; color:var(--kk-ink); }
.kk-table-title-cell .title a { color:inherit; }
.kk-table-title-cell .title a:hover { color:var(--kk-accent); }
.kk-table-actions { display:flex; gap:6px; flex-wrap:wrap; }
.kk-table-actions .btn { padding:5px 12px; font-size:.78rem; border-radius:6px; }
@media (min-width:992px) {
.kk-table th, .kk-table td { padding:14px 24px; }
.kk-table-title-cell .title { max-width:320px; }
}
@media (max-width:767px) {
.kk-table-wrap { overflow-x:auto; }
.kk-table { min-width:650px; }
}

/* Dash forms */
.kk-form-card { background:#fff; border:1px solid var(--kk-line); border-radius:12px; padding:24px; margin-bottom:24px; }
.kk-form-card h3 { font-family:var(--kk-font-display); font-size:1.2rem; font-weight:700; margin-bottom:20px; }
.kk-form-card .form-label { font-weight:600; font-size:.85rem; }
.kk-form-card .form-control, .kk-form-card .form-select { border-color:var(--kk-line); border-radius:var(--kk-radius); }
.kk-form-card .form-control:focus, .kk-form-card .form-select:focus { border-color:var(--kk-accent); box-shadow:0 0 0 3px rgba(194,69,45,.1); }
.kk-form-textarea { min-height:250px; font-size:1rem; line-height:1.7; }
.kk-form-hint { font-size:.8rem; color:var(--kk-muted); margin-top:4px; }
.kk-form-section { margin-bottom:24px; padding-bottom:24px; border-bottom:1px solid var(--kk-line); }
.kk-form-section:last-child { border-bottom:none; margin-bottom:0; padding-bottom:0; }

/* Dash detail */
.kk-detail-card { background:#fff; border:1px solid var(--kk-line); border-radius:12px; padding:24px; margin-bottom:24px; }
.kk-detail-card h3 { font-family:var(--kk-font-display); font-size:1.1rem; font-weight:700; margin-bottom:16px; }
.kk-aside-card { position:sticky; top:80px; }

/* Tabs / filter pills */
.kk-tabs { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:20px; }
.kk-tab { display:inline-flex; align-items:center; gap:5px; padding:6px 16px; border-radius:999px; font-size:.8rem; font-weight:600; color:var(--kk-ink-soft); background:var(--kk-paper); border:1px solid var(--kk-line); text-decoration:none; transition:all .15s; }
.kk-tab:hover { background:var(--kk-tint); color:var(--kk-ink); }
.kk-tab.active { background:var(--kk-ink); color:#fff; border-color:var(--kk-ink); }
.kk-tab .count { font-size:.7rem; background:rgba(0,0,0,.08); padding:1px 6px; border-radius:999px; }
.kk-tab.active .count { background:rgba(255,255,255,.2); }

/* Page header */
.kk-page-header { margin-bottom:24px; }
.kk-page-header h2 { font-family:var(--kk-font-display); font-size:1.4rem; font-weight:700; margin:0 0 4px; }
.kk-page-header p { color:var(--kk-muted); font-size:.9rem; margin:0; }

/* Note alert */
.kk-note { background:#FFF3D6; border-left:4px solid var(--kk-gold); padding:16px 20px; border-radius:0 var(--kk-radius) var(--kk-radius) 0; margin:16px 0; font-size:.9rem; }
.kk-note strong { display:block; margin-bottom:4px; }

/* Action confirm modal */
.kk-modal-kk .modal-header { border-bottom-color:var(--kk-line); }
.kk-modal-kk .modal-title { font-family:var(--kk-font-display); font-weight:700; }
.kk-modal-kk .modal-footer { border-top-color:var(--kk-line); }

/* Reading width for public detail + search */
.kk-reading-wrap { max-width:var(--kk-reading-width); margin:0 auto; }

/* Print */
@media print { .kk-header, .kk-footer, .kk-back-to-top { display:none !important; } body { background:#fff; } }

/* Dashboard compact footer */
.kk-dash-footer { border-top:1px solid var(--kk-line); background:var(--kk-bg); padding:16px 0; margin-top:auto; }
.kk-dash-footer-inner { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:8px; }
.kk-dash-footer-copy { font-size:.8rem; color:var(--kk-muted); margin:0; }

/* ============================================
   DASHBOARD MOBILE RESPONSIVE FIXES
   ============================================ */

/* Contain overflow within dashboard content */

/* Topbar: prevent title overflow on mobile */
.kk-topbar-title { overflow:hidden; min-width:0; flex:1; }
.kk-topbar-title h1 { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* Mobile: table wrapper proper scroll containment */
@media (max-width:767px) {
  .kk-table-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; max-width:100%; }
  .kk-table { min-width:580px; }
}

/* Mobile: tighter table cell padding */
@media (max-width:575px) {
  .kk-table th, .kk-table td { padding:10px 12px; font-size:.8rem; }
  .kk-table-title-cell .title { max-width:140px; }
}

/* Mobile: stat cards tighter padding */
@media (max-width:575px) {
  .kk-stat { padding:14px; gap:10px; min-width:0; overflow:hidden; }
  .kk-stat-num { font-size:1.3rem; min-width:0; }
  .kk-stat-icon { width:30px; height:30px; font-size:.85rem; }
}

/* Mobile: search/filter input groups must not overflow */
@media (max-width:575px) {
  .kk-dash-content .input-group { width:100% !important; max-width:100%; }
  .kk-dash-content .form-select { width:100% !important; }
}

/* Mobile: page header */
@media (max-width:575px) {
  .kk-page-header h2 { font-size:1.2rem; }
  .kk-page-header p { font-size:.8rem; }
}

/* Mobile: form cards */
@media (max-width:575px) {
  .kk-form-card { padding:16px; }
  .kk-form-section { padding-bottom:16px; margin-bottom:16px; }
}

/* Mobile: detail card */
@media (max-width:575px) {
  .kk-detail-card { padding:16px; }
}

/* Mobile: detail content word-break */
.kk-detail-content { overflow-wrap:break-word; word-wrap:break-word; }

/* Mobile: tabs overflow handling */
.kk-tabs { overflow-x:auto; flex-wrap:nowrap; -webkit-overflow-scrolling:touch; padding-bottom:4px; }
@media (min-width:768px) { .kk-tabs { flex-wrap:wrap; overflow-x:visible; } }

/* Mobile: table action buttons tighter spacing */
@media (max-width:575px) {
  .kk-table-actions { gap:4px; }
  .kk-table-actions .btn { padding:4px 8px; font-size:.72rem; }
}

/* Mobile: modal width constraint */
@media (max-width:575px) {
  .modal-dialog { margin:8px; max-width:calc(100vw - 16px); }
}

/* Mobile: sidebar offcanvas width */
@media (max-width:991px) {
  .offcanvas.kk-sidebar { width:280px; max-width:85vw; }
}

/* Mobile: compact footer */
@media (max-width:575px) {
  .kk-dash-footer-inner { flex-direction:column; text-align:center; }
  .kk-dash-footer-copy { font-size:.75rem; }
}

/* Mobile: form row stacking */
@media (max-width:767px) {
  .kk-dash-content .row.g-3 > [class*="col-"] { flex:0 0 100%; max-width:100%; }
}

/* Mobile: horizontal rule spacing */
@media (max-width:575px) {
  .kk-form-section { border-bottom-width:1px; }
}