/* 정혜림 포트폴리오 v3 — mockup-v3.html의 CSS를 그대로 옮김(DESIGN-v3.md). 아래 'site' 블록이 실제 사이트용 추가분 */
:root{
--paper:#ffffff; --grid:#e9ecf6;
--ink:#16181d; --body:#2a2d34; --sub:#5a5f6b; --rule:#cfd4e0;
--pen:#1f3fd1; --pen-d:#162c94; --pen-wash:#eef1fc;
--hl:#ffe14d;
--stroke-a:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M6 9C40 6 92 8.4 150 6.6S252 5 296 7.2L292 33C240 35.6 180 33 120 34.6S40 35.2 3 33.4Z%22 fill=%22%23FFE14D%22/%3E%3Cpath d=%22M6 9C11 8.6 16 8.4 21 8.3L18 34.7C13 34.5 8 34 3 33.4Z%22 fill=%22%23F0C800%22 opacity=%22.28%22/%3E%3Cpath d=%22M281 6.2C286 6.5 291 6.8 296 7.2L292 33C288 33.3 283 33.6 278 33.8Z%22 fill=%22%23F0C800%22 opacity=%22.2%22/%3E%3Cpath d=%22M28 21C100 19.2 200 22 276 19.6%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.3%22 opacity=%22.3%22/%3E%3C/svg%3E");
--stroke-b:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M4 7.6C60 9.6 110 6 170 8S250 9.4 297 6L294 31.4C250 34.4 190 32 130 33.6S50 31.6 2 34Z%22 fill=%22%23FFE14D%22/%3E%3Cpath d=%22M4 7.6C10 7.9 16 8.1 24 8.2L21 33C14 33.2 8 33.6 2 34Z%22 fill=%22%23F0C800%22 opacity=%22.26%22/%3E%3Cpath d=%22M40 14C120 15.6 210 13 284 14.4%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.1%22 opacity=%22.28%22/%3E%3C/svg%3E");
--sans:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR",sans-serif;
--mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;color:var(--ink);font:17px/1.8 var(--sans);word-break:keep-all;overflow-wrap:break-word;-webkit-font-smoothing:antialiased;
background-color:var(--paper);
background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);
background-size:24px 24px;background-position:-1px -1px;min-height:100vh}
a{color:var(--pen);text-underline-offset:4px;text-decoration-thickness:1.5px}
a:hover{color:var(--pen-d)}
:focus-visible{outline:3px solid var(--pen);outline-offset:3px}
.wrap{max-width:1080px;margin:0 auto;padding:0 32px}
.mono{font-family:var(--mono);font-size:13px;letter-spacing:0;color:var(--sub)}
/* 손으로 그은 형광펜: 글자 뒤에 깔리는 그림. 글자보다 양옆으로 조금 삐져나오고 살짝 기울어 있음 */
.hl{background:var(--stroke-a) no-repeat 50% 62%/100% 78%;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:0 .22em;margin:0 -.22em}
.hl.s2{background-image:var(--stroke-b)}
/* ---------- 상단 메뉴 ---------- */
.top{background:var(--paper);border-bottom:1.5px solid var(--ink);position:sticky;top:0;z-index:10}
.top .wrap{display:flex;align-items:center;gap:24px;height:64px}
.id{font-weight:760;font-size:17px;color:var(--ink);text-decoration:none;margin-right:auto;white-space:nowrap}
.tabs{display:flex;gap:4px}
.tabs a{font-size:15px;font-weight:560;color:var(--body);text-decoration:none;padding:8px 12px;line-height:1.5;border-bottom:2.5px solid transparent}
.tabs a:hover{color:var(--pen)}
.tabs a[aria-current="page"]{color:var(--pen);border-bottom-color:var(--pen);font-weight:700}
.tabs a.play[aria-current="page"]{color:var(--ink);border-bottom-color:transparent;background:var(--stroke-b) no-repeat 50% 50%/100% 62%}
.agent{font-family:var(--mono);font-size:12.5px;color:var(--ink);text-decoration:none;border:1.5px solid var(--ink);padding:5px 10px;line-height:1.5;white-space:nowrap;background:var(--paper)}
.agent:hover{background:var(--ink);color:#fff}
/* ---------- 탭 화면 ---------- */
main>section{padding:72px 0 96px}
.js main>section{display:none}
.js body[data-tab="home"] #tab-home,.js body[data-tab="about"] #tab-about,.js body[data-tab="playground"] #tab-playground,
.js body[data-tab="projects"] #tab-projects,.js body[data-tab="resume"] #tab-resume,.js body[data-tab="contact"] #tab-contact{display:block}
h1{font-size:40px;line-height:1.25;letter-spacing:-.03em;font-weight:800;margin:0 0 16px}
h2{font-size:24px;line-height:1.4;letter-spacing:-.02em;font-weight:760;margin:72px 0 24px;padding-bottom:8px;border-bottom:1.5px solid var(--ink)}
.lead{font-size:19px;color:var(--body);max-width:34em;margin:0}
.todo{display:none!important}
.review .todo{font-family:var(--mono);font-size:12.5px;color:#8a4b00;background:#fff4d6;border:1px dashed #b97a1a;padding:2px 8px;display:inline-block!important;line-height:1.6}
/* ---------- Home ---------- */
#tab-home{padding-top:88px}
.hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:56px;align-items:center}
.stamp{display:inline-block;font-family:var(--mono);font-size:13px;font-weight:600;color:var(--pen);border:1.5px solid var(--pen);padding:3px 10px;line-height:1.5;transform:rotate(-1.5deg);background:var(--paper)}
.hero h1{font-size:68px;line-height:1.1;letter-spacing:-.045em;margin:28px 0 40px}
.hero h1 span{display:block;width:fit-content}
.hero h1 .hl{transform:rotate(-.6deg)}
.who{font-size:17px;color:var(--body);margin:0 0 28px}
.go{display:flex;gap:24px;flex-wrap:wrap;font-weight:650;font-size:16px}
.sheet{padding:16px;border:1.5px solid var(--ink);background:var(--paper)}
.bubbles{display:grid;grid-template-columns:repeat(7,52px);gap:8px}
.b{width:52px;height:52px;border-radius:50%;border:1.5px solid var(--pen);padding:0;cursor:pointer;
background:radial-gradient(circle at 34% 30%,#fff 0 14%,var(--pen-wash) 15% 100%);-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.b:hover{background:radial-gradient(circle at 34% 30%,#fff 0 14%,#dfe5fb 15% 100%)}
.b[aria-pressed="true"]{background:var(--hl);border:1.5px dashed var(--ink);cursor:default;position:relative}
.b[aria-pressed="true"]::after{content:"";position:absolute;left:30%;right:30%;top:50%;border-top:1.5px solid var(--ink);transform:rotate(-18deg)}
.b.pop{animation:pop .14s ease-out}
@keyframes pop{from{transform:scale(.82)}to{transform:scale(1)}}
.sheet-foot{display:flex;justify-content:space-between;align-items:center;margin-top:12px}
.reset{font-family:var(--mono);font-size:13px;border:0;background:none;color:var(--pen);cursor:pointer;padding:6px 4px;text-decoration:underline;text-underline-offset:4px}
/* ---------- About ---------- */
.j{display:grid;grid-template-columns:176px minmax(0,600px);gap:8px 40px;padding:28px 0;border-bottom:1px solid var(--rule)}
.j:last-child{border-bottom:0}
.j .when{font-family:var(--mono);font-size:14px;color:var(--pen);font-weight:600;padding-top:5px}
.j h3{font-size:19px;line-height:1.5;margin:0 0 8px;letter-spacing:-.015em;font-weight:720}
.j h3 small{display:block;font-size:14.5px;font-weight:500;color:var(--sub);letter-spacing:0}
.j p{margin:0;color:var(--body)}
/* ---------- Playground ---------- */
.filters{display:flex;gap:8px;flex-wrap:wrap;margin:32px 0 32px}
.filters button{font:inherit;font-size:14.5px;font-weight:560;line-height:1.5;padding:6px 14px;border:1.5px solid var(--ink);background:var(--paper);color:var(--ink);cursor:pointer;min-height:40px}
.filters button .n{font-family:var(--mono);font-size:12px;color:var(--sub);margin-left:6px}
#tab-playground .filters button[aria-pressed="true"]{background:var(--hl)}
#tab-projects .filters button[aria-pressed="true"]{background:var(--pen);border-color:var(--pen);color:#fff}
#tab-projects .filters button[aria-pressed="true"] .n{color:#d5dcfa}
.toys{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 32px}
.toy{display:block;color:var(--ink);text-decoration:none}
.toy .pic{display:block;aspect-ratio:16/10;border:1.5px solid var(--ink);background:var(--paper) center/cover no-repeat;margin-bottom:12px}
.toy .pic.none{background:repeating-linear-gradient(135deg,var(--paper) 0 9px,var(--grid) 9px 10.5px);display:grid;place-items:center;font-family:var(--mono);font-size:12px;color:var(--sub)}
.toy b{font-size:17.5px;font-weight:720;letter-spacing:-.015em}
.toy b{padding:0 .2em;margin:0 -.2em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.toy:hover b{background:var(--stroke-b) no-repeat 50% 60%/100% 76%}
.toy .d{display:block;font-size:15px;line-height:1.65;color:var(--body);margin:4px 0 6px}
.toy .mono{display:block}
/* ---------- Projects ---------- */
.projs{display:flex;flex-direction:column;gap:24px}
.proj{background:var(--paper);border:1.5px solid var(--ink);border-top:5px solid var(--pen);padding:24px 28px 26px;display:grid;grid-template-columns:232px minmax(0,1fr);gap:8px 40px}
.proj h3{grid-column:1/-1;font-size:22px;margin:0 0 8px;letter-spacing:-.02em;line-height:1.4}
.proj dl{margin:0;font-size:15px;line-height:1.7}
.proj dt{font-family:var(--mono);font-size:12px;color:var(--sub);margin-top:10px}
.proj dt:first-child{margin-top:0}
.proj dd{margin:0;color:var(--ink);font-weight:560}
.proj .txt p{margin:0 0 10px;font-size:16px;color:var(--body);max-width:34em}
.proj .txt b{color:var(--pen)}
.links{list-style:none;margin:14px 0 0;padding:12px 0 0;border-top:1px dashed var(--rule);display:flex;gap:6px 22px;flex-wrap:wrap;font-size:15px;font-weight:600}
.links .no{color:var(--sub);font-weight:400}
/* ---------- Resume ---------- */
.pdf{display:inline-block;background:var(--pen);color:#fff;text-decoration:none;font-weight:650;font-size:15px;padding:10px 18px;margin-top:20px}
.pdf:hover{background:var(--pen-d);color:#fff}
.r{display:grid;grid-template-columns:176px minmax(0,600px);gap:4px 40px;padding:14px 0;border-bottom:1px solid var(--rule);font-size:16px;line-height:1.7}
.r .when{font-family:var(--mono);font-size:13.5px;color:var(--sub);padding-top:3px}
.r b{font-weight:700}
.r span{color:var(--body)}
.stack{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.stack li{font-family:var(--mono);font-size:13px;border:1px solid var(--ink);padding:3px 9px;line-height:1.6;background:var(--paper)}
/* ---------- Contact ---------- */
#tab-contact{padding-top:120px}
#tab-contact h1{font-size:60px;letter-spacing:-.04em;line-height:1.15;margin-bottom:48px}
.sayhi{font-size:19px;color:var(--body);margin:0}
.mail{font-size:32px;font-weight:760;letter-spacing:-.025em;line-height:1.4;overflow-wrap:anywhere}
.more{list-style:none;margin:40px 0 0;padding:0;font-size:16px;line-height:2.1}
.more .mono{display:inline-block;width:96px}
footer{border-top:1.5px solid var(--ink);background:var(--paper);padding:20px 0;font-size:13.5px;color:var(--sub)}
/* ---------- 모바일 ---------- */
@media (max-width:820px){
body{font-size:16px;line-height:1.75}
.wrap{padding:0 20px}
.top{position:static}
.top .wrap{flex-wrap:wrap;height:auto;gap:0;padding:0}
.id{padding:12px 20px;margin-right:auto}
.agent{margin-right:20px}
.tabs{order:3;width:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1.5px solid var(--ink)}
.tabs a{text-align:center;padding:11px 4px;font-size:14.5px;border-bottom:0;border-right:1px solid var(--rule);min-height:44px}
.tabs a:nth-child(3n){border-right:0}
.tabs a:nth-child(-n+3){border-bottom:1px solid var(--rule)}
.tabs a[aria-current="page"]{background:var(--pen);color:#fff}
.tabs a.play[aria-current="page"]{background:var(--hl);color:var(--ink)}
main>section{padding:44px 0 72px}
h1{font-size:30px}
h2{font-size:21px;margin-top:56px}
.lead{font-size:17px}
#tab-home{padding-top:44px}
.hero{grid-template-columns:1fr;gap:40px}
.hero h1{font-size:40px;margin:22px 0 28px}
.bubbles{grid-template-columns:repeat(6,1fr);gap:7px}
.b{width:100%;height:auto;aspect-ratio:1}
.j,.r{grid-template-columns:1fr;gap:2px}
.j{padding:24px 0}
.toys{grid-template-columns:1fr;gap:0}
.toy{display:grid;grid-template-columns:112px minmax(0,1fr);gap:14px;padding:16px 0;border-bottom:1px solid var(--rule)}
.toy .pic{margin:0}
.toy b{font-size:16.5px}
.toy .d{font-size:14.5px}
.proj{grid-template-columns:1fr;padding:20px 18px 22px}
.proj h3{font-size:20px}
.proj dl{display:grid;grid-template-columns:auto 1fr;gap:2px 14px;margin-bottom:12px}
.proj dt{margin-top:4px}
#tab-contact{padding-top:64px}
#tab-contact h1{font-size:38px;margin-bottom:36px}
.mail{font-size:21px}
}
@media (prefers-reduced-motion:reduce){.b.pop{animation:none}}
/* ================= v3: 다이어리 ================= */
:root{--hand:"Nanum Pen Script","Gaegu",var(--sans);--circle:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 48%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M15 27C11 13 38 5 66 5S112 11 109 25S86 43 57 43S9 41 12 23C14 13 29 8 46 6.5%22 fill=%22none%22 stroke=%22%231F3FD1%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 vector-effect=%22non-scaling-stroke%22 stroke-width=%222%22/%3E%3C/svg%3E");--under:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 200 12%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M3 7C40 3.5 80 9 120 5.5S180 4 197 7%22 fill=%22none%22 stroke=%22%231F3FD1%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 vector-effect=%22non-scaling-stroke%22 stroke-width=%222.2%22/%3E%3C/svg%3E");--under-ink:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 200 12%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M2 6C50 8.5 90 3.5 140 6.5S185 7 198 4.5%22 fill=%22none%22 stroke=%22%2316181D%22 stroke-linecap=%22round%22 vector-effect=%22non-scaling-stroke%22 stroke-width=%221.8%22/%3E%3C/svg%3E");--arrow:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 70%22 %3E%3Cpath d=%22M6 12C30 4 70 10 92 44%22 fill=%22none%22 stroke=%22%231F3FD1%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 vector-effect=%22non-scaling-stroke%22 stroke-width=%222.2%22/%3E%3Cpath d=%22M76 42L94 48L96 28%22 fill=%22none%22 stroke=%22%231F3FD1%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 vector-effect=%22non-scaling-stroke%22 stroke-width=%222.2%22/%3E%3C/svg%3E");--star:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 40%22 %3E%3Cpath d=%22M20 4L20 36M6 12L34 28M34 12L6 28%22 fill=%22none%22 stroke=%22%231F3FD1%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 vector-effect=%22non-scaling-stroke%22 stroke-width=%222.4%22/%3E%3C/svg%3E")}
.hand,.j .when,.r .when,#count,.reset,.toy .mono,.filters button .n,.proj dt,.more .mono{font-family:var(--hand);font-size:21px;line-height:1.2;letter-spacing:0}
.j .when{font-size:30px;padding-top:0;font-weight:400}
#tab-about h1 .hl{margin-left:-.05em} .r .when{font-size:24px;padding-top:0}
.toy .mono{font-size:22px;margin-top:2px} .filters button .n{font-size:19px} .proj dt{font-size:19px}
.reset{text-decoration:none;background:var(--under) no-repeat 50% 100%/100% 7px;padding-bottom:6px}
/* 손으로 그은 선: 테두리만 흔들리게 */
.rough,.sheet,.proj,.agent,.filters button,.stamp,.stack li{position:relative;border-color:transparent!important}
.sheet::before,.proj::before,.agent::before,.filters button::before,.stamp::before,.stack li::before{content:"";position:absolute;inset:-1px;border:1.6px solid var(--ink);filter:url(#rough);pointer-events:none}
.stamp::before{border-color:var(--pen)} .stack li::before{border-width:1.2px}
.proj::before{border-top:5px solid var(--pen)}
.top{border-bottom:0} .top::after{content:"";position:absolute;left:0;right:0;bottom:-5px;height:10px;background:var(--under-ink) no-repeat 0 50%/100% 100%}
footer{border-top:0;position:relative} footer::before{content:"";position:absolute;left:0;right:0;top:-5px;height:10px;background:var(--under-ink) no-repeat 0 50%/100% 100%}
h2{border-bottom:0;background:var(--under-ink) no-repeat 0 100%/100% 9px;padding-bottom:12px}
.j,.r{border-bottom:0;background:linear-gradient(90deg,var(--rule) 60%,transparent 0) repeat-x 0 100%/10px 1.5px}
.j:last-child{background:none}
/* 메뉴: 지금 탭은 파란 볼펜 동그라미 (모든 탭 같음) */
.tabs a{border-bottom:0;padding:9px 16px}
.tabs a[aria-current="page"],.tabs a.play[aria-current="page"]{color:var(--pen);background:var(--circle) no-repeat 50% 50%/100% 100%;border:0}
.agent:hover{background:var(--paper);color:var(--pen)}
/* 형광펜: 탭 맨 위 큰 제목의 한 구절에만 */
#tab-playground .filters button[aria-pressed="true"]{background:var(--paper)}
.filters button[aria-pressed="true"]::before{border:0;inset:-5px -8px;background:var(--circle) no-repeat 50% 50%/100% 100%;filter:none}
.filters button[aria-pressed="true"]{color:var(--pen)}
.toy:hover b{background:var(--under) no-repeat 50% 100%/100% 7px;color:var(--pen)}
.contact-hl{display:inline-block}
/* 스프링 구멍 + 여백선 (데스크톱만) */
@media (min-width:1180px){
body::before{content:"";position:fixed;left:26px;top:0;bottom:0;width:18px;z-index:20;pointer-events:none;
background:radial-gradient(circle,var(--paper) 0 5.5px,var(--sub) 5.5px 7px,transparent 7.5px) repeat-y 50% 12px/18px 72px}
body::after{content:"";position:fixed;left:72px;top:0;bottom:0;border-left:1.5px solid #f3b9c3;z-index:20;pointer-events:none}
}
/* 히어로 낙서 */
.hero>div:first-child{position:relative}
.hero h1{position:relative;width:fit-content}
.hero h1::after{content:"";position:absolute;right:-46px;top:-18px;width:34px;height:34px;background:var(--star) no-repeat 50%/contain;transform:rotate(12deg)}
.sheet{transform:rotate(1.2deg)}
.sheet::after,.tape{content:"";position:absolute;width:92px;height:26px;background:rgba(31,63,209,.16);left:50%;top:-14px;transform:translateX(-50%) rotate(-3deg)}
.doodle-arrow{position:absolute;right:-8px;bottom:-34px;width:104px;height:62px;background:var(--arrow) no-repeat 50%/contain;pointer-events:none}
/* Playground: 테이프로 붙인 사진 */
.toy .pic{position:relative;border-width:1.5px}
.toy .pic::after{content:"";position:absolute;width:64px;height:20px;background:rgba(31,63,209,.16);left:50%;top:-11px;transform:translateX(-50%) rotate(-4deg)}
.toy:nth-child(3n+1) .pic{transform:rotate(-.9deg)} .toy:nth-child(3n+2) .pic{transform:rotate(.7deg)} .toy:nth-child(3n) .pic{transform:rotate(-.4deg)}
.toy:nth-child(2n) .pic::after{transform:translateX(-50%) rotate(3deg);left:42%}
.proj:nth-child(odd){transform:rotate(-.25deg)} .proj:nth-child(even){transform:rotate(.3deg)}
.mail{text-decoration:none;background:var(--under) no-repeat 50% 100%/100% 9px;padding-bottom:8px}
@media (max-width:820px){
.top::after{display:none} .top{border-bottom:1.5px solid var(--ink)}
.tabs a{padding:11px 4px}
.tabs a[aria-current="page"],.tabs a.play[aria-current="page"]{background:var(--circle) no-repeat 50% 50%/78% 84%;color:var(--pen)}
.hero h1::after{right:-6px;top:-30px;width:26px;height:26px}
.doodle-arrow{right:20px;bottom:-40px;transform:rotate(58deg);width:70px;height:44px}
.toy .pic::after{width:40px;height:14px;top:-8px}
.hand{font-size:22px} .j .when{font-size:27px}
}
/* ===== v3b: 업무 다이어리 쪽으로 (귀여운 요소 빼기) ===== */
:root{--hand:"Caveat",var(--mono)}
body::after{border-left-color:#c3cbe6!important}
.hero h1::after{display:none}
.sheet::after,.toy .pic::after{display:none}
.sheet{transform:none}
.toy .pic,.toy:nth-child(n) .pic,.proj:nth-child(n){transform:none}
/* 손글씨는 날짜·숫자에만. 한글 분류·라벨은 원래 글꼴로 */
.toy .mono,.proj dt,.more .mono{font-family:var(--mono);font-size:13px;line-height:1.5}
.j .when{font-size:27px;font-weight:600} .r .when{font-size:22px;font-weight:500;color:var(--body)}
#count{font-size:22px} .reset{font-size:22px} .filters button .n{font-size:19px;font-weight:600}
.doodle-arrow{opacity:.9}
@media (max-width:820px){.doodle-arrow{display:none}
.tabs a{border-right:1px solid var(--rule)} .tabs a:nth-child(3n){border-right:0} .tabs a:nth-child(-n+3){border-bottom:1px solid var(--rule)}
.j .when{font-size:25px}}
/* ===== v3c: 손글씨 글꼴 없음. 날짜·숫자는 고정폭(IBM Plex Mono). 직함은 상자 없이 한 줄 ===== */
:root{--mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;--hand:var(--mono)}
.j .when{font-family:var(--mono);font-size:15px;font-weight:500;line-height:1.8;padding-top:3px;letter-spacing:-.01em}
.r .when{font-family:var(--mono);font-size:14px;font-weight:400;line-height:1.8;padding-top:2px;color:var(--sub)}
#count,.reset{font-family:var(--mono);font-size:13.5px;font-weight:500}
.filters button .n{font-family:var(--mono);font-size:12.5px;font-weight:500}
.role{margin:0;font-size:18px;font-weight:600;color:var(--ink);letter-spacing:-.01em}
.role span{color:var(--sub);margin:0 .15em} .role b{font-weight:600;color:var(--pen)}
.hero h1{margin:18px 0 44px}
body.fb{--sans:"IBM Plex Sans KR",-apple-system,"Apple SD Gothic Neo",sans-serif;font-family:var(--sans)}
body.fb h1{font-weight:700;letter-spacing:-.035em} body.fb .hero h1{letter-spacing:-.045em}
body.fb h2,body.fb .j h3,body.fb .toy b,body.fb .proj h3,body.fb .id{font-weight:700}
body.fb .tabs a{font-weight:500} body.fb .tabs a[aria-current="page"]{font-weight:600}
@media (max-width:820px){.role{font-size:16.5px} .hero h1{margin:14px 0 32px} .j .when{font-size:14.5px}}
/* ===== v3d: 업무 노트 낙서 — 뜻이 있는 표시만 ===== */
:root{--ck-done:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 28 28%22%3E%3Cpath d=%22M5.5 7.2C10 6.6 16 6.9 20.6 6.5C21 11 20.7 16 21.2 20.8C16 21.4 10.5 21 5.9 21.5C5.4 16.5 5.8 12 5.5 7.2Z%22 fill=%22%23fff%22 stroke=%22%2316181D%22 stroke-width=%221.5%22 stroke-linejoin=%22round%22/%3E%3Cpath d=%22M8.5 13.5C10.3 15.6 11.6 17.4 12.6 19.2C15.6 12.6 19.8 7 25.5 2.8%22 fill=%22none%22 stroke=%22%231F3FD1%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E");--ck-open:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 28 28%22%3E%3Cpath d=%22M5.5 7.2C10 6.6 16 6.9 20.6 6.5C21 11 20.7 16 21.2 20.8C16 21.4 10.5 21 5.9 21.5C5.4 16.5 5.8 12 5.5 7.2Z%22 fill=%22%23fff%22 stroke=%22%2316181D%22 stroke-width=%221.5%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E");--tick:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 28 28%22%3E%3Cpath d=%22M5 14.5C7.4 17 9.2 19.4 10.6 21.8C14 13.6 18.6 7.6 24.5 3.4%22 fill=%22none%22 stroke=%22%231F3FD1%22 stroke-width=%222.4%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E");--arr:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 44 28%22%3E%3Cpath d=%22M3 15.5C12 13.2 24 14.6 38 13.6M29 6.5C32.6 9 35.8 11.4 39 13.6C35.6 16.4 32.6 19.4 30 22.6%22 fill=%22none%22 stroke=%22%231F3FD1%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E");--brace:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 14 100%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M11 2C5.5 3 4.5 6 5 12L5.6 88C6 94 6 97 11.5 98%22 fill=%22none%22 stroke=%22%231F3FD1%22 stroke-width=%222%22 stroke-linecap=%22round%22 vector-effect=%22non-scaling-stroke%22/%3E%3C/svg%3E")}
/* 상자 테두리는 반듯하게(끊김 없앰). 손맛은 구분선·동그라미·밑줄·체크에서 */
.sheet::before,.proj::before,.agent::before,.filters button::before,.stack li::before{filter:none}
/* Journey: 끝난 일은 체크, 하고 있는 일은 빈 칸 */
.j .when{display:flex;align-items:flex-start;gap:8px}
.j .when::before{content:"";flex:none;width:24px;height:24px;margin-top:1px;background:var(--ck-done) no-repeat 50%/contain}
.j.open .when::before{background-image:var(--ck-open)}
/* Resume 자격증: 딴 것에 체크 */
.r.ck b::before{content:"";display:inline-block;width:20px;height:20px;margin:0 8px -3px 0;background:var(--tick) no-repeat 50%/contain}
/* About 요약: 옆에 볼펜 괄호 */
#tab-about .lead{position:relative;padding-left:22px}
#tab-about .lead::before{content:"";position:absolute;left:0;top:2px;bottom:2px;width:12px;background:var(--brace) no-repeat 0 0/100% 100%}
/* Contact: 이메일 앞 화살표 */
.mail::before{content:"";display:inline-block;width:.95em;height:.6em;margin-right:.3em;background:var(--arr) no-repeat 50%/contain}
/* 구역 제목 밑줄을 두 번 그은 줄로 */
h2{background:var(--under-ink) no-repeat 0 100%/100% 9px,var(--under-ink) no-repeat 6px calc(100% + 1px)/38% 9px;padding-bottom:16px}
/* ===== v3e: 양옆 여백 낙서 + Contact 세 줄 같은 급 ===== */
.side{position:fixed;top:50%;width:200px;height:760px;max-height:calc(100vh - 110px);transform:translateY(-46%);pointer-events:none;z-index:1;display:none}
.side-l{right:calc(50% + 540px + 28px)} .side-r{left:calc(50% + 540px + 28px)}
@media (min-width:1560px){.side{display:block}}
@media (min-width:1560px) and (max-width:1659px){.side{width:140px} .side-l{right:calc(50% + 540px + 20px)} .side-r{left:calc(50% + 540px + 20px)}}
.sayhi{margin:0 0 20px}
.ways{list-style:none;margin:0;padding:0;max-width:640px}
.ways li{display:grid;grid-template-columns:28px 96px minmax(0,1fr);align-items:center;gap:0 14px;padding:16px 0;background:linear-gradient(90deg,var(--rule) 60%,transparent 0) repeat-x 0 100%/10px 1.5px}
.ways li:last-child{background:none}
.ways .ic{width:24px;height:24px;color:var(--ink)}
.ways .k{font-family:var(--mono);font-size:13.5px;color:var(--sub)}
.ways a{font-size:20px;font-weight:600;letter-spacing:-.015em;overflow-wrap:anywhere;width:fit-content;text-decoration:none;background:var(--under) no-repeat 50% 100%/100% 7px;padding-bottom:5px}
.ways .todo{width:fit-content}
@media (max-width:820px){.ways li{grid-template-columns:24px minmax(0,1fr);gap:2px 12px;padding:14px 0} .ways .ic{width:22px;height:22px;grid-row:1/3;align-self:start;margin-top:3px} .ways .k{grid-column:2} .ways a,.ways .todo{grid-column:2;font-size:17px}}
/* ===== v3f: 형광펜 네 색 — 노랑(나를 말하는 문장) · 초록(이야기) · 주황(놀이) · 하늘(일) ===== */
:root{--hl-green:#B6EE8A;--hl-orange:#FFC27D;--hl-sky:#A8DBFF;--stroke-a-green:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M6 9C40 6 92 8.4 150 6.6S252 5 296 7.2L292 33C240 35.6 180 33 120 34.6S40 35.2 3 33.4Z%22 fill=%22%23B6EE8A%22/%3E%3Cpath d=%22M6 9C11 8.6 16 8.4 21 8.3L18 34.7C13 34.5 8 34 3 33.4Z%22 fill=%22%238FD45A%22 opacity=%22.28%22/%3E%3Cpath d=%22M281 6.2C286 6.5 291 6.8 296 7.2L292 33C288 33.3 283 33.6 278 33.8Z%22 fill=%22%238FD45A%22 opacity=%22.2%22/%3E%3Cpath d=%22M28 21C100 19.2 200 22 276 19.6%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.3%22 opacity=%22.3%22/%3E%3C/svg%3E");--stroke-a-orange:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M6 9C40 6 92 8.4 150 6.6S252 5 296 7.2L292 33C240 35.6 180 33 120 34.6S40 35.2 3 33.4Z%22 fill=%22%23FFC27D%22/%3E%3Cpath d=%22M6 9C11 8.6 16 8.4 21 8.3L18 34.7C13 34.5 8 34 3 33.4Z%22 fill=%22%23F5A040%22 opacity=%22.28%22/%3E%3Cpath d=%22M281 6.2C286 6.5 291 6.8 296 7.2L292 33C288 33.3 283 33.6 278 33.8Z%22 fill=%22%23F5A040%22 opacity=%22.2%22/%3E%3Cpath d=%22M28 21C100 19.2 200 22 276 19.6%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.3%22 opacity=%22.3%22/%3E%3C/svg%3E");--stroke-a-sky:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M6 9C40 6 92 8.4 150 6.6S252 5 296 7.2L292 33C240 35.6 180 33 120 34.6S40 35.2 3 33.4Z%22 fill=%22%23A8DBFF%22/%3E%3Cpath d=%22M6 9C11 8.6 16 8.4 21 8.3L18 34.7C13 34.5 8 34 3 33.4Z%22 fill=%22%237CC2F5%22 opacity=%22.28%22/%3E%3Cpath d=%22M281 6.2C286 6.5 291 6.8 296 7.2L292 33C288 33.3 283 33.6 278 33.8Z%22 fill=%22%237CC2F5%22 opacity=%22.2%22/%3E%3Cpath d=%22M28 21C100 19.2 200 22 276 19.6%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.3%22 opacity=%22.3%22/%3E%3C/svg%3E");--stroke-b-green:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M4 7.6C60 9.6 110 6 170 8S250 9.4 297 6L294 31.4C250 34.4 190 32 130 33.6S50 31.6 2 34Z%22 fill=%22%23B6EE8A%22/%3E%3Cpath d=%22M4 7.6C10 7.9 16 8.1 24 8.2L21 33C14 33.2 8 33.6 2 34Z%22 fill=%22%238FD45A%22 opacity=%22.26%22/%3E%3Cpath d=%22M40 14C120 15.6 210 13 284 14.4%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.1%22 opacity=%22.28%22/%3E%3C/svg%3E");--stroke-b-orange:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M4 7.6C60 9.6 110 6 170 8S250 9.4 297 6L294 31.4C250 34.4 190 32 130 33.6S50 31.6 2 34Z%22 fill=%22%23FFC27D%22/%3E%3Cpath d=%22M4 7.6C10 7.9 16 8.1 24 8.2L21 33C14 33.2 8 33.6 2 34Z%22 fill=%22%23F5A040%22 opacity=%22.26%22/%3E%3Cpath d=%22M40 14C120 15.6 210 13 284 14.4%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.1%22 opacity=%22.28%22/%3E%3C/svg%3E");--stroke-b-sky:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M4 7.6C60 9.6 110 6 170 8S250 9.4 297 6L294 31.4C250 34.4 190 32 130 33.6S50 31.6 2 34Z%22 fill=%22%23A8DBFF%22/%3E%3Cpath d=%22M4 7.6C10 7.9 16 8.1 24 8.2L21 33C14 33.2 8 33.6 2 34Z%22 fill=%22%237CC2F5%22 opacity=%22.26%22/%3E%3Cpath d=%22M40 14C120 15.6 210 13 284 14.4%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.1%22 opacity=%22.28%22/%3E%3C/svg%3E");}
#tab-about .hl{background-image:var(--stroke-b-green)}
#tab-playground .hl{background-image:var(--stroke-b-orange)}
#tab-projects .hl{background-image:var(--stroke-a-sky)}
#tab-resume .hl{background-image:var(--stroke-b-sky)}
.b[aria-pressed="true"]:nth-child(4n+2){background:var(--hl-green)}
.b[aria-pressed="true"]:nth-child(4n+3){background:var(--hl-orange)}
.b[aria-pressed="true"]:nth-child(4n){background:var(--hl-sky)}
/* ===== v3g: 양옆 낙서 다시 그림 (업무 스케치) ===== */
.side{width:220px;height:860px;max-height:calc(100vh - 96px);top:calc(50% + 32px);transform:translateY(-50%)}
.side-l{right:calc(50% + 540px + 30px)} .side-r{left:calc(50% + 540px + 30px)}
@media (min-width:1560px) and (max-width:1699px){.side{width:150px} .side-l{right:calc(50% + 540px + 16px)} .side-r{left:calc(50% + 540px + 16px)}}
footer{z-index:2}
/* 바닥글을 화면 맨 아래로: 짧은 탭에서 낙서가 바닥선에 걸치지 않게 */
@media (min-width:821px){main{min-height:calc(100vh - 64px - 66px)} .side{max-height:calc(100vh - 180px);top:calc(50% - 4px)}}
/* ===== v3i: 낙서를 크기 섞어 겹치고, 화면 밖으로 잘리게. 스프링 구멍·여백선 없음 ===== */
body::before,body::after{display:none!important}
html,body{overflow-x:hidden}
.side{display:none;width:560px;height:1040px;max-height:none;top:60px;transform:none;overflow:visible}
.side-l{right:calc(50% + 540px + 36px);left:auto} .side-r{left:calc(50% + 540px + 36px);right:auto}
@media (min-width:1180px){.side{display:block}}
@media (min-width:1560px) and (max-width:1699px){.side{width:560px} .side-l{right:calc(50% + 540px + 36px)} .side-r{left:calc(50% + 540px + 36px)}}
@media (min-width:821px){.side{max-height:none;top:60px}}
/* ===== v3j: 형광펜은 탭 제목 한 구절에만(이전 규칙). 색은 탭마다 다름 =====
Home 노랑 · About 초록 · Playground 주황 · Projects 하늘 · Resume 보라 · Contact 분홍 */
:root{--hl-pink:#FFB8C6;--hl-violet:#D6C6FF;--stroke-a-pink:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M6 9C40 6 92 8.4 150 6.6S252 5 296 7.2L292 33C240 35.6 180 33 120 34.6S40 35.2 3 33.4Z%22 fill=%22%23FFB8C6%22/%3E%3Cpath d=%22M6 9C11 8.6 16 8.4 21 8.3L18 34.7C13 34.5 8 34 3 33.4Z%22 fill=%22%23F58CA3%22 opacity=%22.28%22/%3E%3Cpath d=%22M281 6.2C286 6.5 291 6.8 296 7.2L292 33C288 33.3 283 33.6 278 33.8Z%22 fill=%22%23F58CA3%22 opacity=%22.2%22/%3E%3Cpath d=%22M28 21C100 19.2 200 22 276 19.6%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.3%22 opacity=%22.3%22/%3E%3C/svg%3E");--stroke-a-violet:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M6 9C40 6 92 8.4 150 6.6S252 5 296 7.2L292 33C240 35.6 180 33 120 34.6S40 35.2 3 33.4Z%22 fill=%22%23D6C6FF%22/%3E%3Cpath d=%22M6 9C11 8.6 16 8.4 21 8.3L18 34.7C13 34.5 8 34 3 33.4Z%22 fill=%22%23B49CF5%22 opacity=%22.28%22/%3E%3Cpath d=%22M281 6.2C286 6.5 291 6.8 296 7.2L292 33C288 33.3 283 33.6 278 33.8Z%22 fill=%22%23B49CF5%22 opacity=%22.2%22/%3E%3Cpath d=%22M28 21C100 19.2 200 22 276 19.6%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.3%22 opacity=%22.3%22/%3E%3C/svg%3E");--stroke-b-pink:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M4 7.6C60 9.6 110 6 170 8S250 9.4 297 6L294 31.4C250 34.4 190 32 130 33.6S50 31.6 2 34Z%22 fill=%22%23FFB8C6%22/%3E%3Cpath d=%22M4 7.6C10 7.9 16 8.1 24 8.2L21 33C14 33.2 8 33.6 2 34Z%22 fill=%22%23F58CA3%22 opacity=%22.26%22/%3E%3Cpath d=%22M40 14C120 15.6 210 13 284 14.4%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.1%22 opacity=%22.28%22/%3E%3C/svg%3E");--stroke-b-violet:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M4 7.6C60 9.6 110 6 170 8S250 9.4 297 6L294 31.4C250 34.4 190 32 130 33.6S50 31.6 2 34Z%22 fill=%22%23D6C6FF%22/%3E%3Cpath d=%22M4 7.6C10 7.9 16 8.1 24 8.2L21 33C14 33.2 8 33.6 2 34Z%22 fill=%22%23B49CF5%22 opacity=%22.26%22/%3E%3Cpath d=%22M40 14C120 15.6 210 13 284 14.4%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.1%22 opacity=%22.28%22/%3E%3C/svg%3E");}
#tab-resume .hl{background-image:var(--stroke-b-violet)}
#tab-contact .hl{background-image:var(--stroke-a-pink)}
/* ===== v3k: 정신없음을 줄이는 비교안 (주소에 ?v=blur / sheet / pencil / few / cover) ===== */
.side.few{display:none!important}
body.v-few .side:not(.few){display:none!important}
@media (min-width:1180px){body.v-few .side.few{display:block!important}}
body.v-pencil .side{filter:grayscale(1);opacity:.34}
body.v-cover:not([data-tab="home"]) .side{display:none!important}
body.v-mix:not([data-tab="home"]) .side{filter:grayscale(1);opacity:.34}
/* 낙서를 본문 뒤까지 깔기 */
body.v-blur .side-l,body.v-sheet .side-l{right:calc(50% + 540px - 250px)}
body.v-blur .side-r,body.v-sheet .side-r{left:calc(50% + 540px - 250px)}
body.v-blur .side,body.v-sheet .side{z-index:0}
body.v-blur main,body.v-sheet main{position:relative;z-index:1}
body.v-blur main .wrap{background:rgba(255,255,255,.62);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);padding-top:40px;padding-bottom:56px;margin-top:-40px}
body.v-sheet{background-color:#f1f3f8;background-image:none}
body.v-sheet main .wrap{background-color:#fff;background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:24px 24px;border-left:1.5px solid var(--ink);border-right:1.5px solid var(--ink);padding-top:72px;padding-bottom:96px;min-height:calc(100vh - 130px)}
body.v-sheet main>section{padding:0}
/* ===== v3l: C안(연필) 확정 + 점검에서 나온 흠 6개 ===== */
/* 1) 낙서: 펜 선은 회색 연필, 형광펜 줄은 아주 옅은 색으로 */
.side{filter:none!important;opacity:1!important}
.side path:not([style]),.side circle{stroke:#8d93a1;opacity:.5}
.side path[style]{opacity:.3!important}
/* 3) 메뉴 동그라미가 글자를 가리지 않게 바깥으로 */
@media (min-width:821px){
.tabs a{position:relative}
.tabs a[aria-current="page"],.tabs a.play[aria-current="page"]{background:none}
.tabs a[aria-current="page"]::after{content:"";position:absolute;inset:-3px -7px;background:var(--circle) no-repeat 50% 50%/100% 100%;pointer-events:none}
}
/* 4) 구역 제목 밑줄은 한 줄로 */
h2{background:var(--under-ink) no-repeat 0 100%/100% 9px;padding-bottom:12px}
/* 5) 큰 제목 자간 */
.hero h1{letter-spacing:-.03em} #tab-contact h1{letter-spacing:-.028em}
/* 6) Home은 화면 가운데로 */
@media (min-width:821px){
body[data-tab="home"] #tab-home,.js body[data-tab="home"] #tab-home{display:flex;align-items:center;min-height:calc(100vh - 64px - 66px);padding:32px 0}
#tab-home>.wrap{width:100%}
}
/* ===== v3m: Home 두 줄 모두 형광펜 + 들어올 때 한 번 그어지는 움직임 / About 제목 전체 형광펜 ===== */
#tab-about h1 .hl{margin-left:-.22em}
.hero h1 .hl{background:none;position:relative;z-index:0}
.hero h1 .hl.s2{transform:rotate(.4deg)}
.hero h1 .hl::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--stroke-a) no-repeat 50% 62%/100% 78%}
.hero h1 .hl.s2::before{background-image:var(--stroke-b)}
@keyframes hl-draw{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 -2% 0 0)}}
body.intro .hero h1 .hl::before{animation:hl-draw .55s cubic-bezier(.3,.1,.3,1) .95s both}
body.intro .hero h1 .hl.s2::before{animation-delay:.3s}
body.v-mid .hero h1 .hl::before{animation-delay:-.3s!important;animation-play-state:paused!important}
body.v-mid .hero h1 .hl.s2::before{animation-delay:-.55s!important}
@media (prefers-reduced-motion:reduce){body.intro .hero h1 .hl::before{animation:none}}
/* ===== v3n: 형광펜을 비치게(불투명도 0.7) + 양 끝에 잉크 맺힘 ===== */
:root{--stroke-a:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M6 9C40 6 92 8.4 150 6.6S252 5 296 7.2L292 33C240 35.6 180 33 120 34.6S40 35.2 3 33.4Z%22 fill=%22%23FFE14D%22 fill-opacity=%22.7%22/%3E%3Cpath d=%22M6 9C12 8.6 18 8.4 25 8.3L22 34.8C15 34.5 9 34 3 33.4Z%22 fill=%22%23E3B800%22 fill-opacity=%22.22%22/%3E%3Cpath d=%22M6 9C8 8.85 10 8.7 12.5 8.6L9.5 34C7 33.8 5 33.6 3 33.4Z%22 fill=%22%23E3B800%22 fill-opacity=%22.5%22/%3E%3Cpath d=%22M274 6C281 6.3 289 6.7 296 7.2L292 33C285 33.5 278 33.8 270 34Z%22 fill=%22%23E3B800%22 fill-opacity=%22.26%22/%3E%3Cpath d=%22M288.5 6.7C291 6.85 293.5 7 296 7.2L292 33C289.5 33.2 287 33.3 284.5 33.4Z%22 fill=%22%23E3B800%22 fill-opacity=%22.62%22/%3E%3Cpath d=%22M28 21C100 19.2 200 22 270 19.6%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.3%22 opacity=%22.28%22/%3E%3C/svg%3E");--stroke-b:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M4 7.6C60 9.6 110 6 170 8S250 9.4 297 6L294 31.4C250 34.4 190 32 130 33.6S50 31.6 2 34Z%22 fill=%22%23FFE14D%22 fill-opacity=%22.7%22/%3E%3Cpath d=%22M4 7.6C10 7.9 17 8.1 24 8.2L21 33C14 33.2 8 33.6 2 34Z%22 fill=%22%23E3B800%22 fill-opacity=%22.22%22/%3E%3Cpath d=%22M4 7.6C6.5 7.7 9 7.8 11.5 7.9L9.5 33.7C7 33.8 4.5 33.9 2 34Z%22 fill=%22%23E3B800%22 fill-opacity=%22.5%22/%3E%3Cpath d=%22M275 7.4C282 7 290 6.5 297 6L294 31.4C287 31.9 279 32.3 272 32.6Z%22 fill=%22%23E3B800%22 fill-opacity=%22.26%22/%3E%3Cpath d=%22M289 6.5C291.5 6.35 294.5 6.2 297 6L294 31.4C291.5 31.6 288.5 31.75 286 31.9Z%22 fill=%22%23E3B800%22 fill-opacity=%22.62%22/%3E%3Cpath d=%22M40 14C120 15.6 210 13 272 14.4%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.1%22 opacity=%22.26%22/%3E%3C/svg%3E");--stroke-a-green:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M6 9C40 6 92 8.4 150 6.6S252 5 296 7.2L292 33C240 35.6 180 33 120 34.6S40 35.2 3 33.4Z%22 fill=%22%23B6EE8A%22 fill-opacity=%22.7%22/%3E%3Cpath d=%22M6 9C12 8.6 18 8.4 25 8.3L22 34.8C15 34.5 9 34 3 33.4Z%22 fill=%22%237CC548%22 fill-opacity=%22.22%22/%3E%3Cpath d=%22M6 9C8 8.85 10 8.7 12.5 8.6L9.5 34C7 33.8 5 33.6 3 33.4Z%22 fill=%22%237CC548%22 fill-opacity=%22.5%22/%3E%3Cpath d=%22M274 6C281 6.3 289 6.7 296 7.2L292 33C285 33.5 278 33.8 270 34Z%22 fill=%22%237CC548%22 fill-opacity=%22.26%22/%3E%3Cpath d=%22M288.5 6.7C291 6.85 293.5 7 296 7.2L292 33C289.5 33.2 287 33.3 284.5 33.4Z%22 fill=%22%237CC548%22 fill-opacity=%22.62%22/%3E%3Cpath d=%22M28 21C100 19.2 200 22 270 19.6%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.3%22 opacity=%22.28%22/%3E%3C/svg%3E");--stroke-b-green:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M4 7.6C60 9.6 110 6 170 8S250 9.4 297 6L294 31.4C250 34.4 190 32 130 33.6S50 31.6 2 34Z%22 fill=%22%23B6EE8A%22 fill-opacity=%22.7%22/%3E%3Cpath d=%22M4 7.6C10 7.9 17 8.1 24 8.2L21 33C14 33.2 8 33.6 2 34Z%22 fill=%22%237CC548%22 fill-opacity=%22.22%22/%3E%3Cpath d=%22M4 7.6C6.5 7.7 9 7.8 11.5 7.9L9.5 33.7C7 33.8 4.5 33.9 2 34Z%22 fill=%22%237CC548%22 fill-opacity=%22.5%22/%3E%3Cpath d=%22M275 7.4C282 7 290 6.5 297 6L294 31.4C287 31.9 279 32.3 272 32.6Z%22 fill=%22%237CC548%22 fill-opacity=%22.26%22/%3E%3Cpath d=%22M289 6.5C291.5 6.35 294.5 6.2 297 6L294 31.4C291.5 31.6 288.5 31.75 286 31.9Z%22 fill=%22%237CC548%22 fill-opacity=%22.62%22/%3E%3Cpath d=%22M40 14C120 15.6 210 13 272 14.4%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.1%22 opacity=%22.26%22/%3E%3C/svg%3E");--stroke-a-orange:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M6 9C40 6 92 8.4 150 6.6S252 5 296 7.2L292 33C240 35.6 180 33 120 34.6S40 35.2 3 33.4Z%22 fill=%22%23FFC27D%22 fill-opacity=%22.7%22/%3E%3Cpath d=%22M6 9C12 8.6 18 8.4 25 8.3L22 34.8C15 34.5 9 34 3 33.4Z%22 fill=%22%23EE9330%22 fill-opacity=%22.22%22/%3E%3Cpath d=%22M6 9C8 8.85 10 8.7 12.5 8.6L9.5 34C7 33.8 5 33.6 3 33.4Z%22 fill=%22%23EE9330%22 fill-opacity=%22.5%22/%3E%3Cpath d=%22M274 6C281 6.3 289 6.7 296 7.2L292 33C285 33.5 278 33.8 270 34Z%22 fill=%22%23EE9330%22 fill-opacity=%22.26%22/%3E%3Cpath d=%22M288.5 6.7C291 6.85 293.5 7 296 7.2L292 33C289.5 33.2 287 33.3 284.5 33.4Z%22 fill=%22%23EE9330%22 fill-opacity=%22.62%22/%3E%3Cpath d=%22M28 21C100 19.2 200 22 270 19.6%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.3%22 opacity=%22.28%22/%3E%3C/svg%3E");--stroke-b-orange:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M4 7.6C60 9.6 110 6 170 8S250 9.4 297 6L294 31.4C250 34.4 190 32 130 33.6S50 31.6 2 34Z%22 fill=%22%23FFC27D%22 fill-opacity=%22.7%22/%3E%3Cpath d=%22M4 7.6C10 7.9 17 8.1 24 8.2L21 33C14 33.2 8 33.6 2 34Z%22 fill=%22%23EE9330%22 fill-opacity=%22.22%22/%3E%3Cpath d=%22M4 7.6C6.5 7.7 9 7.8 11.5 7.9L9.5 33.7C7 33.8 4.5 33.9 2 34Z%22 fill=%22%23EE9330%22 fill-opacity=%22.5%22/%3E%3Cpath d=%22M275 7.4C282 7 290 6.5 297 6L294 31.4C287 31.9 279 32.3 272 32.6Z%22 fill=%22%23EE9330%22 fill-opacity=%22.26%22/%3E%3Cpath d=%22M289 6.5C291.5 6.35 294.5 6.2 297 6L294 31.4C291.5 31.6 288.5 31.75 286 31.9Z%22 fill=%22%23EE9330%22 fill-opacity=%22.62%22/%3E%3Cpath d=%22M40 14C120 15.6 210 13 272 14.4%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.1%22 opacity=%22.26%22/%3E%3C/svg%3E");--stroke-a-sky:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M6 9C40 6 92 8.4 150 6.6S252 5 296 7.2L292 33C240 35.6 180 33 120 34.6S40 35.2 3 33.4Z%22 fill=%22%23A8DBFF%22 fill-opacity=%22.7%22/%3E%3Cpath d=%22M6 9C12 8.6 18 8.4 25 8.3L22 34.8C15 34.5 9 34 3 33.4Z%22 fill=%22%2362B4EE%22 fill-opacity=%22.22%22/%3E%3Cpath d=%22M6 9C8 8.85 10 8.7 12.5 8.6L9.5 34C7 33.8 5 33.6 3 33.4Z%22 fill=%22%2362B4EE%22 fill-opacity=%22.5%22/%3E%3Cpath d=%22M274 6C281 6.3 289 6.7 296 7.2L292 33C285 33.5 278 33.8 270 34Z%22 fill=%22%2362B4EE%22 fill-opacity=%22.26%22/%3E%3Cpath d=%22M288.5 6.7C291 6.85 293.5 7 296 7.2L292 33C289.5 33.2 287 33.3 284.5 33.4Z%22 fill=%22%2362B4EE%22 fill-opacity=%22.62%22/%3E%3Cpath d=%22M28 21C100 19.2 200 22 270 19.6%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.3%22 opacity=%22.28%22/%3E%3C/svg%3E");--stroke-b-sky:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M4 7.6C60 9.6 110 6 170 8S250 9.4 297 6L294 31.4C250 34.4 190 32 130 33.6S50 31.6 2 34Z%22 fill=%22%23A8DBFF%22 fill-opacity=%22.7%22/%3E%3Cpath d=%22M4 7.6C10 7.9 17 8.1 24 8.2L21 33C14 33.2 8 33.6 2 34Z%22 fill=%22%2362B4EE%22 fill-opacity=%22.22%22/%3E%3Cpath d=%22M4 7.6C6.5 7.7 9 7.8 11.5 7.9L9.5 33.7C7 33.8 4.5 33.9 2 34Z%22 fill=%22%2362B4EE%22 fill-opacity=%22.5%22/%3E%3Cpath d=%22M275 7.4C282 7 290 6.5 297 6L294 31.4C287 31.9 279 32.3 272 32.6Z%22 fill=%22%2362B4EE%22 fill-opacity=%22.26%22/%3E%3Cpath d=%22M289 6.5C291.5 6.35 294.5 6.2 297 6L294 31.4C291.5 31.6 288.5 31.75 286 31.9Z%22 fill=%22%2362B4EE%22 fill-opacity=%22.62%22/%3E%3Cpath d=%22M40 14C120 15.6 210 13 272 14.4%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.1%22 opacity=%22.26%22/%3E%3C/svg%3E");--stroke-a-violet:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M6 9C40 6 92 8.4 150 6.6S252 5 296 7.2L292 33C240 35.6 180 33 120 34.6S40 35.2 3 33.4Z%22 fill=%22%23D6C6FF%22 fill-opacity=%22.7%22/%3E%3Cpath d=%22M6 9C12 8.6 18 8.4 25 8.3L22 34.8C15 34.5 9 34 3 33.4Z%22 fill=%22%23A589F0%22 fill-opacity=%22.22%22/%3E%3Cpath d=%22M6 9C8 8.85 10 8.7 12.5 8.6L9.5 34C7 33.8 5 33.6 3 33.4Z%22 fill=%22%23A589F0%22 fill-opacity=%22.5%22/%3E%3Cpath d=%22M274 6C281 6.3 289 6.7 296 7.2L292 33C285 33.5 278 33.8 270 34Z%22 fill=%22%23A589F0%22 fill-opacity=%22.26%22/%3E%3Cpath d=%22M288.5 6.7C291 6.85 293.5 7 296 7.2L292 33C289.5 33.2 287 33.3 284.5 33.4Z%22 fill=%22%23A589F0%22 fill-opacity=%22.62%22/%3E%3Cpath d=%22M28 21C100 19.2 200 22 270 19.6%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.3%22 opacity=%22.28%22/%3E%3C/svg%3E");--stroke-b-violet:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M4 7.6C60 9.6 110 6 170 8S250 9.4 297 6L294 31.4C250 34.4 190 32 130 33.6S50 31.6 2 34Z%22 fill=%22%23D6C6FF%22 fill-opacity=%22.7%22/%3E%3Cpath d=%22M4 7.6C10 7.9 17 8.1 24 8.2L21 33C14 33.2 8 33.6 2 34Z%22 fill=%22%23A589F0%22 fill-opacity=%22.22%22/%3E%3Cpath d=%22M4 7.6C6.5 7.7 9 7.8 11.5 7.9L9.5 33.7C7 33.8 4.5 33.9 2 34Z%22 fill=%22%23A589F0%22 fill-opacity=%22.5%22/%3E%3Cpath d=%22M275 7.4C282 7 290 6.5 297 6L294 31.4C287 31.9 279 32.3 272 32.6Z%22 fill=%22%23A589F0%22 fill-opacity=%22.26%22/%3E%3Cpath d=%22M289 6.5C291.5 6.35 294.5 6.2 297 6L294 31.4C291.5 31.6 288.5 31.75 286 31.9Z%22 fill=%22%23A589F0%22 fill-opacity=%22.62%22/%3E%3Cpath d=%22M40 14C120 15.6 210 13 272 14.4%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.1%22 opacity=%22.26%22/%3E%3C/svg%3E");--stroke-a-pink:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M6 9C40 6 92 8.4 150 6.6S252 5 296 7.2L292 33C240 35.6 180 33 120 34.6S40 35.2 3 33.4Z%22 fill=%22%23FFB8C6%22 fill-opacity=%22.7%22/%3E%3Cpath d=%22M6 9C12 8.6 18 8.4 25 8.3L22 34.8C15 34.5 9 34 3 33.4Z%22 fill=%22%23F07A95%22 fill-opacity=%22.22%22/%3E%3Cpath d=%22M6 9C8 8.85 10 8.7 12.5 8.6L9.5 34C7 33.8 5 33.6 3 33.4Z%22 fill=%22%23F07A95%22 fill-opacity=%22.5%22/%3E%3Cpath d=%22M274 6C281 6.3 289 6.7 296 7.2L292 33C285 33.5 278 33.8 270 34Z%22 fill=%22%23F07A95%22 fill-opacity=%22.26%22/%3E%3Cpath d=%22M288.5 6.7C291 6.85 293.5 7 296 7.2L292 33C289.5 33.2 287 33.3 284.5 33.4Z%22 fill=%22%23F07A95%22 fill-opacity=%22.62%22/%3E%3Cpath d=%22M28 21C100 19.2 200 22 270 19.6%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.3%22 opacity=%22.28%22/%3E%3C/svg%3E");--stroke-b-pink:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M4 7.6C60 9.6 110 6 170 8S250 9.4 297 6L294 31.4C250 34.4 190 32 130 33.6S50 31.6 2 34Z%22 fill=%22%23FFB8C6%22 fill-opacity=%22.7%22/%3E%3Cpath d=%22M4 7.6C10 7.9 17 8.1 24 8.2L21 33C14 33.2 8 33.6 2 34Z%22 fill=%22%23F07A95%22 fill-opacity=%22.22%22/%3E%3Cpath d=%22M4 7.6C6.5 7.7 9 7.8 11.5 7.9L9.5 33.7C7 33.8 4.5 33.9 2 34Z%22 fill=%22%23F07A95%22 fill-opacity=%22.5%22/%3E%3Cpath d=%22M275 7.4C282 7 290 6.5 297 6L294 31.4C287 31.9 279 32.3 272 32.6Z%22 fill=%22%23F07A95%22 fill-opacity=%22.26%22/%3E%3Cpath d=%22M289 6.5C291.5 6.35 294.5 6.2 297 6L294 31.4C291.5 31.6 288.5 31.75 286 31.9Z%22 fill=%22%23F07A95%22 fill-opacity=%22.62%22/%3E%3Cpath d=%22M40 14C120 15.6 210 13 272 14.4%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.1%22 opacity=%22.26%22/%3E%3C/svg%3E");}
/* ===== v3o: 낙서를 종이에 붙임 — 글과 함께 스크롤. 긴 탭은 아래로 이어 그림 ===== */
svg.side{display:none!important}
main{position:relative}
main>section{position:relative;z-index:1}
.dd-layer{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;display:none}
@media (min-width:1180px){.dd-layer{display:block}}
.dd{position:absolute;width:560px;height:1040px}
.dd.l{right:calc(50% + 540px + 36px)} .dd.r{left:calc(50% + 540px + 36px)}
.dd.flip{transform:scaleX(-1)}
.dd path:not([style]),.dd circle{stroke:#8d93a1;opacity:.5}
.dd path[style]{opacity:.3!important}
/* ===== v3p: 형광펜에 잉크 결·번진 가장자리·끝 맺힘·덧칠 자국 / Home 빨간 펜 밑줄 두 줄씩 ===== */
:root{--stroke-a:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 x2=%221%22 y1=%220%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%23E9BC00%22/%3E%3Cstop offset=%22.018%22 stop-color=%22%23E9BC00%22/%3E%3Cstop offset=%22.06%22 stop-color=%22%23FFE14D%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%23FFE14D%22/%3E%3Cstop offset=%22.93%22 stop-color=%22%23FFE14D%22/%3E%3Cstop offset=%22.975%22 stop-color=%22%23E9BC00%22/%3E%3Cstop offset=%221%22 stop-color=%22%23E9BC00%22/%3E%3C/linearGradient%3E%3Cfilter id=%22ink%22 x=%22-3%25%22 y=%22-15%25%22 width=%22106%25%22 height=%22130%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.035 0.06%22 numOctaves=%222%22 seed=%223%22 result=%22n%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22n%22 scale=%222.6%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.005 0.5%22 numOctaves=%222%22 seed=%228%22 result=%22s%22/%3E%3CfeColorMatrix in=%22s%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.5 1.42%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23ink%29%22%3E%3Cpath d=%22M6 9C40 6 92 8.4 150 6.6S252 5 296 7.2L292 33C240 35.6 180 33 120 34.6S40 35.2 3 33.4Z%22 fill=%22url%28%23g%29%22 fill-opacity=%22.8%22/%3E%3Cpath d=%22M150 8C200 6.4 250 6 293 8.4L291 22C250 20.4 200 21.4 152 20.6Z%22 fill=%22%23FFE14D%22 fill-opacity=%22.28%22/%3E%3C/g%3E%3C/svg%3E");--stroke-b:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 x2=%221%22 y1=%220%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%23E9BC00%22/%3E%3Cstop offset=%22.018%22 stop-color=%22%23E9BC00%22/%3E%3Cstop offset=%22.06%22 stop-color=%22%23FFE14D%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%23FFE14D%22/%3E%3Cstop offset=%22.93%22 stop-color=%22%23FFE14D%22/%3E%3Cstop offset=%22.975%22 stop-color=%22%23E9BC00%22/%3E%3Cstop offset=%221%22 stop-color=%22%23E9BC00%22/%3E%3C/linearGradient%3E%3Cfilter id=%22ink%22 x=%22-3%25%22 y=%22-15%25%22 width=%22106%25%22 height=%22130%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.035 0.06%22 numOctaves=%222%22 seed=%229%22 result=%22n%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22n%22 scale=%222.6%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.005 0.5%22 numOctaves=%222%22 seed=%2214%22 result=%22s%22/%3E%3CfeColorMatrix in=%22s%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.5 1.42%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23ink%29%22%3E%3Cpath d=%22M4 7.6C60 9.6 110 6 170 8S250 9.4 297 6L294 31.4C250 34.4 190 32 130 33.6S50 31.6 2 34Z%22 fill=%22url%28%23g%29%22 fill-opacity=%22.8%22/%3E%3Cpath d=%22M5 20C60 21.4 120 19.6 176 21L175 33.2C120 34 60 32.4 3 33.6Z%22 fill=%22%23FFE14D%22 fill-opacity=%22.26%22/%3E%3C/g%3E%3C/svg%3E");--stroke-a-green:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 x2=%221%22 y1=%220%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%2384CC52%22/%3E%3Cstop offset=%22.018%22 stop-color=%22%2384CC52%22/%3E%3Cstop offset=%22.06%22 stop-color=%22%23B6EE8A%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%23B6EE8A%22/%3E%3Cstop offset=%22.93%22 stop-color=%22%23B6EE8A%22/%3E%3Cstop offset=%22.975%22 stop-color=%22%2384CC52%22/%3E%3Cstop offset=%221%22 stop-color=%22%2384CC52%22/%3E%3C/linearGradient%3E%3Cfilter id=%22ink%22 x=%22-3%25%22 y=%22-15%25%22 width=%22106%25%22 height=%22130%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.035 0.06%22 numOctaves=%222%22 seed=%223%22 result=%22n%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22n%22 scale=%222.6%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.005 0.5%22 numOctaves=%222%22 seed=%228%22 result=%22s%22/%3E%3CfeColorMatrix in=%22s%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.5 1.42%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23ink%29%22%3E%3Cpath d=%22M6 9C40 6 92 8.4 150 6.6S252 5 296 7.2L292 33C240 35.6 180 33 120 34.6S40 35.2 3 33.4Z%22 fill=%22url%28%23g%29%22 fill-opacity=%22.8%22/%3E%3Cpath d=%22M150 8C200 6.4 250 6 293 8.4L291 22C250 20.4 200 21.4 152 20.6Z%22 fill=%22%23B6EE8A%22 fill-opacity=%22.28%22/%3E%3C/g%3E%3C/svg%3E");--stroke-b-green:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 x2=%221%22 y1=%220%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%2384CC52%22/%3E%3Cstop offset=%22.018%22 stop-color=%22%2384CC52%22/%3E%3Cstop offset=%22.06%22 stop-color=%22%23B6EE8A%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%23B6EE8A%22/%3E%3Cstop offset=%22.93%22 stop-color=%22%23B6EE8A%22/%3E%3Cstop offset=%22.975%22 stop-color=%22%2384CC52%22/%3E%3Cstop offset=%221%22 stop-color=%22%2384CC52%22/%3E%3C/linearGradient%3E%3Cfilter id=%22ink%22 x=%22-3%25%22 y=%22-15%25%22 width=%22106%25%22 height=%22130%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.035 0.06%22 numOctaves=%222%22 seed=%229%22 result=%22n%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22n%22 scale=%222.6%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.005 0.5%22 numOctaves=%222%22 seed=%2214%22 result=%22s%22/%3E%3CfeColorMatrix in=%22s%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.5 1.42%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23ink%29%22%3E%3Cpath d=%22M4 7.6C60 9.6 110 6 170 8S250 9.4 297 6L294 31.4C250 34.4 190 32 130 33.6S50 31.6 2 34Z%22 fill=%22url%28%23g%29%22 fill-opacity=%22.8%22/%3E%3Cpath d=%22M5 20C60 21.4 120 19.6 176 21L175 33.2C120 34 60 32.4 3 33.6Z%22 fill=%22%23B6EE8A%22 fill-opacity=%22.26%22/%3E%3C/g%3E%3C/svg%3E");--stroke-a-orange:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 x2=%221%22 y1=%220%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%23F09A3C%22/%3E%3Cstop offset=%22.018%22 stop-color=%22%23F09A3C%22/%3E%3Cstop offset=%22.06%22 stop-color=%22%23FFC27D%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%23FFC27D%22/%3E%3Cstop offset=%22.93%22 stop-color=%22%23FFC27D%22/%3E%3Cstop offset=%22.975%22 stop-color=%22%23F09A3C%22/%3E%3Cstop offset=%221%22 stop-color=%22%23F09A3C%22/%3E%3C/linearGradient%3E%3Cfilter id=%22ink%22 x=%22-3%25%22 y=%22-15%25%22 width=%22106%25%22 height=%22130%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.035 0.06%22 numOctaves=%222%22 seed=%223%22 result=%22n%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22n%22 scale=%222.6%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.005 0.5%22 numOctaves=%222%22 seed=%228%22 result=%22s%22/%3E%3CfeColorMatrix in=%22s%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.5 1.42%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23ink%29%22%3E%3Cpath d=%22M6 9C40 6 92 8.4 150 6.6S252 5 296 7.2L292 33C240 35.6 180 33 120 34.6S40 35.2 3 33.4Z%22 fill=%22url%28%23g%29%22 fill-opacity=%22.8%22/%3E%3Cpath d=%22M150 8C200 6.4 250 6 293 8.4L291 22C250 20.4 200 21.4 152 20.6Z%22 fill=%22%23FFC27D%22 fill-opacity=%22.28%22/%3E%3C/g%3E%3C/svg%3E");--stroke-b-orange:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 x2=%221%22 y1=%220%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%23F09A3C%22/%3E%3Cstop offset=%22.018%22 stop-color=%22%23F09A3C%22/%3E%3Cstop offset=%22.06%22 stop-color=%22%23FFC27D%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%23FFC27D%22/%3E%3Cstop offset=%22.93%22 stop-color=%22%23FFC27D%22/%3E%3Cstop offset=%22.975%22 stop-color=%22%23F09A3C%22/%3E%3Cstop offset=%221%22 stop-color=%22%23F09A3C%22/%3E%3C/linearGradient%3E%3Cfilter id=%22ink%22 x=%22-3%25%22 y=%22-15%25%22 width=%22106%25%22 height=%22130%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.035 0.06%22 numOctaves=%222%22 seed=%229%22 result=%22n%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22n%22 scale=%222.6%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.005 0.5%22 numOctaves=%222%22 seed=%2214%22 result=%22s%22/%3E%3CfeColorMatrix in=%22s%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.5 1.42%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23ink%29%22%3E%3Cpath d=%22M4 7.6C60 9.6 110 6 170 8S250 9.4 297 6L294 31.4C250 34.4 190 32 130 33.6S50 31.6 2 34Z%22 fill=%22url%28%23g%29%22 fill-opacity=%22.8%22/%3E%3Cpath d=%22M5 20C60 21.4 120 19.6 176 21L175 33.2C120 34 60 32.4 3 33.6Z%22 fill=%22%23FFC27D%22 fill-opacity=%22.26%22/%3E%3C/g%3E%3C/svg%3E");--stroke-a-sky:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 x2=%221%22 y1=%220%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%236EBCF2%22/%3E%3Cstop offset=%22.018%22 stop-color=%22%236EBCF2%22/%3E%3Cstop offset=%22.06%22 stop-color=%22%23A8DBFF%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%23A8DBFF%22/%3E%3Cstop offset=%22.93%22 stop-color=%22%23A8DBFF%22/%3E%3Cstop offset=%22.975%22 stop-color=%22%236EBCF2%22/%3E%3Cstop offset=%221%22 stop-color=%22%236EBCF2%22/%3E%3C/linearGradient%3E%3Cfilter id=%22ink%22 x=%22-3%25%22 y=%22-15%25%22 width=%22106%25%22 height=%22130%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.035 0.06%22 numOctaves=%222%22 seed=%223%22 result=%22n%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22n%22 scale=%222.6%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.005 0.5%22 numOctaves=%222%22 seed=%228%22 result=%22s%22/%3E%3CfeColorMatrix in=%22s%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.5 1.42%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23ink%29%22%3E%3Cpath d=%22M6 9C40 6 92 8.4 150 6.6S252 5 296 7.2L292 33C240 35.6 180 33 120 34.6S40 35.2 3 33.4Z%22 fill=%22url%28%23g%29%22 fill-opacity=%22.8%22/%3E%3Cpath d=%22M150 8C200 6.4 250 6 293 8.4L291 22C250 20.4 200 21.4 152 20.6Z%22 fill=%22%23A8DBFF%22 fill-opacity=%22.28%22/%3E%3C/g%3E%3C/svg%3E");--stroke-b-sky:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 x2=%221%22 y1=%220%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%236EBCF2%22/%3E%3Cstop offset=%22.018%22 stop-color=%22%236EBCF2%22/%3E%3Cstop offset=%22.06%22 stop-color=%22%23A8DBFF%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%23A8DBFF%22/%3E%3Cstop offset=%22.93%22 stop-color=%22%23A8DBFF%22/%3E%3Cstop offset=%22.975%22 stop-color=%22%236EBCF2%22/%3E%3Cstop offset=%221%22 stop-color=%22%236EBCF2%22/%3E%3C/linearGradient%3E%3Cfilter id=%22ink%22 x=%22-3%25%22 y=%22-15%25%22 width=%22106%25%22 height=%22130%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.035 0.06%22 numOctaves=%222%22 seed=%229%22 result=%22n%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22n%22 scale=%222.6%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.005 0.5%22 numOctaves=%222%22 seed=%2214%22 result=%22s%22/%3E%3CfeColorMatrix in=%22s%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.5 1.42%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23ink%29%22%3E%3Cpath d=%22M4 7.6C60 9.6 110 6 170 8S250 9.4 297 6L294 31.4C250 34.4 190 32 130 33.6S50 31.6 2 34Z%22 fill=%22url%28%23g%29%22 fill-opacity=%22.8%22/%3E%3Cpath d=%22M5 20C60 21.4 120 19.6 176 21L175 33.2C120 34 60 32.4 3 33.6Z%22 fill=%22%23A8DBFF%22 fill-opacity=%22.26%22/%3E%3C/g%3E%3C/svg%3E");--stroke-a-violet:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 x2=%221%22 y1=%220%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%23AC92F2%22/%3E%3Cstop offset=%22.018%22 stop-color=%22%23AC92F2%22/%3E%3Cstop offset=%22.06%22 stop-color=%22%23D6C6FF%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%23D6C6FF%22/%3E%3Cstop offset=%22.93%22 stop-color=%22%23D6C6FF%22/%3E%3Cstop offset=%22.975%22 stop-color=%22%23AC92F2%22/%3E%3Cstop offset=%221%22 stop-color=%22%23AC92F2%22/%3E%3C/linearGradient%3E%3Cfilter id=%22ink%22 x=%22-3%25%22 y=%22-15%25%22 width=%22106%25%22 height=%22130%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.035 0.06%22 numOctaves=%222%22 seed=%223%22 result=%22n%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22n%22 scale=%222.6%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.005 0.5%22 numOctaves=%222%22 seed=%228%22 result=%22s%22/%3E%3CfeColorMatrix in=%22s%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.5 1.42%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23ink%29%22%3E%3Cpath d=%22M6 9C40 6 92 8.4 150 6.6S252 5 296 7.2L292 33C240 35.6 180 33 120 34.6S40 35.2 3 33.4Z%22 fill=%22url%28%23g%29%22 fill-opacity=%22.8%22/%3E%3Cpath d=%22M150 8C200 6.4 250 6 293 8.4L291 22C250 20.4 200 21.4 152 20.6Z%22 fill=%22%23D6C6FF%22 fill-opacity=%22.28%22/%3E%3C/g%3E%3C/svg%3E");--stroke-b-violet:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 x2=%221%22 y1=%220%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%23AC92F2%22/%3E%3Cstop offset=%22.018%22 stop-color=%22%23AC92F2%22/%3E%3Cstop offset=%22.06%22 stop-color=%22%23D6C6FF%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%23D6C6FF%22/%3E%3Cstop offset=%22.93%22 stop-color=%22%23D6C6FF%22/%3E%3Cstop offset=%22.975%22 stop-color=%22%23AC92F2%22/%3E%3Cstop offset=%221%22 stop-color=%22%23AC92F2%22/%3E%3C/linearGradient%3E%3Cfilter id=%22ink%22 x=%22-3%25%22 y=%22-15%25%22 width=%22106%25%22 height=%22130%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.035 0.06%22 numOctaves=%222%22 seed=%229%22 result=%22n%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22n%22 scale=%222.6%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.005 0.5%22 numOctaves=%222%22 seed=%2214%22 result=%22s%22/%3E%3CfeColorMatrix in=%22s%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.5 1.42%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23ink%29%22%3E%3Cpath d=%22M4 7.6C60 9.6 110 6 170 8S250 9.4 297 6L294 31.4C250 34.4 190 32 130 33.6S50 31.6 2 34Z%22 fill=%22url%28%23g%29%22 fill-opacity=%22.8%22/%3E%3Cpath d=%22M5 20C60 21.4 120 19.6 176 21L175 33.2C120 34 60 32.4 3 33.6Z%22 fill=%22%23D6C6FF%22 fill-opacity=%22.26%22/%3E%3C/g%3E%3C/svg%3E");--stroke-a-pink:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 x2=%221%22 y1=%220%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%23F28AA2%22/%3E%3Cstop offset=%22.018%22 stop-color=%22%23F28AA2%22/%3E%3Cstop offset=%22.06%22 stop-color=%22%23FFB8C6%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%23FFB8C6%22/%3E%3Cstop offset=%22.93%22 stop-color=%22%23FFB8C6%22/%3E%3Cstop offset=%22.975%22 stop-color=%22%23F28AA2%22/%3E%3Cstop offset=%221%22 stop-color=%22%23F28AA2%22/%3E%3C/linearGradient%3E%3Cfilter id=%22ink%22 x=%22-3%25%22 y=%22-15%25%22 width=%22106%25%22 height=%22130%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.035 0.06%22 numOctaves=%222%22 seed=%223%22 result=%22n%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22n%22 scale=%222.6%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.005 0.5%22 numOctaves=%222%22 seed=%228%22 result=%22s%22/%3E%3CfeColorMatrix in=%22s%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.5 1.42%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23ink%29%22%3E%3Cpath d=%22M6 9C40 6 92 8.4 150 6.6S252 5 296 7.2L292 33C240 35.6 180 33 120 34.6S40 35.2 3 33.4Z%22 fill=%22url%28%23g%29%22 fill-opacity=%22.8%22/%3E%3Cpath d=%22M150 8C200 6.4 250 6 293 8.4L291 22C250 20.4 200 21.4 152 20.6Z%22 fill=%22%23FFB8C6%22 fill-opacity=%22.28%22/%3E%3C/g%3E%3C/svg%3E");--stroke-b-pink:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 40%22 preserveAspectRatio=%22none%22%3E%3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 x2=%221%22 y1=%220%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%23F28AA2%22/%3E%3Cstop offset=%22.018%22 stop-color=%22%23F28AA2%22/%3E%3Cstop offset=%22.06%22 stop-color=%22%23FFB8C6%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%23FFB8C6%22/%3E%3Cstop offset=%22.93%22 stop-color=%22%23FFB8C6%22/%3E%3Cstop offset=%22.975%22 stop-color=%22%23F28AA2%22/%3E%3Cstop offset=%221%22 stop-color=%22%23F28AA2%22/%3E%3C/linearGradient%3E%3Cfilter id=%22ink%22 x=%22-3%25%22 y=%22-15%25%22 width=%22106%25%22 height=%22130%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.035 0.06%22 numOctaves=%222%22 seed=%229%22 result=%22n%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22n%22 scale=%222.6%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.005 0.5%22 numOctaves=%222%22 seed=%2214%22 result=%22s%22/%3E%3CfeColorMatrix in=%22s%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.5 1.42%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23ink%29%22%3E%3Cpath d=%22M4 7.6C60 9.6 110 6 170 8S250 9.4 297 6L294 31.4C250 34.4 190 32 130 33.6S50 31.6 2 34Z%22 fill=%22url%28%23g%29%22 fill-opacity=%22.8%22/%3E%3Cpath d=%22M5 20C60 21.4 120 19.6 176 21L175 33.2C120 34 60 32.4 3 33.6Z%22 fill=%22%23FFB8C6%22 fill-opacity=%22.26%22/%3E%3C/g%3E%3C/svg%3E");--red-1:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 8%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M2 4.6C50 2.6 110 5.6 170 3.6S260 3 298 4.6%22 fill=%22none%22 stroke=%22%23E0352B%22 stroke-width=%222.4%22 stroke-linecap=%22round%22 vector-effect=%22non-scaling-stroke%22/%3E%3C/svg%3E");--red-2:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 8%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M3 3.8C70 5.6 130 2.8 200 4.6S270 5 297 3%22 fill=%22none%22 stroke=%22%23E0352B%22 stroke-width=%222.4%22 stroke-linecap=%22round%22 vector-effect=%22non-scaling-stroke%22/%3E%3C/svg%3E");}
.hero h1 span{margin-bottom:.14em}
.hero h1 .ul{position:absolute;left:.06em;right:.04em;bottom:-.1em;height:.2em;pointer-events:none}
.hero h1 .ul::before,.hero h1 .ul::after{content:"";position:absolute;left:0;right:0;height:.1em;background:var(--red-1) no-repeat 0 50%/100% 100%}
.hero h1 .ul::before{top:0}
.hero h1 .ul::after{top:.085em;left:1.5%;right:5%;background-image:var(--red-2)}
body.intro .hero h1 .ul::before,body.intro .hero h1 .ul::after{animation:hl-draw .32s cubic-bezier(.3,.1,.3,1) both}
body.intro .hero h1 .hl.s2 .ul::before{animation-delay:1.65s} body.intro .hero h1 .hl.s2 .ul::after{animation-delay:1.98s}
body.intro .hero h1 .hl:not(.s2) .ul::before{animation-delay:2.4s} body.intro .hero h1 .hl:not(.s2) .ul::after{animation-delay:2.73s}
body.v-mid .hero h1 .hl::before{animation-delay:-1s!important}
body.v-mid .hero h1 .ul::before,body.v-mid .hero h1 .ul::after{animation-play-state:paused!important}
body.v-mid .hero h1 .hl.s2 .ul::before{animation-delay:-1s!important} body.v-mid .hero h1 .hl.s2 .ul::after{animation-delay:-.16s!important}
@media (prefers-reduced-motion:reduce){body.intro .hero h1 .ul::before,body.intro .hero h1 .ul::after{animation:none}}
/* ===== v3q: 펜을 진짜 펜처럼 — 필압(굵기 변화)·시작 뭉침·끝 삐침·잉크 결 ===== */
:root{--circle:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 48%22 preserveAspectRatio=%22none%22%3E%3Cdefs%3E%3Cfilter id=%22pen%22 x=%22-8%25%22 y=%22-30%25%22 width=%22116%25%22 height=%22160%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.08%22 numOctaves=%222%22 seed=%2211%22 result=%22w%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22w%22 scale=%220.9%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.9%22 numOctaves=%221%22 seed=%2214%22 result=%22g%22/%3E%3CfeColorMatrix in=%22g%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.25 1.5%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23pen%29%22%3E%3Cpath d=%22M15 27C11 13 38 5 66 5S112 11 109 25S86 43 57 43S9 41 12 23C14 13 29 8 46 6.5%22 fill=%22none%22 stroke=%22%231F3FD1%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 vector-effect=%22non-scaling-stroke%22 stroke-width=%222%22/%3E%3C/g%3E%3C/svg%3E");--under:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 200 12%22 preserveAspectRatio=%22none%22%3E%3Cdefs%3E%3Cfilter id=%22pen%22 x=%22-8%25%22 y=%22-30%25%22 width=%22116%25%22 height=%22160%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.08%22 numOctaves=%222%22 seed=%2212%22 result=%22w%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22w%22 scale=%220.5%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.9%22 numOctaves=%221%22 seed=%2215%22 result=%22g%22/%3E%3CfeColorMatrix in=%22g%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.25 1.5%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23pen%29%22%3E%3Cpath d=%22M3 7C40 3.5 80 9 120 5.5S180 4 197 7%22 fill=%22none%22 stroke=%22%231F3FD1%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 vector-effect=%22non-scaling-stroke%22 stroke-width=%222.2%22/%3E%3C/g%3E%3C/svg%3E");--under-ink:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 200 12%22 preserveAspectRatio=%22none%22%3E%3Cdefs%3E%3Cfilter id=%22pen%22 x=%22-8%25%22 y=%22-30%25%22 width=%22116%25%22 height=%22160%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.08%22 numOctaves=%222%22 seed=%2213%22 result=%22w%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22w%22 scale=%220.5%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.9%22 numOctaves=%221%22 seed=%2216%22 result=%22g%22/%3E%3CfeColorMatrix in=%22g%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.25 1.5%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23pen%29%22%3E%3Cpath d=%22M2 6C50 8.5 90 3.5 140 6.5S185 7 198 4.5%22 fill=%22none%22 stroke=%22%2316181D%22 stroke-linecap=%22round%22 vector-effect=%22non-scaling-stroke%22 stroke-width=%221.8%22/%3E%3C/g%3E%3C/svg%3E");--arrow:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 70%22 %3E%3Cdefs%3E%3Cfilter id=%22pen%22 x=%22-8%25%22 y=%22-30%25%22 width=%22116%25%22 height=%22160%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.08%22 numOctaves=%222%22 seed=%2214%22 result=%22w%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22w%22 scale=%220.9%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.9%22 numOctaves=%221%22 seed=%2217%22 result=%22g%22/%3E%3CfeColorMatrix in=%22g%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.25 1.5%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23pen%29%22%3E%3Cpath d=%22M6 12C30 4 70 10 92 44%22 fill=%22none%22 stroke=%22%231F3FD1%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 vector-effect=%22non-scaling-stroke%22 stroke-width=%222.2%22/%3E%3Cpath d=%22M76 42L94 48L96 28%22 fill=%22none%22 stroke=%22%231F3FD1%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 vector-effect=%22non-scaling-stroke%22 stroke-width=%222.2%22/%3E%3C/g%3E%3C/svg%3E");--tick:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 28 28%22%3E%3Cdefs%3E%3Cfilter id=%22pen%22 x=%22-8%25%22 y=%22-30%25%22 width=%22116%25%22 height=%22160%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.08%22 numOctaves=%222%22 seed=%2215%22 result=%22w%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22w%22 scale=%220.5%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.9%22 numOctaves=%221%22 seed=%2218%22 result=%22g%22/%3E%3CfeColorMatrix in=%22g%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.25 1.5%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23pen%29%22%3E%3Cpath d=%22M5 14.5C7.4 17 9.2 19.4 10.6 21.8C14 13.6 18.6 7.6 24.5 3.4%22 fill=%22none%22 stroke=%22%231F3FD1%22 stroke-width=%222.4%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E%3C/g%3E%3C/svg%3E");--ck-done:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 28 28%22%3E%3Cdefs%3E%3Cfilter id=%22pen%22 x=%22-8%25%22 y=%22-30%25%22 width=%22116%25%22 height=%22160%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.08%22 numOctaves=%222%22 seed=%2216%22 result=%22w%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22w%22 scale=%220.4%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.9%22 numOctaves=%221%22 seed=%2219%22 result=%22g%22/%3E%3CfeColorMatrix in=%22g%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.25 1.5%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23pen%29%22%3E%3Cpath d=%22M5.5 7.2C10 6.6 16 6.9 20.6 6.5C21 11 20.7 16 21.2 20.8C16 21.4 10.5 21 5.9 21.5C5.4 16.5 5.8 12 5.5 7.2Z%22 fill=%22%23fff%22 stroke=%22%2316181D%22 stroke-width=%221.5%22 stroke-linejoin=%22round%22/%3E%3Cpath d=%22M8.5 13.5C10.3 15.6 11.6 17.4 12.6 19.2C15.6 12.6 19.8 7 25.5 2.8%22 fill=%22none%22 stroke=%22%231F3FD1%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E%3C/g%3E%3C/svg%3E");--ck-open:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 28 28%22%3E%3Cdefs%3E%3Cfilter id=%22pen%22 x=%22-8%25%22 y=%22-30%25%22 width=%22116%25%22 height=%22160%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.08%22 numOctaves=%222%22 seed=%2217%22 result=%22w%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22w%22 scale=%220.4%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.9%22 numOctaves=%221%22 seed=%2220%22 result=%22g%22/%3E%3CfeColorMatrix in=%22g%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.25 1.5%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23pen%29%22%3E%3Cpath d=%22M5.5 7.2C10 6.6 16 6.9 20.6 6.5C21 11 20.7 16 21.2 20.8C16 21.4 10.5 21 5.9 21.5C5.4 16.5 5.8 12 5.5 7.2Z%22 fill=%22%23fff%22 stroke=%22%2316181D%22 stroke-width=%221.5%22 stroke-linejoin=%22round%22/%3E%3C/g%3E%3C/svg%3E");--brace:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 14 100%22 preserveAspectRatio=%22none%22%3E%3Cdefs%3E%3Cfilter id=%22pen%22 x=%22-8%25%22 y=%22-30%25%22 width=%22116%25%22 height=%22160%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.08%22 numOctaves=%222%22 seed=%2218%22 result=%22w%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22w%22 scale=%220.4%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.9%22 numOctaves=%221%22 seed=%2221%22 result=%22g%22/%3E%3CfeColorMatrix in=%22g%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.25 1.5%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23pen%29%22%3E%3Cpath d=%22M11 2C5.5 3 4.5 6 5 12L5.6 88C6 94 6 97 11.5 98%22 fill=%22none%22 stroke=%22%231F3FD1%22 stroke-width=%222%22 stroke-linecap=%22round%22 vector-effect=%22non-scaling-stroke%22/%3E%3C/g%3E%3C/svg%3E");--arr:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 44 28%22%3E%3Cdefs%3E%3Cfilter id=%22pen%22 x=%22-8%25%22 y=%22-30%25%22 width=%22116%25%22 height=%22160%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.08%22 numOctaves=%222%22 seed=%2219%22 result=%22w%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22w%22 scale=%220.5%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.9%22 numOctaves=%221%22 seed=%2222%22 result=%22g%22/%3E%3CfeColorMatrix in=%22g%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.25 1.5%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23pen%29%22%3E%3Cpath d=%22M3 15.5C12 13.2 24 14.6 38 13.6M29 6.5C32.6 9 35.8 11.4 39 13.6C35.6 16.4 32.6 19.4 30 22.6%22 fill=%22none%22 stroke=%22%231F3FD1%22 stroke-width=%222.3%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E%3C/g%3E%3C/svg%3E");--red-1:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 8%22 preserveAspectRatio=%22none%22%3E%3Cdefs%3E%3Cfilter id=%22pen%22 x=%22-8%25%22 y=%22-30%25%22 width=%22116%25%22 height=%22160%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.08%22 numOctaves=%222%22 seed=%224%22 result=%22w%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22w%22 scale=%220.35%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%221.1%22 numOctaves=%221%22 seed=%227%22 result=%22g%22/%3E%3CfeColorMatrix in=%22g%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.25 1.5%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23pen%29%22%3E%3Cpath d=%22M2.0 3.93L5.7 3.23L9.4 3.40L13.1 3.56L16.8 3.58L20.5 3.63L24.2 3.67L27.9 3.71L31.6 3.73L35.3 3.74L39.0 3.73L42.7 3.70L46.4 3.66L50.1 3.60L53.8 3.53L57.5 3.45L61.2 3.36L64.9 3.27L68.6 3.18L72.3 3.09L76.0 3.00L79.7 2.93L83.4 2.87L87.1 2.82L90.8 2.78L94.5 2.76L98.2 2.74L101.9 2.74L105.6 2.75L109.3 2.76L113.0 2.77L116.7 2.78L120.4 2.80L124.1 2.80L127.8 2.80L131.5 2.80L135.2 2.79L138.9 2.77L142.6 2.75L146.3 2.73L150.0 2.71L153.7 2.68L157.4 2.66L161.1 2.64L164.8 2.63L168.5 2.62L172.2 2.61L175.9 2.61L179.6 2.61L183.3 2.61L187.0 2.61L190.7 2.60L194.4 2.60L198.1 2.59L201.8 2.58L205.5 2.56L209.2 2.54L212.9 2.51L216.6 2.49L220.3 2.47L224.0 2.45L227.7 2.45L231.4 2.45L235.1 2.46L238.8 2.49L242.5 2.54L246.2 2.60L249.9 2.68L253.6 2.77L257.3 2.88L261.0 2.99L264.7 3.11L268.4 3.24L272.1 3.36L275.8 3.48L279.5 3.65L283.2 3.78L286.9 3.78L290.6 3.66L294.3 3.41L298.0 3.03L298.0 3.12L294.3 3.65L290.6 4.09L286.9 4.45L283.2 4.71L279.5 4.89L275.8 4.92L272.1 4.86L268.4 4.80L264.7 4.75L261.0 4.71L257.3 4.67L253.6 4.63L249.9 4.59L246.2 4.55L242.5 4.52L238.8 4.48L235.1 4.45L231.4 4.42L227.7 4.40L224.0 4.39L220.3 4.39L216.6 4.39L212.9 4.41L209.2 4.44L205.5 4.48L201.8 4.53L198.1 4.58L194.4 4.65L190.7 4.72L187.0 4.78L183.3 4.85L179.6 4.91L175.9 4.96L172.2 4.99L168.5 5.01L164.8 5.02L161.1 5.01L157.4 4.98L153.7 4.95L150.0 4.89L146.3 4.83L142.6 4.77L138.9 4.70L135.2 4.64L131.5 4.57L127.8 4.52L124.1 4.48L120.4 4.44L116.7 4.42L113.0 4.41L109.3 4.42L105.6 4.43L101.9 4.46L98.2 4.49L94.5 4.53L90.8 4.57L87.1 4.61L83.4 4.66L79.7 4.70L76.0 4.75L72.3 4.79L68.6 4.84L64.9 4.88L61.2 4.93L57.5 4.98L53.8 5.04L50.1 5.10L46.4 5.16L42.7 5.23L39.0 5.29L35.3 5.36L31.6 5.43L27.9 5.50L24.2 5.55L20.5 5.60L16.8 5.64L13.1 5.61L9.4 5.72L5.7 5.82L2.0 5.03Z%22 fill=%22%23D92E24%22 fill-opacity=%22.93%22/%3E%3C/g%3E%3C/svg%3E");--red-2:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 8%22 preserveAspectRatio=%22none%22%3E%3Cdefs%3E%3Cfilter id=%22pen%22 x=%22-8%25%22 y=%22-30%25%22 width=%22116%25%22 height=%22160%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.08%22 numOctaves=%222%22 seed=%229%22 result=%22w%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22w%22 scale=%220.35%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%221.1%22 numOctaves=%221%22 seed=%2212%22 result=%22g%22/%3E%3CfeColorMatrix in=%22g%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.25 1.5%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23pen%29%22%3E%3Cpath d=%22M2.0 3.54L5.7 2.73L9.4 2.80L13.1 2.86L16.8 2.78L20.5 2.71L24.2 2.64L27.9 2.57L31.6 2.49L35.3 2.41L39.0 2.33L42.7 2.25L46.4 2.19L50.1 2.13L53.8 2.09L57.5 2.06L61.2 2.05L64.9 2.06L68.6 2.09L72.3 2.13L76.0 2.19L79.7 2.26L83.4 2.34L87.1 2.42L90.8 2.51L94.5 2.60L98.2 2.68L101.9 2.76L105.6 2.82L109.3 2.87L113.0 2.91L116.7 2.94L120.4 2.95L124.1 2.95L127.8 2.95L131.5 2.93L135.2 2.92L138.9 2.90L142.6 2.88L146.3 2.86L150.0 2.84L153.7 2.83L157.4 2.82L161.1 2.82L164.8 2.81L168.5 2.81L172.2 2.82L175.9 2.82L179.6 2.82L183.3 2.82L187.0 2.82L190.7 2.82L194.4 2.81L198.1 2.81L201.8 2.82L205.5 2.83L209.2 2.85L212.9 2.87L216.6 2.91L220.3 2.96L224.0 3.03L227.7 3.10L231.4 3.19L235.1 3.29L238.8 3.39L242.5 3.50L246.2 3.61L249.9 3.72L253.6 3.82L257.3 3.91L261.0 3.98L264.7 4.05L268.4 4.09L272.1 4.12L275.8 4.14L279.5 4.26L283.2 4.54L286.9 4.91L290.6 5.35L294.3 5.87L298.0 6.44L298.0 6.56L294.3 6.17L290.6 5.93L286.9 5.80L283.2 5.77L279.5 5.85L275.8 5.95L272.1 5.94L268.4 5.93L264.7 5.93L261.0 5.91L257.3 5.90L253.6 5.88L249.9 5.85L246.2 5.82L242.5 5.78L238.8 5.73L235.1 5.67L231.4 5.60L227.7 5.52L224.0 5.43L220.3 5.33L216.6 5.23L212.9 5.13L209.2 5.03L205.5 4.93L201.8 4.83L198.1 4.75L194.4 4.68L190.7 4.63L187.0 4.58L183.3 4.56L179.6 4.55L175.9 4.55L172.2 4.56L168.5 4.58L164.8 4.60L161.1 4.63L157.4 4.65L153.7 4.67L150.0 4.68L146.3 4.68L142.6 4.68L138.9 4.66L135.2 4.63L131.5 4.59L127.8 4.55L124.1 4.50L120.4 4.45L116.7 4.40L113.0 4.35L109.3 4.31L105.6 4.27L101.9 4.25L98.2 4.22L94.5 4.21L90.8 4.21L87.1 4.21L83.4 4.21L79.7 4.22L76.0 4.23L72.3 4.25L68.6 4.26L64.9 4.27L61.2 4.29L57.5 4.30L53.8 4.32L50.1 4.33L46.4 4.36L42.7 4.39L39.0 4.42L35.3 4.47L31.6 4.52L27.9 4.59L24.2 4.66L20.5 4.75L16.8 4.83L13.1 4.91L9.4 5.12L5.7 5.32L2.0 4.64Z%22 fill=%22%23D92E24%22 fill-opacity=%22.93%22/%3E%3C/g%3E%3C/svg%3E");--red-3:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 8%22 preserveAspectRatio=%22none%22%3E%3Cdefs%3E%3Cfilter id=%22pen%22 x=%22-8%25%22 y=%22-30%25%22 width=%22116%25%22 height=%22160%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.08%22 numOctaves=%222%22 seed=%2215%22 result=%22w%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22w%22 scale=%220.35%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%221.1%22 numOctaves=%221%22 seed=%2218%22 result=%22g%22/%3E%3CfeColorMatrix in=%22g%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.25 1.5%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23pen%29%22%3E%3Cpath d=%22M2.0 3.10L5.7 2.45L9.4 2.67L13.1 2.88L16.8 3.11L20.5 3.17L24.2 3.22L27.9 3.27L31.6 3.32L35.3 3.37L39.0 3.42L42.7 3.46L46.4 3.49L50.1 3.51L53.8 3.52L57.5 3.52L61.2 3.50L64.9 3.47L68.6 3.44L72.3 3.39L76.0 3.33L79.7 3.27L83.4 3.20L87.1 3.14L90.8 3.08L94.5 3.03L98.2 3.00L101.9 2.97L105.6 2.97L109.3 2.97L113.0 3.00L116.7 3.04L120.4 3.09L124.1 3.15L127.8 3.21L131.5 3.29L135.2 3.36L138.9 3.42L142.6 3.49L146.3 3.54L150.0 3.58L153.7 3.62L157.4 3.64L161.1 3.65L164.8 3.65L168.5 3.64L172.2 3.62L175.9 3.60L179.6 3.57L183.3 3.54L187.0 3.51L190.7 3.48L194.4 3.44L198.1 3.41L201.8 3.37L205.5 3.33L209.2 3.29L212.9 3.24L216.6 3.19L220.3 3.13L224.0 3.06L227.7 2.99L231.4 2.91L235.1 2.83L238.8 2.75L242.5 2.67L246.2 2.60L249.9 2.53L253.6 2.47L257.3 2.43L261.0 2.40L264.7 2.39L268.4 2.39L272.1 2.41L275.8 2.45L279.5 2.65L283.2 3.04L286.9 3.52L290.6 4.08L294.3 4.71L298.0 5.39L298.0 5.51L294.3 5.04L290.6 4.73L286.9 4.54L283.2 4.49L279.5 4.56L275.8 4.63L272.1 4.59L268.4 4.54L264.7 4.50L261.0 4.45L257.3 4.41L253.6 4.37L249.9 4.34L246.2 4.32L242.5 4.31L238.8 4.31L235.1 4.32L231.4 4.36L227.7 4.40L224.0 4.47L220.3 4.55L216.6 4.63L212.9 4.73L209.2 4.84L205.5 4.94L201.8 5.04L198.1 5.14L194.4 5.23L190.7 5.31L187.0 5.37L183.3 5.42L179.6 5.46L175.9 5.48L172.2 5.49L168.5 5.48L164.8 5.47L161.1 5.45L157.4 5.43L153.7 5.41L150.0 5.39L146.3 5.37L142.6 5.36L138.9 5.35L135.2 5.35L131.5 5.35L127.8 5.35L124.1 5.36L120.4 5.37L116.7 5.38L113.0 5.39L109.3 5.39L105.6 5.39L101.9 5.38L98.2 5.37L94.5 5.35L90.8 5.34L87.1 5.32L83.4 5.30L79.7 5.28L76.0 5.27L72.3 5.26L68.6 5.25L64.9 5.25L61.2 5.26L57.5 5.26L53.8 5.27L50.1 5.27L46.4 5.27L42.7 5.26L39.0 5.25L35.3 5.22L31.6 5.18L27.9 5.12L24.2 5.05L20.5 4.97L16.8 4.87L13.1 4.94L9.4 4.99L5.7 5.03L2.0 4.20Z%22 fill=%22%23D92E24%22 fill-opacity=%22.93%22/%3E%3C/g%3E%3C/svg%3E");--red-4:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 8%22 preserveAspectRatio=%22none%22%3E%3Cdefs%3E%3Cfilter id=%22pen%22 x=%22-8%25%22 y=%22-30%25%22 width=%22116%25%22 height=%22160%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.08%22 numOctaves=%222%22 seed=%2222%22 result=%22w%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 in2=%22w%22 scale=%220.35%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22 result=%22d%22/%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%221.1%22 numOctaves=%221%22 seed=%2225%22 result=%22g%22/%3E%3CfeColorMatrix in=%22g%22 type=%22matrix%22 values=%220 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.25 1.5%22 result=%22m%22/%3E%3CfeComposite in=%22d%22 in2=%22m%22 operator=%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Cg filter=%22url%28%23pen%29%22%3E%3Cpath d=%22M2.0 3.29L5.7 2.61L9.4 2.81L13.1 3.00L16.8 2.95L20.5 2.96L24.2 2.97L27.9 2.99L31.6 3.00L35.3 3.02L39.0 3.04L42.7 3.06L46.4 3.07L50.1 3.09L53.8 3.11L57.5 3.12L61.2 3.12L64.9 3.12L68.6 3.12L72.3 3.11L76.0 3.10L79.7 3.09L83.4 3.09L87.1 3.09L90.8 3.09L94.5 3.11L98.2 3.14L101.9 3.17L105.6 3.22L109.3 3.29L113.0 3.36L116.7 3.44L120.4 3.52L124.1 3.61L127.8 3.70L131.5 3.78L135.2 3.85L138.9 3.91L142.6 3.95L146.3 3.98L150.0 3.99L153.7 3.98L157.4 3.95L161.1 3.91L164.8 3.85L168.5 3.78L172.2 3.69L175.9 3.61L179.6 3.52L183.3 3.42L187.0 3.33L190.7 3.25L194.4 3.16L198.1 3.09L201.8 3.02L205.5 2.95L209.2 2.89L212.9 2.83L216.6 2.78L220.3 2.73L224.0 2.67L227.7 2.63L231.4 2.58L235.1 2.54L238.8 2.50L242.5 2.46L246.2 2.43L249.9 2.41L253.6 2.41L257.3 2.41L261.0 2.43L264.7 2.45L268.4 2.50L272.1 2.55L275.8 2.62L279.5 2.81L283.2 3.00L286.9 3.05L290.6 2.96L294.3 2.73L298.0 2.34L298.0 2.45L294.3 3.05L290.6 3.59L286.9 4.07L283.2 4.47L279.5 4.80L275.8 4.94L272.1 4.92L268.4 4.89L264.7 4.85L261.0 4.81L257.3 4.76L253.6 4.71L249.9 4.66L246.2 4.61L242.5 4.57L238.8 4.54L235.1 4.53L231.4 4.53L227.7 4.54L224.0 4.57L220.3 4.61L216.6 4.67L212.9 4.74L209.2 4.82L205.5 4.90L201.8 4.98L198.1 5.07L194.4 5.14L190.7 5.21L187.0 5.28L183.3 5.33L179.6 5.37L175.9 5.39L172.2 5.41L168.5 5.42L164.8 5.42L161.1 5.41L157.4 5.40L153.7 5.39L150.0 5.38L146.3 5.37L142.6 5.36L138.9 5.35L135.2 5.35L131.5 5.35L127.8 5.34L124.1 5.34L120.4 5.33L116.7 5.33L113.0 5.31L109.3 5.30L105.6 5.27L101.9 5.25L98.2 5.22L94.5 5.19L90.8 5.16L87.1 5.13L83.4 5.10L79.7 5.09L76.0 5.08L72.3 5.08L68.6 5.09L64.9 5.10L61.2 5.13L57.5 5.17L53.8 5.21L50.1 5.25L46.4 5.29L42.7 5.32L39.0 5.34L35.3 5.36L31.6 5.36L27.9 5.34L24.2 5.31L20.5 5.25L16.8 5.19L13.1 5.05L9.4 5.13L5.7 5.20L2.0 4.39Z%22 fill=%22%23D92E24%22 fill-opacity=%22.93%22/%3E%3C/g%3E%3C/svg%3E");}
.hero h1 .ul{height:.24em;bottom:-.13em}
.hero h1 .ul::before,.hero h1 .ul::after{height:.115em;overflow:visible}
.hero h1 .ul::after{top:.1em;left:2.5%;right:7%;transform:rotate(-.25deg)}
.hero h1 .ul::before{transform:rotate(.2deg)}
.hero h1 .hl:not(.s2) .ul::before{background-image:var(--red-3)} .hero h1 .hl:not(.s2) .ul::after{background-image:var(--red-4);left:1%;right:10%}
/* ===== v3r: 바닥글에 연락처 아이콘 ===== */
footer{padding:8px 0}
.foot{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:50px}
.foot-links{display:flex;gap:4px;list-style:none;margin:0 -11px 0 0;padding:0}
.foot-links a{display:grid;place-items:center;width:44px;height:44px;color:var(--ink)}
.foot-links a:hover{color:var(--pen)}
.foot-links .ic{width:22px;height:22px}
.foot-links .nolink{opacity:.35;outline:1.5px dashed #b97a1a;outline-offset:-8px}
/* ===== site: 실제 사이트용 추가분 ===== */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-80px;z-index:50;background:var(--ink);color:#fff;padding:8px 14px;text-decoration:none}
.skip:focus{top:12px;color:#fff}
main:focus,h1[tabindex="-1"]:focus{outline:none}
html:not(.js) .sheet,html:not(.js) .filters{display:none}
html:not(.js) main>section+section{border-top:1.5px solid var(--ink)}
.toys{list-style:none;margin:0;padding:0}
.toys li[hidden]{display:none}
.links .d{display:block;color:var(--body);font-size:14.5px;font-weight:400;line-height:1.6;max-width:36em;margin-top:2px}
.links:has(.d){flex-direction:column;gap:12px}
.proj .txt>.links:first-child{margin-top:0}
.r ul{margin:6px 0 0;padding-left:1.1em;color:var(--body);font-size:15px;line-height:1.7}
.r li+li{margin-top:2px}
.proj .txt>p.todo+p.todo+.links{border-top:0;margin-top:0;padding-top:0}
.review .proj .txt>p.todo+p.todo+.links{border-top:1px dashed var(--rule);margin-top:14px;padding-top:12px}
@media (max-width:820px){.agent{min-height:44px;display:inline-flex;align-items:center}}