/* Theme Variables */
:root{--bg:#141414;--bg2:#1c1c1a;--bg3:#242422;--fg:#e8e8e4;--fg-muted:#999;--fg-subtle:#555;--border:#2e2e2c;--border2:#3a3a38;--accent:#5a9fd4;--al:#1a2e3d;--ab:#2d4f6e;--tag-bg:#252523;--tag-fg:#bbb;--tbg:#2a2a28;--tfg:#ccc;}
[data-theme="light"]{--bg:#fff;--bg2:#f7f7f5;--bg3:#f0f0ee;--fg:#1a1a1a;--fg-muted:#555;--fg-subtle:#999;--border:#e2e2e2;--border2:#d0d0ce;--accent:#2a6496;--al:#eaf1f8;--ab:#c0d8ee;--tag-bg:#f2f2f0;--tag-fg:#444;--tbg:#e8e8e6;--tfg:#333;}

/* Reset & Base */
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--fg);line-height:1.7;font-size:16px;transition:background .2s,color .2s;}
a{color:var(--accent);text-decoration:none;}a:hover{text-decoration:underline;}

/* Navigation */
nav{border-bottom:1px solid var(--border);padding:.8rem 2rem;display:flex;align-items:center;position:sticky;top:0;background:var(--bg);z-index:100;transition:background .2s,border-color .2s;}
.nb{font-weight:700;font-size:.95rem;text-decoration:none;color:var(--fg);margin-right:2rem;flex-shrink:0;}
.nl{display:flex;gap:1.5rem;flex:1;}
.nl a{font-size:.875rem;text-decoration:none;color:var(--fg-muted);transition:color .15s;}
.nl a:hover,.nl a.active{color:var(--accent);}
.nc{display:flex;align-items:center;gap:.5rem;margin-left:auto;}
.cb{background:var(--tbg);color:var(--tfg);border:1px solid transparent;border-radius:4px;padding:.28rem .6rem;font-size:.8rem;cursor:pointer;font-family:inherit;transition:background .15s;}
.cb:hover{background:var(--border2);}
.cb.active{background:var(--al);color:var(--accent);border-color:var(--ab);}
.cd{width:1px;height:16px;background:var(--border);}

/* Page Layout */
.page{max-width:800px;margin:0 auto;padding:3rem 2rem 7rem;}
section{margin-bottom:3rem;}
h2{font-family:Georgia,serif;font-size:1.22rem;font-weight:normal;margin-bottom:1.25rem;padding-bottom:.5rem;border-bottom:1px solid var(--border);color:var(--fg);}

/* Hero (index.html) */
.hero{display:flex;align-items:flex-start;gap:1.75rem;padding-bottom:2.5rem;border-bottom:1px solid var(--border);margin-bottom:2.75rem;}
.avatar{width:72px;height:72px;border-radius:50%;object-fit:cover;flex-shrink:0;border:2px solid var(--border2);}
.eyebrow{font-size:.75rem;color:var(--fg-subtle);letter-spacing:.1em;text-transform:uppercase;margin-bottom:.5rem;}
.hero h1{font-family:Georgia,serif;font-size:1.7rem;font-weight:normal;color:var(--fg);margin-bottom:.55rem;line-height:1.3;}
.role{font-size:.9rem;color:var(--accent);margin-bottom:.6rem;font-weight:500;}
.bio{color:var(--fg-muted);font-size:.93rem;max-width:520px;line-height:1.75;}

/* Page Header (subpages) */
.page-header{padding-bottom:2rem;border-bottom:1px solid var(--border);margin-bottom:2.5rem;}
.page-header h1{font-family:Georgia,serif;font-size:1.7rem;font-weight:normal;margin-bottom:.6rem;line-height:1.3;}
.page-header p{color:var(--fg-muted);font-size:.93rem;}

/* Skills Header */
.skills-header{padding-bottom:2.5rem;border-bottom:1px solid var(--border);margin-bottom:2.5rem;text-align:center;}
.skills-eyebrow{font-size:.75rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--accent);margin-bottom:.75rem;}
.skills-title{font-family:Georgia,serif;font-size:1.6rem;font-weight:normal;color:var(--fg);margin-bottom:1.5rem;line-height:1.4;}
.skills-badges{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;}
.skills-badge{display:inline-flex;align-items:center;gap:.45rem;padding:.5rem 1rem;border-radius:20px;background:var(--al);border:1px solid var(--ab);font-size:.82rem;color:var(--accent);}
.skills-badge svg{width:16px;height:16px;flex-shrink:0;}
@media(max-width:580px){.skills-title{font-size:1.3rem;}.skills-badges{flex-direction:column;align-items:center;}}

/* Skills / Tags */
.sg{margin-bottom:1.5rem;}.sg:last-child{margin-bottom:0;}
.gl{font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-subtle);margin-bottom:.55rem;}
.tags{display:flex;flex-wrap:wrap;gap:.4rem;}
.tag{display:inline-block;padding:.26rem .65rem;border-radius:3px;font-size:.82rem;background:var(--tag-bg);color:var(--tag-fg);border:1px solid var(--border);line-height:1.4;}
.tag.hi{background:var(--al);color:var(--accent);border-color:var(--ab);}

