@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700;800;900&family=Noto+Sans+KR:wght@400;500;600;700;800;900&display=swap');
:root { --paper:#f3efe5; --ink:#171714; --orange:#ff6748; --lime:#e7ff62; --page:#dedbd1; --sheet:#fffefa; --sheet-border:#b7b3a8; --rule:#c9c5bc; --rule-light:#e0dcd3; --muted:#68665f; --orange-dark:#c64b30; --line:2px solid var(--ink); --mono:'DM Mono',monospace; --sans:'DM Sans','Noto Sans KR',sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
img { max-width:100%; }
::selection { background:var(--lime); color:var(--ink); }
:focus-visible { outline:3px solid var(--orange); outline-offset:4px; }
.skip-link { position:absolute; top:-80px; left:16px; z-index:100; padding:10px 14px; background:var(--lime); border:var(--line); }
.skip-link:focus { top:12px; }
.eyebrow { font-family:var(--mono); font-size:11px; font-weight:500; letter-spacing:.11em; line-height:1.5; }
.site-header { height:82px; border-bottom:var(--line); display:flex; align-items:stretch; justify-content:space-between; position:relative; z-index:10; background:var(--paper); }
.brand { display:flex; align-items:center; gap:12px; padding:12px 4vw; font-size:15px; font-weight:900; line-height:1.05; letter-spacing:-.04em; white-space:nowrap; }
.brand small { display:block; margin-top:4px; font-family:var(--mono); font-size:9px; letter-spacing:.1em; }
.brand-mark { display:grid; place-items:center; width:42px; height:42px; background:var(--ink); color:var(--paper); font-family:var(--mono); font-size:16px; letter-spacing:-.08em; }
.footer { background:var(--orange); padding:90px 4vw 0; }
.footer-bottom > a { display:inline-flex; gap:20px; border-bottom:3px solid var(--ink); padding-bottom:5px; font-size:clamp(23px,3vw,45px); font-weight:800; letter-spacing:-.05em; }
.footer-bottom { display:flex; justify-content:space-between; gap:24px; border-top:var(--line); padding:22px 0; margin-top:95px; font-family:var(--mono); font-size:10px; letter-spacing:.05em; }
.footer-bottom a:hover { text-decoration:underline; }
.small-footer { padding-top:0; }
.small-footer .footer-bottom { margin-top:0; border-top:0; }
.resume-page { background:var(--page); }
.resume-shell { max-width:1040px; margin:auto; padding:35px 22px 100px; }
.resume-document { background:var(--sheet); border:1px solid var(--sheet-border); box-shadow:10px 10px 0 rgba(23,23,20,.16); padding:70px 76px; }
.resume-intro { border-bottom:3px solid var(--ink); padding-bottom:30px; }
.resume-intro h1 { font-size:80px; letter-spacing:-.1em; margin:10px 0 0; line-height:1; }
.resume-intro h1 span { color:var(--orange); }
.resume-intro > p { margin:6px 0 26px; font-size:21px; font-weight:700; }
.resume-contact { display:flex; gap:18px; flex-wrap:wrap; font-family:var(--mono); font-size:11px; }
.resume-contact a { text-decoration:underline; }
.resume-intro > .resume-request { margin:12px 0 0; font-size:13px; font-weight:400; color:var(--muted); }
.resume-block { display:grid; grid-template-columns:155px 1fr; gap:35px; border-bottom:1px solid var(--rule); padding:31px 0; }
.resume-block h2 { margin:0; font-size:16px; letter-spacing:-.04em; }
.resume-block p { margin:0; line-height:1.75; font-size:14px; word-break:keep-all; }
.resume-tags { display:flex; gap:8px; flex-wrap:wrap; }
.resume-tags span { padding:5px 9px; border:1px solid var(--ink); font-family:var(--mono); font-size:10px; }
.resume-entry { display:grid; grid-template-columns:150px 1fr; gap:26px; }
.resume-entry + .resume-entry { margin-top:30px; }
.resume-entry > div:first-child { display:flex; flex-direction:column; gap:6px; }
.resume-entry strong { font-size:13px; }
.resume-entry span { font-family:var(--mono); font-size:10px; color:var(--muted); }
.resume-entry h3 { margin:0 0 10px; font-size:15px; }
.resume-entry ul { margin:0; padding-left:18px; }
.resume-entry li { font-size:13px; line-height:1.75; margin-bottom:5px; word-break:keep-all; }
@media (max-width:900px) {
  .site-header { height:auto; flex-wrap:wrap; }
  .brand { min-height:72px; }
}
@media (max-width:650px) {
  .brand { width:100%; }
  .footer { padding:65px 5vw 0; }
  .footer-bottom { margin-top:65px; font-size:9px; }
  .resume-shell { padding:20px 12px 50px; }
  .resume-document { padding:38px 25px; box-shadow:5px 5px 0 rgba(23,23,20,.16); }
  .resume-intro h1 { font-size:56px; }
  .resume-block { display:block; }
  .resume-block h2 { margin-bottom:16px; }
  .resume-entry { grid-template-columns:1fr; gap:8px; }
  .resume-entry > div:first-child { display:block; }
  .resume-entry span { margin-left:10px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important; }
}
@media print {
  @page { size:A4; margin:12mm; }
  body.resume-page { background:white; }
  .site-header,.footer,.skip-link { display:none !important; }
  .resume-shell { padding:0; max-width:none; }
  .resume-document { border:0; box-shadow:none; padding:0; }
  .resume-intro h1 { font-size:50px; }
  .resume-block { padding:16px 0; break-inside:avoid; }
  .resume-entry { break-inside:avoid; }
}
.resume-actions { display:flex; align-items:stretch; border-left:var(--line); }
.resume-actions a,.resume-actions button { display:flex; align-items:center; justify-content:center; gap:10px; min-width:112px; padding:0 20px; border:0; border-right:var(--line); background:transparent; color:var(--ink); font-family:var(--mono); font-size:11px; font-weight:500; letter-spacing:.04em; cursor:pointer; }
.resume-actions a:hover,.resume-actions button:hover { background:var(--orange); }
.resume-actions button { min-width:135px; border-right:0; background:var(--lime); }
.resume-actions a.resume-notes { background:var(--ink); color:var(--paper); }
.resume-actions a.resume-notes:hover { background:var(--orange); color:var(--ink); }
.resume-toc { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:22px; }
.resume-toc .eyebrow { white-space:nowrap; }
.resume-toc div { display:flex; flex-wrap:wrap; gap:8px 22px; }
.resume-toc a { border-bottom:1px solid currentColor; padding-bottom:3px; font-size:12px; font-weight:700; }
.resume-toc a:hover { color:var(--orange-dark); }
@media (max-width:650px) {
  .resume-actions { width:100%; border-left:0; border-top:var(--line); }
  .resume-actions a,.resume-actions button { flex:1; min-width:0; padding:0 10px; min-height:50px; }
  .resume-toc { display:block; }
  .resume-toc div { margin-top:12px; }
}
@media print {
  .resume-toc { display:none; }
}
.resume-summary { margin:0 0 18px !important; font-weight:600; }
.resume-introduction p + p { margin-top:12px; }
.resume-case + .resume-case { margin-top:26px; padding-top:24px; border-top:1px solid var(--rule-light); }
.resume-case-company { display:block; margin-bottom:6px; font-size:12px; color:var(--muted); }
.resume-case h3 { margin:0 0 10px; font-size:16px; line-height:1.5; word-break:keep-all; }
.resume-case .resume-case-result { margin-top:10px; font-weight:700; }
.resume-case .resume-case-note { margin-top:4px; font-size:12px; color:var(--muted); }
.resume-case .resume-case-link { margin-top:10px; font-size:13px; }
.resume-case-link a { text-decoration:underline; }
@media print {
  .resume-case { break-inside:avoid; }
}
#experience .resume-entry strong { font-size:16px; line-height:1.4; }
.resume-subsection + .resume-subsection { margin-top:24px; }
.resume-subsection h4 { margin:0 0 8px; font-size:14px; line-height:1.5; }
.resume-subpoints { margin-top:5px !important; }
@media print {
  .resume-block,.resume-entry { break-inside:auto; }
  .resume-block h2,.resume-entry h3,.resume-subsection h4 { break-after:avoid; }
  .resume-subsection { break-inside:avoid; }
}
.small-footer .footer-bottom { align-items:flex-end; }
.small-footer .footer-bottom > a { white-space:nowrap; }
.footer-meta { display:flex; flex-direction:column; gap:6px; }
.footer-meta a { text-decoration:underline; text-underline-offset:3px; }
.footer :focus-visible { outline-color:var(--ink); }
@media (max-width:650px) {
  .small-footer { padding-top:0; }
  .small-footer .footer-bottom { flex-direction:column; align-items:flex-start; gap:14px; padding-bottom:28px; }
}
.scroll-nav { position:fixed; right:16px; bottom:calc(16px + env(safe-area-inset-bottom)); z-index:20; font-family:var(--mono); transition:opacity .2s, transform .2s, visibility .2s; }
.scroll-nav.is-hidden { opacity:0; visibility:hidden; transform:translateY(8px); }
.scroll-nav-toggle { position:relative; display:flex; align-items:center; gap:4px; height:44px; padding:0 16px; border:2px solid var(--ink); background:var(--lime); box-shadow:4px 4px 0 var(--ink); color:var(--ink); font-family:var(--mono); font-size:12px; font-weight:500; letter-spacing:.06em; cursor:pointer; }
.scroll-nav-current { font-weight:700; }
.scroll-nav-list { display:none; position:absolute; right:0; bottom:calc(100% + 12px); min-width:180px; margin:0; padding:8px; list-style:none; background:var(--sheet); border:2px solid var(--ink); box-shadow:4px 4px 0 var(--ink); }
.scroll-nav.is-open .scroll-nav-list { display:block; }
.scroll-nav-list a { display:flex; gap:10px; padding:8px; font-size:11px; letter-spacing:.04em; white-space:nowrap; }
.scroll-nav-list a span { color:var(--orange-dark); font-weight:500; }
.scroll-nav-list a:hover { text-decoration:underline; }
.scroll-nav-list a[aria-current] { background:var(--lime); }
.scroll-nav-progress { position:absolute; left:2px; right:2px; bottom:2px; height:3px; pointer-events:none; }
.scroll-nav-progress i { display:block; width:calc(var(--progress, 0) * 100%); height:100%; background:var(--ink); }
@media (min-width:1440px) {
  .scroll-nav { width:150px; padding:10px 8px 14px; background:var(--sheet); border:2px solid var(--ink); box-shadow:6px 6px 0 var(--ink); }
  .scroll-nav-toggle { display:none; }
  .scroll-nav-list { display:block; position:static; min-width:0; padding:0; border:0; box-shadow:none; background:none; }
  .scroll-nav-list a { padding:6px 8px; }
  .scroll-nav-progress { left:8px; right:8px; bottom:6px; background:var(--rule-light); }
}
.print-only { display:none; }
.resume-entry li a { text-decoration:underline; text-underline-offset:3px; }
@media print {
  .print-only { display:inline; }
  .screen-only { display:none; }
  .scroll-nav { display:none !important; }
  .resume-block { grid-template-columns:110px 1fr; gap:24px; }
  .resume-entry { display:block; }
  .resume-entry > div:first-child { flex-direction:row; align-items:baseline; gap:10px; margin-bottom:6px; break-after:avoid; }
  .resume-entry + .resume-entry { margin-top:18px; }
  .resume-summary { break-after:avoid; }
  .resume-intro { padding-bottom:18px; }
  .resume-intro h1 { font-size:36px; }
  .resume-intro > p { margin:4px 0 14px; font-size:17px; }
  .resume-block { padding:10px 0; }
  .resume-block p { font-size:12.5px; line-height:1.6; }
  .resume-entry li { font-size:12px; line-height:1.6; margin-bottom:3px; }
  .resume-case + .resume-case { margin-top:12px; padding-top:12px; }
  .resume-subsection + .resume-subsection { margin-top:14px; }
  .resume-subsection { break-inside:auto; }
  .resume-entry li { break-inside:avoid; }
  .resume-case h3 { font-size:15px; }
  .resume-entry h3 { font-size:14px; margin-bottom:6px; }
  .resume-subsection h4 { font-size:13px; margin-bottom:4px; }
  .resume-summary { margin-bottom:10px !important; }
}
