@font-face{font-family:"Fredoka";font-style:normal;font-weight:400 700;font-display:swap;src:url(/pancake/fonts/fredoka-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
:root{--cream:#fff6e6;--cream2:#ffeac4;--card:#fffdf8;--ink:#3b1f0e;--muted:#7a5236;--line:#f0d6ad;
--batter:#f8cd7c;--golden:#e9a23b;--crust:#c9772a;--syrup:#a8551c;--maple:#4a2511;--butter:#ffe07a;--cherry:#d62839;--berry:#3d4fa0;
--plate:#ffffff;--shadow:rgba(74,37,17,.28);--display:"Fredoka",ui-rounded,"SF Pro Rounded","Hiragino Maru Gothic ProN","Apple SD Gothic Neo",system-ui,sans-serif;
--text:ui-rounded,"SF Pro Rounded",-apple-system,BlinkMacSystemFont,"Hiragino Maru Gothic ProN","Hiragino Sans","Apple SD Gothic Neo","Noto Sans KR","Segoe UI",system-ui,sans-serif;
--drip:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%20240%2044%22%3E%3Cpath%20d%3D%22M0%200H240V11H206C199%2011%20196%2015%20196%2021V27C196%2035%20184%2035%20184%2027V20C184%2014%20180%2011%20174%2011H124C117%2011%20114%2015%20114%2023V33C114%2042%20100%2042%20100%2033V21C100%2014%2096%2011%2089%2011H54C48%2011%2046%2014%2046%2018C46%2024%2036%2024%2036%2018C36%2014%2033%2011%2028%2011H0Z%22/%3E%3Ccircle%20cx%3D%22150%22%20cy%3D%2222%22%20r%3D%224%22/%3E%3C/svg%3E");color-scheme:light}
@media (prefers-color-scheme:dark){:root{--cream:#22130a;--cream2:#2d190c;--card:#341f11;--ink:#ffefd8;--muted:#e6c39a;--line:#5b3519;
--syrup:#c8702a;--maple:#140a04;--plate:#3d2615;--shadow:rgba(0,0,0,.5);color-scheme:dark}}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream);color:var(--ink);font:17px/1.65 var(--text);overflow-x:hidden}
:lang(ko) body,body:lang(ko){word-break:keep-all;overflow-wrap:anywhere}:lang(ja) body,body:lang(ja){line-break:strict}
img{max-width:100%;height:auto}
a{color:var(--syrup);text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{color:var(--cherry)}
:focus-visible{outline:3px solid var(--cherry);outline-offset:3px;border-radius:8px}
h1,h2,h3{font-family:var(--display);line-height:1.15;color:var(--ink);font-weight:650;letter-spacing:-.01em}
code{font:13px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--cream2);padding:1px 6px;border-radius:6px}
.pk-wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.pk-skip{position:absolute;left:-999px}.pk-skip:focus{left:12px;top:12px;z-index:99;background:var(--card);padding:8px 12px}
/* buttons */
.pk-btn{display:inline-flex;align-items:center;gap:8px;font:600 16px/1 var(--display);padding:14px 22px;border-radius:999px;text-decoration:none;
background:var(--syrup);color:#fff8ec;border:0;box-shadow:0 5px 0 var(--maple);transition:transform .15s,box-shadow .15s}
.pk-btn:hover{color:#fff;transform:translateY(-2px);box-shadow:0 7px 0 var(--maple)}
.pk-btn:active{transform:translateY(3px);box-shadow:0 2px 0 var(--maple)}
.pk-btn.butter{background:var(--butter);color:var(--maple);box-shadow:0 5px 0 var(--golden)}
.pk-btn.butter:hover{box-shadow:0 7px 0 var(--golden)}
.pk-btn.plain{background:var(--card);color:var(--ink);box-shadow:0 5px 0 var(--line);border:2px solid var(--line)}
.pk-btn.sm{font-size:14px;padding:10px 16px;box-shadow:0 4px 0 var(--maple)}
.pk-btn.soon{cursor:default}.pk-btn.soon:hover{transform:none;box-shadow:0 4px 0 var(--maple)}
/* header */
.pk-nav{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--cream) 88%,transparent);backdrop-filter:blur(10px) saturate(150%);-webkit-backdrop-filter:blur(10px) saturate(150%);border-bottom:2px dashed var(--line)}
.pk-nav .pk-wrap{display:flex;align-items:center;gap:10px 22px;min-height:66px;flex-wrap:wrap;padding-top:8px;padding-bottom:8px}
.pk-brand{display:flex;align-items:center;gap:10px;font:700 21px/1 var(--display);color:var(--ink)!important;text-decoration:none}
.pk-brand img{width:38px;height:38px;border-radius:10px;box-shadow:0 3px 0 var(--line);transition:transform .4s cubic-bezier(.3,1.6,.5,1)}
.pk-brand:hover img{transform:rotate(-12deg) scale(1.08)}
.pk-links{display:flex;align-items:center;gap:18px;margin-left:auto;flex-wrap:wrap}
.pk-links>a:not(.pk-btn){color:var(--muted);font:500 15px/1 var(--display);text-decoration:none}
.pk-links>a:not(.pk-btn):hover,.pk-links>a[aria-current]{color:var(--ink)}
.pk-lang{display:inline-flex;background:var(--cream2);border-radius:999px;padding:3px}
.pk-lang a{font:500 13px/1 var(--display);padding:6px 9px;border-radius:999px;color:var(--muted);text-decoration:none}
.pk-lang a.on{background:var(--card);color:var(--ink);box-shadow:0 2px 0 var(--line)}
@media(max-width:700px){.pk-links>a.pk-opt{display:none}.pk-links{gap:10px}}
/* syrup drip divider */
.pk-drip{height:44px;background:var(--syrup);-webkit-mask:var(--drip) repeat-x 0 0/240px 44px;mask:var(--drip) repeat-x 0 0/240px 44px}
/* hero */
.pk-hero{position:relative;padding:56px 0 40px;background:
radial-gradient(60% 70% at 78% 40%,color-mix(in srgb,var(--batter) 70%,transparent),transparent 70%),
radial-gradient(40% 50% at 8% 10%,color-mix(in srgb,var(--butter) 45%,transparent),transparent 70%)}
.pk-hero .pk-wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:30px;align-items:center}
.pk-kicker{display:inline-flex;align-items:center;gap:8px;font:600 14px/1 var(--display);color:var(--syrup);background:var(--card);border:2px solid var(--line);padding:8px 14px;border-radius:999px;transform:rotate(-2deg)}
.pk-kicker::before{content:"";width:12px;height:10px;border-radius:3px;background:var(--butter);box-shadow:inset -2px -2px 0 var(--golden)}
.pk-hero h1{margin:18px 0 14px;font-size:clamp(44px,7vw,78px);font-weight:700;letter-spacing:-.02em}
.pk-hero h1 .name{display:block}
.pk-hero h1 .tag{display:block;font-size:.46em;font-weight:550;color:var(--muted);margin-top:10px;letter-spacing:0}
.pk-hero h1 .name em{font-style:normal;color:var(--syrup);position:relative;white-space:nowrap}
.pk-hero h1 .name em::after{content:"";position:absolute;left:4%;right:4%;bottom:.06em;height:.16em;background:var(--butter);border-radius:99px;z-index:-1}
.pk-lede{font-size:19px;color:var(--ink);max-width:34em;margin:0 0 24px}
.pk-actions{display:flex;flex-wrap:wrap;gap:14px;margin:0 0 26px}
.pk-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.pk-chips li{font:500 14px/1 var(--display);background:var(--card);border:2px solid var(--line);color:var(--muted);padding:8px 12px;border-radius:999px}
.pk-chips li:nth-child(odd){transform:rotate(1.5deg)}.pk-chips li:nth-child(even){transform:rotate(-1.5deg)}
.pk-art{position:relative;justify-self:center;width:min(100%,500px)}
.pk-art .stack{position:relative;z-index:2;display:block;width:100%;filter:drop-shadow(0 22px 18px var(--shadow));animation:pk-bob 4.5s ease-in-out infinite;transform-origin:50% 90%;cursor:pointer}
.pk-art .stack:hover{animation:pk-wobble .7s ease-in-out}
.pk-art::before{content:"";position:absolute;z-index:1;left:4%;right:4%;bottom:2%;height:22%;border-radius:50%;background:var(--plate);box-shadow:0 10px 0 var(--line),0 24px 34px var(--shadow)}
.pk-berry{position:absolute;z-index:3;width:22px;height:22px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#8ea0ff,var(--berry) 55%,#202a66);box-shadow:0 4px 6px var(--shadow);animation:pk-float 5s ease-in-out infinite}
.pk-berry::after{content:"";position:absolute;left:8px;top:-1px;width:6px;height:4px;border-radius:2px;background:#1c2350}
.pk-berry.b1{left:2%;top:58%}.pk-berry.b2{right:3%;top:64%;animation-delay:-2s;width:18px;height:18px}.pk-berry.b3{left:12%;top:30%;animation-delay:-3.5s;width:15px;height:15px}
.pk-pat{position:absolute;z-index:3;right:6%;top:16%;width:46px;height:34px;border-radius:9px;background:linear-gradient(145deg,#fff6bf,var(--butter) 55%,#f2c94c);box-shadow:inset -4px -4px 0 rgba(233,162,59,.55),0 8px 10px var(--shadow);transform:rotate(14deg);animation:pk-float 6s ease-in-out infinite -1s}
@keyframes pk-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes pk-float{0%,100%{translate:0 0}50%{translate:0 -12px}}
@keyframes pk-wobble{0%,100%{transform:rotate(0)}20%{transform:rotate(-4deg) scale(1.02)}45%{transform:rotate(3deg)}70%{transform:rotate(-1.5deg)}}
@media(max-width:860px){.pk-hero .pk-wrap{grid-template-columns:1fr}.pk-art{width:min(86%,420px);order:-1}}
/* sections */
.pk-sec{padding:70px 0}
.pk-head{text-align:center;max-width:720px;margin:0 auto 40px}
.pk-head .eyebrow{font:600 14px/1 var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--crust)}
.pk-head h2{font-size:clamp(34px,5vw,52px);margin:10px 0 12px}
.pk-head p{color:var(--muted);margin:0;font-size:18px}
/* menu: every feature is a pancake */
.pk-menu{display:flex;flex-wrap:wrap;justify-content:center;gap:40px 28px;padding-bottom:14px}
.pk-menu>.pk-item{flex:1 1 290px;max-width:354px}
.pk-item{position:relative;background:var(--card);border:2px solid var(--line);border-radius:28px;padding:26px 24px 22px;
box-shadow:0 7px 0 -1px var(--batter),0 14px 0 -2px var(--golden),0 21px 0 -3px var(--crust),0 30px 30px -14px var(--shadow);
transition:transform .3s cubic-bezier(.3,1.5,.5,1)}
.pk-item:nth-child(3n+1){transform:rotate(-.8deg)}.pk-item:nth-child(3n+2){transform:rotate(.6deg)}.pk-item:nth-child(3n){transform:rotate(-.3deg)}
.pk-item:hover{transform:rotate(0) translateY(-6px)}
.pk-item .no{font:600 13px/1 var(--display);color:var(--crust);letter-spacing:.08em}
.pk-item h3{font-size:22px;margin:8px 0 10px}
.pk-item p{margin:0;color:var(--muted);font-size:16px}
.pk-item::after{content:"";position:absolute;right:20px;top:-12px;width:34px;height:24px;border-radius:7px;background:linear-gradient(145deg,#fff6bf,var(--butter) 60%,#f2c94c);box-shadow:inset -3px -3px 0 rgba(233,162,59,.5),0 4px 6px var(--shadow);transform:rotate(10deg) scale(0);transition:transform .35s cubic-bezier(.3,1.7,.5,1)}
.pk-item:hover::after{transform:rotate(10deg) scale(1)}
/* stacks (plans) */
.pk-stacks-sec{background:var(--cream2)}
.pk-stacks{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;align-items:end}
.pk-stack{text-align:center;background:var(--card);border:2px solid var(--line);border-radius:30px;padding:22px 22px 28px;position:relative}
.pk-stack picture{display:block;margin:-90px auto 4px;width:88%}
.pk-stack img{display:block;width:100%;filter:drop-shadow(0 14px 12px var(--shadow));transition:transform .45s cubic-bezier(.3,1.6,.5,1);transform-origin:50% 100%}
.pk-stack:hover img{transform:scale(1.06) rotate(-2deg)}
.pk-stack h3{font-size:28px;margin:6px 0 2px}
.pk-stack .topping{display:inline-block;font:500 14px/1.2 var(--display);color:var(--syrup);background:var(--cream);border-radius:999px;padding:6px 12px;margin:4px 0 12px}
.pk-stack p{margin:0;color:var(--muted);font-size:16px}
.pk-stack.full{border-color:var(--golden);box-shadow:0 8px 0 var(--golden)}
.pk-stacks-note{text-align:center;color:var(--muted);margin:30px 0 0}
@media(max-width:820px){.pk-stacks{grid-template-columns:1fr;gap:110px;max-width:420px;margin:90px auto 0}}
@media(min-width:821px){.pk-stacks{margin-top:110px}}
/* homemade: a napkin on a gingham tablecloth */
.pk-gingham{background-color:#fffaf2;background-image:linear-gradient(90deg,rgba(214,40,57,.16) 50%,transparent 50%),linear-gradient(rgba(214,40,57,.16) 50%,transparent 50%);background-size:32px 32px;padding:80px 0}
@media (prefers-color-scheme:dark){.pk-gingham{background-color:#2a1209;background-image:linear-gradient(90deg,rgba(214,40,57,.28) 50%,transparent 50%),linear-gradient(rgba(214,40,57,.28) 50%,transparent 50%)}}
.pk-napkin{max-width:760px;margin:0 auto;background:var(--card);border-radius:34px;padding:40px 40px 34px;text-align:center;box-shadow:0 12px 0 var(--line),0 30px 50px -20px var(--shadow);transform:rotate(-1deg)}
.pk-napkin .eyebrow{font:600 14px/1 var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--cherry)}
.pk-napkin h2{font-size:clamp(30px,4.4vw,44px);margin:10px 0 14px}
.pk-napkin p{margin:0;color:var(--muted);text-align:left}
/* call to action */
.pk-cta{text-align:center;padding:76px 0 70px}
.pk-flip{width:120px;height:120px;margin:0 auto 6px;position:relative}
.pk-flip span{position:absolute;left:10px;right:10px;top:34px;height:40px;border-radius:50%;background:radial-gradient(ellipse at 50% 35%,#ffd98e,var(--golden) 70%,var(--crust));box-shadow:inset 0 -5px 0 rgba(168,85,28,.45);animation:pk-flip 2.8s cubic-bezier(.45,0,.3,1) infinite}
.pk-flip::after{content:"";position:absolute;left:4px;right:4px;bottom:14px;height:22px;border-radius:50%;background:#2b2b2b;box-shadow:inset 0 -5px 0 #111,0 8px 14px var(--shadow)}
@keyframes pk-flip{0%,35%{transform:translateY(30px) rotateX(0)}55%{transform:translateY(-34px) rotateX(180deg)}75%,100%{transform:translateY(30px) rotateX(360deg)}}
.pk-cta h2{font-size:clamp(32px,5vw,50px);margin:6px 0 10px}
.pk-cta p{color:var(--muted);margin:0 auto 24px;max-width:36em}
.pk-cta .pk-actions{justify-content:center}
/* footer */
.pk-foot{background:var(--maple);color:#f6dcb8;padding:0 0 34px;font-size:15px}
.pk-foot>.pk-drip{margin-bottom:26px}
.pk-foot a{color:#ffe7c2}.pk-foot a:hover{color:var(--butter)}
.pk-foot .cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:28px}
.pk-foot .fbrand{display:flex;align-items:center;gap:10px;font:700 22px/1 var(--display);color:#fff4e2}
.pk-foot .fbrand img{width:40px;height:40px;border-radius:10px}
.pk-foot .colhead{font:600 13px/1 var(--display);letter-spacing:.1em;text-transform:uppercase;color:var(--batter);margin-bottom:10px}
.pk-foot ul{list-style:none;margin:0;padding:0}.pk-foot li{margin:0 0 6px}
.pk-foot p{margin:12px 0 0;max-width:28em;color:#e7c79d}
.pk-foot .fine{margin-top:28px;padding-top:18px;border-top:2px dashed rgba(255,231,194,.2);color:#cfae86;font-size:13px}
@media(max-width:760px){.pk-foot .cols{grid-template-columns:1fr}}
/* plain documents: support, privacy, source */
.pk-doc{max-width:780px;margin:0 auto;padding:44px 20px 70px}
.pk-doc article{background:var(--card);border:2px solid var(--line);border-radius:30px;padding:34px 36px;box-shadow:0 8px 0 var(--line)}
.pk-doc h1{font-size:clamp(32px,5vw,44px);margin:0 0 6px}
.pk-doc h2{font-size:24px;margin:34px 0 8px}
.pk-doc h3{font-size:19px;margin:24px 0 6px}
.pk-doc .muted{color:var(--muted)}
.pk-doc table{width:100%;border-collapse:collapse;font-size:14px}
.pk-doc td{padding:8px;border-top:2px dashed var(--line);vertical-align:top;overflow-wrap:anywhere}
.pk-doc code{font-size:12px}
@media(max-width:600px){.pk-doc article{padding:24px 20px;border-radius:24px}}
.pk-mini{text-align:center;color:var(--muted);font-size:14px;padding:0 20px 40px}
/* gentle entrance; content is visible when scripts are off */
.pk-js .pk-rise{opacity:0;translate:0 26px;transition:opacity .6s ease,translate .6s cubic-bezier(.3,1.4,.5,1)}
.pk-js .pk-rise.in{opacity:1;translate:0 0}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.pk-js .pk-rise{opacity:1;translate:none}html{scroll-behavior:auto}}