/* Projects Grid */
.proj-grid{display:grid;grid-template-columns:1fr 1fr;gap:.85rem;}
.proj-card{background:var(--bg2);border:1px solid var(--border);border-radius:4px;padding:1.1rem 1.2rem 1rem;text-decoration:none;color:inherit;display:block;transition:border-color .15s;}
.proj-card:hover{border-color:var(--accent);}
.proj-name{font-size:.93rem;font-weight:600;color:var(--accent);margin-bottom:.4rem;}
.proj-desc{font-size:.84rem;color:var(--fg-muted);line-height:1.6;margin-bottom:.8rem;}
.proj-tags{display:flex;flex-wrap:wrap;gap:.3rem;}
.proj-tag{font-size:.74rem;padding:.13rem .48rem;border-radius:2px;background:var(--tag-bg);color:var(--fg-muted);border:1px solid var(--border);}

/* Account Links */
.alist{display:flex;flex-direction:column;gap:.6rem;}
.alink{display:flex;align-items:center;gap:.85rem;padding:.75rem 1rem;border-radius:4px;background:var(--bg2);border:1px solid var(--border);text-decoration:none;color:var(--fg);transition:border-color .15s,background .15s;}
.alink:hover{border-color:var(--accent);background:var(--bg3);text-decoration:none;}
.aico{width:20px;height:20px;flex-shrink:0;color:var(--fg-muted);}
.aname{font-size:.9rem;font-weight:600;color:var(--fg);}
.ahandle{font-size:.8rem;color:var(--fg-muted);}
.arr{color:var(--fg-subtle);font-size:.85rem;margin-left:auto;}

/* Donation Section Highlight */
.donation .alist{gap:.8rem;}
.donation .alink{background:linear-gradient(135deg,var(--al) 0%,var(--bg2) 100%);border:2px solid var(--ab);padding:1rem 1.2rem;}
.donation .alink:hover{border-color:var(--accent);background:linear-gradient(135deg,var(--ab) 0%,var(--bg3) 100%);}
.donation .aico{color:var(--accent);width:24px;height:24px;}
.donation .aname{font-size:.95rem;color:var(--accent);}

/* Travel Image Cards */
.travel-cards{display:grid;grid-template-columns:1fr 1fr;gap:.85rem;margin-top:1rem;}
.travel-card{border-radius:4px;overflow:hidden;border:1px solid var(--border);transition:border-color .15s;}
.travel-card:hover{border-color:var(--accent);}
.travel-card a img{width:100%;height:120px;object-fit:cover;display:block;transition:opacity .15s;}
.travel-card a:hover img{opacity:.85;}
.travel-card-info{padding:.6rem .75rem;background:var(--bg2);}
.travel-card-label{font-size:.85rem;color:var(--fg);font-weight:600;}
.travel-card-desc{font-size:.75rem;color:var(--fg-muted);margin-top:.2rem;}
.travel-card-link{font-size:.75rem;color:var(--accent);text-decoration:none;display:inline-block;margin-top:.35rem;}
.travel-card-link:hover{text-decoration:underline;}
@media(max-width:580px){.travel-cards{grid-template-columns:1fr;}}

/* Category Labels */
.cat-label{font-size:.75rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--fg-subtle);margin:1.5rem 0 .6rem;}

/* History */
.history{list-style:none;color:var(--fg-subtle);font-size:.85rem;}
.history li{padding:.25rem 0;border-bottom:1px solid var(--border);}
.history li:last-child{border-bottom:none;}

/* Footer */
.more{margin-top:.75rem;font-size:.84rem;color:var(--fg-subtle);}
.foot{font-size:.83rem;color:var(--fg-subtle);padding-top:2rem;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem;}
.foot a{color:var(--fg-muted);}
.foot a:hover{color:var(--accent);}

/* Mobile Menu */
.menu-toggle{display:none;background:none;border:none;cursor:pointer;padding:.5rem;color:var(--fg-muted);}
.menu-toggle svg{width:24px;height:24px;}
.mobile-menu{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:var(--bg);z-index:200;flex-direction:column;padding:1rem;}
.mobile-menu.open{display:flex;}
.mobile-menu-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:1rem;border-bottom:1px solid var(--border);}
.mobile-menu-close{background:none;border:none;cursor:pointer;padding:.5rem;color:var(--fg-muted);}
.mobile-menu-close svg{width:24px;height:24px;}
.mobile-menu-links{display:flex;flex-direction:column;gap:.5rem;padding:1.5rem 0;}
.mobile-menu-links a{font-size:1.1rem;padding:.75rem 0;color:var(--fg-muted);text-decoration:none;border-bottom:1px solid var(--border);}
.mobile-menu-links a:hover,.mobile-menu-links a.active{color:var(--accent);}
.mobile-menu-controls{display:flex;gap:.5rem;margin-top:auto;padding-top:1rem;border-top:1px solid var(--border);}

/* Responsive */
@media(max-width:580px){.nl{display:none;}.menu-toggle{display:block;}.hero{flex-direction:column;gap:1rem;}.proj-grid{grid-template-columns:1fr;}}
