@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600;700&family=Inter:wght@300;400;500;600;700&display=swap");:root{--navy-dark: #0d1b2a;--navy: #1b2a4a;--navy-mid: #2d4070;--gold: #c9a435;--gold-light: #e8c96e;--gold-dim: #a0822a;--white: #ffffff;--off-white: #f7f8fc;--gray-100: #f1f4f8;--gray-200: #e2e8f0;--gray-400: #94a3b8;--gray-600: #64748b;--gray-800: #334155;--text: #1e293b;--shadow-sm: 0 1px 4px rgba(0,0,0,0.07), 0 1px 2px rgba(0,0,0,0.04);--shadow-md: 0 4px 16px rgba(0,0,0,0.09), 0 2px 4px rgba(0,0,0,0.05);--shadow-lg: 0 12px 32px rgba(0,0,0,0.14), 0 4px 8px rgba(0,0,0,0.06);--ease: cubic-bezier(0.4, 0, 0.2, 1)}*,*::before,*::after{box-sizing:border-box}html{font-size:18px}html,body{margin:0;padding:0}body{font-family:'Inter', sans-serif;background:var(--off-white);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body:before{display:none}ul,li{list-style:none;padding:0;margin:0}a{text-decoration:none}#sidebar{display:none}#about{text-align:center;background:linear-gradient(160deg, var(--navy-dark) 0%, var(--navy) 55%, var(--navy-mid) 100%);position:relative;overflow:hidden}#about::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:480px;height:340px;background:radial-gradient(ellipse, rgba(201,164,53,0.12) 0%, transparent 70%);pointer-events:none}#about::after{content:"";display:block;height:3px;background:linear-gradient(90deg, transparent 0%, var(--gold) 40%, var(--gold-light) 50%, var(--gold) 60%, transparent 100%);width:55%;margin:0 auto;border-radius:2px}#about .profile-zone{padding:3.5rem 1.5rem 2rem;position:relative;z-index:1}#about .profile-img{width:188px;height:188px;border-radius:50%;object-fit:cover;object-position:center 22%;border:4px solid var(--gold);box-shadow:0 0 0 8px rgba(201,164,53,0.12),var(--shadow-lg);display:block;margin:0 auto 1.5rem}#about .name-zone{margin:0 0 1.75rem}#about .name-zone h1{font-family:'Playfair Display', serif;font-size:2rem;font-weight:700;color:var(--white);margin:0 0 0.45rem;letter-spacing:0.01em;line-height:1.2}#about .name-zone h2{font-size:0.92rem;font-weight:400;color:var(--gold-light);margin:0;letter-spacing:0.12em;text-transform:uppercase;opacity:0.9}#about .personal-info{display:flex;flex-wrap:wrap;justify-content:center;gap:0.45rem;max-width:600px;margin:0 auto;padding-bottom:2.25rem}#about .personal-info li{height:auto !important;margin:0 !important}#about .personal-info a{display:inline-flex;align-items:center;gap:0.4rem;background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.14);border-radius:20px;padding:0.3rem 0.85rem;transition:all 0.25s var(--ease);cursor:pointer}#about .personal-info a:hover{background:rgba(201,164,53,0.18);border-color:var(--gold);transform:translateY(-1px)}#about .personal-info a img{width:13px;height:13px;filter:invert(1);opacity:0.82;flex-shrink:0}#about .personal-info a div{display:inline}#about .personal-info a span{font-size:0.9rem !important;color:rgba(255,255,255,0.82) !important;clip-path:none !important;display:inline !important;font-weight:400;letter-spacing:0.01em;transition:none !important}#contents{width:92%;max-width:800px;margin:2.75rem auto;text-align:left}#contents>ul{padding:0;margin:0}#contents>ul>li{margin:0}#contents .subject{background:var(--white);border-radius:14px;box-shadow:var(--shadow-sm);padding:2rem 1.75rem 1.5rem;margin-bottom:1.25rem;border:1px solid var(--gray-200);opacity:0;transition:opacity 0.65s ease, transform 0.65s ease, box-shadow 0.3s;transform:translateY(22px)}#contents .subject.appear{opacity:1;transform:none}#contents .subject:hover{box-shadow:var(--shadow-md)}#contents .subject>ul{margin:0;padding:0}#contents .subject-name{display:flex;align-items:center;gap:0.65rem;font-family:'Playfair Display', serif;font-size:1.25rem;font-weight:700;color:var(--navy);margin:0 0 1.5rem;padding-bottom:0.8rem;border-bottom:2px solid var(--gray-100);position:relative}#contents .subject-name::after{content:"";position:absolute;bottom:-2px;left:0;width:44px;height:2px;background:linear-gradient(90deg, var(--gold), var(--gold-light));border-radius:1px}#contents .subject-name div{width:28px;height:28px;background:linear-gradient(140deg, var(--navy), var(--navy-mid));border-radius:8px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;margin:0;transform:none}#contents .subject-icon{width:15px;height:15px;filter:invert(1);display:block;margin:auto;vertical-align:unset}#contents .item{position:relative;padding:1.15rem 1.2rem 1rem 1.3rem;border-radius:9px;border:1px solid var(--gray-200);margin-top:0;margin-bottom:0.85rem;background:var(--off-white);opacity:0;transition:opacity 0.5s ease, transform 0.5s ease, border-color 0.2s, background 0.2s;transform:translateY(14px)}#contents .item.appear{opacity:1;transform:none}#contents .item:last-child{margin-bottom:0}#contents .item::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:3px;background:linear-gradient(180deg, var(--gold), var(--gold-dim));border-radius:0 2px 2px 0;opacity:0;transition:opacity 0.22s}#contents .item:hover{border-color:rgba(201,164,53,0.38);background:#fffef8}#contents .item:hover::before{opacity:1}#contents .item:nth-child(1){margin-top:0}#contents .content-header{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:0.45rem;margin-bottom:0.35rem;width:100%;position:static}#contents .content-header::before{display:none !important}#contents .content-header p{font-size:1.05rem;font-weight:600;color:var(--navy);margin:0;line-height:1.4;flex:1;min-width:180px}#contents .content-header span{line-height:1.5}#contents .content-header+ul{margin-top:0.35rem}#contents .content-date{display:inline-flex;align-items:center;gap:0.28rem;font-size:0.88rem;font-weight:500;color:var(--gray-600);background:var(--gray-100);border:1px solid var(--gray-200);border-radius:10px;padding:0.18rem 0.62rem;white-space:nowrap;width:auto !important;text-align:left !important}#contents .content-date img{width:11px;height:11px;opacity:0.4;margin:0}#contents .item>p{font-size:0.95rem;color:var(--gray-600);font-style:italic;margin:0 0 0.5rem;font-weight:400;line-height:1.45}#contents .subitem{position:relative;font-size:1rem;color:var(--gray-800);line-height:1.7;padding:0.12rem 0 0.12rem 1.1rem;margin:0;list-style:none}#contents .subitem::before{content:"▸";position:absolute;left:0;color:var(--gold-dim);font-size:0.64rem;top:0.4rem}#contents ul{margin-bottom:0}#contents ul+p{margin-top:0}#contents em{padding:0 2px}#contents a{color:var(--navy-mid);text-decoration:underline 1px;text-underline-position:under}#contents a:hover{color:var(--gold-dim)}#contents p{line-height:1.65}#contents code{margin:0 2px;padding:2px 6px;font-size:0.93rem;border:1px solid var(--gray-200);background-color:var(--gray-100);border-radius:4px;font-family:'Courier New', Courier, monospace;color:var(--navy)}#contents img{aspect-ratio:auto;max-width:320px}#contents li.subject#Skills .content-header p{font-size:0.9rem;font-weight:700;color:var(--gold-dim);text-transform:uppercase;letter-spacing:0.09em}#contents li.subject#Skills .item{background:var(--white)}#contents li.subject#Skills .item:hover{background:var(--white)}#contents li.subject#Skills .item>ul{display:flex;flex-wrap:wrap;gap:0.38rem;margin-top:0.55rem}#contents li.subject#Skills .subitem{display:inline-flex;align-items:center;padding:0.28rem 0.75rem;background:var(--navy);color:rgba(255,255,255,0.88);border-radius:14px;font-size:0.88rem;font-weight:500;letter-spacing:0.025em;line-height:1;transition:all 0.22s var(--ease)}#contents li.subject#Skills .subitem::before{display:none}#contents li.subject#Skills .subitem:hover{background:var(--gold-dim);color:var(--white);transform:translateY(-1px);box-shadow:0 3px 10px rgba(13,27,42,0.2)}#footer{text-align:center;padding:1.5rem 1rem;background:var(--navy-dark);color:var(--gray-400);font-size:0.93rem;letter-spacing:0.02em}#footer a{color:var(--gold-light);font-weight:500;transition:color 0.2s}#footer a:hover{color:var(--white)}@media (min-width: 768px){body::before{display:none !important}#about .profile-img{width:210px;height:210px}#about .name-zone h1{font-size:2.5rem}#about .name-zone h2{font-size:0.98rem}#contents{width:84%}#contents .subject{padding:2.25rem 2.25rem 1.75rem}#contents .subject-name{font-size:1.45rem}#contents .content-header p{font-size:1.1rem}#contents .content-date{font-size:0.92rem}#contents .subitem{font-size:1.05rem}#contents li.subject#Skills .subitem{font-size:0.9rem}}@media (min-width: 1024px){#about .profile-img{width:234px;height:234px}#about .name-zone h1{font-size:2.8rem}#about .name-zone h2{font-size:1.04rem;letter-spacing:0.14em}#sidebar{display:block;position:fixed;width:144px;top:260px;right:0;z-index:10;font-size:0.75rem;font-family:'Inter', sans-serif}#sidebar li{margin:3px 0;padding:7px 20px 7px 14px;border-radius:8px 0 0 8px;background:var(--white);border:1px solid var(--gray-200);border-right:none;transition:all 0.25s var(--ease);cursor:pointer;box-shadow:var(--shadow-sm)}#sidebar li a{color:var(--gray-800);font-weight:500;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#sidebar li:hover{background:var(--navy);border-color:var(--navy)}#sidebar li:hover a{color:var(--white)}#sidebar li.active{background:var(--navy-dark);border-color:var(--navy-dark);border-left:3px solid var(--gold);padding-left:11px}#sidebar li.active a{color:var(--white)}#contents{width:62%;max-width:860px;margin:4rem auto}#contents .subject{padding:2.5rem 2.75rem 2rem}#contents img{max-width:100%}}
