/* Spiron blog paneli. Sitenin renkleri ve yazı tipi; köşeli, sade. */
:root{--p:#0F3A57;--p2:#115E86;--p3:#0A1A28;--accent:#2E9BD6;--tint:#EEF4F9;--ink:#111C26;--grey:#566371;--line:#DCE4EB;--alert:#C2410C;--ok:#15803D}
*{box-sizing:border-box}
body{margin:0;background:#F5F8FB;color:var(--ink);font-family:'General Sans',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;font-size:15.5px;line-height:1.55}
a{color:var(--p2)}
h1,h2{margin:0;font-weight:600;letter-spacing:-.02em}
h1{font-size:28px}
h2{font-size:19px;margin-bottom:10px}
.pn-top{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:12px clamp(16px,3vw,40px);background:var(--p3);color:#fff}
.pn-logo{display:inline-flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font-weight:600;letter-spacing:.08em}
.pn-logo small{font-weight:400;letter-spacing:0;color:rgba(255,255,255,.65);margin-left:6px}
.pn-logo img{filter:brightness(0) invert(1)}
.pn-nav{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.pn-nav a,.pn-nav .pn-link{color:rgba(255,255,255,.8);text-decoration:none;font-size:14.5px}
.pn-nav a:hover,.pn-nav a[aria-current],.pn-nav .pn-link:hover{color:#fff}
.pn-nav form{margin:0}
.pn-main{max-width:1180px;margin:0 auto;padding:clamp(24px,4vw,48px) clamp(16px,3vw,40px) 96px}
.pn-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:24px}
.pn-new{display:flex;gap:10px;flex-wrap:wrap}
.pn-new small{font-weight:400;opacity:.75;margin-left:4px}
.pn-tip{max-width:60em;margin:-8px 0 22px;line-height:1.55}
.pn-crumb{margin:0 0 6px;font-size:14px}
.pn-crumb a{text-decoration:none}
.pn-muted{color:var(--grey);font-size:14px;margin:4px 0 0}
.pn-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 20px;border:1.5px solid var(--p);background:var(--p);color:#fff;font:inherit;font-weight:600;text-decoration:none;cursor:pointer}
.pn-btn:hover{background:var(--p2);border-color:var(--p2)}
.pn-btn.ghost{background:#fff;color:var(--ink);border-color:#C7D3DE}
.pn-btn.ghost:hover{border-color:var(--p);color:var(--p)}
.pn-link{background:none;border:0;padding:0;font:inherit;color:var(--p2);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.pn-link.danger{color:var(--alert)}
.pn-flash{padding:12px 16px;margin:0 0 20px;background:#E9F6EE;border-left:3px solid var(--ok)}
.pn-flash.err{background:#FDEEE6;border-left-color:var(--alert)}
.pn-flash ul{margin:6px 0 0;padding-left:18px}
.pn-empty{padding:32px;background:#fff;border:1px dashed #C7D3DE;text-align:center;color:var(--grey)}
.pn-card{background:#fff;border:1px solid var(--line);border-top:3px solid var(--accent);padding:clamp(18px,2.4vw,28px);margin:0 0 20px}
.pn-card legend{float:left;width:100%;margin-bottom:14px;font-size:17px;font-weight:600}
.pn-card legend small{font-weight:400;color:var(--grey);font-size:13.5px}
.pn-card legend + *{clear:both}
fieldset.pn-card{min-width:0}
label{display:grid;gap:6px;align-content:start;margin-bottom:14px;font-size:14px;font-weight:600;color:var(--ink)}
label small,.pn-image small{font-weight:400;color:var(--grey);font-size:12.5px}
input[type=text],input[type=email],input[type=password],input[type=url],input[type=date],select,textarea{width:100%;font:inherit;font-weight:400;font-size:15px;padding:10px 12px;border:1px solid #C7D3DE;background:#fff;color:var(--ink);border-radius:0}
textarea{resize:vertical;line-height:1.55}
input:focus,select:focus,textarea:focus{outline:2px solid rgba(46,155,214,.35);border-color:var(--p2)}
.pn-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0 18px}
.pn-row .wide{grid-column:span 2}
.pn-stack{display:grid}
.pn-image{display:grid;gap:8px;align-content:start;margin-bottom:14px}
.pn-label{font-size:14px;font-weight:600}
.pn-image img{width:100%;max-width:420px;aspect-ratio:16/9;object-fit:cover;border:1px solid var(--line);background:var(--tint)}
.pn-langs{display:flex;gap:0;margin:8px 0 -1px}
.pn-langs button{font:inherit;font-weight:600;padding:10px 20px;border:1px solid var(--line);background:#EEF2F6;color:var(--grey);cursor:pointer}
.pn-langs button[aria-selected=true]{background:#fff;color:var(--ink);border-bottom-color:#fff}
.pn-more{border-top:1px solid var(--line);padding:12px 0 0;margin-top:6px}
.pn-more summary{cursor:pointer;font-weight:600;margin-bottom:12px}
.pn-save{position:sticky;bottom:0;display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:14px 18px;background:#fff;border:1px solid var(--line);box-shadow:0 -10px 30px -20px rgba(10,26,40,.35)}
.pn-status{display:flex;align-items:center;gap:10px;margin:0}
.pn-status select{width:auto}
.pn-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line)}
.pn-table th{text-align:left;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--grey);padding:12px 14px;border-bottom:1px solid var(--line)}
.pn-table td{padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:middle}
.pn-post{display:flex;align-items:center;gap:14px}
.pn-post img{width:96px;height:54px;object-fit:cover;flex:none}
.pn-post div{display:grid}
.pn-post a{color:var(--ink);text-decoration:none}
.pn-post a:hover b{color:var(--p2)}
.pn-tag{display:inline-block;padding:3px 10px;font-size:12.5px;font-weight:600;background:#EEF2F6;color:var(--grey)}
.pn-tag.on{background:#E9F6EE;color:var(--ok)}
.pn-actions{white-space:nowrap}
.pn-actions a,.pn-actions form{display:inline;margin-left:12px}
.pn-login{max-width:420px;margin:6vh auto 0;background:#fff;border:1px solid var(--line);border-top:3px solid var(--accent);padding:32px}
.pn-login h1{margin-bottom:6px}
.pn-form{margin-top:20px}
.pn-form.narrow{max-width:520px}
@media (max-width:760px){
  .pn-row .wide{grid-column:auto}
  .pn-table thead{display:none}
  .pn-table,.pn-table tbody,.pn-table tr,.pn-table td{display:block;width:100%}
  .pn-table tr{border-bottom:1px solid var(--line)}
  .pn-table td{border:0;padding:8px 14px}
  .pn-actions a,.pn-actions form{margin:0 12px 0 0}
}
.pn-codeacts{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
