/*
 * PICK KIM Studio 3 — a soft K-beauty studio. Presentation only.
 *
 *   1 tokens       colour, type, radius, elevation, motion
 *   2 base         reset and type
 *   3 motion       .pk-press, .pk-card, .pk-rise, [data-pk-reveal], page handover
 *   4 surfaces     .pk-s-stage, .pk-s-tint, .pk-s-card, .pk-s-sheet (pick one; no one-off boxes)
 *   5 controls     buttons, links, fields, choices
 *   6 shell        header, desktop nav, phone tab bar, footer
 *   7 home
 *   8 services     profile, catalogue, library, reading pages, Today, search
 *   9 play         play hub, interactive engine, Estudio K-Beauty
 *  10 culture      Drama, Tournaments
 *  11 responsive, reduced motion, forced colours
 *
 * Only transform/translate/scale/opacity animate. Hover effects exist only for real pointers;
 * touch gets the press response. With reduced motion nothing moves and nothing stays hidden.
 */

/* ───────────── 1 tokens ───────────── */

/* Self-hosted OFL fonts (assets/fonts, subset by tools/art/fonts.sh). Body text stays on the system UI font. */
@font-face { font-family: "Bricolage Grotesque"; src: url(../fonts/bricolage-grotesque.woff2) format("woff2"); font-weight: 400 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Instrument Serif"; src: url(../fonts/instrument-serif-italic.woff2) format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "PK Hangul"; src: url(../fonts/pretendard-ornament.woff2) format("woff2"); font-weight: 400 900; font-display: swap; unicode-range: U+AC00-D7A3, U+00B7, U+2726; }

:root {
	color-scheme: light;

	/* Seoul Jewel: hanji ground, plum-ink night, jewel accents from a modern obangsaek. */
	--pk-bg: #fbf6ee;
	--pk-surface: #ffffff;
	--pk-surface-2: #fdf9f3;
	--pk-ink: #1a1530;
	--pk-ink-2: #3d3654;
	--pk-muted: #5f5873;
	--pk-line: rgb(26 21 48 / 0.1);
	--pk-line-strong: rgb(26 21 48 / 0.18);
	--pk-night: #15122b;
	--pk-night-2: #251a45;
	--pk-green: #c4194f;          /* the action colour (cherry); name kept for older rules */
	--pk-green-press: #a3113f;
	--pk-persimmon: #ff5c33;
	--pk-cherry: #e0245e;
	--pk-cherry-ink: #b3123f;      /* cherry for small text: AA on white, blush and hanji */
	--pk-celadon: #4fb894;
	--pk-lilac: #8f78ff;
	--pk-butter: #ffc93c;
	--pk-indigo: #2f3fb0;
	--pk-sage: #d3efe4;
	--pk-sage-2: #ebf8f2;
	--pk-blush: #ffdbe4;
	--pk-blush-2: #fff0f3;
	--pk-sky: #e7e2ff;
	--pk-cream: #fff2c7;
	--pk-clay: #e0245e;
	--pk-focus: #1a1530;
	--pk-shine: linear-gradient(100deg, #ff7a4d 0%, #ff4f86 35%, #b59bff 70%, #7fe0c0 100%);

	/* legacy names, still read by older component rules */
	--pk-paper: var(--pk-bg);
	--pk-rule: var(--pk-line-strong);
	--pk-soft: var(--pk-sage-2);
	--pk-lime: var(--pk-sage);

	--pk-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--pk-display: "Bricolage Grotesque", -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--pk-accent: "Instrument Serif", "Iowan Old Style", Georgia, serif;
	--pk-hangul: "PK Hangul", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif;
	--pk-sans: var(--pk-font);
	--pk-serif: var(--pk-display);

	--pk-r-xs: 10px;
	--pk-r-sm: 14px;
	--pk-r-md: 20px;
	--pk-r-lg: 28px;
	--pk-r-xl: 36px;
	--pk-r-pill: 999px;

	--pk-shadow-1: 0 1px 2px rgb(28 36 32 / 0.05), 0 2px 10px -2px rgb(28 36 32 / 0.06);
	--pk-shadow-2: 0 2px 6px rgb(28 36 32 / 0.05), 0 14px 34px -10px rgb(28 36 32 / 0.14);
	--pk-shadow-3: 0 4px 12px rgb(28 36 32 / 0.06), 0 26px 52px -14px rgb(28 36 32 / 0.2);
	--pk-shadow-press: 0 1px 2px rgb(28 36 32 / 0.08), 0 4px 10px -6px rgb(28 36 32 / 0.12);

	/* How long: by what is moving. */
	--pk-instant: 90ms;   /* a press going down */
	--pk-fast: 160ms;     /* colour, an arrow */
	--pk-ui: 280ms;       /* a card or panel answering */
	--pk-release: 460ms;  /* a press letting go, on the spring */
	--pk-page: 360ms;     /* page handover */
	--pk-scene: 640ms;    /* the hero arriving */
	--pk-medium: var(--pk-ui);

	/* How: out for arriving, soft for light and colour, one gentle spring for things you touch. */
	--pk-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
	--pk-ease-soft: cubic-bezier(0.33, 0, 0.2, 1);
	--pk-ease: var(--pk-ease-out);
	--pk-spring: cubic-bezier(0.25, 1.25, 0.4, 1);
	--pk-press-scale: 0.965;
	--pk-lift: -3px;

	--pk-tabbar-h: 62px;
	--pk-header-h: 68px;
	--pk-gutter: clamp(20px, 4.4vw, 56px);
}

@supports (transition-timing-function: linear(0, 1)) {
	:root {
		/* about 2% overshoot: settles like a sheet of glass, never bounces like a cartoon */
		--pk-spring: linear(0, 0.21 5%, 0.55 12%, 0.8 19%, 0.94 26%, 1.012 34%, 1.022 41%, 1.012 52%, 1.002 66%, 1);
	}
}

/* ───────────── 2 base ───────────── */

*, *::before, *::after { box-sizing: border-box; }
html { scroll-padding-top: calc(var(--pk-header-h) + 16px); -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	background: var(--pk-bg);
	color: var(--pk-ink);
	font: 17px/1.55 var(--pk-font);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 0.22em; }
button, input, select, textarea { font: inherit; color: inherit; }
button, a, input, select, summary { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
button:disabled { cursor: default; opacity: 0.45; }
img, svg { max-width: 100%; }
img { height: auto; }
h1, h2, h3, h4, h5, p, figure { margin: 0; }
h1, h2, h3, h4, h5 { font-family: var(--pk-display); font-weight: 700; letter-spacing: -0.03em; line-height: 1.08; font-optical-sizing: auto; }
h1 em, h2 em, h3 em { font-family: var(--pk-accent); font-style: italic; font-weight: 400; letter-spacing: -0.01em; }
h1 { font-size: clamp(2.4rem, 5vw, 4.2rem); letter-spacing: -0.04em; line-height: 1.02; font-weight: 800; }
h2 { font-size: clamp(1.6rem, 2.8vw, 2.3rem); }
h3 { font-size: 1.3rem; }
p { max-width: 68ch; }
ul, ol { padding-left: 1.3rem; }
li + li { margin-top: 0.35rem; }
:focus-visible { outline: 3px solid var(--pk-focus); outline-offset: 3px; border-radius: 6px; }
[hidden] { display: none !important; }
::selection { background: var(--pk-sage); color: var(--pk-ink); }

.pk-shell { width: min(1240px, calc(100% - 2 * var(--pk-gutter))); margin-inline: auto; }
.pk-eyebrow {
	font: 600 0.75rem/1.4 var(--pk-font);
	letter-spacing: 0.02em;
	text-transform: none;
	color: var(--pk-muted);
}
.pk-screen-reader-text { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pk-skip-link {
	position: fixed; top: 10px; left: 16px; z-index: 1000;
	translate: 0 -160%;
	background: var(--pk-surface); color: var(--pk-ink);
	padding: 0.8rem 1.1rem; border-radius: var(--pk-r-pill); box-shadow: var(--pk-shadow-2);
}
.pk-skip-link:focus { translate: none; }

/* ───────────── 3 motion ───────────── */

/* Everything tappable: a quick compression, then a soft spring back. */
.pk-press,
.pk-button, .pk-primary-link, .pk-icon-button, .pk-choice, .pk-profile-button, .pk-candidate-button,
.pk-beauty-button, .pk-service-filters button, .pk-search-form button {
	transition:
		scale var(--pk-release) var(--pk-spring),
		translate var(--pk-release) var(--pk-spring),
		box-shadow var(--pk-ui) var(--pk-ease-soft),
		background-color var(--pk-fast) var(--pk-ease-soft),
		border-color var(--pk-fast) var(--pk-ease-soft),
		color var(--pk-fast) var(--pk-ease-soft),
		opacity var(--pk-fast) var(--pk-ease-soft);
	touch-action: manipulation;
}
.pk-press:active,
.pk-button:active, .pk-primary-link:active, .pk-icon-button:active, .pk-choice:active, .pk-profile-button:active,
.pk-candidate-button:active, .pk-beauty-button:active, .pk-service-filters button:active, .pk-search-form button:active {
	scale: var(--pk-press-scale);
	transition-duration: var(--pk-instant);
	transition-timing-function: var(--pk-ease-out);
}

/* An elevated, tappable card: lift, light, picture and arrow answer together. */
.pk-card { position: relative; isolation: isolate; }
.pk-card [data-pk-card-media] { transition: scale var(--pk-scene) var(--pk-ease-out), translate var(--pk-scene) var(--pk-ease-out); }
.pk-card [data-pk-card-arrow] { display: inline-block; transition: translate var(--pk-ui) var(--pk-ease-out); }
.pk-card:active { box-shadow: var(--pk-shadow-press); }

@media (hover: hover) and (pointer: fine) {
	.pk-card:hover { translate: 0 var(--pk-lift); box-shadow: var(--pk-shadow-3); }
	.pk-card:hover [data-pk-card-media] { scale: 1.04; translate: 0 -4px; }
	.pk-card:hover [data-pk-card-arrow] { translate: 4px 0; }
	.pk-button:hover, .pk-primary-link:hover { translate: 0 -1px; box-shadow: var(--pk-shadow-2); }
}

@media (prefers-reduced-motion: no-preference) {
	/* Arrival: a short, staggered rise for the first view. */
	.pk-rise { animation: pk-rise var(--pk-scene) var(--pk-ease-out) both; animation-delay: calc(var(--pk-rise-i, 0) * 70ms + 60ms); }
	.pk-hero-art img { animation: pk-settle 1100ms var(--pk-ease-out) both; }

	/* Below the fold: one gentle rise as each block comes into view (class added by studio.js). */
	[data-pk-reveal].pk-reveal-wait { opacity: 0; translate: 0 18px; }
	[data-pk-reveal] { transition: opacity 700ms var(--pk-ease-out), translate 700ms var(--pk-ease-out); }

	/* Page handover: cross-document view transition as progressive enhancement. Links stay links. */
	@view-transition { navigation: auto; }
	.pk-site-header { view-transition-name: pk-header; }
	.pk-tabbar { view-transition-name: pk-tabbar; }
	::view-transition-old(root) { animation: pk-fade-out 180ms var(--pk-ease-soft) both; }
	::view-transition-new(root) { animation: pk-page-in var(--pk-page) var(--pk-ease-out) both; }
}

@keyframes pk-rise { from { opacity: 0; translate: 0 14px; } to { opacity: 1; translate: none; } }
@keyframes pk-settle { from { opacity: 0; scale: 1.035; } to { opacity: 1; scale: 1; } }
@keyframes pk-fade-out { to { opacity: 0; } }
@keyframes pk-page-in { from { opacity: 0; translate: 0 10px; } to { opacity: 1; translate: none; } }
@keyframes pk-sheet-in { from { opacity: 0; translate: 0 10px; scale: 0.985; } to { opacity: 1; translate: none; scale: 1; } }

/* ───────────── 4 surfaces ───────────── */

/* A large soft stage that holds rendered art. */
.pk-s-stage { position: relative; overflow: hidden; border-radius: var(--pk-r-xl); background: var(--pk-tint, #e6e3dd); }
/* A tinted panel for a featured idea. */
.pk-s-tint { border-radius: var(--pk-r-lg); background: linear-gradient(160deg, var(--pk-sage-2), var(--pk-sage)); }
/* A white card on the page. */
.pk-s-card { border-radius: var(--pk-r-lg); background: var(--pk-surface); box-shadow: var(--pk-shadow-1); }
/* A working sheet: questions, games, reading tools. */
.pk-s-sheet { border-radius: var(--pk-r-xl); background: var(--pk-surface); box-shadow: var(--pk-shadow-2); }

/* ───────────── 5 controls ───────────── */

.pk-button, .pk-primary-link {
	display: inline-flex; align-items: center; justify-content: center; gap: 0.6rem;
	min-height: 52px; padding: 0.85rem 1.5rem;
	border: 0; border-radius: var(--pk-r-pill);
	background: var(--pk-green); color: #fff;
	font: 600 1rem/1.2 var(--pk-font); letter-spacing: -0.005em;
	text-decoration: none; box-shadow: var(--pk-shadow-1);
	white-space: nowrap;
}
.pk-primary-link > span[aria-hidden] { font-size: 0.95em; }
.pk-button:hover, .pk-primary-link:hover, button.pk-primary-link:hover:not(:disabled) { background: var(--pk-green-press); color: #fff; }
.pk-button--quiet { background: var(--pk-surface); color: var(--pk-ink); box-shadow: var(--pk-shadow-1); }
.pk-button--quiet:hover { background: var(--pk-surface); color: var(--pk-ink); }
.pk-secondary-link, .pk2-text-link, .pk-link {
	display: inline-flex; align-items: center; gap: 0.35rem; min-height: 44px;
	font: 600 0.95rem/1.3 var(--pk-font); color: var(--pk-green);
	text-decoration: none;
}
.pk-secondary-link:hover, .pk2-text-link:hover, .pk-link:hover { text-decoration: underline; }
.pk-icon-button {
	display: inline-grid; place-items: center; width: 44px; height: 44px;
	border-radius: var(--pk-r-pill); color: var(--pk-ink);
}
@media (hover: hover) and (pointer: fine) { .pk-icon-button:hover { background: rgb(28 36 32 / 0.06); } }

input, select, textarea {
	min-height: 50px; width: 100%;
	padding: 0.75rem 1rem;
	border: 1px solid var(--pk-line-strong); border-radius: var(--pk-r-sm);
	background: var(--pk-surface); color: var(--pk-ink);
	transition: border-color var(--pk-fast) var(--pk-ease-soft), box-shadow var(--pk-fast) var(--pk-ease-soft);
}
input:focus, select:focus, textarea:focus { border-color: var(--pk-green); box-shadow: 0 0 0 4px rgb(196 25 79 / 0.14); outline: none; }
input:focus-visible, select:focus-visible { outline: none; }
input[type=checkbox] { width: 22px; min-height: 22px; height: 22px; accent-color: var(--pk-green); }
button {
	min-height: 46px; padding: 0.7rem 1.15rem;
	border: 1px solid var(--pk-line-strong); border-radius: var(--pk-r-pill);
	background: var(--pk-surface);
}
@media (hover: hover) and (pointer: fine) { button:hover:not(:disabled) { background: var(--pk-sage-2); } }
summary { cursor: pointer; min-height: 44px; padding-block: 0.5rem; }

/* ───────────── 6 shell ───────────── */

.pk-site-header {
	position: sticky; top: 0; z-index: 60;
	background: rgb(251 246 238 / 0.8);
	-webkit-backdrop-filter: saturate(180%) blur(20px);
	backdrop-filter: saturate(180%) blur(20px);
	border-bottom: 1px solid transparent;
	transition: border-color var(--pk-ui) var(--pk-ease-soft), background-color var(--pk-ui) var(--pk-ease-soft);
}
.pk-scrolled .pk-site-header { border-bottom-color: var(--pk-line); }
.pk-site-header__inner { min-height: var(--pk-header-h); display: flex; align-items: center; gap: 24px; }
.pk-wordmark { display: inline-flex; align-items: center; min-height: 44px; flex-shrink: 0; text-decoration: none; font: 800 1.25rem/1 var(--pk-display); letter-spacing: -0.04em; }
.pk-wordmark > span { white-space: nowrap; }
.pk-wordmark-dot { color: var(--pk-clay); margin-left: 4px; font-weight: 400; }
.pk-wordmark small { display: none; }

.pk-desktop-nav { margin-inline: auto; }
.pk-nav { display: flex; list-style: none; margin: 0; padding: 4px; gap: 2px; align-items: center; }
.pk-nav li { margin: 0; }
.pk-desktop-nav .pk-nav { background: rgb(28 36 32 / 0.045); border-radius: var(--pk-r-pill); }
.pk-nav-group > a {
	display: flex; align-items: center; min-height: 40px; padding: 0 16px;
	border-radius: var(--pk-r-pill);
	font: 600 0.9rem/1 var(--pk-font); color: var(--pk-ink-2); text-decoration: none; white-space: nowrap;
}
.pk-nav-group > a[aria-current=page] { background: var(--pk-surface); color: var(--pk-ink); box-shadow: var(--pk-shadow-1); }
@media (hover: hover) and (pointer: fine) { .pk-nav-group > a:not([aria-current]):hover { color: var(--pk-ink); background: rgb(255 255 255 / 0.6); } }
.pk-nav-sub { display: none; }
.pk-header-tools { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.pk-desktop-nav + .pk-header-tools { margin-left: 0; }

.pk-languages { display: flex; align-items: center; gap: 2px; padding: 3px; border-radius: var(--pk-r-pill); background: rgb(28 36 32 / 0.045); font: 700 0.72rem/1 var(--pk-font); letter-spacing: 0.02em; }
.pk-languages a { display: grid; place-items: center; min-width: 44px; min-height: 38px; border-radius: var(--pk-r-pill); text-decoration: none; color: var(--pk-muted); }
.pk-languages a[aria-current] { background: var(--pk-surface); color: var(--pk-ink); box-shadow: var(--pk-shadow-1); }
.pk-menu-toggle { display: none; }

/* Phone tab bar: the five worlds, always one tap away. */
.pk-tabbar { display: none; }

.pk-site-footer { margin-top: clamp(64px, 9vw, 120px); padding: 56px 0 calc(40px + env(safe-area-inset-bottom)); background: var(--pk-surface-2); border-top: 1px solid var(--pk-line); color: var(--pk-ink); }
.pk-footer-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 30px; margin-bottom: 40px; }
.pk-footer-heading p { font: 650 clamp(1.5rem, 2.6vw, 2.1rem)/1.15 var(--pk-display); letter-spacing: -0.025em; max-width: 18ch; }
.pk-footer-star { font-size: 2.4rem; line-height: 1; color: var(--pk-clay); }
.pk-site-footer__inner { display: flex; justify-content: space-between; gap: 40px; align-items: flex-start; }
.pk-site-footer__inner p { font-size: 0.9rem; color: var(--pk-muted); margin-top: 12px; max-width: 34ch; }
.pk-site-footer .pk-nav { flex-wrap: wrap; padding: 0; gap: 4px; }
.pk-site-footer .pk-nav-group > a { padding: 0 12px; font-weight: 500; color: var(--pk-ink-2); }
.pk-footer-colophon { margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--pk-line); display: flex; justify-content: space-between; gap: 24px; font-size: 0.78rem; color: var(--pk-muted); }

/* ───────────── 7 home ───────────── */
/* (homepage rules live in the Seoul Jewel section at the end of this file) */

/* ───────────── 8 services ───────────── */

.pk-service-page, .pk-play-page, .pk-torneo-page, .pk-listing { padding-top: 20px; padding-bottom: 40px; }
.pk-play-crumbs, .pk-torneo-page > nav, .pk-breadcrumbs { font-size: 0.85rem; color: var(--pk-muted); line-height: 1.6; }
.pk-play-crumbs a, .pk-torneo-page > nav a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; color: var(--pk-green); font-weight: 600; }

/* A large title, like the top of an iOS screen: short and certain. */
.pk-service-heading, .pk-play-heading, .pk-page-heading { margin: 12px 0 36px; max-width: 760px; }
.pk-service-heading > .pk-eyebrow, .pk-play-heading > .pk-eyebrow, .pk-page-heading > .pk-eyebrow { margin-bottom: 10px; color: var(--pk-green); }
.pk-service-heading > p:not(.pk-eyebrow), .pk-play-heading > p:not(.pk-eyebrow), .pk-page-heading > p:not(.pk-eyebrow) { margin-top: 14px; color: var(--pk-ink-2); font-size: 1.1rem; line-height: 1.55; max-width: 56ch; }

.pk-service-filters {
	display: flex; flex-wrap: wrap; align-items: end; gap: 14px;
	margin-block: 0 28px; padding: 18px;
	border: 0; border-radius: var(--pk-r-lg); background: var(--pk-surface); box-shadow: var(--pk-shadow-1);
}
.pk-service-filters label { display: grid; gap: 6px; flex: 1 1 200px; font-size: 0.82rem; font-weight: 600; color: var(--pk-muted); }
.pk-service-filters button { align-self: end; background: var(--pk-green); color: #fff; border: 0; min-height: 50px; padding-inline: 24px; font-weight: 600; }
.pk-service-filters button:hover:not(:disabled) { background: var(--pk-green-press); }
.pk-service-count { font-size: 0.85rem; font-weight: 600; color: var(--pk-muted); margin-block: 0 14px; letter-spacing: 0; text-transform: none; }

/* Lists of products and guides: an inset grouped list, not a wall of tiles. */
.pk-service-grid {
	display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px;
	padding: 6px 28px; border-radius: var(--pk-r-lg); background: var(--pk-surface); box-shadow: var(--pk-shadow-1);
}
.pk-service-card { padding: 22px 0; min-width: 0; border: 0; border-bottom: 1px solid var(--pk-line); background: none; border-radius: 0; box-shadow: none; }
.pk-service-card .pk-eyebrow { margin-bottom: 6px; }
.pk-service-card h2 { font-size: 1.2rem; line-height: 1.3; letter-spacing: -0.015em; }
.pk-service-card h2 a { text-decoration: none; overflow-wrap: break-word; }
.pk-service-card h2 a::after { content: ""; position: absolute; inset: 0; }
.pk-service-card { position: relative; }
@media (hover: hover) and (pointer: fine) { .pk-service-card:hover h2 a { color: var(--pk-green); } }
.pk-service-card > p:not(.pk-eyebrow) { margin-top: 6px; color: var(--pk-muted); font-size: 0.93rem; line-height: 1.5; }
.pk-service-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-block: 0 24px; padding: 0; border: 0; font-size: 0.92rem; }
.pk-service-tabs a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: var(--pk-r-pill); background: var(--pk-surface); box-shadow: var(--pk-shadow-1); text-decoration: none; font-weight: 600; color: var(--pk-ink-2); border: 0; }
.pk-service-tabs a[aria-current] { background: var(--pk-ink); color: #fff; }

/* Reading pages: one comfortable column on a white sheet. */
.pk-service-reading, .pk-service-detail {
	max-width: 780px; margin-inline: auto;
	padding: clamp(28px, 5vw, 56px); border-radius: var(--pk-r-xl); background: var(--pk-surface); box-shadow: var(--pk-shadow-1);
}
.pk-service-reading h2, .pk-service-detail h2 { font-size: 1.45rem; margin-block: 36px 12px; }
.pk-service-reading > .pk-eyebrow { margin-bottom: 14px; }
.pk-service-reading p, .pk-service-detail p { font-size: 1.04rem; line-height: 1.75; color: var(--pk-ink-2); }
.pk-service-reading p + p, .pk-service-detail p + p { margin-top: 14px; }
.pk-service-reading .pk-service-lead, .pk-service-detail .pk-service-lead { font-size: 1.22rem; line-height: 1.6; color: var(--pk-ink); }
.pk-service-reading li { line-height: 1.7; font-size: 1rem; color: var(--pk-ink-2); }
.pk-service-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin-block: 28px; padding: 4px 22px; border: 0; border-radius: var(--pk-r-md); background: var(--pk-surface-2); box-shadow: inset 0 0 0 1px var(--pk-line); }
.pk-service-facts > div { padding: 14px 0; border-bottom: 1px solid var(--pk-line); }
.pk-service-facts dt { color: var(--pk-muted); font-size: 0.8rem; font-weight: 600; margin-bottom: 2px; }
.pk-service-facts dd { margin: 0; font-size: 0.98rem; }
.pk-today-culture { margin-top: 48px; padding-top: 28px; border-top: 1px solid var(--pk-line); }
.pk-today-culture p { color: var(--pk-muted); margin-top: 12px; }
.pk-today-culture ul { list-style: none; padding: 0; }
.pk-today-culture li { padding: 14px 0; border-bottom: 1px solid var(--pk-line); }

/* Skin Profile: one question at a time on a sheet. */
.pk-profile { max-width: 900px; margin-inline: auto; padding: clamp(24px, 5vw, 52px); border-radius: var(--pk-r-xl); background: var(--pk-surface); box-shadow: var(--pk-shadow-2); border: 0; }
.pk-profile-stage { min-height: 260px; margin-block: 8px 24px; }
.pk-profile-stage > h2 { font-size: clamp(1.6rem, 3vw, 2.3rem); max-width: 26ch; margin-bottom: 16px; }
.pk-profile-stage > p { max-width: 56ch; color: var(--pk-ink-2); margin-block: 12px; }
.pk-js .pk-profile-stage > * { animation: pk-sheet-in var(--pk-ui) var(--pk-ease-out) both; }
.pk-profile-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; max-width: 760px; margin-block: 22px; }
.pk-profile-button, .pk-choice {
	display: block; width: 100%; min-height: 64px; padding: 18px 20px;
	border: 1px solid var(--pk-line); border-radius: var(--pk-r-md);
	background: var(--pk-surface-2); color: var(--pk-ink);
	text-align: left; font-size: 1rem; line-height: 1.45; font-weight: 500;
	box-shadow: var(--pk-shadow-1);
}
@media (hover: hover) and (pointer: fine) {
	.pk-profile-button:hover, .pk-choice:hover { background: var(--pk-surface); border-color: rgb(196 25 79 / 0.45); translate: 0 -1px; box-shadow: var(--pk-shadow-2); color: var(--pk-ink); }
}
.pk-profile-button[aria-pressed=true], .pk-choice[aria-pressed=true] { background: var(--pk-sage-2); border-color: var(--pk-green); }
.pk-profile-priorities { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.pk-profile-priorities li { margin: 0; padding: 16px 18px; border-radius: var(--pk-r-md); background: var(--pk-sage-2); font-size: 1rem; font-weight: 600; }
.pk-profile-priorities small { display: block; font-size: 0.86rem; font-weight: 400; color: var(--pk-ink-2); margin-top: 4px; }
.pk-profile-modes { display: flex; flex-wrap: wrap; gap: 8px; margin-block: 24px; padding: 4px; width: fit-content; border-radius: var(--pk-r-pill); background: rgb(28 36 32 / 0.05); }
.pk-profile-modes button { min-width: 120px; min-height: 42px; border: 0; background: transparent; font-weight: 600; color: var(--pk-ink-2); }
.pk-profile-modes button[aria-pressed=true], .pk-profile-modes button[aria-selected=true] { background: var(--pk-surface); color: var(--pk-ink); box-shadow: var(--pk-shadow-1); }
.pk-profile-plans { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-block: 24px; gap: 16px; }
.pk-profile-plans section { padding: 26px; border-radius: var(--pk-r-lg); background: linear-gradient(160deg, var(--pk-sage-2), #e6eee3); }
.pk-profile-plans section + section { background: linear-gradient(160deg, var(--pk-blush-2), var(--pk-blush)); }
.pk-profile-plans h3 { font-size: 1.5rem; }
.pk-profile-plans ol { margin-block: 18px 0; padding-left: 1.2rem; }
.pk-profile-plans li { padding-block: 8px; }
.pk-profile-plans h4 { font: 650 1.02rem/1.4 var(--pk-font); }
.pk-profile-plans p { font-size: 0.93rem; line-height: 1.6; margin-top: 4px; color: var(--pk-ink-2); }
.pk-profile-picks { padding-block: 24px; border-color: var(--pk-line); }
.pk-profile-picks > h4 { font: 650 0.92rem var(--pk-font); color: var(--pk-muted); margin-bottom: 16px; }
.pk-profile-picks article { padding: 18px 20px; border-radius: var(--pk-r-md); background: var(--pk-surface-2); box-shadow: inset 0 0 0 1px var(--pk-line); }
.pk-profile-picks article + article { margin-top: 10px; }
.pk-profile-picks h5 { font: 650 1.15rem/1.3 var(--pk-display); margin-top: 6px; }
.pk-profile-picks li { font-size: 0.93rem; color: var(--pk-ink-2); }
.pk-profile [data-profile-status] { font-size: 0.85rem; font-weight: 600; color: var(--pk-muted); margin-block: 0 16px; }
.pk-profile-save { font-size: 0.92rem; margin-block: 20px; display: flex; gap: 10px; align-items: center; }
.pk-profile-boundary { border-top: 1px solid var(--pk-line); padding-top: 20px; color: var(--pk-muted); margin-top: 24px; line-height: 1.6; font-size: 0.92rem; }
.pk-profile [data-profile-restart] { margin-top: 12px; }
.pk-profile-link { min-height: 44px; }

/* Search */
.pk-search-form { display: flex; align-items: flex-end; gap: 10px; margin-block: 16px; }
.pk-search-form label { display: grid; gap: 6px; font-size: 0.85rem; font-weight: 600; color: var(--pk-muted); flex: 1; }
.pk-search-form input { border-radius: var(--pk-r-pill); padding-inline: 20px; background: var(--pk-surface); }
.pk-search-form button { background: var(--pk-green); color: #fff; border: 0; min-height: 50px; padding-inline: 24px; font-weight: 600; }
.pk-search-form button:hover:not(:disabled) { background: var(--pk-green-press); }

/* ───────────── 9 play ───────────── */

.pk-play-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.pk-play-card {
	display: grid; grid-template-columns: 120px 1fr; align-items: center; gap: 20px;
	padding: 16px; border: 0; border-radius: var(--pk-r-lg); background: var(--pk-surface); box-shadow: var(--pk-shadow-1);
	text-decoration: none; min-width: 0;
	transition: translate var(--pk-ui) var(--pk-ease-out), box-shadow var(--pk-ui) var(--pk-ease-soft), scale var(--pk-release) var(--pk-spring);
}
.pk-play-card:active { scale: var(--pk-press-scale); transition-duration: var(--pk-instant); }
@media (hover: hover) and (pointer: fine) { .pk-play-card:hover { translate: 0 var(--pk-lift); box-shadow: var(--pk-shadow-3); background: var(--pk-surface); } }
.pk-play-card__art { aspect-ratio: 1; background: var(--pk-sage-2); border-radius: var(--pk-r-md); overflow: hidden; }
.pk-play-card__art img { width: 100%; height: 100%; object-fit: contain; padding: 6%; }
.pk-play-card__copy { padding: 0; min-width: 0; }
.pk-play-card :is(h2, h3) { font-size: 1.2rem; line-height: 1.25; margin-block: 4px 6px; }
.pk-play-card p:not(.pk-eyebrow) { font-size: 0.92rem; color: var(--pk-muted); line-height: 1.5; }
.pk-play-card__action { display: inline-block; margin-top: 8px; font-size: 0.9rem; font-weight: 600; color: var(--pk-green); }
.pk-play-page > section { margin-block: 40px; }
.pk-play-page > section > h2 { margin-bottom: 18px; }

.pk-beauty-feature {
	display: grid; grid-template-columns: 1fr minmax(0, 0.8fr); align-items: center; gap: 24px;
	margin-block: 8px 40px; padding: clamp(28px, 4vw, 48px);
	border-radius: var(--pk-r-xl); background: radial-gradient(120% 100% at 80% 60%, #fdf6f2, var(--pk-blush) 75%); box-shadow: var(--pk-shadow-1);
}
.pk-beauty-feature h2 { font-size: clamp(1.9rem, 3.4vw, 2.8rem); margin-block: 10px 12px; }
.pk-beauty-feature p { max-width: 40ch; color: var(--pk-ink-2); }
.pk-beauty-feature .pk-primary-link { margin-top: 22px; }

.pk-interactive-shell { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 32px; margin-block: 8px 40px; padding: clamp(18px, 3vw, 32px); border-radius: var(--pk-r-xl); background: var(--pk-surface); box-shadow: var(--pk-shadow-2); }
.pk-experience-art { position: relative; background: var(--pk-sage-2); border-radius: var(--pk-r-lg); overflow: hidden; align-self: start; }
.pk-experience-art img { width: 100%; height: auto; display: block; object-fit: contain; }
.pk-experience-body { padding: 12px 8px; min-width: 0; }
.pk-js .pk-experience-body > * { animation: pk-sheet-in var(--pk-ui) var(--pk-ease-out) both; }
.pk-experience-status { font: 600 0.82rem var(--pk-font); color: var(--pk-muted); margin-bottom: 16px; }
.pk-question-title { font-size: clamp(1.5rem, 2.6vw, 2.1rem); line-height: 1.2; margin-bottom: 22px; }
.pk-choice-list { display: grid; grid-template-columns: 1fr; gap: 10px; }
.pk-experience-tools { display: flex; gap: 8px; margin-top: 22px; }
.pk-experience-tools button { border: 0; background: rgb(28 36 32 / 0.05); font-size: 0.9rem; font-weight: 600; }
.pk-original-result { border: 0; border-radius: var(--pk-r-lg); background: linear-gradient(160deg, var(--pk-sage-2), var(--pk-sage)); padding: 30px; }
.pk-original-result h2 { font-size: clamp(1.7rem, 3vw, 2.3rem); line-height: 1.15; }
.pk-original-result p { line-height: 1.65; color: var(--pk-ink-2); }
.pk-result-why { border-color: var(--pk-line-strong); margin-top: 18px; padding-top: 18px; }
.pk-result-actions, .pk-result-controls { display: flex; flex-wrap: wrap; gap: 12px; }
.pk-journey-map { color: var(--pk-muted); gap: 6px 14px; font-size: 0.8rem; margin-bottom: 22px; }
.pk-journey-map li[aria-current] { color: var(--pk-green); font-weight: 700; }
.pk-scene-body { font-size: 1.04rem; line-height: 1.75; max-width: 62ch; margin-bottom: 24px; }
.pk-inventory { color: var(--pk-muted); font-size: 0.86rem; margin-block: 22px; padding-top: 18px; border-color: var(--pk-line); }
.pk-mini-feedback { margin-top: 22px; background: var(--pk-sage-2); border: 0; border-radius: var(--pk-r-lg); padding: 24px; }
.pk-mini-feedback h3 { font-size: 1.35rem; margin-bottom: 10px; }
.pk-mini-feedback p { font-size: 0.98rem; line-height: 1.6; }
.pk-mini-feedback a { display: inline-block; margin-block: 12px; font-weight: 600; color: var(--pk-green); }
.pk-mini-feedback button { display: block; }
.pk-save-progress { font-size: 0.92rem; margin-top: 24px; }
.pk-save-note { font-size: 0.84rem; color: var(--pk-muted); margin-top: 8px; }
.pk-play-explanation { max-width: 780px; margin: 48px auto 0; padding: clamp(24px, 4vw, 44px); border: 0; border-radius: var(--pk-r-xl); background: var(--pk-surface); box-shadow: var(--pk-shadow-1); }
.pk-play-explanation h2 { font-size: 1.5rem; margin-bottom: 16px; }
.pk-play-explanation p { font-size: 1rem; line-height: 1.7; margin-block: 12px; color: var(--pk-ink-2); }
.pk-play-explanation summary { font-size: 0.95rem; font-weight: 600; color: var(--pk-green); }
.pk-play-explanation h3 { font-size: 1.2rem; margin-block: 18px 8px; }
.pk-play-next { margin-top: 40px; padding-top: 0; border: 0; }
.pk-play-next h2 { font-size: 1.5rem; margin-bottom: 14px; }
.pk-play-next a { margin-right: 18px; font-weight: 600; color: var(--pk-green); }

/* Estudio K-Beauty */
.pk-beauty-room { border-radius: var(--pk-r-xl); background: radial-gradient(120% 100% at 20% 30%, #fffaf7, var(--pk-blush) 80%); padding: clamp(20px, 4vw, 44px); gap: 40px; margin-block: 8px 48px; box-shadow: var(--pk-shadow-2); }
.pk-beauty-controls h2 { font-size: clamp(1.7rem, 3vw, 2.4rem); color: var(--pk-ink); line-height: 1.12; margin-block: 10px 16px; }
.pk-beauty-controls p { font-size: 1rem; color: var(--pk-ink-2); line-height: 1.6; margin-bottom: 16px; }
.pk-beauty-field { font-weight: 600; font-size: 0.84rem; color: var(--pk-muted); }
.pk-beauty-field select { border-radius: var(--pk-r-sm); background: var(--pk-surface); border-color: var(--pk-line-strong); color: var(--pk-ink); }
.pk-beauty-button, .pk-beauty-controls > [data-beauty-restart] { border-radius: var(--pk-r-pill); border-color: var(--pk-line-strong); background: var(--pk-surface); color: var(--pk-ink); font-weight: 600; box-shadow: var(--pk-shadow-1); }
.pk-beauty-controls .pk-beauty-note { font-size: 0.84rem; color: var(--pk-muted); }
.pk-beauty-summary li { border-radius: var(--pk-r-pill); background: rgb(255 255 255 / 0.75); color: var(--pk-ink); }
.pk-beauty-room .pk-primary-link { color: #fff; background: var(--pk-green); }
.pk-vanity { filter: drop-shadow(0 24px 40px rgb(90 50 40 / 0.16)); }
.pk-beauty-reading { max-width: 760px; margin-inline: auto; font-size: 1.04rem; line-height: 1.75; }
.pk-beauty-reading p { margin-bottom: 20px; }

.pk-discovery-links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.pk-discovery-links > a { display: block; padding: 18px; border: 0; border-radius: var(--pk-r-lg); background: var(--pk-surface); box-shadow: var(--pk-shadow-1); text-decoration: none; transition: translate var(--pk-ui) var(--pk-ease-out), box-shadow var(--pk-ui) var(--pk-ease-soft), scale var(--pk-release) var(--pk-spring); }
.pk-discovery-links > a:active { scale: var(--pk-press-scale); transition-duration: var(--pk-instant); }
@media (hover: hover) and (pointer: fine) { .pk-discovery-links > a:hover { translate: 0 var(--pk-lift); box-shadow: var(--pk-shadow-3); } }
.pk-discovery-cover-art { display: block; max-width: 100%; aspect-ratio: 1; margin-bottom: 14px; padding: 8%; border-radius: var(--pk-r-md); overflow: hidden; background: var(--pk-surface-2); object-fit: contain; }
.pk-discovery-links h3 { font-size: 1.2rem; margin-block: 8px; }
.pk-discovery-links > a > span:last-child { font-size: 0.9rem; color: var(--pk-muted); }

/* ───────────── 10 culture ───────────── */

.pk-drama-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 24px; margin-block: 32px; }
.pk-drama-cover { position: relative; display: flex; flex-direction: column; justify-content: space-between; min-height: 280px; aspect-ratio: 4/5; background: var(--pk-sage-2); padding: 22px; text-decoration: none; overflow: hidden; border-radius: var(--pk-r-lg); box-shadow: var(--pk-shadow-1); transition: translate var(--pk-ui) var(--pk-ease-out), box-shadow var(--pk-ui) var(--pk-ease-soft), scale var(--pk-release) var(--pk-spring); }
.pk-drama-cover:active { scale: var(--pk-press-scale); transition-duration: var(--pk-instant); }
@media (hover: hover) and (pointer: fine) { .pk-drama-cover:hover { translate: 0 var(--pk-lift); box-shadow: var(--pk-shadow-3); } }
.pk-drama-cover > svg { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0.55; pointer-events: none; }
.pk-drama-cover > span { position: relative; z-index: 1; }
.pk-drama-cover__edition { font-size: 0.7rem; font-weight: 600; letter-spacing: 0.04em; }
.pk-drama-cover__title { font: 700 2rem/1.08 var(--pk-display); letter-spacing: -0.035em; max-width: 12ch; }
.pk-drama-cover__native { font-size: 0.8rem; }
.pk-drama-cover__imprint { font-size: 0.7rem; display: flex; justify-content: space-between; gap: 18px; }
.pk-drama-card__meta { margin-block: 14px 6px; font-size: 0.82rem; color: var(--pk-muted); }
.pk-drama-card h2 { font-size: 1.3rem; margin-bottom: 6px; }
.pk-drama-card h2 a { text-decoration: none; }
.pk-drama-card__original { font-size: 0.86rem; color: var(--pk-muted); }
.pk-drama-filters { display: flex; gap: 14px; align-items: end; flex-wrap: wrap; padding: 18px; margin-top: 8px; border: 0; border-radius: var(--pk-r-lg); background: var(--pk-surface); box-shadow: var(--pk-shadow-1); }
.pk-drama-filters label { display: grid; gap: 6px; font-size: 0.82rem; font-weight: 600; color: var(--pk-muted); flex: 1 1 180px; }
.pk-drama-filters > a { font-size: 0.92rem; font-weight: 600; color: var(--pk-green); padding-block: 12px; }
.pk-drama-filters select { min-width: 160px; }
.pk-drama-filters .pk-primary-link { min-height: 50px; }
.pk-drama__body { max-width: 860px; padding-block: 48px; }
.pk-drama .pk-hero { background: linear-gradient(180deg, var(--pk-sage-2), var(--pk-bg)); padding-block: 48px; }
.pk-hero__grid { display: grid; grid-template-columns: 1.25fr 0.65fr; gap: 32px 64px; align-items: start; }
.pk-hero__identity h1 { margin-top: 14px; font-size: clamp(2.4rem, 4.8vw, 4rem); max-width: 15ch; }
.pk-alt-titles { margin-top: 16px; font-size: 0.95rem; line-height: 1.6; color: var(--pk-ink-2); }
.pk-status { margin-top: 18px; font-size: 0.85rem; }
.pk-poster { grid-column: 2; grid-row: 1 / 3; max-width: 290px; margin-left: auto; width: 100%; }
.pk-poster__placeholder { position: relative; display: flex; flex-direction: column; justify-content: space-between; aspect-ratio: 3/4; min-height: 320px; background: var(--pk-sage); padding: 24px; overflow: hidden; border-radius: var(--pk-r-lg); box-shadow: var(--pk-shadow-2); }
.pk-poster__placeholder > svg { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0.55; }
.pk-poster__placeholder > span, .pk-poster__placeholder > strong { position: relative; z-index: 1; }
.pk-poster__mark, .pk-poster__note { font-size: 0.7rem; font-weight: 600; letter-spacing: 0.04em; }
.pk-poster__title { font: 700 1.8rem/1.12 var(--pk-display); letter-spacing: -0.03em; }
.pk-hero__details { grid-column: 1; }
.pk-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 24px; padding: 6px 22px; border: 0; border-radius: var(--pk-r-md); background: var(--pk-surface); box-shadow: var(--pk-shadow-1); }
.pk-facts > div { padding-block: 14px; }
.pk-facts dt { font-size: 0.78rem; font-weight: 600; color: var(--pk-muted); margin-bottom: 2px; }
.pk-facts dd { margin: 0; font-size: 0.95rem; }
.pk-taxonomy ul { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; font-size: 0.88rem; }
.pk-taxonomy li { margin: 0; }
.pk-taxonomy a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border-radius: var(--pk-r-pill); background: var(--pk-surface); box-shadow: var(--pk-shadow-1); text-decoration: none; }
.pk-drama__body .pk-section { padding-block: 28px; border-bottom: 1px solid var(--pk-line); }
.pk-drama__body h2 { font-size: 1.5rem; margin-bottom: 14px; }
.pk-drama__body p { margin-block: 12px; font-size: 1.04rem; line-height: 1.75; max-width: 70ch; color: var(--pk-ink-2); }
.pk-country-selector { display: flex; gap: 14px; align-items: end; margin-bottom: 20px; }
.pk-country-selector label { font-size: 0.85rem; font-weight: 600; color: var(--pk-muted); }
.pk-empty-note { color: var(--pk-muted); }
.pk-credit-list { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 24px; }
.pk-credit-list li { margin: 0; padding-block: 14px; border-bottom: 1px solid var(--pk-line); }

.pk-torneo-page > h1 { margin-top: 12px; }
.pk-torneo-page > p { margin-top: 14px; color: var(--pk-ink-2); font-size: 1.1rem; }
.pk-torneo-page > .pk-eyebrow { margin-top: 16px; color: var(--pk-green); }
.pk-catalogue-categories { display: flex; flex-wrap: wrap; gap: 8px; margin-block: 28px; font-size: 0.92rem; }
.pk-catalogue-categories a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: var(--pk-r-pill); background: var(--pk-surface); box-shadow: var(--pk-shadow-1); text-decoration: none; font-weight: 600; }
.pk-tournament-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-block: 32px; }
.pk-tournament-card > a { display: block; padding: 14px; border-radius: var(--pk-r-xl); background: var(--pk-surface); box-shadow: var(--pk-shadow-1); text-decoration: none; transition: translate var(--pk-ui) var(--pk-ease-out), box-shadow var(--pk-ui) var(--pk-ease-soft), scale var(--pk-release) var(--pk-spring); }
.pk-tournament-card > a:active { scale: var(--pk-press-scale); transition-duration: var(--pk-instant); }
@media (hover: hover) and (pointer: fine) { .pk-tournament-card > a:hover { translate: 0 var(--pk-lift); box-shadow: var(--pk-shadow-3); } }
.pk-tournament-preview { display: flex; flex-direction: column; justify-content: space-between; width: 100%; min-width: 0; height: auto; aspect-ratio: 1.6; border-radius: var(--pk-r-lg); background: var(--pk-green); color: #f7f6f1; padding: 26px; }
.pk-tournament-preview strong { font: 700 2rem/1.08 var(--pk-display); letter-spacing: -0.03em; max-width: 15ch; }
.pk-tournament-preview[data-tone="1"] { background: var(--pk-sage); color: var(--pk-ink); }
.pk-tournament-preview[data-tone="2"] { background: var(--pk-blush); color: var(--pk-ink); }
.pk-tournament-card h2, .pk-tournament-card h3 { font-size: 1.35rem; margin: 16px 8px 8px; }
.pk-tournament-card p { font-size: 0.96rem; line-height: 1.6; color: var(--pk-muted); max-width: 55ch; margin-inline: 8px; }
.pk-tournament-card a > span:not(.pk-tournament-preview):not(.pk-eyebrow) { display: inline-block; margin: 8px 8px 4px; font-size: 0.92rem; }
.pk-tournament-card a > .pk-eyebrow { display: block; margin: 16px 8px 0; }
.pk-tournament-cta { color: var(--pk-green); font-weight: 600; }
.pk-tournament-intro { margin-block: 12px 32px; max-width: 820px; }
.pk-tournament-intro h1 { font-size: clamp(2.3rem, 4.6vw, 3.9rem); margin-top: 10px; }
.pk-tournament-description { margin-top: 18px; max-width: 64ch; }
.pk-tournament-description summary { font-size: 0.92rem; font-weight: 600; color: var(--pk-green); }
.pk-tournament-description p { font-size: 1rem; line-height: 1.7; margin-top: 12px; color: var(--pk-ink-2); }
#pk-tournament-player { padding: clamp(18px, 3vw, 32px); border-radius: var(--pk-r-xl); background: var(--pk-surface); box-shadow: var(--pk-shadow-2); }
#pk-tournament-stage > p { margin-bottom: 20px; color: var(--pk-muted); }
#pk-tournament-status { font: 600 0.85rem var(--pk-font); color: var(--pk-muted); }
/* Repeated choices answer fastest of all. */
.pk-candidate-button { border: 1px solid var(--pk-line); border-radius: var(--pk-r-lg); background: var(--pk-surface-2); box-shadow: var(--pk-shadow-1); overflow: hidden; --pk-release: 320ms; }
@media (hover: hover) and (pointer: fine) { .pk-candidate-button:hover { border-color: rgb(196 25 79 / 0.45); translate: 0 -2px; box-shadow: var(--pk-shadow-2); } }
.pk-fallback { background: var(--pk-green); color: #f7f6f1; min-height: 250px; }
.pk-fallback[data-kind="drama"] { background: #3c4a42; }
.pk-fallback[data-kind="food"] { background: #6b5a48; }
.pk-fallback strong { font-family: var(--pk-display); font-weight: 700; }
.pk-fallback-symbol img { max-height: 180px; object-fit: contain; }
.pk-candidate-name { font: 650 1.2rem/1.2 var(--pk-display); }
.pk-candidate-button > span:last-child { font-size: 0.86rem; }
.pk-winner-card { max-width: 430px; margin-block: 32px; }
.pk-winner-card h2 { font-size: 1.9rem; line-height: 1.15; margin-top: 18px; }
.pk-winner-card p { font-size: 0.96rem; color: var(--pk-muted); margin-top: 12px; }
.pk-torneo-page .pk-primary-link { background: var(--pk-green); color: #fff; }
.pk-torneo-section { border-color: var(--pk-line); margin-top: 44px; }
.pk-torneo-section h2 { font-size: 1.5rem; margin-bottom: 14px; }
.pk-torneo-section p { font-size: 1rem; color: var(--pk-muted); margin-bottom: 16px; }
.pk-image-credits { border-top: 1px solid var(--pk-line); padding-top: 22px; font-size: 0.86rem; color: var(--pk-muted); }
.pk-image-credits li { line-height: 1.6; }
.pk-torneo-page .pk-secondary-link { color: var(--pk-green); background: none; }
.pk-content-list__item { padding-block: 24px; border-top: 1px solid var(--pk-line); }
.pk-content-list__item h2 { font-size: 1.35rem; }
.pk-content-list__item p { margin-top: 12px; font-size: 1rem; color: var(--pk-muted); }
.navigation { margin-block: 40px; font-size: 0.95rem; }
.nav-links { display: flex; justify-content: space-between; gap: 24px; }

/* ───────────── 11 responsive ───────────── */

@media (max-width: 1100px) {
	.pk-desktop-nav .pk-nav-group > a { padding: 0 12px; font-size: 0.86rem; }
	.pk-hero__grid { gap: 32px 40px; }
}


@media (max-width: 900px) {
	.pk-interactive-shell, .pk-beauty-room { grid-template-columns: 1fr; }
	.pk-vanity { max-width: 360px; width: 100%; margin-inline: auto; }
	.pk-drama-grid, .pk-discovery-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.pk-hero__grid { grid-template-columns: 1fr 0.6fr; }
	.pk-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.pk-site-footer__inner { flex-direction: column; gap: 28px; }
}

/* Phone: its own composition. Header holds the brand and tools; the worlds move to the tab bar. */
@media (max-width: 700px) {
	:root { --pk-header-h: 56px; --pk-gutter: 18px; }
	body { font-size: 16px; padding-bottom: calc(var(--pk-tabbar-h) + env(safe-area-inset-bottom)); }
	.pk-desktop-nav { display: none; }
	.pk-site-header__inner { gap: 8px; }
	.pk-desktop-nav + .pk-header-tools, .pk-header-tools { margin-left: auto; }
	.pk-wordmark { font-size: 1.12rem; }
	.pk-languages a { min-width: 40px; min-height: 34px; }

	.pk-tabbar {
		display: block; position: fixed; inset: auto 0 0 0; z-index: 70;
		padding: 0 6px env(safe-area-inset-bottom);
		background: rgb(250 249 246 / 0.9);
		-webkit-backdrop-filter: saturate(180%) blur(22px);
		backdrop-filter: saturate(180%) blur(22px);
		border-top: 1px solid var(--pk-line);
	}
	.pk-tabbar ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
	.pk-tabbar li { margin: 0; }
	.pk-tab {
		display: grid; justify-items: center; align-content: center; gap: 3px;
		min-height: var(--pk-tabbar-h); padding: 6px 2px 4px;
		font: 600 0.66rem/1.1 var(--pk-font); letter-spacing: 0; text-align: center;
		color: var(--pk-ink-2); text-decoration: none; --pk-press-scale: 0.9;
	}
	.pk-tab span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
	.pk-tab[aria-current=page] { color: var(--pk-green); font-weight: 700; }
	.pk-tab[aria-current=page] .pk-tab-icon { stroke-width: 2.1; }
	.pk-tab-icon { width: 25px; height: 25px; }

	h1 { font-size: clamp(2rem, 8.6vw, 2.5rem); }
	h2 { font-size: 1.45rem; }

	/* Services */
	.pk-service-heading, .pk-play-heading, .pk-page-heading { margin-block: 4px 24px; }
	.pk-service-heading h1, .pk-play-heading h1, .pk-page-heading h1 { overflow-wrap: break-word; }
	.pk-service-heading > p:not(.pk-eyebrow), .pk-play-heading > p:not(.pk-eyebrow), .pk-page-heading > p:not(.pk-eyebrow) { font-size: 1rem; }
	/* Two selects side by side, then search with its button: the list starts sooner. */
	.pk-service-filters { display: grid; grid-template-columns: 1fr 1fr; padding: 12px; gap: 8px; border-radius: var(--pk-r-md); }
	.pk-service-filters label { font-size: 0.74rem; gap: 4px; min-width: 0; }
	.pk-service-filters label:nth-of-type(3) { grid-column: 1 / -1; }
	.pk-service-filters select, .pk-service-filters input { min-height: 44px; padding-block: 0.55rem; font-size: 0.95rem; }
	.pk-service-filters button { grid-column: 1 / -1; width: 100%; min-height: 46px; }
	.pk-service-grid { grid-template-columns: 1fr; padding: 2px 18px; border-radius: var(--pk-r-md); }
	.pk-service-card { padding-block: 16px; }
	.pk-service-card h2 { font-size: 1.08rem; }
	.pk-service-card > p:not(.pk-eyebrow) { font-size: 0.9rem; }
	.pk-service-tabs { flex-wrap: nowrap; overflow-x: auto; margin-inline: calc(-1 * var(--pk-gutter)); padding: 2px var(--pk-gutter) 6px; scrollbar-width: none; }
	.pk-service-tabs a { flex: none; }
	.pk-service-reading, .pk-service-detail { padding: 22px 20px; border-radius: var(--pk-r-lg); margin-inline: -4px; }
	.pk-service-reading h2, .pk-service-detail h2 { font-size: 1.3rem; }
	.pk-service-reading p, .pk-service-detail p { font-size: 1rem; }
	.pk-service-reading .pk-service-lead, .pk-service-detail .pk-service-lead { font-size: 1.1rem; }
	.pk-service-facts { grid-template-columns: 1fr; padding: 2px 16px; }
	.pk-service-facts dd { overflow-wrap: anywhere; }
	.pk-profile { padding: 22px 18px; border-radius: var(--pk-r-lg); margin-inline: -4px; }
	.pk-profile-stage { min-height: 0; }
	.pk-profile-stage > h2 { font-size: 1.55rem; }
	.pk-profile-choices { grid-template-columns: 1fr; gap: 10px; }
	.pk-profile-button, .pk-choice { min-height: 56px; padding: 15px 16px; }
	.pk-profile-priorities { grid-template-columns: 1fr; }
	.pk-profile-modes { width: 100%; }
	.pk-profile-modes button { min-width: 0; flex: 1; padding-inline: 8px; }
	.pk-profile-plans { grid-template-columns: 1fr; gap: 12px; }
	.pk-profile-plans section { padding: 20px; }
	.pk-search-form { gap: 8px; }
	.pk-search-form label { min-width: 0; }
	.pk-search-form button { padding-inline: 18px; }

	/* Play */
	.pk-play-grid { grid-template-columns: 1fr; gap: 10px; }
	.pk-play-card { grid-template-columns: 84px 1fr; gap: 14px; padding: 12px; border-radius: var(--pk-r-md); }
	.pk-play-card :is(h2, h3) { font-size: 1.08rem; }
	.pk-play-card p:not(.pk-eyebrow) { font-size: 0.88rem; }
	.pk-beauty-feature { grid-template-columns: 1fr; padding: 24px 20px; border-radius: var(--pk-r-lg); }
	.pk-interactive-shell { padding: 14px; gap: 16px; border-radius: var(--pk-r-lg); margin-inline: -4px; }
	.pk-experience-art { max-height: 180px; aspect-ratio: 1.9; }
	.pk-experience-art img { height: 100%; object-fit: cover; object-position: 50% 40%; }
	.pk-question-title { font-size: 1.45rem; }
	.pk-original-result { padding: 22px; }
	.pk-result-actions .pk-primary-link { width: 100%; }
	.pk-play-explanation { padding: 22px 20px; border-radius: var(--pk-r-lg); }
	.pk-beauty-room { padding: 18px 14px; gap: 22px; border-radius: var(--pk-r-lg); margin-inline: -4px; }
	.pk-vanity { padding: 12px 10px 60px; max-width: 320px; min-width: 0; }
	.pk-mirror { max-width: 235px; aspect-ratio: 4/5; }
	.pk-beauty-field select { padding: 12px 8px; min-width: 0; }
	.pk-beauty-fields { gap: 10px; }
	.pk-beauty-controls button { max-width: 100%; }
	.pk-discovery-links { grid-template-columns: 1fr 1fr; gap: 10px; }
	.pk-discovery-links > a { padding: 12px; border-radius: var(--pk-r-md); }
	.pk-discovery-links h3 { font-size: 1.02rem; }

	/* Culture */
	.pk-drama-grid { grid-template-columns: 1fr 1fr; gap: 22px 12px; }
	.pk-drama-cover { padding: 14px; min-height: 0; aspect-ratio: 3/4; border-radius: var(--pk-r-md); }
	.pk-drama-cover__title { font-size: 1.35rem; overflow-wrap: break-word; }
	.pk-drama-cover__edition, .pk-drama-cover__imprint { font-size: 0.58rem; }
	.pk-drama-cover__native { font-size: 0.65rem; }
	.pk-drama-card h2 { font-size: 1.08rem; }
	.pk-drama-card__meta { font-size: 0.72rem; }
	.pk-drama-filters { padding: 14px; gap: 10px; }
	.pk-drama-filters label { flex-basis: 100%; }
	.pk-drama-filters .pk-primary-link { flex: 1; }
	.pk-drama .pk-hero { padding-block: 28px; }
	.pk-hero__grid { grid-template-columns: 1fr; gap: 24px; }
	.pk-hero__identity h1 { font-size: 2.3rem; max-width: 14ch; }
	.pk-poster { grid-column: 1; grid-row: auto; max-width: 220px; margin-left: 0; }
	.pk-poster__placeholder { min-height: 0; }
	.pk-facts { grid-template-columns: 1fr 1fr; padding: 4px 16px; }
	.pk-drama__body { padding-block: 28px; }
	.pk-country-selector { flex-direction: column; align-items: stretch; }
	.pk-credit-list { grid-template-columns: 1fr; }
	.pk-tournament-grid { grid-template-columns: 1fr; gap: 16px; margin-block: 24px; }
	.pk-tournament-card > a { padding: 10px; border-radius: var(--pk-r-lg); }
	.pk-tournament-preview { padding: 22px; border-radius: var(--pk-r-md); }
	.pk-tournament-preview strong { font-size: 1.7rem; }
	.pk-catalogue-categories { flex-wrap: nowrap; overflow-x: auto; margin-inline: calc(-1 * var(--pk-gutter)); padding: 2px var(--pk-gutter) 6px; scrollbar-width: none; }
	.pk-catalogue-categories::-webkit-scrollbar, .pk-service-tabs::-webkit-scrollbar { display: none; }
	.pk-catalogue-categories a { flex: none; }
	.pk-matchup { gap: 6px; grid-template-columns: minmax(0, 1fr) 20px minmax(0, 1fr); }
	.pk-fallback { min-height: 220px; padding: 16px 12px; }
	.pk-fallback strong { font-size: 1.4rem; line-height: 1.08; }
	.pk-candidate-name { font-size: 1.05rem; }
	#pk-tournament-player { padding: 12px; border-radius: var(--pk-r-lg); margin-inline: -4px; }

	/* Footer sits above the tab bar */
	.pk-site-footer { padding-top: 40px; margin-top: 56px; }
	.pk-footer-heading { margin-bottom: 24px; }
	.pk-site-footer .pk-nav { display: grid; grid-template-columns: 1fr 1fr; }
	.pk-footer-colophon { flex-direction: column; gap: 6px; }
}


@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
	.pk-card:hover, .pk-card:hover [data-pk-card-media], .pk-play-card:hover, .pk-drama-cover:hover, .pk-tournament-card > a:hover, .pk-discovery-links > a:hover { translate: none !important; scale: none !important; }
	/* Pressing still answers, through light rather than movement. */
	.pk-press:active, .pk-button:active, .pk-primary-link:active, .pk-choice:active, .pk-profile-button:active, .pk-candidate-button:active { scale: none !important; filter: brightness(0.94); }
	.pk-reveal-wait { opacity: 1 !important; translate: none !important; }
}

@media (forced-colors: active) {
	.pk-button, .pk-primary-link, .pk-s-card, .pk-s-sheet, .pk4-door, .pk4-tile, .pk-service-grid, .pk-profile { border: 1px solid CanvasText; }
	.pk-nav-group > a[aria-current=page], .pk-tab[aria-current=page] { outline: 2px solid Highlight; }
}

html:not(.pk-js) [data-profile-start], html:not(.pk-js) [data-beauty-start], html:not(.pk-js) #pk-experience-start, html:not(.pk-js) #pk-tournament-start { display: none; }

/* ───────────── world banners ─────────────
 * A world's front page opens on its own tinted stage with its rendered object, so you always
 * know where you are. Detail pages keep a plain large title. */

.pk-landing :is(.pk-service-heading, .pk-play-heading, .pk-page-heading) {
	position: relative; isolation: isolate; overflow: hidden;
	display: flex; flex-direction: column; justify-content: center;
	max-width: none; min-height: 300px; margin: 4px 0 36px;
	padding: clamp(32px, 4.5vw, 64px) min(44%, 460px) clamp(32px, 4.5vw, 64px) clamp(28px, 4.5vw, 64px);
	border-radius: var(--pk-r-xl);
	background: var(--pk-world-tint, linear-gradient(160deg, var(--pk-sage-2), var(--pk-sage)));
}
.pk-landing :is(.pk-service-heading, .pk-play-heading, .pk-page-heading)::after {
	content: ""; position: absolute; z-index: -1; right: 4%; top: 14px; bottom: 14px;
	width: min(36%, 340px);
	background: var(--pk-world-art) center / contain no-repeat;
	pointer-events: none;
}
@media (prefers-reduced-motion: no-preference) {
	.pk-landing :is(.pk-service-heading, .pk-play-heading, .pk-page-heading)::after { animation: pk-settle 900ms var(--pk-ease-out) both; }
	.pk-landing :is(.pk-service-heading, .pk-play-heading, .pk-page-heading) > * { animation: pk-rise var(--pk-scene) var(--pk-ease-out) both; }
	.pk-landing :is(.pk-service-heading, .pk-play-heading, .pk-page-heading) > :nth-child(2) { animation-delay: 70ms; }
	.pk-landing :is(.pk-service-heading, .pk-play-heading, .pk-page-heading) > :nth-child(3) { animation-delay: 140ms; }
}
.pk-landing .pk-play-crumbs { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.pk-world-my-skin { --pk-world-tint: radial-gradient(120% 130% at 85% 55%, #f3fcf8, #bfe9d8 70%); --pk-world-art: url(../images/studio3/drop-800.webp); }
.pk-world-k-beauty { --pk-world-tint: radial-gradient(120% 130% at 85% 55%, #fff4f6, #ffc7d6 70%); --pk-world-art: url(../images/studio3/dropi-800.webp); }
.pk-world-learn { --pk-world-tint: radial-gradient(120% 130% at 85% 55%, #f6f3ff, #d6ccff 70%); --pk-world-art: url(../images/studio3/books-800.webp); }
.pk-world-play { --pk-world-tint: radial-gradient(120% 130% at 85% 55%, #fffaf0, #ffe39a 70%); --pk-world-art: url(../images/studio3/mina-800.webp); }
.pk-world-culture { --pk-world-tint: radial-gradient(90% 120% at 80% 50%, #3b2470, var(--pk-night) 75%); --pk-world-art: url(../images/studio3/dal-800.webp); }
.pk-world-today { --pk-world-tint: radial-gradient(120% 130% at 85% 55%, #fffaf0, #ffdcb8 70%); --pk-world-art: url(../images/studio3/drop-800.webp); }
/* K-Culture's banner is the night stage: light words on plum ink. */
.pk-landing.pk-world-culture :is(.pk-service-heading, .pk-play-heading, .pk-page-heading) { color: #fff; }
.pk-landing.pk-world-culture :is(.pk-service-heading, .pk-play-heading, .pk-page-heading) > p { color: rgb(255 255 255 / 0.8) !important; }
.pk-landing.pk-world-culture :is(.pk-service-heading, .pk-play-heading, .pk-page-heading) > .pk-eyebrow { color: var(--pk-butter) !important; }
@supports (background-image: image-set(url(x.avif) type("image/avif"))) {
	.pk-world-my-skin, .pk-world-today { --pk-world-art: image-set(url(../images/studio3/drop-800.avif) type("image/avif"), url(../images/studio3/drop-800.webp) type("image/webp")); }
	.pk-world-k-beauty { --pk-world-art: image-set(url(../images/studio3/dropi-800.avif) type("image/avif"), url(../images/studio3/dropi-800.webp) type("image/webp")); }
	.pk-world-learn { --pk-world-art: image-set(url(../images/studio3/books-800.avif) type("image/avif"), url(../images/studio3/books-800.webp) type("image/webp")); }
	.pk-world-play { --pk-world-art: image-set(url(../images/studio3/mina-800.avif) type("image/avif"), url(../images/studio3/mina-800.webp) type("image/webp")); }
	.pk-world-culture { --pk-world-art: image-set(url(../images/studio3/dal-800.avif) type("image/avif"), url(../images/studio3/dal-800.webp) type("image/webp")); }
}

@media (max-width: 700px) {
	.pk-landing :is(.pk-service-heading, .pk-play-heading, .pk-page-heading) {
		min-height: 0; margin: 0 -4px 24px; padding: 168px 22px 26px; border-radius: var(--pk-r-lg);
	}
	.pk-landing :is(.pk-service-heading, .pk-play-heading, .pk-page-heading)::after { right: 50%; top: 8px; bottom: auto; width: 160px; height: 160px; translate: 50% 0; }
}

/* Drama discovery: each title's own original cover, on the same soft card. */
.pk-discovery-drama { display: block; aspect-ratio: 2 / 3; border-radius: var(--pk-r-md); overflow: hidden; margin-bottom: 14px; }
.pk-discovery-drama .pk-original-cover { display: block; width: 100%; height: 100%; }
.pk-discovery-links .pk-discovery-cover-art:has(.pk-discovery-drama) { padding: 0; background: none; aspect-ratio: auto; }
.pk-beauty-feature__object img { display: block; width: 100%; max-width: 340px; margin: -8% auto; }

.pk-not-found { min-height: 50vh; }
.pk-not-found .pk4-actions { margin-top: 8px; }

/* ═════════════ Seoul Jewel: the homepage, header and footer ═════════════
 * A plum-ink night stage, jewel colour blocks like pieces of bojagi, Hangul as ornament
 * (aria-hidden, lang="ko"; the real words are always the localized HTML beside it). */

.pk4-home { overflow-x: clip; }
[lang="ko"] { font-family: var(--pk-hangul); }

/* Header on the homepage joins the stage: dark material, light words. */
.home .pk-site-header { background: rgb(21 18 43 / 0.82); color: #fff; }
.home .pk-wordmark { color: #fff; }
.home .pk-desktop-nav .pk-nav { background: rgb(255 255 255 / 0.08); }
.home .pk-nav-group > a { color: rgb(255 255 255 / 0.82); }
.home .pk-nav-group > a[aria-current=page] { background: #fff; color: var(--pk-ink); }
@media (hover: hover) and (pointer: fine) { .home .pk-nav-group > a:not([aria-current]):hover { color: #fff; background: rgb(255 255 255 / 0.12); } .home .pk-icon-button:hover { background: rgb(255 255 255 / 0.12); } }
.home .pk-icon-button { color: #fff; }
.home .pk-languages { background: rgb(255 255 255 / 0.1); }
.home .pk-languages a { color: rgb(255 255 255 / 0.75); }
.home .pk-languages a[aria-current] { background: #fff; color: var(--pk-ink); }
.home.pk-scrolled .pk-site-header, .pk-scrolled .home .pk-site-header { border-bottom-color: rgb(255 255 255 / 0.08); }

/* The stage */
.pk4-stage {
	position: relative; isolation: isolate; overflow: hidden;
	display: flex; align-items: center;
	min-height: clamp(560px, 50vw, 780px);
	background: var(--pk-night); color: #fff;
}
.pk4-stage .pk-hero-art { position: absolute; inset: 0; z-index: -2; background: var(--pk-night); }
.pk4-stage .pk-hero-art img { width: 100%; height: 100%; object-fit: cover; object-position: 100% 55%; }
.pk4-stage::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgb(21 18 43 / 0.94) 0%, rgb(21 18 43 / 0.72) 30%, rgb(21 18 43 / 0) 58%), linear-gradient(0deg, rgb(21 18 43 / 0.55), transparent 30%); pointer-events: none; }
.pk4-stage__copy { padding-block: clamp(64px, 8vw, 120px); }
.pk4-stage__copy > * { max-width: 720px; }
.pk4-stage__eyebrow { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-bottom: 22px; font: 600 0.92rem/1.3 var(--pk-font); color: rgb(255 255 255 / 0.78); }
.pk4-stage__eyebrow [lang="ko"] { padding: 6px 12px; border-radius: var(--pk-r-pill); background: rgb(255 201 60 / 0.16); color: var(--pk-butter); font-weight: 700; letter-spacing: 0.04em; }
.pk4-stage h1 { font-size: clamp(2.8rem, 5.2vw, 5.4rem); line-height: 0.98; letter-spacing: -0.05em; color: #fff; }
.pk4-stage h1 > span { white-space: nowrap; }
.pk4-stage h1 > span { display: block; }
.pk4-shine { background: var(--pk-shine); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; }
.pk4-stage__intro { margin-top: 24px; font-size: clamp(1.05rem, 1.35vw, 1.22rem); line-height: 1.55; color: rgb(255 255 255 / 0.8); max-width: 44ch; }
.pk4-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.pk-button--glow { background: var(--pk-butter); color: var(--pk-night); box-shadow: 0 10px 34px -10px rgb(255 201 60 / 0.75); }
.pk-button--glow:hover { background: #ffd666; color: var(--pk-night); }
.pk-button--ghost { background: rgb(255 255 255 / 0.08); color: #fff; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.32); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.pk-button--ghost:hover { background: rgb(255 255 255 / 0.16); color: #fff; }

@media (prefers-reduced-motion: no-preference) {
	.pk4-shine { animation: pk-shine 9s var(--pk-ease-soft) infinite alternate; }
	.pk4-ribbon__track { animation: pk-ribbon 42s linear infinite; }
}
@keyframes pk-shine { to { background-position: 100% 0; } }
@keyframes pk-ribbon { to { translate: -50% 0; } }

/* The ribbon: a cherry band of what is inside, Hangul between. */
.pk4-ribbon { overflow: hidden; background: #c8184f; color: #fff; }
.pk4-ribbon__track { display: flex; width: max-content; align-items: center; gap: 22px; padding-block: 14px; font: 700 1rem/1 var(--pk-font); letter-spacing: -0.01em; white-space: nowrap; }
.pk4-ribbon__mark { color: #fff; font-weight: 800; padding: 3px 10px; border-radius: var(--pk-r-pill); background: rgb(21 18 43 / 0.28); }

.pk4-desk { display: grid; gap: clamp(64px, 8vw, 112px); padding-top: clamp(56px, 7vw, 96px); }
.pk4-head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 8px 24px; margin-bottom: 24px; }
.pk4-head h2 { font-size: clamp(1.9rem, 3.4vw, 3rem); letter-spacing: -0.04em; }
.pk4-head > p { flex-basis: 100%; order: 2; color: var(--pk-muted); font-size: 1.05rem; margin-top: -2px; }
.pk4-head > .pk-link { order: 1; }
.pk4-head__hangul { font-size: 0.5em; color: var(--pk-cherry-ink); vertical-align: 0.35em; margin-left: 6px; letter-spacing: 0.04em; }

/* Three ways in: jewel colour blocks, words on a frosted panel. */
.pk4-doors { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.pk4-doors > li { margin: 0; display: flex; }
.pk4-door {
	position: relative; display: grid; grid-template-rows: 1fr auto; width: 100%; min-height: 470px;
	border-radius: var(--pk-r-xl); text-decoration: none; overflow: hidden; color: var(--pk-ink);
	box-shadow: var(--pk-shadow-2);
	transition: translate var(--pk-ui) var(--pk-ease-out), box-shadow var(--pk-ui) var(--pk-ease-soft), scale var(--pk-release) var(--pk-spring);
}
.pk4-door--celadon { background: radial-gradient(110% 80% at 50% 25%, #a9ecd3, #4fb894 75%); }
.pk4-door--cherry { background: radial-gradient(110% 80% at 50% 25%, #ffa3bd, #e0245e 78%); }
.pk4-door--lilac { background: radial-gradient(110% 80% at 50% 25%, #d4c9ff, #7d63ff 78%); }
.pk4-door__hangul { position: absolute; top: 18px; left: 22px; font-size: 3.4rem; font-weight: 800; line-height: 1; color: rgb(255 255 255 / 0.42); letter-spacing: 0.02em; }
.pk4-door__art { display: grid; place-items: center; padding: 34px 20px 0; }
.pk4-door__art img { display: block; width: 100%; max-width: 300px; filter: drop-shadow(0 26px 30px rgb(26 21 48 / 0.28)); }
.pk4-door__text { display: grid; gap: 6px; margin: 12px; padding: 20px 22px 18px; border-radius: 22px; background: rgb(255 255 255 / 0.9); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.pk4-door__label { font: 700 0.8rem/1 var(--pk-font); color: var(--pk-cherry-ink); }
.pk4-door__title { font: 800 1.55rem/1.1 var(--pk-display); letter-spacing: -0.035em; }
.pk4-door__line { font-size: 0.95rem; line-height: 1.45; color: var(--pk-ink-2); }
.pk4-door__go { margin-top: 6px; font-weight: 700; color: var(--pk-ink); }

/* K-Culture now: the night stage again, with each Drama's own cover. */
.pk4-culture {
	position: relative; isolation: isolate; overflow: hidden;
	padding: clamp(28px, 4.5vw, 64px); border-radius: var(--pk-r-xl); color: #fff;
	background: radial-gradient(60% 80% at 90% 10%, rgb(224 36 94 / 0.45), transparent 70%), radial-gradient(60% 90% at 5% 100%, rgb(79 184 148 / 0.32), transparent 70%), var(--pk-night);
	box-shadow: var(--pk-shadow-3);
}
.pk4-culture__hangul { position: absolute; z-index: -1; right: -10px; bottom: -40px; font-size: clamp(8rem, 18vw, 15rem); font-weight: 800; line-height: 1; color: rgb(255 255 255 / 0.05); }
.pk4-head--light h2 { color: #fff; }
.pk4-head--light > p { color: rgb(255 255 255 / 0.72); }
.pk-link--light { color: var(--pk-butter); }
.pk4-culture__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 1.15fr); gap: 16px; }
.pk4-cover, .pk4-versus { display: grid; align-content: start; gap: 6px; text-decoration: none; color: #fff; border-radius: var(--pk-r-lg); transition: translate var(--pk-ui) var(--pk-ease-out), box-shadow var(--pk-ui) var(--pk-ease-soft), scale var(--pk-release) var(--pk-spring); }
.pk4-cover__art { display: block; aspect-ratio: 2 / 3; border-radius: var(--pk-r-lg); overflow: hidden; box-shadow: 0 22px 40px -18px rgb(0 0 0 / 0.6); }
.pk4-cover__art svg { display: block; width: 100%; height: 100%; }
.pk4-cover__meta { margin-top: 8px; font-size: 0.8rem; font-weight: 600; color: rgb(255 255 255 / 0.62); }
.pk4-cover__title { font: 750 1.12rem/1.2 var(--pk-display); letter-spacing: -0.02em; }
.pk4-versus { padding: 18px; background: linear-gradient(160deg, rgb(255 255 255 / 0.12), rgb(255 255 255 / 0.04)); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.14); }
.pk4-versus__art img { display: block; width: 100%; max-width: 240px; margin: 0 auto 6px; filter: drop-shadow(0 18px 24px rgb(0 0 0 / 0.4)); }
.pk4-versus__label { font: 700 0.8rem/1 var(--pk-font); color: var(--pk-butter); }
.pk4-versus__title { font: 800 1.35rem/1.15 var(--pk-display); letter-spacing: -0.03em; }
.pk4-versus__go { margin-top: 8px; font-weight: 700; color: #fff; }

/* Today: a butter lead, three tinted slips. */
.pk4-today__board { display: grid; grid-template-columns: minmax(0, 1.2fr) repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, auto); gap: 14px; }
.pk4-today__lead { grid-row: span 2; display: grid; align-content: start; gap: 10px; padding: 30px; min-height: 320px; border-radius: var(--pk-r-xl); text-decoration: none; color: var(--pk-ink); background: radial-gradient(120% 100% at 0% 0%, #fff6d6, #ffcf4a 80%); box-shadow: var(--pk-shadow-2); transition: translate var(--pk-ui) var(--pk-ease-out), box-shadow var(--pk-ui) var(--pk-ease-soft), scale var(--pk-release) var(--pk-spring); }
.pk4-today__date { display: flex; align-items: baseline; gap: 12px; margin-bottom: 14px; font-size: 0.92rem; font-weight: 600; color: var(--pk-ink-2); }
.pk4-today__date > span { font: 800 4rem/0.9 var(--pk-display); letter-spacing: -0.05em; color: var(--pk-ink); }
.pk4-chip { display: inline-flex; width: fit-content; align-items: center; min-height: 26px; padding: 0 12px; border-radius: var(--pk-r-pill); background: rgb(255 255 255 / 0.72); font: 700 0.78rem/1 var(--pk-font); color: var(--pk-ink); }
.pk4-today__title { font: 800 clamp(1.5rem, 2.3vw, 2rem)/1.12 var(--pk-display); letter-spacing: -0.035em; max-width: 20ch; }
.pk4-today__body { color: var(--pk-ink-2); font-size: 1.02rem; line-height: 1.55; max-width: 46ch; }
.pk4-today__slip { display: grid; grid-template-columns: 1fr auto; align-content: space-between; gap: 14px 12px; padding: 22px; min-height: 150px; border-radius: var(--pk-r-lg); text-decoration: none; color: var(--pk-ink); transition: translate var(--pk-ui) var(--pk-ease-out), box-shadow var(--pk-ui) var(--pk-ease-soft), scale var(--pk-release) var(--pk-spring); }
.pk4-today__slip .pk4-chip { grid-column: 1 / -1; }
.pk4-today__slip--celadon { background: linear-gradient(160deg, #ecfaf4, #c3ecdc); }
.pk4-today__slip--lilac { background: linear-gradient(160deg, #f4f1ff, #dcd3ff); }
.pk4-today__slip--blush { background: linear-gradient(160deg, #fff3f6, #ffd2de); grid-column: span 2; }
.pk4-today__slip-title { font: 750 1.12rem/1.3 var(--pk-display); letter-spacing: -0.02em; }
.pk4-today__arrow { align-self: end; font-weight: 700; color: var(--pk-cherry-ink); }

/* The five worlds as a patchwork. */
.pk4-mosaic { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; }
.pk4-mosaic__item { margin: 0; display: flex; grid-column: span 2; }
.pk4-mosaic__item--my-skin, .pk4-mosaic__item--k-beauty { grid-column: span 3; }
.pk4-tile {
	position: relative; display: grid; grid-template-columns: 1fr; align-content: end; gap: 4px;
	width: 100%; min-height: 260px; padding: 22px 24px; border-radius: var(--pk-r-xl); overflow: hidden;
	text-decoration: none; color: var(--pk-ink); box-shadow: var(--pk-shadow-1);
	transition: translate var(--pk-ui) var(--pk-ease-out), box-shadow var(--pk-ui) var(--pk-ease-soft), scale var(--pk-release) var(--pk-spring);
}
.pk4-mosaic__item--my-skin .pk4-tile { background: radial-gradient(90% 120% at 85% 40%, #e9faf3, #a8e2cb 80%); min-height: 300px; }
.pk4-mosaic__item--k-beauty .pk4-tile { background: radial-gradient(90% 120% at 85% 40%, #fff1f5, #ffb9cc 80%); min-height: 300px; }
.pk4-mosaic__item--learn .pk4-tile { background: radial-gradient(100% 120% at 80% 20%, #f5f2ff, #cfc4ff 80%); }
.pk4-mosaic__item--play .pk4-tile { background: radial-gradient(100% 120% at 80% 20%, #fffbef, #ffdd84 80%); }
.pk4-mosaic__item--culture .pk4-tile { background: radial-gradient(100% 120% at 80% 20%, #3b2470, var(--pk-night) 80%); color: #fff; }
.pk4-tile__hangul { position: absolute; top: 16px; left: 22px; font-size: 2.6rem; font-weight: 800; line-height: 1; color: rgb(26 21 48 / 0.12); letter-spacing: 0.02em; }
.pk4-mosaic__item--culture .pk4-tile__hangul { color: rgb(255 255 255 / 0.16); }
.pk4-tile__art { position: absolute; right: -4%; top: 4%; width: 54%; max-width: 230px; }
.pk4-mosaic__item--my-skin .pk4-tile__art, .pk4-mosaic__item--k-beauty .pk4-tile__art { right: 4%; top: 50%; translate: 0 -50%; width: 42%; max-width: 260px; }
.pk4-tile__art img { display: block; width: 100%; filter: drop-shadow(0 18px 22px rgb(26 21 48 / 0.22)); }
.pk4-tile__name { position: relative; font: 800 1.5rem/1.1 var(--pk-display); letter-spacing: -0.035em; }
.pk4-tile__line { position: relative; font-size: 0.95rem; line-height: 1.45; color: var(--pk-ink-2); max-width: 26ch; }
.pk4-mosaic__item--culture .pk4-tile__line { color: rgb(255 255 255 / 0.76); }

/* Footer: the night again, closing the page like the stage opened it. */
.pk-site-footer { background: var(--pk-night); color: #fff; border-top: 0; }
.pk-footer-heading p { color: #fff; }
.pk-footer-star { color: var(--pk-butter); }
.pk-site-footer__inner p, .pk-footer-colophon { color: rgb(255 255 255 / 0.68); }
.pk-site-footer .pk-nav-group > a { color: rgb(255 255 255 / 0.86); }
.pk-site-footer .pk-wordmark { color: #fff; }
.pk-footer-colophon { border-top-color: rgb(255 255 255 / 0.12); }
.pk-site-footer a:focus-visible { outline-color: var(--pk-butter); }

@media (max-width: 1100px) {
	.pk4-culture__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.pk4-versus { grid-column: 1 / -1; grid-template-columns: 160px 1fr; align-items: center; column-gap: 20px; }
	.pk4-versus__art { grid-row: span 3; }
}

@media (max-width: 900px) {
	.pk4-doors { grid-template-columns: 1fr; }
	.pk4-door { min-height: 0; grid-template-columns: 0.9fr 1.1fr; grid-template-rows: auto; align-items: center; }
	.pk4-door__art { padding: 24px 0 24px 12px; }
	.pk4-today__board { grid-template-columns: 1fr 1fr; }
	.pk4-today__lead { grid-column: 1 / -1; grid-row: auto; min-height: 0; }
	.pk4-today__slip--blush { grid-column: 1 / -1; }
}

@media (max-width: 700px) {
	.pk4-stage { flex-direction: column; align-items: stretch; min-height: 0; }
	.pk4-stage .pk-hero-art { position: relative; inset: auto; z-index: 0; aspect-ratio: 1; }
	.pk4-stage .pk-hero-art img { object-position: 50% 50%; }
	.pk4-stage::before { background: linear-gradient(0deg, var(--pk-night) 0%, rgb(21 18 43 / 0) 30%); height: calc(100vw + 2px); }
	.pk4-stage__copy { position: relative; margin-top: -64px; padding-block: 0 40px; }
	.pk4-stage__eyebrow { margin-bottom: 14px; font-size: 0.85rem; }
	.pk4-stage h1 { font-size: clamp(2.5rem, 11.5vw, 3.3rem); }
	.pk4-stage h1 > span { white-space: normal; }
	.pk4-stage__intro { margin-top: 14px; font-size: 1rem; }
	.pk4-actions { flex-direction: column; margin-top: 24px; }
	.pk4-actions .pk-button { width: 100%; }
	.pk4-ribbon__track { padding-block: 12px; font-size: 0.92rem; gap: 18px; }
	.pk4-desk { gap: 56px; padding-top: 44px; }
	.pk4-head { margin-bottom: 16px; }
	.pk4-door { grid-template-columns: 116px 1fr; border-radius: var(--pk-r-lg); }
	.pk4-door__hangul { font-size: 2.2rem; top: 12px; left: 14px; }
	.pk4-door__art { padding: 34px 0 10px 8px; }
	.pk4-door__text { margin: 8px; padding: 14px 16px; border-radius: 18px; }
	.pk4-door__title { font-size: 1.25rem; }
	.pk4-door__line { font-size: 0.88rem; }
	.pk4-culture { padding: 24px 18px; border-radius: var(--pk-r-lg); margin-inline: -4px; }
	.pk4-culture__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
	.pk4-cover__title { font-size: 0.92rem; }
	.pk4-cover__meta { font-size: 0.68rem; }
	.pk4-versus { grid-template-columns: 96px 1fr; padding: 14px; }
	.pk4-versus__title { font-size: 1.12rem; }
	.pk4-today__board { grid-template-columns: 1fr; gap: 10px; }
	.pk4-today__lead { padding: 24px; border-radius: var(--pk-r-lg); }
	.pk4-today__date > span { font-size: 3rem; }
	.pk4-today__slip { min-height: 0; padding: 18px; }
	.pk4-today__slip--blush { grid-column: auto; }
	.pk4-mosaic { grid-template-columns: 1fr 1fr; gap: 10px; }
	.pk4-mosaic__item, .pk4-mosaic__item--my-skin, .pk4-mosaic__item--k-beauty { grid-column: span 1; }
	.pk4-mosaic__item--my-skin { grid-column: 1 / -1; }
	.pk4-mosaic__item--culture .pk4-tile__art { width: 62%; }
	.pk4-tile { min-height: 210px; padding: 16px; border-radius: var(--pk-r-lg); }
	.pk4-mosaic__item--my-skin .pk4-tile { min-height: 200px; }
	.pk4-mosaic__item--k-beauty .pk4-tile { min-height: 210px; }
	.pk4-mosaic__item--k-beauty .pk4-tile__art { right: -4%; top: 4%; translate: none; width: 60%; }
	.pk4-tile__hangul { font-size: 1.9rem; top: 12px; left: 14px; }
	.pk4-tile__name { font-size: 1.2rem; }
	.pk4-tile__line { font-size: 0.84rem; }
	.home .pk-tabbar { background: rgb(21 18 43 / 0.88); border-top-color: rgb(255 255 255 / 0.08); }
	.home .pk-tab { color: rgb(255 255 255 / 0.8); }
	.home .pk-tab[aria-current=page] { color: var(--pk-butter); }
}

@media (prefers-reduced-motion: reduce) {
	.pk4-ribbon__track { animation: none; }
	.pk4-shine { animation: none; }
}

/* ═════════════ Polish: premium, clean, a little kitsch ═════════════ */

body { font-feature-settings: "kern", "liga"; }
::selection { background: #ffd1de; color: var(--pk-ink); }
:focus-visible { outline: 3px solid var(--pk-cherry); outline-offset: 3px; }

/* Wordmark: Bricolage, a cherry star that turns when you point at it. */
.pk-wordmark { font: 800 1.32rem/1 var(--pk-display); letter-spacing: -0.045em; }
.pk-wordmark-dot { display: inline-block; color: var(--pk-cherry-ink); margin-left: 3px; transition: rotate var(--pk-scene) var(--pk-spring); }
@media (hover: hover) and (pointer: fine) { .pk-wordmark:hover .pk-wordmark-dot { rotate: 90deg; } }
.pk-nav-group > a { font-family: var(--pk-display); font-weight: 600; font-size: 0.92rem; letter-spacing: -0.01em; }

/* Labels: small, confident, never shouting. */
.pk-eyebrow { font: 700 0.78rem/1.3 var(--pk-display); letter-spacing: 0.01em; }
.pk-service-heading > .pk-eyebrow, .pk-play-heading > .pk-eyebrow, .pk-page-heading > .pk-eyebrow { display: inline-flex; width: fit-content; align-items: center; min-height: 28px; padding: 0 12px; border-radius: var(--pk-r-pill); background: rgb(255 255 255 / 0.7); color: var(--pk-cherry-ink); box-shadow: inset 0 0 0 1px rgb(26 21 48 / 0.06); }

/* Buttons: a lit top edge, a coloured shadow, an arrow that leans in. */
.pk-button, .pk-primary-link { font-family: var(--pk-display); font-weight: 700; letter-spacing: -0.01em; }
.pk-button:not(.pk-button--quiet):not(.pk-button--ghost), .pk-primary-link {
	background: linear-gradient(180deg, #d92a62, #b9154a);
	box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.28), inset 0 -1px 0 rgb(0 0 0 / 0.12), 0 10px 24px -10px rgb(196 25 79 / 0.65);
}
.pk-button--glow { background: linear-gradient(180deg, #ffd765, #ffbf1f) !important; color: var(--pk-night) !important; box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.6), inset 0 -1px 0 rgb(120 70 0 / 0.18), 0 12px 34px -10px rgb(255 191 31 / 0.8) !important; }
.pk-button--glow::after, .pk-button:not(.pk-button--quiet):not(.pk-button--ghost)::after { content: "→"; display: inline-block; margin-left: 2px; transition: translate var(--pk-ui) var(--pk-ease-out); }
@media (hover: hover) and (pointer: fine) { .pk-button:hover::after { translate: 3px 0; } }
.pk-button--quiet { box-shadow: inset 0 0 0 1px var(--pk-line), var(--pk-shadow-1); }

/* The hero badge: a slow-turning sticker, the kitsch note on a serious stage. */
.pk4-badge { position: absolute; z-index: 1; right: clamp(16px, 4vw, 64px); top: clamp(20px, 5vw, 64px); width: clamp(96px, 9vw, 138px); height: auto; overflow: visible; }
.pk4-badge circle { fill: var(--pk-butter); }
.pk4-badge text { font: 800 15.5px var(--pk-display); letter-spacing: 2.4px; fill: var(--pk-night); }
.pk4-badge .pk4-badge__center { font: 900 34px var(--pk-hangul); letter-spacing: 0; fill: var(--pk-cherry); }
@media (prefers-reduced-motion: no-preference) {
	.pk4-badge { animation: pk-spin 28s linear infinite; }
	.pk4-badge .pk4-badge__center { animation: pk-spin 28s linear infinite reverse; transform-origin: 100px 104px; }
}
@keyframes pk-spin { to { rotate: 360deg; } }

/* Hero type: Bricolage for the voice, Instrument Serif italic for the shine. */
.pk4-stage h1 { font-weight: 800; }
.pk4-shine { font-family: var(--pk-accent); font-style: italic; font-weight: 400; letter-spacing: -0.02em; padding-right: 0.06em; }
.pk4-stage__eyebrow { font-family: var(--pk-display); }
.pk4-stage__eyebrow [lang="ko"] { font-family: var(--pk-hangul); }

/* Ribbon: stars between the words. */
.pk4-ribbon__track { font-family: var(--pk-display); font-weight: 700; }
.pk4-ribbon__track > span:not(.pk4-ribbon__mark)::after { content: "✦"; margin-left: 22px; color: rgb(255 255 255 / 0.55); font-size: 0.8em; }

/* Section heads: Hangul as a small coloured tag beside the title. */
.pk4-head h2 { font-weight: 800; }
.pk4-head h2 em { color: var(--pk-cherry-ink); }
.pk4-head--light h2 em { background: var(--pk-shine); -webkit-background-clip: text; background-clip: text; color: transparent; padding-right: 0.06em; }
.pk4-head__hangul { display: inline-flex; align-items: center; height: 1.6em; padding: 0 0.7em; margin-left: 10px; border-radius: var(--pk-r-pill); background: var(--pk-blush); color: var(--pk-cherry-ink); font: 800 0.38em/1 var(--pk-hangul); vertical-align: 0.5em; letter-spacing: 0.02em; }
.pk4-head--light .pk4-head__hangul { background: rgb(255 201 60 / 0.16); color: var(--pk-butter); }

/* Doors and tiles: a hairline of light on every coloured surface. */
.pk4-door, .pk4-tile, .pk4-today__lead, .pk4-today__slip { box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.45), var(--pk-shadow-1); }
.pk4-door { box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.35), var(--pk-shadow-2); }
.pk4-door__hangul, .pk4-tile__hangul { font-family: var(--pk-hangul); font-weight: 900; }
.pk4-door__title, .pk4-tile__name, .pk4-versus__title, .pk4-cover__title, .pk4-today__title, .pk4-today__slip-title { font-family: var(--pk-display); }
.pk4-door__label, .pk4-versus__label { font-family: var(--pk-display); letter-spacing: 0.01em; }
.pk4-door__text { box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.7), 0 8px 24px -14px rgb(26 21 48 / 0.35); }
.pk4-door__go, .pk4-versus__go { display: inline-flex; align-items: center; gap: 6px; width: fit-content; min-height: 36px; padding: 0 14px; border-radius: var(--pk-r-pill); background: var(--pk-ink); color: #fff; font: 700 0.9rem/1 var(--pk-display); }
.pk4-versus__go { background: var(--pk-butter); color: var(--pk-night); }
.pk4-today__date > span { font-family: var(--pk-display); font-weight: 800; }
.pk4-today__date { font-family: var(--pk-accent); font-style: italic; font-size: 1.15rem; font-weight: 400; }
.pk4-chip { font-family: var(--pk-display); letter-spacing: 0.01em; box-shadow: inset 0 0 0 1px rgb(26 21 48 / 0.06); }

/* Little stickers on the patchwork: the world's number, slightly tilted. */
.pk4-mosaic { counter-reset: world; }
.pk4-tile::after { counter-increment: world; content: "0" counter(world); position: absolute; right: 16px; bottom: 16px; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: rgb(255 255 255 / 0.75); color: var(--pk-ink); font: 800 0.8rem/1 var(--pk-display); rotate: -8deg; box-shadow: var(--pk-shadow-1); transition: rotate var(--pk-ui) var(--pk-spring); }
.pk4-mosaic__item--culture .pk4-tile::after { background: var(--pk-butter); }
@media (hover: hover) and (pointer: fine) { .pk4-tile:hover::after { rotate: 8deg; } }

/* Phone tab bar: the active world sits on a soft pill, like iOS. */
.pk-tab { font-family: var(--pk-display); font-weight: 600; letter-spacing: 0; }
.pk-tab .pk-tab-icon { padding: 2px 12px; width: 50px; height: 30px; border-radius: var(--pk-r-pill); transition: background-color var(--pk-ui) var(--pk-ease-soft); box-sizing: border-box; }
.pk-tab[aria-current=page] { color: var(--pk-cherry-ink); }
.pk-tab[aria-current=page] .pk-tab-icon { background: rgb(224 36 94 / 0.12); }
.home .pk-tab[aria-current=page] .pk-tab-icon { background: rgb(255 201 60 / 0.16); }

/* Inset grouped lists: a chevron and a lit row, like Settings. */
.pk-service-card { padding-right: 34px; transition: background-color var(--pk-fast) var(--pk-ease-soft); }
.pk-service-card::after { content: ""; position: absolute; right: 6px; top: 50%; width: 9px; height: 9px; border-top: 2px solid var(--pk-line-strong); border-right: 2px solid var(--pk-line-strong); rotate: 45deg; translate: 0 -50%; transition: translate var(--pk-ui) var(--pk-ease-out), border-color var(--pk-fast); }
@media (hover: hover) and (pointer: fine) { .pk-service-card:hover::after { translate: 3px -50%; border-color: var(--pk-cherry-ink); } }
.pk-service-card h2 a::after { z-index: 1; }
.pk-service-card .pk-eyebrow { color: var(--pk-cherry-ink); font-size: 0.74rem; }
.pk-service-card h2 { font-family: var(--pk-display); font-weight: 700; }

/* Fields: a soft inset, a custom chevron. */
input, select, textarea { box-shadow: inset 0 1px 2px rgb(26 21 48 / 0.05); }
select { -webkit-appearance: none; appearance: none; padding-right: 40px; background-image: linear-gradient(45deg, transparent 50%, var(--pk-ink-2) 50%), linear-gradient(135deg, var(--pk-ink-2) 50%, transparent 50%); background-position: calc(100% - 20px) 52%, calc(100% - 15px) 52%; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; }

/* World banners: their Hangul word as a large quiet watermark. */
.pk-landing :is(.pk-service-heading, .pk-play-heading, .pk-page-heading) h1 { font-weight: 800; font-size: clamp(2.4rem, 5.4vw, 4.6rem); letter-spacing: -0.045em; }
.pk-landing :is(.pk-service-heading, .pk-play-heading, .pk-page-heading)::before { position: absolute; z-index: -1; right: clamp(16px, 3vw, 40px); bottom: -0.2em; font: 900 clamp(5rem, 13vw, 11rem)/1 var(--pk-hangul); color: rgb(26 21 48 / 0.06); pointer-events: none; }
.pk-world-my-skin.pk-landing :is(.pk-service-heading, .pk-play-heading, .pk-page-heading)::before { content: "피부"; }
.pk-world-k-beauty.pk-landing :is(.pk-service-heading, .pk-play-heading, .pk-page-heading)::before { content: "뷰티"; }
.pk-world-learn.pk-landing :is(.pk-service-heading, .pk-play-heading, .pk-page-heading)::before { content: "배움"; }
.pk-world-play.pk-landing :is(.pk-service-heading, .pk-play-heading, .pk-page-heading)::before { content: "놀이"; }
.pk-world-culture.pk-landing :is(.pk-service-heading, .pk-play-heading, .pk-page-heading)::before { content: "문화"; color: rgb(255 255 255 / 0.07); }
.pk-world-today.pk-landing :is(.pk-service-heading, .pk-play-heading, .pk-page-heading)::before { content: "오늘"; }

/* Reading pages: an editorial lead in the display face. */
.pk-service-reading .pk-service-lead, .pk-service-detail .pk-service-lead { font-family: var(--pk-display); font-weight: 500; letter-spacing: -0.012em; }
.pk-service-reading h2, .pk-service-detail h2, .pk-play-explanation h2 { font-weight: 800; }

/* Footer: the brand, set large, closing the page. */
.pk-site-footer { position: relative; overflow: hidden; }
.pk-site-footer::after { content: "PICK KIM ✳"; display: block; margin: 40px 0 -0.22em; padding-inline: var(--pk-gutter); font: 800 clamp(4rem, 15vw, 13rem)/0.9 var(--pk-display); letter-spacing: -0.06em; white-space: nowrap; background: var(--pk-shine); -webkit-background-clip: text; background-clip: text; color: transparent; opacity: 0.9; pointer-events: none; }
.pk-footer-heading p { font-family: var(--pk-display); font-weight: 700; }

@media (max-width: 700px) {
	.pk4-badge { top: 14px; right: 14px; width: 84px; }
	.pk4-head__hangul { font-size: 0.42em; }
	.pk-tab .pk-tab-icon { width: 48px; }
	.pk4-tile::after { width: 32px; height: 32px; right: 10px; bottom: 10px; font-size: 0.7rem; }
	.pk-landing :is(.pk-service-heading, .pk-play-heading, .pk-page-heading)::before { font-size: 4.2rem; right: 12px; top: 112px; bottom: auto; }
}

/* Footer: the current world reads as a quiet pill, never white on white. */
.pk-site-footer .pk-nav-group > a[aria-current=page] { background: rgb(255 255 255 / 0.14); color: #fff; box-shadow: none; }

/* Tournament previews: the night stage, a glow per category, a VS sticker. */
.pk-tournament-preview { position: relative; overflow: hidden; isolation: isolate; color: #fff !important; background: radial-gradient(80% 90% at 85% 15%, rgb(224 36 94 / 0.55), transparent 70%), var(--pk-night) !important; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.08); }
.pk-tournament-preview[data-tone="1"] { background: radial-gradient(80% 90% at 85% 15%, rgb(79 184 148 / 0.6), transparent 70%), var(--pk-night) !important; }
.pk-tournament-preview[data-tone="2"] { background: radial-gradient(80% 90% at 85% 15%, rgb(143 120 255 / 0.65), transparent 70%), var(--pk-night) !important; }
.pk-tournament-preview[data-tone="3"] { background: radial-gradient(80% 90% at 85% 15%, rgb(255 201 60 / 0.5), transparent 70%), var(--pk-night) !important; }
.pk-tournament-preview strong { font: 800 clamp(1.7rem, 2.6vw, 2.4rem)/1.05 var(--pk-display); letter-spacing: -0.04em; color: #fff; }
.pk-tournament-preview > span { color: rgb(255 255 255 / 0.62); font-family: var(--pk-display); font-weight: 600; }
.pk-tournament-preview::after { content: "VS"; position: absolute; right: 22px; bottom: 22px; display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: var(--pk-butter); color: var(--pk-night); font: 800 1.15rem/1 var(--pk-display); letter-spacing: -0.02em; rotate: -10deg; box-shadow: 0 10px 24px -8px rgb(0 0 0 / 0.5); transition: rotate var(--pk-ui) var(--pk-spring); }
@media (hover: hover) and (pointer: fine) { .pk-tournament-card > a:hover .pk-tournament-preview::after { rotate: 8deg; } }
.pk-tournament-card h2, .pk-tournament-card h3 { font-weight: 800; }

/* Estudio K-Beauty vanity: the rendered dropper and cushion stand on a lacquered shelf. */
.pk-vanity { background: radial-gradient(ellipse at 50% 28%, #fff5f7, #f6c9d6 75%) !important; filter: none; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.6); }
.pk-mirror { border-color: #e7c27a !important; box-shadow: 0 0 0 4px rgb(255 255 255 / 0.5), 0 18px 40px -12px rgb(160 40 80 / 0.35) !important; }
.pk-vanity-caption { position: relative; z-index: 1; font: 700 0.7rem/1 var(--pk-display) !important; letter-spacing: 0.14em; color: var(--pk-cherry-ink); }
.pk-vanity-objects { border-bottom: 12px solid var(--pk-night) !important; border-radius: 0 0 6px 6px; }
.pk-vanity-objects .pk-bottle, .pk-vanity-objects .pk-cream { font-size: 0 !important; color: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; background: center bottom / contain no-repeat !important; filter: drop-shadow(0 14px 14px rgb(26 21 48 / 0.25)); }
.pk-vanity-objects .pk-bottle { width: 112px !important; height: 172px !important; background-image: url(../images/studio3/bottle-480.webp) !important; rotate: -6deg; transform: none !important; }
.pk-vanity-objects .pk-cream { width: 132px !important; height: 104px !important; background-image: url(../images/studio3/compact-480.webp) !important; rotate: 4deg; transform: none !important; }
.pk-vanity-objects .pk-bottle::before { display: none !important; }
.pk-service-card .pk-link-arrow { display: none; }

/* Estudio vanity: bigger rendered objects, the caption kept clear above the shelf. */
.pk-vanity { padding-bottom: 11.5rem !important; }
.pk-vanity-objects { gap: 1rem !important; }
.pk-vanity-objects .pk-bottle { width: 138px !important; height: 206px !important; }
.pk-vanity-objects .pk-cream { width: 168px !important; height: 128px !important; }
@media (max-width: 700px) {
	.pk-vanity { padding-bottom: 9.5rem !important; }
	.pk-vanity-objects .pk-bottle { width: 104px !important; height: 156px !important; }
	.pk-vanity-objects .pk-cream { width: 126px !important; height: 96px !important; }
}
button { font-family: var(--pk-display); font-weight: 600; letter-spacing: -0.005em; }
.pk-profile-button, .pk-choice { font-family: var(--pk-font); font-weight: 500; }
input[type=checkbox] { accent-color: var(--pk-cherry-ink); border-radius: 6px; }
@media (max-width: 700px) { .pk-tournament-preview::after { top: 16px; right: 16px; bottom: auto; width: 52px; height: 52px; font-size: 0.95rem; } }

/* The cast: each door's character says hello in a little speech bubble. */
.pk4-door__art { position: relative; }
.pk4-bubble { position: absolute; top: 18%; right: 8%; padding: 8px 14px; border-radius: 18px 18px 18px 4px; background: #fff; color: var(--pk-ink); font: 800 0.9rem/1.1 var(--pk-display); letter-spacing: -0.01em; white-space: nowrap; box-shadow: 0 10px 24px -10px rgb(26 21 48 / 0.45); rotate: 4deg; transition: rotate var(--pk-ui) var(--pk-spring), translate var(--pk-ui) var(--pk-spring); }
.pk4-bubble::after { content: ""; position: absolute; left: -2px; bottom: -6px; width: 14px; height: 14px; background: #fff; clip-path: polygon(0 0, 100% 0, 0 100%); }
@media (hover: hover) and (pointer: fine) { .pk4-door:hover .pk4-bubble { rotate: -3deg; translate: 0 -4px; } }
@media (prefers-reduced-motion: no-preference) { .pk4-bubble { animation: pk-bob 4.5s var(--pk-ease-in-out, ease-in-out) infinite alternate; } }
@keyframes pk-bob { from { translate: 0 0; } to { translate: 0 -5px; } }
@media (max-width: 700px) { .pk4-bubble { top: 4px; right: -6px; padding: 5px 9px; font-size: 0.68rem; border-radius: 12px 12px 12px 3px; } }

/* Hero copy keeps clear of the cast on the right. */
@media (min-width: 701px) {
	.pk4-stage__copy > * { max-width: 600px; }
	.pk4-stage__intro { max-width: 36ch; }
	.pk4-stage h1 { font-size: clamp(2.8rem, 5vw, 5rem); }
}
/* K-Culture banner label: a light-on-dark pill. */
.pk-landing.pk-world-culture :is(.pk-service-heading, .pk-play-heading, .pk-page-heading) > .pk-eyebrow { background: rgb(255 255 255 / 0.12) !important; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.16); }

/* ───────────── Studio 3.4 · inner pages ─────────────
 * Every page inside a world now opens like its front page: a tinted stage, the world's Hangul
 * mark and a rendered object chosen by what the page is about (a jar for a cream, books for a
 * guide). Reading pages pair one comfortable column with a quiet aside for what to do next. */

/* Each world's ink and wash, for labels, numbers and soft panels (AA on white and on the wash). */
body { --pk-acc: var(--pk-cherry-ink); --pk-acc-soft: var(--pk-blush-2); --pk-acc-line: rgb(179 18 63 / 0.16); }
.pk-world-my-skin { --pk-acc: #1c7457; --pk-acc-soft: #e8f7f0; --pk-acc-line: rgb(28 116 87 / 0.18); --pk-hangul-mark: "피부"; }
.pk-world-k-beauty { --pk-acc: #b3123f; --pk-acc-soft: #fff0f3; --pk-acc-line: rgb(179 18 63 / 0.16); --pk-hangul-mark: "뷰티"; }
.pk-world-learn { --pk-acc: #4a35c4; --pk-acc-soft: #f1edff; --pk-acc-line: rgb(74 53 196 / 0.16); --pk-hangul-mark: "배움"; }
.pk-world-play { --pk-acc: #8a4b00; --pk-acc-soft: #fff5d9; --pk-acc-line: rgb(138 75 0 / 0.18); --pk-hangul-mark: "놀이"; }
.pk-world-culture { --pk-acc: #5b3fd0; --pk-acc-soft: #efeaff; --pk-acc-line: rgb(91 63 208 / 0.18); --pk-hangul-mark: "문화"; }
.pk-world-today { --pk-acc: #a8481a; --pk-acc-soft: #fff1e6; --pk-acc-line: rgb(168 72 26 / 0.18); --pk-hangul-mark: "오늘"; }

/* Which object stands on a detail page's stage. */
.pk-world-k-beauty { --pk-detail-art: url(../images/studio3/dropi-480.webp); }
.pk-world-learn { --pk-detail-art: url(../images/studio3/books-480.webp); }
.pk-world-play { --pk-detail-art: url(../images/studio3/mina-480.webp); }
.pk-world-culture { --pk-detail-art: url(../images/studio3/joon-480.webp); }
.pk-world-my-skin, .pk-world-today { --pk-detail-art: url(../images/studio3/drop-480.webp); }
[data-category="serum"], [data-category="hydrating"], [data-kind="ingredient"] { --pk-detail-art: url(../images/studio3/bottle-480.webp); }
[data-category="moisturizer"] { --pk-detail-art: url(../images/studio3/jar-480.webp); }
[data-category="cleanser"], [data-category="oil-cleanser"] { --pk-detail-art: url(../images/studio3/drop-480.webp); }
[data-category="sunscreen"] { --pk-detail-art: url(../images/studio3/dropi-480.webp); }
[data-kind="guide"] { --pk-detail-art: url(../images/studio3/books-480.webp); }
[data-kind="short"] { --pk-detail-art: url(../images/studio3/compact-480.webp); }
.pk-torneo-page { --pk-detail-art: url(../images/studio3/tickets-480.webp); }
.pk-drama-main { --pk-detail-art: url(../images/studio3/lantern-480.webp); }
@supports (background-image: image-set(url(x.avif) type("image/avif"))) {
	.pk-world-k-beauty, [data-category="sunscreen"] { --pk-detail-art: image-set(url(../images/studio3/dropi-480.avif) type("image/avif"), url(../images/studio3/dropi-480.webp) type("image/webp")); }
	.pk-world-learn, [data-kind="guide"] { --pk-detail-art: image-set(url(../images/studio3/books-480.avif) type("image/avif"), url(../images/studio3/books-480.webp) type("image/webp")); }
	.pk-world-play { --pk-detail-art: image-set(url(../images/studio3/mina-480.avif) type("image/avif"), url(../images/studio3/mina-480.webp) type("image/webp")); }
	.pk-world-culture { --pk-detail-art: image-set(url(../images/studio3/joon-480.avif) type("image/avif"), url(../images/studio3/joon-480.webp) type("image/webp")); }
	.pk-world-my-skin, .pk-world-today, [data-category="cleanser"], [data-category="oil-cleanser"] { --pk-detail-art: image-set(url(../images/studio3/drop-480.avif) type("image/avif"), url(../images/studio3/drop-480.webp) type("image/webp")); }
	[data-category="serum"], [data-category="hydrating"], [data-kind="ingredient"] { --pk-detail-art: image-set(url(../images/studio3/bottle-480.avif) type("image/avif"), url(../images/studio3/bottle-480.webp) type("image/webp")); }
	[data-category="moisturizer"] { --pk-detail-art: image-set(url(../images/studio3/jar-480.avif) type("image/avif"), url(../images/studio3/jar-480.webp) type("image/webp")); }
	[data-kind="short"] { --pk-detail-art: image-set(url(../images/studio3/compact-480.avif) type("image/avif"), url(../images/studio3/compact-480.webp) type("image/webp")); }
	.pk-torneo-page { --pk-detail-art: image-set(url(../images/studio3/tickets-480.avif) type("image/avif"), url(../images/studio3/tickets-480.webp) type("image/webp")); }
	.pk-drama-main { --pk-detail-art: image-set(url(../images/studio3/lantern-480.avif) type("image/avif"), url(../images/studio3/lantern-480.webp) type("image/webp")); }
}

/* The detail stage: the landing banner, a little shorter. */
body:not(.pk-landing) :is(.pk-service-heading, .pk-play-heading, .pk-tournament-intro) {
	position: relative; isolation: isolate; overflow: hidden;
	display: flex; flex-direction: column; justify-content: center;
	max-width: none; min-height: 260px; margin: 4px 0 40px;
	padding: clamp(30px, 4vw, 56px) min(40%, 400px) clamp(30px, 4vw, 56px) clamp(26px, 4.2vw, 60px);
	border-radius: var(--pk-r-xl);
	background: var(--pk-world-tint, linear-gradient(160deg, var(--pk-sage-2), var(--pk-sage)));
}
body:not(.pk-landing) :is(.pk-service-heading, .pk-play-heading, .pk-tournament-intro)::after {
	content: ""; position: absolute; z-index: -1; right: 5%; top: 18px; bottom: 18px; width: min(30%, 260px);
	background: var(--pk-detail-art, var(--pk-world-art)) center / contain no-repeat;
	filter: drop-shadow(0 18px 24px rgb(26 21 48 / 0.18)); pointer-events: none;
}
body:not(.pk-landing) :is(.pk-service-heading, .pk-play-heading, .pk-tournament-intro)::before {
	content: var(--pk-hangul-mark, ""); position: absolute; z-index: -2; right: clamp(16px, 3vw, 40px); bottom: -0.18em;
	font: 900 clamp(4.6rem, 11vw, 9rem)/1 var(--pk-hangul); color: rgb(26 21 48 / 0.06); pointer-events: none;
}
body:not(.pk-landing) :is(.pk-service-heading, .pk-play-heading, .pk-tournament-intro) h1 {
	font-weight: 800; font-size: clamp(2.1rem, 4.4vw, 3.7rem); line-height: 1.04; letter-spacing: -0.04em; max-width: 18ch; text-wrap: balance;
}
body:not(.pk-landing) :is(.pk-service-heading, .pk-play-heading, .pk-tournament-intro) > .pk-eyebrow {
	align-self: flex-start; display: inline-flex; align-items: center; min-height: 28px; padding: 0 12px; margin-bottom: 14px;
	border-radius: var(--pk-r-pill); background: rgb(255 255 255 / 0.72); color: var(--pk-acc); font-size: 0.78rem; font-weight: 700;
	box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.9);
}
body:not(.pk-landing) :is(.pk-service-heading, .pk-play-heading) > p:not(.pk-eyebrow) { color: var(--pk-ink-2); max-width: 52ch; text-wrap: pretty; }
@media (prefers-reduced-motion: no-preference) {
	body:not(.pk-landing) :is(.pk-service-heading, .pk-play-heading, .pk-tournament-intro)::after { animation: pk-settle 900ms var(--pk-ease-out) both; }
	body:not(.pk-landing) :is(.pk-service-heading, .pk-play-heading, .pk-tournament-intro) > * { animation: pk-rise var(--pk-scene) var(--pk-ease-out) both; }
	body:not(.pk-landing) :is(.pk-service-heading, .pk-play-heading, .pk-tournament-intro) > :nth-child(2) { animation-delay: 60ms; }
	body:not(.pk-landing) :is(.pk-service-heading, .pk-play-heading, .pk-tournament-intro) > :nth-child(3) { animation-delay: 120ms; }
}
/* K-Culture details stand on the night stage, like its front page. */
body.pk-world-culture:not(.pk-landing) :is(.pk-service-heading, .pk-play-heading, .pk-tournament-intro) { color: #fff; }
body.pk-world-culture:not(.pk-landing) :is(.pk-service-heading, .pk-play-heading, .pk-tournament-intro)::before { color: rgb(255 255 255 / 0.07); }
body.pk-world-culture:not(.pk-landing) :is(.pk-service-heading, .pk-play-heading, .pk-tournament-intro) h1 { color: #fff; }
body.pk-world-culture:not(.pk-landing) :is(.pk-service-heading, .pk-play-heading, .pk-tournament-intro) > p:not(.pk-eyebrow),
body.pk-world-culture:not(.pk-landing) .pk-tournament-description p { color: rgb(255 255 255 / 0.82); }
body.pk-world-culture:not(.pk-landing) :is(.pk-service-heading, .pk-play-heading, .pk-tournament-intro) > .pk-eyebrow { background: rgb(255 255 255 / 0.12); color: var(--pk-butter); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.16); }
body.pk-world-culture:not(.pk-landing) .pk-tournament-description summary { color: var(--pk-butter); }

/* Breadcrumbs: a quiet trail above the stage. */
:is(.pk-play-crumbs, .pk-torneo-page > nav) { margin-bottom: 2px; }
:is(.pk-play-crumbs, .pk-torneo-page > nav) a { color: var(--pk-acc); }

/* ── Reading layout: one column, an aside for the next step ── */
.pk-read { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 340px); gap: clamp(28px, 4vw, 56px); align-items: start; counter-reset: pk-step; }
.pk-read-main { max-width: 720px; margin: 0; padding: 0; background: none; border-radius: 0; box-shadow: none; }
.pk-read-aside { position: sticky; top: calc(var(--pk-header-h) + 20px); display: grid; gap: 18px; }

.pk-read-answer { position: relative; padding: clamp(24px, 3.4vw, 40px); border-radius: var(--pk-r-xl); background: var(--pk-surface); box-shadow: var(--pk-shadow-2); }
.pk-read-answer > .pk-eyebrow { color: var(--pk-acc); margin-bottom: 10px; }
.pk-read-main .pk-read-answer h2 { margin: 0 0 12px; font-size: clamp(1.35rem, 2.2vw, 1.75rem); line-height: 1.2; letter-spacing: -0.025em; text-wrap: balance; }
.pk-read-main .pk-read-answer .pk-service-lead { margin: 0; font-size: clamp(1.1rem, 1.6vw, 1.28rem); line-height: 1.6; color: var(--pk-ink); text-wrap: pretty; }

.pk-read-section { position: relative; counter-increment: pk-step; padding: 34px 0 30px 68px; border-bottom: 1px solid var(--pk-line); }
.pk-read-section::before {
	content: counter(pk-step, decimal-leading-zero); position: absolute; left: 0; top: 30px;
	font: italic 400 2.2rem/1 var(--pk-accent); color: var(--pk-acc); letter-spacing: -0.02em;
}
.pk-read-main .pk-read-section h2 { margin: 0 0 10px; font-size: 1.32rem; line-height: 1.25; letter-spacing: -0.02em; }
.pk-read-main .pk-read-section p { margin: 0; font-size: 1.04rem; line-height: 1.78; color: var(--pk-ink-2); max-width: 64ch; }

.pk-read-try, .pk-read-note, .pk-read-facts, .pk-read-ingredients { margin-top: 28px; padding: clamp(22px, 3vw, 32px); border-radius: var(--pk-r-lg); }
.pk-read-try { background: var(--pk-acc-soft); box-shadow: inset 0 0 0 1px var(--pk-acc-line); }
.pk-read-main :is(.pk-read-try, .pk-read-note, .pk-read-facts, .pk-read-ingredients) h2 { margin: 0 0 14px; font-size: 1.15rem; letter-spacing: -0.015em; }
.pk-read-try ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.pk-read-try li { position: relative; padding-left: 36px; font-size: 1rem; line-height: 1.6; color: var(--pk-ink); }
.pk-read-try li::before {
	content: ""; position: absolute; left: 0; top: 0.12em; width: 24px; height: 24px; border-radius: 50%; background: var(--pk-acc);
	-webkit-mask: radial-gradient(circle, #000 0 100%); mask: radial-gradient(circle, #000 0 100%);
}
.pk-read-try li::after { content: ""; position: absolute; left: 8px; top: calc(0.12em + 6px); width: 6px; height: 10px; border: solid #fff; border-width: 0 2px 2px 0; rotate: 45deg; }
.pk-read-note { background: var(--pk-surface); box-shadow: inset 0 0 0 1px var(--pk-line-strong); }
.pk-read-note h2::before { content: "✦"; margin-right: 8px; color: var(--pk-acc); }
.pk-read-main .pk-read-note p { margin: 0; font-size: 1rem; line-height: 1.7; color: var(--pk-ink-2); }

/* Aside: the next step as large pressable rows, then the source in small print. */
.pk-read-next, .pk-read-source { padding: 22px; border-radius: var(--pk-r-lg); background: var(--pk-surface); box-shadow: var(--pk-shadow-1); }
.pk-read-aside h2 { margin: 0 0 12px; font-size: 1rem; letter-spacing: -0.01em; }
.pk-next-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.pk-next-list a {
	display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 56px; padding: 12px 14px 12px 16px;
	border-radius: var(--pk-r-md); background: var(--pk-acc-soft); color: var(--pk-ink); text-decoration: none; font-weight: 600; font-size: 0.96rem; line-height: 1.3;
	transition: background-color var(--pk-fast) var(--pk-ease-soft), scale var(--pk-release) var(--pk-spring);
}
.pk-next-list a .pk-link-arrow { flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #fff; color: var(--pk-acc); font-size: 0.85rem; transition: translate var(--pk-fast) var(--pk-ease-out); }
.pk-next-list a:active { scale: var(--pk-press-scale); transition-duration: var(--pk-instant); }
@media (hover: hover) and (pointer: fine) { .pk-next-list a:hover .pk-link-arrow { translate: 2px -2px; } .pk-next-list a:hover { background: color-mix(in srgb, var(--pk-acc-soft) 70%, var(--pk-acc) 8%); } }
.pk-read-source ul { list-style: none; margin: 0 0 10px; padding: 0; display: grid; gap: 6px; font-size: 0.92rem; }
.pk-read-source a { color: var(--pk-ink-2); }
.pk-read-source .pk-eyebrow { color: var(--pk-muted); font-weight: 600; }

/* Product facts: what we checked stands out, what we do not know stays quiet. */
.pk-read-facts { padding: 0; }
.pk-read-main .pk-read-facts h2 { margin: 30px 0 14px; }
.pk-read-product .pk-service-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 0; background: none; box-shadow: none; border-radius: 0; }
.pk-read-product .pk-service-facts > div { padding: 14px 16px; border: 0; border-radius: var(--pk-r-md); background: var(--pk-surface); box-shadow: inset 0 0 0 1px var(--pk-line); }
.pk-read-product .pk-service-facts > [data-known="1"] { box-shadow: inset 0 0 0 1px var(--pk-acc-line), var(--pk-shadow-1); }
.pk-read-product .pk-service-facts > [data-known="1"] dd { font-weight: 650; color: var(--pk-ink); }
.pk-read-product .pk-service-facts > [data-known="1"] dd::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 8px; border-radius: 50%; background: var(--pk-acc); translate: 0 -1px; }
.pk-read-product .pk-service-facts > [data-known="0"] { background: transparent; box-shadow: inset 0 0 0 1px var(--pk-line); }
.pk-read-product .pk-service-facts > [data-known="0"] dd { color: var(--pk-muted); font-style: italic; }
.pk-read-product .pk-service-facts dt { font-size: 0.76rem; letter-spacing: 0.01em; }
.pk-read-ingredients { padding: 0; }
.pk-read-main .pk-read-ingredients h2 { margin: 30px 0 14px; }
.pk-chip-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.pk-chip-list > li > :is(a, span) {
	display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 16px; border-radius: var(--pk-r-pill);
	background: var(--pk-acc-soft); color: var(--pk-acc); font-weight: 650; font-size: 0.92rem; text-decoration: none; box-shadow: inset 0 0 0 1px var(--pk-acc-line);
	transition: scale var(--pk-release) var(--pk-spring);
}
.pk-chip-list a:active { scale: var(--pk-press-scale); transition-duration: var(--pk-instant); }
.pk-source-button {
	display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; margin-top: 12px; border-radius: var(--pk-r-pill);
	background: var(--pk-ink); color: #fff !important; font-weight: 650; text-decoration: none; transition: scale var(--pk-release) var(--pk-spring), background-color var(--pk-fast) var(--pk-ease-soft);
}
.pk-source-button:active { scale: var(--pk-press-scale); transition-duration: var(--pk-instant); }
@media (hover: hover) and (pointer: fine) { .pk-source-button:hover { background: var(--pk-night-2); } }

/* ── Lists: each row carries a small rendered object for what it is ── */
.pk-service-grid { gap: 0 36px; padding: 8px 26px; border-radius: var(--pk-r-xl); }
.pk-service-card[data-category], .pk-service-card[data-kind] { padding-left: 82px; }
.pk-service-card[data-category]::before, .pk-service-card[data-kind]::before {
	content: ""; position: absolute; left: 0; top: 22px; width: 64px; height: 64px; border-radius: 18px;
	background: var(--pk-detail-art) center / 86% no-repeat, var(--pk-acc-soft);
	transition: scale var(--pk-ui) var(--pk-spring);
}
@media (hover: hover) and (pointer: fine) { .pk-service-card:hover::before { scale: 1.06; } }
.pk-service-card[data-category] .pk-eyebrow, .pk-service-card[data-kind] .pk-eyebrow { color: var(--pk-acc); }
.pk-service-card[data-kind="ingredient"] { --pk-acc-soft: #fff0f3; }
.pk-service-card[data-kind="short"] { --pk-acc-soft: #fff5d9; }
.pk-service-tabs a[aria-current], .pk-service-tabs a:active { background: var(--pk-ink); color: #fff; }

/* Today: each module gets its own little wash. */
.pk-service-card[data-module] { padding: 22px 22px 20px; margin-block: 8px; border: 0; border-radius: var(--pk-r-lg); background: var(--pk-surface-2); }
.pk-service-card[data-module="habit"], .pk-service-card[data-module="skin-tip"] { background: #fff5d9; }
.pk-service-card[data-module="ingredient"] { background: #e8f7f0; }
.pk-service-card[data-module="question"] { background: #f1edff; }
.pk-service-card[data-module="pick"] { background: #fff0f3; }
.pk-service-card[data-module="challenge"] { background: #fff1e6; }
section[data-pk-today] .pk-service-grid { padding: 10px; gap: 10px; background: none; box-shadow: none; }
.pk-service-card[data-module] > a { position: static; display: inline-flex; margin-top: 10px; font-weight: 650; color: var(--pk-ink); }
.pk-service-card[data-module] > a::after { content: ""; position: absolute; inset: 0; }
.pk-today-culture { margin-top: 48px; padding: clamp(26px, 4vw, 44px); border-radius: var(--pk-r-xl); background: radial-gradient(90% 120% at 80% 50%, #3b2470, var(--pk-night) 75%); color: #fff; }
.pk-today-culture h2 { color: #fff; font-size: clamp(1.6rem, 3vw, 2.2rem); }
.pk-today-culture p { color: rgb(255 255 255 / 0.78); margin-top: 8px; }
.pk-today-culture ul { list-style: none; margin: 22px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.pk-today-culture a { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 64px; padding: 14px 16px; border-radius: var(--pk-r-md); background: rgb(255 255 255 / 0.08); color: #fff; text-decoration: none; font-weight: 650; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.14); transition: background-color var(--pk-fast) var(--pk-ease-soft), scale var(--pk-release) var(--pk-spring); }
.pk-today-culture a:active { scale: var(--pk-press-scale); transition-duration: var(--pk-instant); }
@media (hover: hover) and (pointer: fine) { .pk-today-culture a:hover { background: rgb(255 255 255 / 0.14); } }
.pk-today-culture .pk-link-arrow { color: var(--pk-butter); }

/* ── Play details ── */
.pk-interactive-shell { align-items: center; }
.pk-experience-art { background: var(--pk-acc-soft); }
#pk-experience-stage h2 { font-size: clamp(1.5rem, 2.6vw, 2.1rem); letter-spacing: -0.03em; line-height: 1.12; text-wrap: balance; }
#pk-experience-stage > p { margin-block: 10px 22px; color: var(--pk-ink-2); }
.pk-play-explanation { background: var(--pk-surface); box-shadow: var(--pk-shadow-1); }
.pk-play-explanation h2::before, .pk-play-next h2::before { content: "✦"; margin-right: 10px; color: var(--pk-acc); }
.pk-play-explanation summary { color: var(--pk-acc); }
.pk-play-next { max-width: 780px; margin: 28px auto 0; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
.pk-play-next h2 { flex-basis: 100%; }
.pk-play-next a.pk-primary-link { margin: 0; color: #fff; }
.pk-play-next a.pk-secondary-link { margin: 0; color: var(--pk-acc); }

/* ── Tournaments ── */
.pk-torneo-page .pk-tournament-intro { margin-top: 4px; }
.pk-tournament-description { margin-top: 14px; }
.pk-tournament-description p { font-size: 0.98rem; }
#pk-tournament-player { max-width: 980px; margin-inline: auto; text-align: center; }
#pk-tournament-stage > p { margin-block: 6px 18px; color: var(--pk-ink-2); }
.pk-torneo-section { max-width: 980px; margin: 40px auto 0; padding: clamp(22px, 3vw, 32px); border-top: 0 !important; border-radius: var(--pk-r-lg); background: var(--pk-acc-soft); }
.pk-torneo-section h2::before { content: "✦"; margin-right: 10px; color: var(--pk-acc); }
.pk-torneo-section > a { display: inline-flex; align-items: center; min-height: 48px; margin-top: 10px; padding: 0 20px; border-radius: var(--pk-r-pill); background: var(--pk-ink); color: #fff; font-weight: 650; text-decoration: none; }

/* ── Drama pages: the night stage holds the identity, the cover and the facts ── */
.pk-drama .pk-hero { position: relative; isolation: isolate; overflow: hidden; margin: 4px var(--pk-gutter) 0; padding-block: clamp(36px, 5vw, 64px); border-radius: var(--pk-r-xl); border: 0; background: radial-gradient(90% 120% at 80% 40%, #3b2470, var(--pk-night) 75%); color: #fff; }
.pk-drama .pk-hero::before { content: "드라마"; position: absolute; z-index: -1; left: clamp(16px, 3vw, 40px); bottom: -0.2em; font: 900 clamp(4.6rem, 11vw, 9rem)/1 var(--pk-hangul); color: rgb(255 255 255 / 0.05); pointer-events: none; }
.pk-drama .pk-hero h1 { color: #fff; }
.pk-drama .pk-hero .pk-eyebrow { display: inline-flex; align-items: center; min-height: 28px; padding: 0 12px; border-radius: var(--pk-r-pill); background: rgb(255 255 255 / 0.12); color: var(--pk-butter); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.16); }
.pk-drama .pk-alt-titles, .pk-drama .pk-status { color: rgb(255 255 255 / 0.78); }
.pk-drama .pk-facts { background: rgb(255 255 255 / 0.08); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.14); }
.pk-drama .pk-facts dt { color: rgb(255 255 255 / 0.62); }
.pk-drama .pk-facts dd { color: #fff; }
.pk-drama .pk-taxonomy a { background: rgb(255 255 255 / 0.12); color: #fff; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.16); }
.pk-drama .pk-poster__placeholder { box-shadow: 0 30px 60px -20px rgb(0 0 0 / 0.55); }
.pk-drama__body { max-width: 980px; }
.pk-drama__body .pk-section { padding: clamp(22px, 3vw, 32px); margin-bottom: 14px; border: 0; border-radius: var(--pk-r-lg); background: var(--pk-surface); box-shadow: var(--pk-shadow-1); }
.pk-drama__body h2::before { content: "✦"; margin-right: 10px; color: var(--pk-acc); }
.pk-drama .pk-cast { display: grid; list-style: none; margin: 0; padding: 0; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; }
.pk-drama .pk-cast li { margin: 0; padding: 14px 16px; border-radius: var(--pk-r-md); background: var(--pk-acc-soft); }
.pk-drama .pk-cast li span { display: block; margin-top: 2px; font-size: 0.86rem; color: var(--pk-muted); }
.pk-drama .pk-crew { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; margin: 0; }
.pk-drama .pk-crew > div { padding: 14px 16px; border-radius: var(--pk-r-md); box-shadow: inset 0 0 0 1px var(--pk-line); }
.pk-drama .pk-crew dt { font-size: 0.78rem; font-weight: 600; color: var(--pk-muted); }
.pk-drama .pk-crew dd { margin: 2px 0 0; font-weight: 650; }
.pk-drama__body .pk-section > ul:not(.pk-cast) { list-style: none; padding: 0; display: grid; gap: 8px; }
.pk-drama__body .pk-section > ul:not(.pk-cast) a { display: flex; align-items: center; min-height: 52px; padding: 12px 16px; border-radius: var(--pk-r-md); background: var(--pk-acc-soft); color: var(--pk-ink); font-weight: 600; text-decoration: none; }
.pk-culture-dramas > h2 { font-size: clamp(1.5rem, 2.6vw, 2rem); letter-spacing: -0.03em; }

/* ── Phones: the stage stacks, the object sits on top, the aside follows the reading ── */
@media (max-width: 980px) {
	.pk-read { grid-template-columns: 1fr; }
	.pk-read-aside { position: static; }
}
@media (max-width: 700px) {
	body:not(.pk-landing) :is(.pk-service-heading, .pk-play-heading, .pk-tournament-intro) { min-height: 0; margin: 0 -4px 26px; padding: 150px 22px 26px; border-radius: var(--pk-r-lg); }
	body:not(.pk-landing) :is(.pk-service-heading, .pk-play-heading, .pk-tournament-intro)::after { right: 50%; top: 10px; bottom: auto; width: 140px; height: 140px; translate: 50% 0; }
	body:not(.pk-landing) :is(.pk-service-heading, .pk-play-heading, .pk-tournament-intro)::before { font-size: 4rem; right: 12px; top: 96px; bottom: auto; }
	.pk-read-section { padding: 26px 0 24px 52px; }
	.pk-read-section::before { top: 24px; font-size: 1.8rem; }
	.pk-read-product .pk-service-facts { grid-template-columns: 1fr 1fr; gap: 8px; }
	.pk-read-product .pk-service-facts > div { padding: 12px; }
	.pk-service-grid { padding: 4px 16px; }
	.pk-service-card[data-category], .pk-service-card[data-kind] { padding-left: 70px; }
	.pk-service-card[data-category]::before, .pk-service-card[data-kind]::before { top: 18px; width: 54px; height: 54px; border-radius: 15px; }
	.pk-today-culture ul { grid-template-columns: 1fr; }
	.pk-drama .pk-hero { margin-inline: 12px; }
}

/* Studio 3.4 touch-ups */
.pk-chip-list .pk-link-arrow { display: inline; width: auto; height: auto; margin: 0; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; font-size: 0.8em; color: inherit; }
.pk-service-card[data-module]::after { display: none; }
.pk-drama .pk-poster { color: var(--pk-ink); }
.pk-drama .pk-poster__placeholder :is(.pk-poster__mark, .pk-poster__title, .pk-poster__note) { color: var(--pk-ink); }
.pk-chip-list .pk-link-arrow { line-height: 1; }
@media (max-width: 700px) {
	.pk-read-section { padding-left: 0; }
	.pk-read-section::before { position: static; display: block; margin-bottom: 8px; font-size: 1.7rem; }
}

/* Recommendation 2.0 cards: the label says how many verified reasons line up; no scores. */
.pk-profile-picks article[data-match] { position: relative; background: var(--pk-surface); box-shadow: inset 0 0 0 1px var(--pk-line), var(--pk-shadow-1); }
.pk-profile-picks article[data-match] > .pk-eyebrow { display: inline-flex; align-items: center; min-height: 26px; padding: 0 10px; border-radius: var(--pk-r-pill); background: var(--pk-surface-2); color: var(--pk-muted); font-size: 0.74rem; }
.pk-profile-picks article[data-match="strong-match"] { box-shadow: inset 0 0 0 1.5px var(--pk-acc-line), var(--pk-shadow-2); }
.pk-profile-picks article[data-match="strong-match"] > .pk-eyebrow { background: var(--pk-acc); color: #fff; }
.pk-profile-picks article[data-match="good-match"] > .pk-eyebrow { background: var(--pk-acc-soft); color: var(--pk-acc); }
.pk-profile-brand { margin-top: 2px; font-size: 0.82rem; font-weight: 600; color: var(--pk-muted); }
.pk-profile-picks article[data-match] ul { list-style: none; margin: 12px 0 10px; padding: 0; display: grid; gap: 8px; }
.pk-profile-picks article[data-match] li { position: relative; padding-left: 26px; line-height: 1.5; }
.pk-profile-picks article[data-match] li::before { content: ""; position: absolute; left: 0; top: 0.18em; width: 17px; height: 17px; border-radius: 50%; background: var(--pk-acc-soft); box-shadow: inset 0 0 0 1px var(--pk-acc-line); }
.pk-profile-picks article[data-match] li::after { content: ""; position: absolute; left: 6px; top: calc(0.18em + 4px); width: 4px; height: 7px; border: solid var(--pk-acc); border-width: 0 1.6px 1.6px 0; rotate: 45deg; }
.pk-profile-ingredients { margin-bottom: 10px; font-size: 0.85rem; color: var(--pk-muted); }

/* Ingredient chips: a drawn corner arrow instead of a glyph that floats in some fonts. */
.pk-chip-list .pk-link-arrow { font-size: 0; display: inline-block; width: 7px; height: 7px; margin-left: 2px; border-top: 1.6px solid currentColor; border-right: 1.6px solid currentColor; translate: 0 1px; }
.pk-chip-list { align-items: center; }
.pk-chip-list > li { margin: 0; display: flex; }

/* ───────────── Studio 3.5 · motion on touch ─────────────
 * A phone has no hover, so cards answer as they reach the middle of the screen (.pk-inview from
 * studio.js) with the same lift, light and arrow a mouse gives; every tappable surface presses down
 * and springs back; and every page's lower blocks rise in with a small stagger. Movement only under
 * no-preference; reduced motion keeps press colour feedback and hides nothing. */
@media (prefers-reduced-motion: no-preference) {
	[data-pk-reveal] { transition-delay: calc(var(--pk-reveal-i, 0) * 70ms); }
	[data-pk-reveal]:not(.pk-reveal-wait) { transition-delay: 0ms; }
}
@media (prefers-reduced-motion: no-preference) and ((hover: none) or (pointer: coarse)) {
	.pk-card, .pk4-door, .pk4-tile, .pk-play-card, .pk-drama-cover, .pk-tournament-card > a, .pk-discovery-links > a,
	.pk-service-card[data-category], .pk-service-card[data-kind], .pk-service-card[data-module] {
		transition: translate var(--pk-ui) var(--pk-ease-out), box-shadow var(--pk-ui) var(--pk-ease-soft), scale var(--pk-release) var(--pk-spring), background-color var(--pk-ui) var(--pk-ease-soft);
	}
	:is(.pk-card, .pk4-door, .pk-play-card, .pk-drama-cover, .pk-tournament-card > a, .pk-discovery-links > a).pk-inview { translate: 0 -2px; box-shadow: var(--pk-shadow-3); }
	.pk-card.pk-inview [data-pk-card-media] { scale: 1.035; translate: 0 -3px; }
	.pk-card.pk-inview [data-pk-card-arrow] { translate: 4px 0; }
	.pk4-tile.pk-inview::after { rotate: 8deg; }
	.pk4-door.pk-inview .pk4-bubble { rotate: -3deg; translate: 0 -4px; }
	.pk-tournament-card > a.pk-inview .pk-tournament-preview::after { rotate: 8deg; }
	.pk-service-card.pk-inview::before { scale: 1.08; }
	.pk-service-card.pk-inview::after { translate: 3px -50%; border-color: var(--pk-cherry-ink); }
	.pk-service-card.pk-inview h2 a { color: var(--pk-acc); }
	.pk-service-card[data-module].pk-inview { translate: 0 -2px; box-shadow: var(--pk-shadow-2); }
	.pk-service-card::before { transition: scale var(--pk-ui) var(--pk-spring); }
	.pk-service-card::after { transition: translate var(--pk-ui) var(--pk-ease-out), border-color var(--pk-fast); }

	/* Press: down fast, back on the spring. */
	:is(.pk-card, .pk4-door, .pk4-tile, .pk-play-card, .pk-drama-cover, .pk-tournament-card > a, .pk-discovery-links > a, .pk-service-card, .pk-next-list a, .pk-chip-list a, .pk-today-culture a, .pk-source-button, .pk-primary-link, .pk-secondary-link, .pk-button, .pk-profile-button, .pk-choice, .pk-candidate-button, .pk-service-tabs a, .pk-catalogue-categories a, .pk-taxonomy a, .pk-drama__body .pk-section > ul a, .pk-torneo-section > a):active {
		scale: var(--pk-press-scale); transition-duration: var(--pk-instant);
	}
	:is(.pk-next-list a, .pk-chip-list a, .pk-profile-button, .pk-choice, .pk-service-tabs a):active { scale: 0.975; }
	.pk-next-list a:active .pk-link-arrow { translate: 2px -2px; }

	/* Tab bar: the icon gives a small, springy nod when touched; the current world's icon settles in on arrival. */
	.pk-tabbar a .pk-tab-icon { transition: scale var(--pk-release) var(--pk-spring), translate var(--pk-release) var(--pk-spring); }
	.pk-tabbar a:active .pk-tab-icon { scale: 0.86; transition-duration: var(--pk-instant); }
	.pk-tabbar a[aria-current] .pk-tab-icon { animation: pk-tab-nod 520ms var(--pk-spring) both 120ms; }
}
@keyframes pk-tab-nod { from { translate: 0 4px; scale: 0.9; } to { translate: 0 0; scale: 1; } }
/* Reduced motion on touch: a press still darkens, without moving. */
@media (prefers-reduced-motion: reduce) and ((hover: none) or (pointer: coarse)) {
	:is(.pk-card, .pk-service-card, .pk-next-list a, .pk-chip-list a, .pk-play-card, .pk-drama-cover, .pk-tournament-card > a):active { filter: brightness(0.96); }
}

/* Trust pages and new links (Studio 3.6). */
[data-page] { --pk-detail-art: url(../images/studio3/books-480.webp); --pk-world-tint: radial-gradient(120% 130% at 85% 55%, #fffaf3, #f3e6d6 70%); }
[data-page="privacy"] { --pk-detail-art: url(../images/studio3/lantern-480.webp); }
[data-page="method"] { --pk-detail-art: url(../images/studio3/bottle-480.webp); }
.pk-footer-trust ul { list-style: none; margin: 0 0 18px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 0.9rem; }
.pk-footer-trust a { color: rgb(255 255 255 / 0.78); text-decoration: none; }
.pk-footer-trust a:hover, .pk-footer-trust a:focus-visible { color: #fff; text-decoration: underline; }
.pk-read-method { margin: 12px 0 0; font-size: 0.88rem; }
.pk-read-method a { color: var(--pk-ink-2); }
.pk-read-more { margin: 10px 0 0; font-size: 0.9rem; font-weight: 600; }
.pk-service-filter-note { margin: -8px 0 16px; font-size: 0.92rem; color: var(--pk-ink-2); }
.pk-profile-method { margin: 18px 0 6px; font-size: 0.9rem; }
.pk-footer-trust ul { align-items: center; }
.pk-footer-trust li { margin: 0; padding: 0; line-height: 1.4; }
/* Today invitation in reading asides (Studio 3.7). */
.pk-read-today { padding: 20px 22px; border-radius: var(--pk-r-lg); background: radial-gradient(120% 130% at 85% 20%, #fffaf0, #ffe4c4 80%); }
.pk-read-today .pk-eyebrow { color: #a8481a; }
.pk-read-today p:not(.pk-eyebrow) { margin: 6px 0 10px; font-size: 0.92rem; line-height: 1.5; color: var(--pk-ink-2); }
.pk-read-today a { font-weight: 650; color: var(--pk-ink); }