/* fn-theme */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --fn-bg:#0e0c0b;--fn-sf:#181513;--fn-tx:#d0ccc8;
  --fn-mt:#9a9690;--fn-wh:#f5f2ee;--fn-hd:#e0784a;
  --fn-h3:#cc6a40;--fn-ac:#e0784a;--fn-bd:rgba(255,220,200,0.07);
  --fn-lk:#e0784a;--fn-ft:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{font-family:var(--fn-ft);background:var(--fn-bg);color:var(--fn-tx);font-size:17.2px;line-height:1.8}
img{max-width:100%;height:auto;display:block}
a{color:var(--fn-lk);text-decoration:none}
a:hover{text-decoration:underline}

.fn-core{max-width:820px;margin:0 auto;padding:0 1.5rem}

#reading-area{padding:4rem 0 3rem}
#reading-area h1{font-size:clamp(1.8rem,4vw,2.6rem);font-weight:800;line-height:1.2;color:var(--fn-hd);margin-bottom:2rem;letter-spacing:-0.02em}
#reading-area h2{font-size:clamp(1.4rem,3vw,1.9rem);font-weight:700;line-height:1.25;color:var(--fn-hd);margin-top:3.5rem;margin-bottom:1.25rem;padding-left:0.75rem;border-left:4px solid var(--fn-ac);letter-spacing:-0.01em}
#reading-area h3{font-size:clamp(1.1rem,2.5vw,1.35rem);font-weight:600;color:var(--fn-h3);margin-top:2.5rem;margin-bottom:0.75rem}
#reading-area p{margin-bottom:1.5rem;color:var(--fn-tx)}
#reading-area img{margin:2rem 0;border-radius:9px;border:1px solid var(--fn-bd)}

#reading-area table{width:100%;border-collapse:collapse;margin:2rem 0;font-size:0.9rem;border:1px solid var(--fn-bd);border-radius:8px;overflow:hidden}
#reading-area thead{background:rgba(224,120,74,0.08)}
#reading-area th{padding:0.85rem 1.25rem;text-align:left;font-weight:600;color:var(--fn-wh);font-size:0.8rem;text-transform:uppercase;letter-spacing:0.05em;border-bottom:1px solid var(--fn-bd)}
#reading-area td{padding:0.75rem 1.25rem;color:var(--fn-mt);border-bottom:1px solid var(--fn-bd)}
#reading-area tbody tr:last-child td{border-bottom:none}
#reading-area tbody tr:hover{background:rgba(255,255,255,0.02)}

#reading-area ul{margin:1.5rem 0;padding-left:0;list-style:none}
#reading-area li{position:relative;padding:0.5rem 0 0.5rem 1.5rem;color:var(--fn-tx);font-size:0.95rem}
#reading-area li::before{content:'2';position:absolute;left:0;color:var(--fn-ac);font-weight:700;font-size:1.2em}

figure{margin:0}
.fn-top-img,.fn-mid-img{margin:2rem 0}
.fn-top-img img,.fn-mid-img img{width:100%;height:auto;border-radius:9px;border:1px solid var(--fn-bd);display:block}

#extra-links,#answers{padding:2.5rem 0;border-top:1px solid var(--fn-bd)}
#extra-links h2,#answers h2{font-size:clamp(1.4rem,3vw,1.9rem);font-weight:700;line-height:1.25;color:var(--fn-hd);margin-bottom:1.25rem;padding-left:0.75rem;border-left:4px solid var(--fn-ac);letter-spacing:-0.01em}
#extra-links h3,#answers h3{font-size:clamp(1.1rem,2.5vw,1.35rem);font-weight:600;color:var(--fn-h3);margin-top:2rem;margin-bottom:0.5rem}
#extra-links p,#answers p{margin-bottom:1.25rem;color:var(--fn-tx);line-height:1.8}
#extra-links a{color:var(--fn-ac);text-decoration:none;border-bottom:1px solid rgba(224,120,74,0.3);transition:border-color 0.2s}
#extra-links a:hover{border-color:var(--fn-ac)}

footer{border-top:1px solid var(--fn-bd);padding:2rem 0}
footer p{font-size:0.8rem;color:var(--fn-mt);text-align:center}

@media(max-width:600px){
  #reading-area{padding:2.5rem 0 2rem}
  #reading-area h2{margin-top:2.5rem}
  .fn-top-img,.fn-mid-img{margin:1.5rem 0}
  .fn-top-img img,.fn-mid-img img{border-radius:6px}
  #reading-area table{font-size:0.8rem}
  #reading-area th,#reading-area td{padding:0.6rem 0.75rem}
  #extra-links,#answers{padding:2rem 0}
}
