:root{--bg:#f4efe7;--paper:#fbf8f2;--ink:#292624;--muted:#817873;--accent:#a5485b;--line:#ded5ca;--header:76px;--radius:2px;color-scheme:light}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;font-family:Pretendard,"SUIT Variable",SUIT,"Noto Sans KR","Malgun Gothic",sans-serif;background:var(--bg);color:var(--ink)}button,a{font:inherit}.top{height:var(--header);position:fixed;z-index:10;inset:0 0 auto;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:24px;padding:0 max(22px,calc((100vw - 980px)/2));background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid color-mix(in srgb,var(--line) 65%,transparent)}.brand{color:inherit;text-decoration:none;font-size:13px;font-weight:800;letter-spacing:.22em;white-space:nowrap}.categories{display:flex;gap:22px;overflow-x:auto;scrollbar-width:none;mask-image:linear-gradient(90deg,transparent,#000 18px,#000 calc(100% - 18px),transparent);padding:18px}.categories::-webkit-scrollbar{display:none}.categories button,#theme,.action,.next{border:0;background:none;color:var(--muted);cursor:pointer;white-space:nowrap}.categories button{padding:10px 0;font-size:14px}.categories button.active{color:var(--accent);font-weight:700;box-shadow:inset 0 -2px var(--accent)}#theme{font-size:21px;color:var(--ink);padding:10px}#feed{height:100dvh;overflow-y:auto;scroll-snap-type:y mandatory;overscroll-behavior-y:contain;scroll-behavior:smooth}.page{height:100dvh;scroll-snap-align:start;scroll-snap-stop:always;display:grid;place-items:center;padding:calc(var(--header) + 32px) 24px 34px;position:relative}.sheet{width:min(100%,720px);min-height:min(68vh,640px);display:flex;flex-direction:column;justify-content:center;padding:clamp(32px,7vw,76px);background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);position:relative}.meta{font-size:13px;font-weight:700;color:var(--accent);margin-bottom:26px}.copy{margin:0;font-size:clamp(21px,3.8vw,30px);font-weight:520;line-height:1.58;letter-spacing:-.025em;word-break:keep-all;text-wrap:pretty}.short .copy{font-size:clamp(23px,4.2vw,34px);line-height:1.52}.medium .copy{font-size:clamp(20px,3.3vw,27px);line-height:1.62}.quote .copy{font-size:clamp(24px,4.5vw,36px);line-height:1.55}.attribution{margin-top:26px;color:var(--muted);font-size:14px;line-height:1.55}.actions{display:flex;align-items:center;gap:22px;margin-top:42px}.action{padding:7px 0;font-size:14px}.action.saved{color:var(--accent);font-weight:700}.next{margin-left:auto;padding:7px 0;color:var(--muted)}.counter{position:absolute;right:22px;bottom:18px;color:var(--muted);font-size:11px;letter-spacing:.08em}.ad{border-style:dashed;text-align:center;align-items:center}.ad small{color:var(--muted);letter-spacing:.16em}.gesture{position:fixed;z-index:12;left:50%;bottom:24px;transform:translateX(-50%);padding:9px 14px;background:var(--ink);color:var(--paper);font-size:12px;border-radius:999px;opacity:0;pointer-events:none;animation:hint 4s 1s both}#toast{position:fixed;z-index:20;left:50%;bottom:28px;transform:translate(-50%,12px);background:var(--ink);color:var(--paper);padding:10px 14px;border-radius:4px;font-size:13px;opacity:0;transition:.2s}#toast.show{opacity:1;transform:translate(-50%,0)}body.dark{--bg:#262321;--paper:#302c29;--ink:#f2ebe2;--muted:#b6aaa0;--accent:#db8392;--line:#49423d}body.visual-b{--bg:#f7f5f0;--paper:#f7f5f0;--ink:#20201f;--accent:#6f313e;--line:#d3cfc8}.visual-b .sheet{border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding-left:clamp(22px,6vw,62px);padding-right:clamp(22px,6vw,62px)}.visual-b .copy{font-weight:470}.visual-c{--bg:#f2eee9;--paper:#fffdf9;--accent:#b14f66;--line:#eadfd8;--radius:22px}.visual-c .sheet{box-shadow:0 18px 50px rgba(75,50,44,.08)}.visual-c .categories{gap:18px}.visual-c .meta{letter-spacing:.02em}.visual-c .action{color:var(--ink)}@keyframes hint{0%,100%{opacity:0;transform:translate(-50%,8px)}15%,70%{opacity:.86;transform:translate(-50%,0)}}@media(max-width:600px){:root{--header:94px}.top{grid-template-columns:1fr auto;padding:8px 18px 0;align-content:center;gap:0}.brand{align-self:center}.categories{grid-row:2;grid-column:1/3;order:3;margin:0 -18px;padding:2px 18px 10px;gap:20px;mask-image:none}#theme{grid-column:2;grid-row:1}.page{padding:calc(var(--header) + 18px) 14px 18px}.sheet{min-height:calc(100dvh - var(--header) - 46px);padding:34px 27px}.copy{font-size:23px;line-height:1.56}.short .copy{font-size:25px}.medium .copy{font-size:21px}.actions{margin-top:36px}.counter{display:none}}
@media(prefers-reduced-motion:reduce){#feed{scroll-behavior:auto}.gesture{animation:none;display:none}}

/* Deliberately distinct comparison directions. */
body.visual-b{--bg:#f8f6f1;--paper:#f8f6f1;--ink:#191918;--muted:#756f68;--accent:#713744;--line:#c9c3bb;--radius:0}.visual-b .top{background:var(--bg);border:0}.visual-b .brand{font-family:Georgia,"Times New Roman",serif;font-size:17px;font-weight:500;letter-spacing:.16em}.visual-b .categories{justify-content:center}.visual-b .categories button{font-size:13px}.visual-b .categories button.active{box-shadow:none}.visual-b .categories button.active::before{content:'— ';color:var(--accent)}.visual-b .page{justify-items:start}.visual-b .sheet{width:min(100%,660px);min-height:58vh;border:0;border-left:1px solid var(--line);padding:24px 28px 24px clamp(42px,9vw,110px);background:transparent}.visual-b .meta{font-size:12px;text-transform:uppercase;letter-spacing:.14em;margin-bottom:38px}.visual-b .copy{font-family:Georgia,"Noto Sans KR","Malgun Gothic",sans-serif;font-weight:400;line-height:1.72;max-width:560px}.visual-b .actions{border-top:1px solid var(--line);padding-top:18px;margin-top:54px}.visual-b .counter{display:none}.visual-b.dark{--bg:#242321;--paper:#242321;--ink:#eee9e0;--line:#4b4741}
.visual-c{--bg:#eee9e4;--paper:#fffdfa;--ink:#272326;--muted:#81777b;--accent:#b44561;--line:#ebd9df;--radius:28px}.visual-c .top{height:68px;margin:12px 14px 0;border:1px solid var(--line);border-radius:22px;padding:0 18px;background:color-mix(in srgb,var(--paper) 92%,transparent);box-shadow:0 8px 30px rgba(93,57,68,.07)}.visual-c .brand{font-size:12px;color:var(--accent)}.visual-c .categories{gap:8px}.visual-c .categories button{padding:8px 12px;border-radius:14px}.visual-c .categories button.active{color:#fff;background:var(--accent);box-shadow:none}.visual-c .page{padding-top:104px}.visual-c .sheet{min-height:min(66vh,610px);box-shadow:0 22px 70px rgba(75,50,56,.12);border-color:transparent;text-align:center;align-items:center;overflow:hidden}.visual-c .sheet::before{content:'';position:absolute;inset:0 0 auto;height:6px;background:var(--accent)}.visual-c .meta{padding:7px 12px;border-radius:999px;background:#f8e9ed;margin-bottom:30px}.visual-c.dark .meta{background:#4b333a}.visual-c .copy{max-width:570px}.visual-c .actions{width:100%;justify-content:center;margin-top:44px;padding:12px 16px;border-radius:18px;background:color-mix(in srgb,var(--bg) 65%,transparent)}.visual-c .next{margin-left:18px}.visual-c .counter{right:26px;bottom:22px}.visual-c.dark{--bg:#252123;--paper:#332d30;--ink:#f6edef;--line:#4b3c41}
.visual-a .page{perspective:1200px}.visual-a .sheet{transform:translateY(22px) scale(.994);opacity:.82;box-shadow:0 18px 42px rgba(67,48,42,0);transition:transform .52s cubic-bezier(.22,.75,.2,1),opacity .42s ease,box-shadow .52s ease;will-change:transform,opacity}.visual-a .page.active .sheet{transform:translateY(0) scale(1);opacity:1;box-shadow:0 18px 42px rgba(67,48,42,.075)}.visual-a .page.leaving .sheet{transform:translateY(-14px) scale(.997);opacity:.9}.visual-a.dark .page.active .sheet{box-shadow:0 20px 50px rgba(0,0,0,.18)}
@media(max-width:600px){.visual-b .top{height:86px;padding-top:4px}.visual-b .categories{justify-content:flex-start}.visual-b .page{padding-top:108px;padding-left:0;padding-right:0}.visual-b .sheet{min-height:calc(100dvh - 128px);padding:50px 32px 36px 44px;border-left:2px solid var(--accent)}.visual-b .copy{font-size:22px;line-height:1.68}.visual-b .short .copy{font-size:25px}.visual-b .actions{justify-content:flex-start}.visual-b .next{margin-left:auto}.visual-c .top{height:92px;margin:8px 9px 0;padding:7px 14px 0}.visual-c .categories{margin:0 -14px;padding-left:14px;gap:7px}.visual-c .categories button{padding:7px 10px}.visual-c .page{padding:116px 12px 14px}.visual-c .sheet{min-height:calc(100dvh - 138px);padding:40px 25px}.visual-c .copy{font-size:22px;line-height:1.52}.visual-c .short .copy{font-size:25px}.visual-c .actions{gap:14px}.visual-c .next{margin-left:4px}}
@media(prefers-reduced-motion:reduce){.visual-a .sheet{transition:none;transform:none;opacity:1}}
.book-mode #feed{position:relative;height:100dvh;overflow:hidden;scroll-snap-type:none}.book-mode .page{position:absolute;inset:0;z-index:2;transform-origin:left center}.book-mode .page:not(.turning){clip-path:none!important;transform:none!important}.book-mode .page.turning{z-index:5;will-change:clip-path,transform}.book-mode .page .sheet{transform:none;opacity:1;box-shadow:0 18px 42px rgba(67,48,42,.075)}.curl-fold,.curl-shadow{position:absolute;z-index:8;inset:calc(var(--header) + 32px) max(24px,calc((100vw - 720px)/2)) 34px;background:linear-gradient(90deg,rgba(255,255,255,.08),rgba(255,252,245,.96) 50%,rgba(126,91,80,.16));pointer-events:none;opacity:0}.curl-shadow{z-index:7;background:linear-gradient(90deg,transparent,rgba(48,31,26,.34),transparent);filter:blur(8px)}.dark .curl-fold{background:linear-gradient(90deg,rgba(255,255,255,.02),rgba(74,67,62,.95) 50%,rgba(0,0,0,.24))}@media(max-width:600px){.curl-fold,.curl-shadow{inset:calc(var(--header) + 18px) 14px 18px}}
.visual-a .page:not(.quote) .copy{font-size:clamp(21px,3.8vw,30px);line-height:1.58}.visual-a .page.medium:not(.quote) .copy,.visual-a .page.long:not(.quote) .copy{font-size:clamp(20px,3.3vw,27px);line-height:1.62}@media(max-width:600px){.visual-a .page:not(.quote) .copy,.visual-a .page.short:not(.quote) .copy,.visual-a .page.medium:not(.quote) .copy,.visual-a .page.long:not(.quote) .copy{font-size:23px;line-height:1.56}}

#locale{border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:999px;padding:8px 12px;font-size:12px;max-width:145px}@media(max-width:600px){.top{grid-template-columns:1fr auto auto}#locale{grid-column:2;grid-row:1;max-width:116px;padding:7px 9px}#theme{grid-column:3;grid-row:1}.categories{grid-column:1/4}}