@ihabdevteam/core 0.193.0 → 0.195.0

package/dist/ihabdevteam-core.css

@@ -1 +1 @@
-:where(.ihabdevteam-core-scope){color-scheme:light;--brand-main:#499cdf;--brand-sub:#4dcdc0;--color-lightMain:var(--brand-lightMain,#d2e2ef);--color-softMain:var(--brand-softMain,#8bbce4);--color-main:var(--brand-main);--color-main-a10:color-mix(in srgb,var(--color-main) 10%,transparent);--color-main-a20:color-mix(in srgb,var(--color-main) 20%,transparent);--color-deepMain:var(--brand-deepMain,#418ecd);--color-darkMain:var(--brand-darkMain,#1e5a8f);--color-lightSub:var(--brand-lightSub,#d5ecea);--color-softSub:var(--brand-softSub,#92ddd5);--color-sub:var(--brand-sub);--color-sub-a10:color-mix(in srgb,var(--color-sub) 10%,transparent);--color-deepSub:var(--brand-deepSub,#45bbaf);--color-darkSub:var(--brand-darkSub,#257e76);--color-text-main:var(--color-darkMain);--color-text-sub:var(--color-darkSub);--color-infoLink:#2f7fd1;--color-uiAccent:#32bbae;--color-success:#2fae9e;--color-warn:#e6b94e;--color-warn-a10:#e6b94e1a;--color-error:#d9534f;--color-error-a10:#d9534f1a;--color-like:#e06b68;--color-disabled:#bfc7d1;--color-pureWhite:#fff;--color-white:#fbfdff;--color-white-a10:#fbfdff1a;--color-white-a30:#fbfdff4d;--color-white-a60:#fbfdff99;--color-white-a80:#fbfdffcc;--color-deepWhite:#f8fafc;--color-darkWhite:#eef2f6;--color-whiteLine:#dde3ec;--color-lightGray:#96a4b8;--color-lightGray-a10:#96a4b81a;--color-lightGray-a80:#96a4b8cc;--color-softGray:#7b8ca3;--color-gray:#64748b;--color-gray-a10:#64748b1a;--color-gray-a60:#64748b99;--color-gray-a80:#64748bcc;--color-deepGray:#546170;--color-darkGray:#434d56;--color-darkGray-a10:#434d561a;--color-lightBlack:#32393f;--color-softBlack:#222528;--color-black:#111;--color-pureBlack:#000;--color-popupBlock:rgba(16,24,32,.6);--color-onDark-title:var(--color-pureWhite);--color-onDark-text:hsla(0,0%,100%,.58);--color-onDark-muted:hsla(0,0%,100%,.5);--color-onDark-surface:hsla(0,0%,100%,.04);--color-text-primary:var(--color-black);--color-text-secondary:var(--color-gray);--color-text-muted:var(--color-lightGray);--color-text-on-brand:var(--color-pureWhite);--color-surface:var(--color-white);--color-surface-raised:var(--color-deepWhite);--color-surface-sunken:var(--color-darkWhite);--color-border:var(--color-whiteLine);--color-overlay:var(--color-popupBlock);--shadow-popup:20px 20px 20px rgba(0,0,0,.05);--shadow-tooltip:8px 8px 8px rgba(0,0,0,.05);--shadow-button:4px 4px 4px rgba(0,0,0,.05);--shadow-menu:20px 20px 20px rgba(0,0,0,.05);--shadow-card:2px 2px 8px rgba(0,0,0,.06);--shadow-dropdown:8px 8px 24px rgba(0,0,0,.06);--shadow-panel:4px 4px 20px rgba(0,0,0,.06);--font-family:"Pretendard Variable","Pretendard",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;--text-display-1-size:clamp(44px,6.6vw,72px);--text-display-1-line:1.05;--text-display-1-spacing:-0.04em;--text-display-1-weight:800;--text-display-1-weight-bold:900;--text-display-2-size:clamp(38px,5.2vw,56px);--text-display-2-line:1.12;--text-display-2-spacing:-0.03em;--text-display-2-weight:700;--text-display-2-weight-bold:800;--text-display-3-size:clamp(34px,4.1vw,44px);--text-display-3-line:1.2;--text-display-3-spacing:-0.02em;--text-display-3-weight:700;--text-display-3-weight-bold:800;--text-h0-size:40px;--text-h0-line:52px;--text-h0-spacing:-1px;--text-h0-weight:700;--text-h0-weight-bold:800;--text-h1-size:32px;--text-h1-line:44px;--text-h1-spacing:-0.5px;--text-h1-weight:700;--text-h1-weight-bold:800;--text-h2-size:24px;--text-h2-line:34px;--text-h2-spacing:-0.25px;--text-h2-weight:500;--text-h2-weight-bold:600;--text-h3-size:20px;--text-h3-line:30px;--text-h3-spacing:normal;--text-h3-weight:500;--text-h3-weight-bold:600;--text-h4-size:17px;--text-h4-line:26px;--text-h4-spacing:normal;--text-h4-weight:500;--text-h4-weight-bold:600;--text-h5-size:15px;--text-h5-line:23px;--text-h5-spacing:normal;--text-h5-weight:500;--text-h5-weight-bold:600;--text-body-1-size:18px;--text-body-1-line:28px;--text-body-1-weight:400;--text-body-1-weight-bold:600;--text-body-2-size:16px;--text-body-2-line:26px;--text-body-2-weight:400;--text-body-2-weight-bold:600;--text-body-3-size:14px;--text-body-3-line:22px;--text-body-3-weight:400;--text-body-3-weight-bold:600;--text-button-1-size:14px;--text-button-1-line:20px;--text-button-1-weight:500;--text-button-2-size:13px;--text-button-2-line:18px;--text-button-2-weight:400;--text-caption-1-size:12px;--text-caption-1-line:17px;--text-caption-1-weight:400;--text-caption-1-weight-bold:600;--text-caption-2-size:11px;--text-caption-2-line:15px;--text-caption-2-weight:400;--text-caption-2-weight-bold:600;--spacing-xs:8px;--spacing-s:12px;--spacing-m:16px;--spacing-l:20px;--spacing-xl:24px;--spacing-page:60px;--spacing-content:20px;--container-page:1920px;--margin-page:var(--spacing-page);--margin-content:var(--spacing-content);--duration-fast:120ms;--duration-base:200ms;--duration-slow:320ms;--ease-out:cubic-bezier(0.22,0.9,0.3,1);--ease-in-out:cubic-bezier(0.4,0,0.2,1);--bp-tablet:768px;--bp-desktop:1024px;--radius-xs:4px;--radius-sm:8px;--radius-s:10px;--radius-card:12px;--radius-m:20px;--radius-l:40px;--radius-full:999px;--radius-dialog:var(--radius-m);--z-base:0;--z-content:1;--z-dropdown:200;--z-sticky:500;--z-bulk-bar:600;--z-nav:1000;--z-sidebar:1100;--z-menu:1500;--z-overlay:2000;--z-page-popup:2100;--z-fab:2150;--z-modal:2200;--focus-ring:var(--color-main);--z-popover:2300;--z-tooltip:3000;--z-alert:3100;--z-toast:3200}@media (min-width:768px) and (max-width:1023px){:where(.ihabdevteam-core-scope){--spacing-page:40px;--spacing-content:15px;--text-h0-size:32px;--text-h0-line:44px;--text-h0-spacing:-0.75px;--text-h1-size:28px;--text-h1-line:40px;--text-h1-spacing:-0.4px;--text-h2-size:22px;--text-h2-line:32px;--text-h2-spacing:-0.2px;--text-h4-size:16px;--text-h4-line:24px;--text-h5-size:14px;--text-h5-line:21px;--text-body-1-size:17px;--text-body-1-line:27px;--text-body-2-size:15px;--text-body-2-line:24px;--text-body-3-size:14px;--text-body-3-line:22px}}@media (max-width:767px){:where(.ihabdevteam-core-scope){--spacing-page:20px;--spacing-content:10px;--text-h0-size:28px;--text-h0-line:38px;--text-h0-spacing:-0.5px;--text-h1-size:24px;--text-h1-line:34px;--text-h1-spacing:-0.3px;--text-h2-size:20px;--text-h2-line:29px;--text-h2-spacing:-0.2px;--text-h3-size:17px;--text-h3-line:26px;--text-h4-size:15px;--text-h4-line:23px;--text-h5-size:13px;--text-h5-line:20px;--text-body-1-size:17px;--text-body-1-line:27px;--text-body-2-size:15px;--text-body-2-line:23px;--text-body-3-size:13px;--text-body-3-line:21px}}.ihabdevteam-core-scope [data-font-scale=large1],.ihabdevteam-core-scope[data-font-scale=large1],[data-font-scale=large1] .ihabdevteam-core-scope{--text-h4-size:19px;--text-h4-line:29px;--text-h5-size:17px;--text-h5-line:26px;--text-body-1-size:20px;--text-body-1-line:31px;--text-body-2-size:18px;--text-body-2-line:28px;--text-body-3-size:16px;--text-body-3-line:25px;--text-button-1-size:16px;--text-button-1-line:23px;--text-button-2-size:15px;--text-button-2-line:21px;--text-caption-1-size:14px;--text-caption-1-line:20px;--text-caption-2-size:12px;--text-caption-2-line:17px}.ihabdevteam-core-scope [data-font-scale=large2],.ihabdevteam-core-scope[data-font-scale=large2],[data-font-scale=large2] .ihabdevteam-core-scope{--text-h4-size:21px;--text-h4-line:32px;--text-h5-size:19px;--text-h5-line:29px;--text-body-1-size:23px;--text-body-1-line:36px;--text-body-2-size:20px;--text-body-2-line:31px;--text-body-3-size:18px;--text-body-3-line:28px;--text-button-1-size:18px;--text-button-1-line:26px;--text-button-2-size:16px;--text-button-2-line:23px;--text-caption-1-size:15px;--text-caption-1-line:21px;--text-caption-2-size:14px;--text-caption-2-line:19px}.ihabdevteam-core-scope [data-font-scale=large3],.ihabdevteam-core-scope[data-font-scale=large3],[data-font-scale=large3] .ihabdevteam-core-scope{--text-h4-size:23px;--text-h4-line:35px;--text-h5-size:21px;--text-h5-line:32px;--text-body-1-size:25px;--text-body-1-line:39px;--text-body-2-size:22px;--text-body-2-line:34px;--text-body-3-size:19px;--text-body-3-line:30px;--text-button-1-size:19px;--text-button-1-line:27px;--text-button-2-size:18px;--text-button-2-line:26px;--text-caption-1-size:17px;--text-caption-1-line:24px;--text-caption-2-size:15px;--text-caption-2-line:21px}.ihabdevteam-core-scope [data-theme=dark],.ihabdevteam-core-scope[data-theme=dark],[data-theme=dark] .ihabdevteam-core-scope{color-scheme:dark;--color-white:#1e2227;--color-deepWhite:#252a30;--color-darkWhite:#2d3238;--color-whiteLine:hsla(0,0%,100%,.08);--color-black:#f0f2f5;--color-softBlack:#dde1e7;--color-lightBlack:#cbd1da;--color-darkGray:#b8c0cc;--color-deepGray:#a1aab7;--color-gray:#8b95a1;--color-softGray:#737f90;--color-lightGray:#60697a;--color-text-main:var(--color-softMain);--color-text-sub:var(--color-softSub);--color-text-primary:var(--color-black);--color-text-secondary:var(--color-gray);--color-text-muted:var(--color-lightGray);--color-text-on-brand:var(--color-pureWhite);--color-surface:var(--color-white);--color-surface-raised:var(--color-deepWhite);--color-surface-sunken:var(--color-darkWhite);--color-border:var(--color-whiteLine);--color-pureWhite:#0f1215;--color-pureBlack:#f0f2f5;--color-disabled:#3f4650}@media (prefers-color-scheme:dark){.ihabdevteam-core-scope :root:not([data-theme=light]):not([data-theme=dark]),.ihabdevteam-core-scope [data-theme=auto],.ihabdevteam-core-scope[data-theme=auto],[data-theme=auto] .ihabdevteam-core-scope{color-scheme:dark;--color-white:#1e2227;--color-deepWhite:#252a30;--color-darkWhite:#2d3238;--color-whiteLine:hsla(0,0%,100%,.08);--color-black:#f0f2f5;--color-softBlack:#dde1e7;--color-lightBlack:#cbd1da;--color-darkGray:#b8c0cc;--color-deepGray:#a1aab7;--color-gray:#8b95a1;--color-softGray:#737f90;--color-lightGray:#60697a;--color-text-main:var(--color-softMain);--color-text-sub:var(--color-softSub);--color-text-primary:var(--color-black);--color-text-secondary:var(--color-gray);--color-text-muted:var(--color-lightGray);--color-text-on-brand:var(--color-pureWhite);--color-surface:var(--color-white);--color-surface-raised:var(--color-deepWhite);--color-surface-sunken:var(--color-darkWhite);--color-border:var(--color-whiteLine);--color-pureWhite:#0f1215;--color-pureBlack:#f0f2f5;--color-disabled:#3f4650}}.force-light-scheme .ihabdevteam-core-scope,.ihabdevteam-core-scope .force-light-scheme,.ihabdevteam-core-scope.force-light-scheme{color-scheme:light;--color-pureWhite:#fff;--color-white:#fbfdff;--color-deepWhite:#f8fafc;--color-darkWhite:#eef2f6;--color-whiteLine:#dde3ec;--color-lightGray:#96a4b8;--color-softGray:#7b8ca3;--color-gray:#64748b;--color-deepGray:#546170;--color-darkGray:#434d56;--color-lightBlack:#32393f;--color-softBlack:#222528;--color-black:#111;--color-pureBlack:#000;--color-disabled:#bfc7d1;--color-text-main:var(--color-darkMain);--color-text-sub:var(--color-darkSub);--color-text-primary:var(--color-black);--color-text-secondary:var(--color-gray);--color-text-muted:var(--color-lightGray);--color-text-on-brand:var(--color-pureWhite);--color-surface:var(--color-white);--color-surface-raised:var(--color-deepWhite);--color-surface-sunken:var(--color-darkWhite);--color-border:var(--color-whiteLine)}@media (hover:none){.ihabdevteam-core-scope [role=button]:hover,.ihabdevteam-core-scope a:hover,.ihabdevteam-core-scope button:hover{opacity:1}}.ihabdevteam-core-scope *,.ihabdevteam-core-scope :after,.ihabdevteam-core-scope :before{box-sizing:border-box}.ihabdevteam-core-scope{margin:0}.ihabdevteam-core-scope button,.ihabdevteam-core-scope input,.ihabdevteam-core-scope select,.ihabdevteam-core-scope textarea{font-family:inherit}:where(.ihabdevteam-core-scope) :where(.display-1),:where(.ihabdevteam-core-scope) :where(.display-1b){font-size:clamp(44px,6.6vw,72px);font-size:var(--text-display-1-size);letter-spacing:-.04em;letter-spacing:var(--text-display-1-spacing);line-height:1.05;line-height:var(--text-display-1-line);margin:0}:where(.ihabdevteam-core-scope) :where(.display-2),:where(.ihabdevteam-core-scope) :where(.display-2b){font-size:clamp(38px,5.2vw,56px);font-size:var(--text-display-2-size);letter-spacing:-.03em;letter-spacing:var(--text-display-2-spacing);line-height:1.12;line-height:var(--text-display-2-line);margin:0}:where(.ihabdevteam-core-scope) :where(.display-3),:where(.ihabdevteam-core-scope) :where(.display-3b){font-size:clamp(34px,4.1vw,44px);font-size:var(--text-display-3-size);letter-spacing:-.02em;letter-spacing:var(--text-display-3-spacing);line-height:1.2;line-height:var(--text-display-3-line);margin:0}:where(.ihabdevteam-core-scope) :where(.display-1){font-weight:800;font-weight:var(--text-display-1-weight)}:where(.ihabdevteam-core-scope) :where(.display-2){font-weight:700;font-weight:var(--text-display-2-weight)}:where(.ihabdevteam-core-scope) :where(.display-3){font-weight:700;font-weight:var(--text-display-3-weight)}:where(.ihabdevteam-core-scope) :where(.display-1b){font-weight:900;font-weight:var(--text-display-1-weight-bold)}:where(.ihabdevteam-core-scope) :where(.display-2b){font-weight:800;font-weight:var(--text-display-2-weight-bold)}:where(.ihabdevteam-core-scope) :where(.display-3b){font-weight:800;font-weight:var(--text-display-3-weight-bold)}:where(.ihabdevteam-core-scope) :where(.h0),:where(.ihabdevteam-core-scope) :where(.h0b){font-size:40px;font-size:var(--text-h0-size);letter-spacing:-1px;letter-spacing:var(--text-h0-spacing);line-height:52px;line-height:var(--text-h0-line);margin:0}:where(.ihabdevteam-core-scope) :where(.h1),:where(.ihabdevteam-core-scope) :where(.h1b){font-size:32px;font-size:var(--text-h1-size);letter-spacing:-.5px;letter-spacing:var(--text-h1-spacing);line-height:44px;line-height:var(--text-h1-line);margin:0}:where(.ihabdevteam-core-scope) :where(.h2),:where(.ihabdevteam-core-scope) :where(.h2b){font-size:24px;font-size:var(--text-h2-size);letter-spacing:-.25px;letter-spacing:var(--text-h2-spacing);line-height:34px;line-height:var(--text-h2-line);margin:0}:where(.ihabdevteam-core-scope) :where(.h3),:where(.ihabdevteam-core-scope) :where(.h3b){font-size:20px;font-size:var(--text-h3-size);letter-spacing:normal;letter-spacing:var(--text-h3-spacing);line-height:30px;line-height:var(--text-h3-line);margin:0}:where(.ihabdevteam-core-scope) :where(.h4),:where(.ihabdevteam-core-scope) :where(.h4b){font-size:17px;font-size:var(--text-h4-size);letter-spacing:normal;letter-spacing:var(--text-h4-spacing);line-height:26px;line-height:var(--text-h4-line);margin:0}:where(.ihabdevteam-core-scope) :where(.h5),:where(.ihabdevteam-core-scope) :where(.h5b){font-size:15px;font-size:var(--text-h5-size);letter-spacing:normal;letter-spacing:var(--text-h5-spacing);line-height:23px;line-height:var(--text-h5-line);margin:0}:where(.ihabdevteam-core-scope) :where(.h0){font-weight:700;font-weight:var(--text-h0-weight)}:where(.ihabdevteam-core-scope) :where(.h1){font-weight:700;font-weight:var(--text-h1-weight)}:where(.ihabdevteam-core-scope) :where(.h2){font-weight:500;font-weight:var(--text-h2-weight)}:where(.ihabdevteam-core-scope) :where(.h3){font-weight:500;font-weight:var(--text-h3-weight)}:where(.ihabdevteam-core-scope) :where(.h4){font-weight:500;font-weight:var(--text-h4-weight)}:where(.ihabdevteam-core-scope) :where(.h5){font-weight:500;font-weight:var(--text-h5-weight)}:where(.ihabdevteam-core-scope) :where(.h0b){font-weight:800;font-weight:var(--text-h0-weight-bold)}:where(.ihabdevteam-core-scope) :where(.h1b){font-weight:800;font-weight:var(--text-h1-weight-bold)}:where(.ihabdevteam-core-scope) :where(.h2b){font-weight:600;font-weight:var(--text-h2-weight-bold)}:where(.ihabdevteam-core-scope) :where(.h3b){font-weight:600;font-weight:var(--text-h3-weight-bold)}:where(.ihabdevteam-core-scope) :where(.h4b){font-weight:600;font-weight:var(--text-h4-weight-bold)}:where(.ihabdevteam-core-scope) :where(.h5b){font-weight:600;font-weight:var(--text-h5-weight-bold)}:where(.ihabdevteam-core-scope) :where(.body-1),:where(.ihabdevteam-core-scope) :where(.body-1b){font-size:18px;font-size:var(--text-body-1-size);font-weight:400;font-weight:var(--text-body-1-weight);line-height:28px;line-height:var(--text-body-1-line);margin:0}:where(.ihabdevteam-core-scope) :where(.body-2),:where(.ihabdevteam-core-scope) :where(.body-2b){font-size:16px;font-size:var(--text-body-2-size);font-weight:400;font-weight:var(--text-body-2-weight);line-height:26px;line-height:var(--text-body-2-line);margin:0}:where(.ihabdevteam-core-scope) :where(.body-3),:where(.ihabdevteam-core-scope) :where(.body-3b){font-size:14px;font-size:var(--text-body-3-size);font-weight:400;font-weight:var(--text-body-3-weight);line-height:22px;line-height:var(--text-body-3-line);margin:0}:where(.ihabdevteam-core-scope) :where(.body-1b){font-weight:600;font-weight:var(--text-body-1-weight-bold)}:where(.ihabdevteam-core-scope) :where(.body-2b){font-weight:600;font-weight:var(--text-body-2-weight-bold)}:where(.ihabdevteam-core-scope) :where(.body-3b){font-weight:600;font-weight:var(--text-body-3-weight-bold)}:where(.ihabdevteam-core-scope) :where(.button-1){font-size:14px;font-size:var(--text-button-1-size);font-weight:500;font-weight:var(--text-button-1-weight);line-height:20px;line-height:var(--text-button-1-line);margin:0}:where(.ihabdevteam-core-scope) :where(.button-2){font-size:13px;font-size:var(--text-button-2-size);font-weight:400;font-weight:var(--text-button-2-weight);line-height:18px;line-height:var(--text-button-2-line);margin:0}:where(.ihabdevteam-core-scope) :where(.caption-1),:where(.ihabdevteam-core-scope) :where(.caption-1b){font-size:12px;font-size:var(--text-caption-1-size);font-weight:400;font-weight:var(--text-caption-1-weight);line-height:17px;line-height:var(--text-caption-1-line);margin:0}:where(.ihabdevteam-core-scope) :where(.caption-2),:where(.ihabdevteam-core-scope) :where(.caption-2b){font-size:11px;font-size:var(--text-caption-2-size);font-weight:400;font-weight:var(--text-caption-2-weight);line-height:15px;line-height:var(--text-caption-2-line);margin:0}:where(.ihabdevteam-core-scope) :where(.caption-1b){font-weight:600;font-weight:var(--text-caption-1-weight-bold)}:where(.ihabdevteam-core-scope) :where(.caption-2b){font-weight:600;font-weight:var(--text-caption-2-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).display-1{font-size:clamp(44px,6.6vw,72px);font-size:var(--text-display-1-size);font-weight:800;font-weight:var(--text-display-1-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).display-1b{font-size:clamp(44px,6.6vw,72px);font-size:var(--text-display-1-size);font-weight:900;font-weight:var(--text-display-1-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).display-2{font-size:clamp(38px,5.2vw,56px);font-size:var(--text-display-2-size);font-weight:700;font-weight:var(--text-display-2-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).display-2b{font-size:clamp(38px,5.2vw,56px);font-size:var(--text-display-2-size);font-weight:800;font-weight:var(--text-display-2-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).display-3{font-size:clamp(34px,4.1vw,44px);font-size:var(--text-display-3-size);font-weight:700;font-weight:var(--text-display-3-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).display-3b{font-size:clamp(34px,4.1vw,44px);font-size:var(--text-display-3-size);font-weight:800;font-weight:var(--text-display-3-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h0{font-size:40px;font-size:var(--text-h0-size);font-weight:700;font-weight:var(--text-h0-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h0b{font-size:40px;font-size:var(--text-h0-size);font-weight:800;font-weight:var(--text-h0-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h1{font-size:32px;font-size:var(--text-h1-size);font-weight:700;font-weight:var(--text-h1-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h1b{font-size:32px;font-size:var(--text-h1-size);font-weight:800;font-weight:var(--text-h1-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h2{font-size:24px;font-size:var(--text-h2-size);font-weight:500;font-weight:var(--text-h2-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h2b{font-size:24px;font-size:var(--text-h2-size);font-weight:600;font-weight:var(--text-h2-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h3{font-size:20px;font-size:var(--text-h3-size);font-weight:500;font-weight:var(--text-h3-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h3b{font-size:20px;font-size:var(--text-h3-size);font-weight:600;font-weight:var(--text-h3-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h4{font-size:17px;font-size:var(--text-h4-size);font-weight:500;font-weight:var(--text-h4-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h4b{font-size:17px;font-size:var(--text-h4-size);font-weight:600;font-weight:var(--text-h4-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h5{font-size:15px;font-size:var(--text-h5-size);font-weight:500;font-weight:var(--text-h5-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h5b{font-size:15px;font-size:var(--text-h5-size);font-weight:600;font-weight:var(--text-h5-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).body-1{font-size:18px;font-size:var(--text-body-1-size);font-weight:400;font-weight:var(--text-body-1-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).body-1b{font-size:18px;font-size:var(--text-body-1-size);font-weight:600;font-weight:var(--text-body-1-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).body-2{font-size:16px;font-size:var(--text-body-2-size);font-weight:400;font-weight:var(--text-body-2-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).body-2b{font-size:16px;font-size:var(--text-body-2-size);font-weight:600;font-weight:var(--text-body-2-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).body-3{font-size:14px;font-size:var(--text-body-3-size);font-weight:400;font-weight:var(--text-body-3-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).body-3b{font-size:14px;font-size:var(--text-body-3-size);font-weight:600;font-weight:var(--text-body-3-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).caption-1{font-size:12px;font-size:var(--text-caption-1-size);font-weight:400;font-weight:var(--text-caption-1-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).caption-1b{font-size:12px;font-size:var(--text-caption-1-size);font-weight:600;font-weight:var(--text-caption-1-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).caption-2{font-size:11px;font-size:var(--text-caption-2-size);font-weight:400;font-weight:var(--text-caption-2-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).caption-2b{font-size:11px;font-size:var(--text-caption-2-size);font-weight:600;font-weight:var(--text-caption-2-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).button-1{font-size:14px;font-size:var(--text-button-1-size);font-weight:500;font-weight:var(--text-button-1-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).button-2{font-size:13px;font-size:var(--text-button-2-size);font-weight:400;font-weight:var(--text-button-2-weight)}.ihabdevteam-core-scope ::-webkit-scrollbar{height:6px;width:6px}.ihabdevteam-core-scope ::-webkit-scrollbar-track{background:transparent}.ihabdevteam-core-scope ::-webkit-scrollbar-thumb{background:#eef2f6;background:var(--color-darkWhite);border-radius:3px}.ihabdevteam-core-scope ::-webkit-scrollbar-thumb:hover{background:#96a4b8;background:var(--color-lightGray)}.ihabdevteam-core-scope *{scrollbar-color:#eef2f6 transparent;scrollbar-color:var(--color-darkWhite) transparent;scrollbar-width:thin}@keyframes sub-to-main{0%{background-color:#4dcdc0;background-color:var(--color-sub)}to{background-color:#499cdf;background-color:var(--color-main)}}.ihabdevteam-core-scope .safearea{margin:0 auto;max-width:1920px;max-width:var(--container-page);width:100%}.ihabdevteam-core-scope{color:#111;color:var(--color-black);font-family:Pretendard Variable,Pretendard,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;font-family:var(--font-family);overflow-wrap:anywhere;white-space:normal;word-break:keep-all}.ihabdevteam-core-scope :focus-visible{outline:2px solid #499cdf;outline:2px solid var(--focus-ring);outline-offset:2px}@media (prefers-reduced-motion:reduce){.ihabdevteam-core-scope *,.ihabdevteam-core-scope :after,.ihabdevteam-core-scope :before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
+:where(.ihabdevteam-core-scope){color-scheme:light;--brand-main:#499cdf;--brand-sub:#4dcdc0;--color-lightMain:var(--brand-lightMain,#d2e2ef);--color-softMain:var(--brand-softMain,#8bbce4);--color-main:var(--brand-main);--color-main-a10:color-mix(in srgb,var(--color-main) 10%,transparent);--color-main-a20:color-mix(in srgb,var(--color-main) 20%,transparent);--color-deepMain:var(--brand-deepMain,#418ecd);--color-darkMain:var(--brand-darkMain,#1e5a8f);--color-lightSub:var(--brand-lightSub,#d5ecea);--color-softSub:var(--brand-softSub,#92ddd5);--color-sub:var(--brand-sub);--color-sub-a10:color-mix(in srgb,var(--color-sub) 10%,transparent);--color-deepSub:var(--brand-deepSub,#45bbaf);--color-darkSub:var(--brand-darkSub,#257e76);--color-text-main:var(--color-darkMain);--color-text-sub:var(--color-darkSub);--color-infoLink:#2f7fd1;--color-uiAccent:#32bbae;--color-success:#2fae9e;--color-warn:#e6b94e;--color-warn-a10:#e6b94e1a;--color-error:#d9534f;--color-error-a10:#d9534f1a;--color-like:#e06b68;--color-disabled:#bfc7d1;--color-pureWhite:#fff;--color-white:#fbfdff;--color-white-a10:#fbfdff1a;--color-white-a30:#fbfdff4d;--color-white-a60:#fbfdff99;--color-white-a80:#fbfdffcc;--color-deepWhite:#f8fafc;--color-darkWhite:#eef2f6;--color-whiteLine:#dde3ec;--color-lightGray:#96a4b8;--color-lightGray-a10:#96a4b81a;--color-lightGray-a80:#96a4b8cc;--color-softGray:#7b8ca3;--color-gray:#64748b;--color-gray-a10:#64748b1a;--color-gray-a60:#64748b99;--color-gray-a80:#64748bcc;--color-deepGray:#546170;--color-darkGray:#434d56;--color-darkGray-a10:#434d561a;--color-lightBlack:#32393f;--color-softBlack:#222528;--color-black:#111;--color-pureBlack:#000;--color-popupBlock:rgba(16,24,32,.6);--color-onDark-title:var(--color-pureWhite);--color-onDark-text:hsla(0,0%,100%,.58);--color-onDark-muted:hsla(0,0%,100%,.5);--color-onDark-surface:hsla(0,0%,100%,.04);--color-text-primary:var(--color-black);--color-text-secondary:var(--color-gray);--color-text-muted:var(--color-lightGray);--color-text-on-brand:var(--color-pureWhite);--color-surface:var(--color-white);--color-surface-raised:var(--color-deepWhite);--color-surface-sunken:var(--color-darkWhite);--color-border:var(--color-whiteLine);--color-overlay:var(--color-popupBlock);--shadow-popup:20px 20px 20px rgba(0,0,0,.05);--shadow-tooltip:8px 8px 8px rgba(0,0,0,.05);--shadow-button:4px 4px 4px rgba(0,0,0,.05);--shadow-menu:20px 20px 20px rgba(0,0,0,.05);--shadow-card:2px 2px 8px rgba(0,0,0,.06);--shadow-dropdown:8px 8px 24px rgba(0,0,0,.06);--shadow-panel:4px 4px 20px rgba(0,0,0,.06);--font-family:"Pretendard Variable","Pretendard",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;--text-display-1-size:clamp(44px,6.6vw,72px);--text-display-1-line:1.05;--text-display-1-spacing:-0.04em;--text-display-1-weight:800;--text-display-1-weight-bold:900;--text-display-2-size:clamp(38px,5.2vw,56px);--text-display-2-line:1.12;--text-display-2-spacing:-0.03em;--text-display-2-weight:700;--text-display-2-weight-bold:800;--text-display-3-size:clamp(34px,4.1vw,44px);--text-display-3-line:1.2;--text-display-3-spacing:-0.02em;--text-display-3-weight:700;--text-display-3-weight-bold:800;--text-h0-size:40px;--text-h0-line:52px;--text-h0-spacing:-1px;--text-h0-weight:700;--text-h0-weight-bold:800;--text-h1-size:32px;--text-h1-line:44px;--text-h1-spacing:-0.5px;--text-h1-weight:700;--text-h1-weight-bold:800;--text-h2-size:24px;--text-h2-line:34px;--text-h2-spacing:-0.25px;--text-h2-weight:500;--text-h2-weight-bold:600;--text-h3-size:20px;--text-h3-line:30px;--text-h3-spacing:normal;--text-h3-weight:500;--text-h3-weight-bold:600;--text-h4-size:17px;--text-h4-line:26px;--text-h4-spacing:normal;--text-h4-weight:500;--text-h4-weight-bold:600;--text-h5-size:15px;--text-h5-line:23px;--text-h5-spacing:normal;--text-h5-weight:500;--text-h5-weight-bold:600;--text-body-1-size:18px;--text-body-1-line:28px;--text-body-1-weight:400;--text-body-1-weight-bold:600;--text-body-2-size:16px;--text-body-2-line:26px;--text-body-2-weight:400;--text-body-2-weight-bold:600;--text-body-3-size:14px;--text-body-3-line:22px;--text-body-3-weight:400;--text-body-3-weight-bold:600;--text-button-1-size:14px;--text-button-1-line:20px;--text-button-1-weight:500;--text-button-2-size:13px;--text-button-2-line:18px;--text-button-2-weight:400;--text-caption-1-size:12px;--text-caption-1-line:17px;--text-caption-1-weight:400;--text-caption-1-weight-bold:600;--text-caption-2-size:11px;--text-caption-2-line:15px;--text-caption-2-weight:400;--text-caption-2-weight-bold:600;--spacing-xs:8px;--spacing-s:12px;--spacing-m:16px;--spacing-l:20px;--spacing-xl:24px;--spacing-page:60px;--spacing-content:20px;--container-page:1920px;--margin-page:var(--spacing-page);--margin-content:var(--spacing-content);--duration-fast:120ms;--duration-base:200ms;--duration-slow:320ms;--ease-out:cubic-bezier(0.22,0.9,0.3,1);--ease-in-out:cubic-bezier(0.4,0,0.2,1);--bp-tablet:768px;--bp-desktop:1024px;--radius-xs:4px;--radius-sm:8px;--radius-s:10px;--radius-card:12px;--radius-m:20px;--radius-l:40px;--radius-full:999px;--radius-dialog:var(--radius-m);--z-base:0;--z-content:1;--z-dropdown:200;--z-sticky:500;--z-bulk-bar:600;--z-nav:1000;--z-sidebar:1100;--z-menu:1500;--z-overlay:2000;--z-page-popup:2100;--z-fab:2150;--z-modal:2200;--focus-ring:var(--color-main);--z-popover:2300;--z-tooltip:3000;--z-alert:3100;--z-toast:3200}@media (min-width:768px) and (max-width:1023px){:where(.ihabdevteam-core-scope){--spacing-page:40px;--spacing-content:15px;--text-h0-size:32px;--text-h0-line:44px;--text-h0-spacing:-0.75px;--text-h1-size:28px;--text-h1-line:40px;--text-h1-spacing:-0.4px;--text-h2-size:22px;--text-h2-line:32px;--text-h2-spacing:-0.2px;--text-h4-size:16px;--text-h4-line:24px;--text-h5-size:14px;--text-h5-line:21px;--text-body-1-size:17px;--text-body-1-line:27px;--text-body-2-size:15px;--text-body-2-line:24px;--text-body-3-size:14px;--text-body-3-line:22px}}@media (max-width:767px){:where(.ihabdevteam-core-scope){--spacing-page:20px;--spacing-content:10px;--text-h0-size:28px;--text-h0-line:38px;--text-h0-spacing:-0.5px;--text-h1-size:24px;--text-h1-line:34px;--text-h1-spacing:-0.3px;--text-h2-size:20px;--text-h2-line:29px;--text-h2-spacing:-0.2px;--text-h3-size:17px;--text-h3-line:26px;--text-h4-size:15px;--text-h4-line:23px;--text-h5-size:13px;--text-h5-line:20px;--text-body-1-size:17px;--text-body-1-line:27px;--text-body-2-size:15px;--text-body-2-line:23px;--text-body-3-size:13px;--text-body-3-line:21px}}.ihabdevteam-core-scope [data-font-scale=large1],.ihabdevteam-core-scope[data-font-scale=large1],[data-font-scale=large1] .ihabdevteam-core-scope{--text-h4-size:19px;--text-h4-line:29px;--text-h5-size:17px;--text-h5-line:26px;--text-body-1-size:20px;--text-body-1-line:31px;--text-body-2-size:18px;--text-body-2-line:28px;--text-body-3-size:16px;--text-body-3-line:25px;--text-button-1-size:16px;--text-button-1-line:23px;--text-button-2-size:15px;--text-button-2-line:21px;--text-caption-1-size:14px;--text-caption-1-line:20px;--text-caption-2-size:12px;--text-caption-2-line:17px}.ihabdevteam-core-scope [data-font-scale=large2],.ihabdevteam-core-scope[data-font-scale=large2],[data-font-scale=large2] .ihabdevteam-core-scope{--text-h4-size:21px;--text-h4-line:32px;--text-h5-size:19px;--text-h5-line:29px;--text-body-1-size:23px;--text-body-1-line:36px;--text-body-2-size:20px;--text-body-2-line:31px;--text-body-3-size:18px;--text-body-3-line:28px;--text-button-1-size:18px;--text-button-1-line:26px;--text-button-2-size:16px;--text-button-2-line:23px;--text-caption-1-size:15px;--text-caption-1-line:21px;--text-caption-2-size:14px;--text-caption-2-line:19px}.ihabdevteam-core-scope [data-font-scale=large3],.ihabdevteam-core-scope[data-font-scale=large3],[data-font-scale=large3] .ihabdevteam-core-scope{--text-h4-size:23px;--text-h4-line:35px;--text-h5-size:21px;--text-h5-line:32px;--text-body-1-size:25px;--text-body-1-line:39px;--text-body-2-size:22px;--text-body-2-line:34px;--text-body-3-size:19px;--text-body-3-line:30px;--text-button-1-size:19px;--text-button-1-line:27px;--text-button-2-size:18px;--text-button-2-line:26px;--text-caption-1-size:17px;--text-caption-1-line:24px;--text-caption-2-size:15px;--text-caption-2-line:21px}.ihabdevteam-core-scope [data-theme=dark],.ihabdevteam-core-scope[data-theme=dark],[data-theme=dark] .ihabdevteam-core-scope{color-scheme:dark;--color-white:#1e2227;--color-deepWhite:#252a30;--color-darkWhite:#2d3238;--color-whiteLine:hsla(0,0%,100%,.08);--color-black:#f0f2f5;--color-softBlack:#dde1e7;--color-lightBlack:#cbd1da;--color-darkGray:#b8c0cc;--color-deepGray:#a1aab7;--color-gray:#8b95a1;--color-softGray:#737f90;--color-lightGray:#60697a;--color-text-main:var(--color-softMain);--color-text-sub:var(--color-softSub);--color-text-primary:var(--color-black);--color-text-secondary:var(--color-gray);--color-text-muted:var(--color-lightGray);--color-text-on-brand:var(--color-pureWhite);--color-surface:var(--color-white);--color-surface-raised:var(--color-deepWhite);--color-surface-sunken:var(--color-darkWhite);--color-border:var(--color-whiteLine);--color-pureWhite:#0f1215;--color-pureBlack:#f0f2f5;--color-disabled:#3f4650}@media (prefers-color-scheme:dark){.ihabdevteam-core-scope :root:not([data-theme=light]):not([data-theme=dark]),.ihabdevteam-core-scope [data-theme=auto],.ihabdevteam-core-scope[data-theme=auto],[data-theme=auto] .ihabdevteam-core-scope{color-scheme:dark;--color-white:#1e2227;--color-deepWhite:#252a30;--color-darkWhite:#2d3238;--color-whiteLine:hsla(0,0%,100%,.08);--color-black:#f0f2f5;--color-softBlack:#dde1e7;--color-lightBlack:#cbd1da;--color-darkGray:#b8c0cc;--color-deepGray:#a1aab7;--color-gray:#8b95a1;--color-softGray:#737f90;--color-lightGray:#60697a;--color-text-main:var(--color-softMain);--color-text-sub:var(--color-softSub);--color-text-primary:var(--color-black);--color-text-secondary:var(--color-gray);--color-text-muted:var(--color-lightGray);--color-text-on-brand:var(--color-pureWhite);--color-surface:var(--color-white);--color-surface-raised:var(--color-deepWhite);--color-surface-sunken:var(--color-darkWhite);--color-border:var(--color-whiteLine);--color-pureWhite:#0f1215;--color-pureBlack:#f0f2f5;--color-disabled:#3f4650}}.force-light-scheme .ihabdevteam-core-scope,.ihabdevteam-core-scope .force-light-scheme,.ihabdevteam-core-scope.force-light-scheme{color-scheme:light;--color-pureWhite:#fff;--color-white:#fbfdff;--color-deepWhite:#f8fafc;--color-darkWhite:#eef2f6;--color-whiteLine:#dde3ec;--color-lightGray:#96a4b8;--color-softGray:#7b8ca3;--color-gray:#64748b;--color-deepGray:#546170;--color-darkGray:#434d56;--color-lightBlack:#32393f;--color-softBlack:#222528;--color-black:#111;--color-pureBlack:#000;--color-disabled:#bfc7d1;--color-text-main:var(--color-darkMain);--color-text-sub:var(--color-darkSub);--color-text-primary:var(--color-black);--color-text-secondary:var(--color-gray);--color-text-muted:var(--color-lightGray);--color-text-on-brand:var(--color-pureWhite);--color-surface:var(--color-white);--color-surface-raised:var(--color-deepWhite);--color-surface-sunken:var(--color-darkWhite);--color-border:var(--color-whiteLine)}.ihabdevteam-core-scope .game-overlay{align-items:center;background:rgba(0,0,0,.5);background:var(--game-overlay-bg,rgba(0,0,0,.5));display:flex;inset:0;justify-content:center;position:fixed;z-index:2200;z-index:var(--z-modal)}@media (max-width:767px){.ihabdevteam-core-scope .game-overlay:has(.game-sheet--play){padding:0}.ihabdevteam-core-scope .game-sheet.game-sheet--play{border:none;border-radius:0;box-shadow:none;height:100%;justify-content:center;max-height:none;max-width:none;padding:calc(28px + env(safe-area-inset-top)) 20px calc(16px + env(safe-area-inset-bottom));width:100%}}@media (max-height:500px){.ihabdevteam-core-scope .game-sheet.game-sheet--play{gap:6px;padding-bottom:calc(10px + env(safe-area-inset-bottom));padding-top:calc(10px + env(safe-area-inset-top))}.ihabdevteam-core-scope .game-sheet--play .game-play-header{gap:8px}.ihabdevteam-core-scope .game-sheet--play .game-play-header__icon{font-size:18px;height:32px;width:32px}}.ihabdevteam-core-scope .game-play-header,.ihabdevteam-core-scope .game-timer{align-items:center;display:flex;gap:10px}.ihabdevteam-core-scope .game-timer__label{min-width:30px;text-align:right;transition:color .3s}.ihabdevteam-core-scope .game-timer-slider-wrap{display:flex;flex:1}.ihabdevteam-core-scope .game-rounds{align-items:center;display:flex;gap:7px}.ihabdevteam-core-scope .game-rounds__dot{background:hsla(0,0%,100%,.14);background:var(--game-dot-bg,hsla(0,0%,100%,.14));border-radius:50%;height:8px;transition:background .25s,transform .25s,box-shadow .25s;width:8px}.ihabdevteam-core-scope .game-rounds__dot--correct{background:#34d399;background:var(--game-dot-correct,#34d399)}.ihabdevteam-core-scope .game-rounds__dot--wrong{background:#f87171;background:var(--game-dot-wrong,#f87171)}.ihabdevteam-core-scope .game-rounds__label{color:hsla(0,0%,100%,.45);color:var(--game-muted,hsla(0,0%,100%,.45));margin-left:auto}.ihabdevteam-core-scope .game-feedback{align-items:center;border-radius:10px;border-radius:var(--radius-s);display:flex;justify-content:center;padding:12px 16px;text-align:center}.ihabdevteam-core-scope .game-feedback--hidden{visibility:hidden}.ihabdevteam-core-scope .game-result{align-items:center;display:flex;flex-direction:column;gap:8px;gap:var(--spacing-xs)}.ihabdevteam-core-scope .game-result__emoji{font-size:42px}.ihabdevteam-core-scope .game-result__item{align-items:center;border-radius:8px;border-radius:var(--radius-sm);box-sizing:border-box;display:flex;gap:10px;padding:8px 12px;width:100%}.ihabdevteam-core-scope .game-result__status{flex-shrink:0;width:18px}.ihabdevteam-core-scope .game-result__pct-row{align-items:center;display:flex;flex-direction:column;gap:6px;margin-bottom:8px;margin-bottom:var(--spacing-xs);width:100%}.ihabdevteam-core-scope .game-result__footer{display:flex;gap:10px;margin-top:4px;width:100%}@media (max-height:700px){.ihabdevteam-core-scope .game-result{gap:10px}.ihabdevteam-core-scope .game-result__emoji-ring{font-size:30px;height:64px;width:64px}}@media (max-height:500px) and (min-width:520px){.ihabdevteam-core-scope .game-result{align-content:center;align-items:center;display:grid;grid-template-columns:auto minmax(190px,1fr);grid-column-gap:20px;grid-column-gap:var(--spacing-l);-moz-column-gap:20px;column-gap:20px;-moz-column-gap:var(--spacing-l);column-gap:var(--spacing-l);grid-row-gap:4px;height:100%;min-height:0;padding-right:44px;row-gap:4px;width:100%}.ihabdevteam-core-scope .game-result__emoji-ring{font-size:24px;height:52px;width:52px}.ihabdevteam-core-scope .game-result__list{align-self:stretch;grid-column:2;grid-row:1/span 5;max-height:100%;min-height:0}.ihabdevteam-core-scope .game-result__footer{background:none;grid-column:2;grid-row:6;margin-top:0;padding-top:0;position:static}}@media (hover:none){.ihabdevteam-core-scope [role=button]:hover,.ihabdevteam-core-scope a:hover,.ihabdevteam-core-scope button:hover{opacity:1}}.ihabdevteam-core-scope *,.ihabdevteam-core-scope :after,.ihabdevteam-core-scope :before{box-sizing:border-box}.ihabdevteam-core-scope{margin:0}.ihabdevteam-core-scope button,.ihabdevteam-core-scope input,.ihabdevteam-core-scope select,.ihabdevteam-core-scope textarea{font-family:inherit}:where(.ihabdevteam-core-scope) :where(.display-1),:where(.ihabdevteam-core-scope) :where(.display-1b){font-size:clamp(44px,6.6vw,72px);font-size:var(--text-display-1-size);letter-spacing:-.04em;letter-spacing:var(--text-display-1-spacing);line-height:1.05;line-height:var(--text-display-1-line);margin:0}:where(.ihabdevteam-core-scope) :where(.display-2),:where(.ihabdevteam-core-scope) :where(.display-2b){font-size:clamp(38px,5.2vw,56px);font-size:var(--text-display-2-size);letter-spacing:-.03em;letter-spacing:var(--text-display-2-spacing);line-height:1.12;line-height:var(--text-display-2-line);margin:0}:where(.ihabdevteam-core-scope) :where(.display-3),:where(.ihabdevteam-core-scope) :where(.display-3b){font-size:clamp(34px,4.1vw,44px);font-size:var(--text-display-3-size);letter-spacing:-.02em;letter-spacing:var(--text-display-3-spacing);line-height:1.2;line-height:var(--text-display-3-line);margin:0}:where(.ihabdevteam-core-scope) :where(.display-1){font-weight:800;font-weight:var(--text-display-1-weight)}:where(.ihabdevteam-core-scope) :where(.display-2){font-weight:700;font-weight:var(--text-display-2-weight)}:where(.ihabdevteam-core-scope) :where(.display-3){font-weight:700;font-weight:var(--text-display-3-weight)}:where(.ihabdevteam-core-scope) :where(.display-1b){font-weight:900;font-weight:var(--text-display-1-weight-bold)}:where(.ihabdevteam-core-scope) :where(.display-2b){font-weight:800;font-weight:var(--text-display-2-weight-bold)}:where(.ihabdevteam-core-scope) :where(.display-3b){font-weight:800;font-weight:var(--text-display-3-weight-bold)}:where(.ihabdevteam-core-scope) :where(.h0),:where(.ihabdevteam-core-scope) :where(.h0b){font-size:40px;font-size:var(--text-h0-size);letter-spacing:-1px;letter-spacing:var(--text-h0-spacing);line-height:52px;line-height:var(--text-h0-line);margin:0}:where(.ihabdevteam-core-scope) :where(.h1),:where(.ihabdevteam-core-scope) :where(.h1b){font-size:32px;font-size:var(--text-h1-size);letter-spacing:-.5px;letter-spacing:var(--text-h1-spacing);line-height:44px;line-height:var(--text-h1-line);margin:0}:where(.ihabdevteam-core-scope) :where(.h2),:where(.ihabdevteam-core-scope) :where(.h2b){font-size:24px;font-size:var(--text-h2-size);letter-spacing:-.25px;letter-spacing:var(--text-h2-spacing);line-height:34px;line-height:var(--text-h2-line);margin:0}:where(.ihabdevteam-core-scope) :where(.h3),:where(.ihabdevteam-core-scope) :where(.h3b){font-size:20px;font-size:var(--text-h3-size);letter-spacing:normal;letter-spacing:var(--text-h3-spacing);line-height:30px;line-height:var(--text-h3-line);margin:0}:where(.ihabdevteam-core-scope) :where(.h4),:where(.ihabdevteam-core-scope) :where(.h4b){font-size:17px;font-size:var(--text-h4-size);letter-spacing:normal;letter-spacing:var(--text-h4-spacing);line-height:26px;line-height:var(--text-h4-line);margin:0}:where(.ihabdevteam-core-scope) :where(.h5),:where(.ihabdevteam-core-scope) :where(.h5b){font-size:15px;font-size:var(--text-h5-size);letter-spacing:normal;letter-spacing:var(--text-h5-spacing);line-height:23px;line-height:var(--text-h5-line);margin:0}:where(.ihabdevteam-core-scope) :where(.h0){font-weight:700;font-weight:var(--text-h0-weight)}:where(.ihabdevteam-core-scope) :where(.h1){font-weight:700;font-weight:var(--text-h1-weight)}:where(.ihabdevteam-core-scope) :where(.h2){font-weight:500;font-weight:var(--text-h2-weight)}:where(.ihabdevteam-core-scope) :where(.h3){font-weight:500;font-weight:var(--text-h3-weight)}:where(.ihabdevteam-core-scope) :where(.h4){font-weight:500;font-weight:var(--text-h4-weight)}:where(.ihabdevteam-core-scope) :where(.h5){font-weight:500;font-weight:var(--text-h5-weight)}:where(.ihabdevteam-core-scope) :where(.h0b){font-weight:800;font-weight:var(--text-h0-weight-bold)}:where(.ihabdevteam-core-scope) :where(.h1b){font-weight:800;font-weight:var(--text-h1-weight-bold)}:where(.ihabdevteam-core-scope) :where(.h2b){font-weight:600;font-weight:var(--text-h2-weight-bold)}:where(.ihabdevteam-core-scope) :where(.h3b){font-weight:600;font-weight:var(--text-h3-weight-bold)}:where(.ihabdevteam-core-scope) :where(.h4b){font-weight:600;font-weight:var(--text-h4-weight-bold)}:where(.ihabdevteam-core-scope) :where(.h5b){font-weight:600;font-weight:var(--text-h5-weight-bold)}:where(.ihabdevteam-core-scope) :where(.body-1),:where(.ihabdevteam-core-scope) :where(.body-1b){font-size:18px;font-size:var(--text-body-1-size);font-weight:400;font-weight:var(--text-body-1-weight);line-height:28px;line-height:var(--text-body-1-line);margin:0}:where(.ihabdevteam-core-scope) :where(.body-2),:where(.ihabdevteam-core-scope) :where(.body-2b){font-size:16px;font-size:var(--text-body-2-size);font-weight:400;font-weight:var(--text-body-2-weight);line-height:26px;line-height:var(--text-body-2-line);margin:0}:where(.ihabdevteam-core-scope) :where(.body-3),:where(.ihabdevteam-core-scope) :where(.body-3b){font-size:14px;font-size:var(--text-body-3-size);font-weight:400;font-weight:var(--text-body-3-weight);line-height:22px;line-height:var(--text-body-3-line);margin:0}:where(.ihabdevteam-core-scope) :where(.body-1b){font-weight:600;font-weight:var(--text-body-1-weight-bold)}:where(.ihabdevteam-core-scope) :where(.body-2b){font-weight:600;font-weight:var(--text-body-2-weight-bold)}:where(.ihabdevteam-core-scope) :where(.body-3b){font-weight:600;font-weight:var(--text-body-3-weight-bold)}:where(.ihabdevteam-core-scope) :where(.button-1){font-size:14px;font-size:var(--text-button-1-size);font-weight:500;font-weight:var(--text-button-1-weight);line-height:20px;line-height:var(--text-button-1-line);margin:0}:where(.ihabdevteam-core-scope) :where(.button-2){font-size:13px;font-size:var(--text-button-2-size);font-weight:400;font-weight:var(--text-button-2-weight);line-height:18px;line-height:var(--text-button-2-line);margin:0}:where(.ihabdevteam-core-scope) :where(.caption-1),:where(.ihabdevteam-core-scope) :where(.caption-1b){font-size:12px;font-size:var(--text-caption-1-size);font-weight:400;font-weight:var(--text-caption-1-weight);line-height:17px;line-height:var(--text-caption-1-line);margin:0}:where(.ihabdevteam-core-scope) :where(.caption-2),:where(.ihabdevteam-core-scope) :where(.caption-2b){font-size:11px;font-size:var(--text-caption-2-size);font-weight:400;font-weight:var(--text-caption-2-weight);line-height:15px;line-height:var(--text-caption-2-line);margin:0}:where(.ihabdevteam-core-scope) :where(.caption-1b){font-weight:600;font-weight:var(--text-caption-1-weight-bold)}:where(.ihabdevteam-core-scope) :where(.caption-2b){font-weight:600;font-weight:var(--text-caption-2-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).display-1{font-size:clamp(44px,6.6vw,72px);font-size:var(--text-display-1-size);font-weight:800;font-weight:var(--text-display-1-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).display-1b{font-size:clamp(44px,6.6vw,72px);font-size:var(--text-display-1-size);font-weight:900;font-weight:var(--text-display-1-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).display-2{font-size:clamp(38px,5.2vw,56px);font-size:var(--text-display-2-size);font-weight:700;font-weight:var(--text-display-2-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).display-2b{font-size:clamp(38px,5.2vw,56px);font-size:var(--text-display-2-size);font-weight:800;font-weight:var(--text-display-2-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).display-3{font-size:clamp(34px,4.1vw,44px);font-size:var(--text-display-3-size);font-weight:700;font-weight:var(--text-display-3-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).display-3b{font-size:clamp(34px,4.1vw,44px);font-size:var(--text-display-3-size);font-weight:800;font-weight:var(--text-display-3-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h0{font-size:40px;font-size:var(--text-h0-size);font-weight:700;font-weight:var(--text-h0-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h0b{font-size:40px;font-size:var(--text-h0-size);font-weight:800;font-weight:var(--text-h0-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h1{font-size:32px;font-size:var(--text-h1-size);font-weight:700;font-weight:var(--text-h1-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h1b{font-size:32px;font-size:var(--text-h1-size);font-weight:800;font-weight:var(--text-h1-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h2{font-size:24px;font-size:var(--text-h2-size);font-weight:500;font-weight:var(--text-h2-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h2b{font-size:24px;font-size:var(--text-h2-size);font-weight:600;font-weight:var(--text-h2-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h3{font-size:20px;font-size:var(--text-h3-size);font-weight:500;font-weight:var(--text-h3-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h3b{font-size:20px;font-size:var(--text-h3-size);font-weight:600;font-weight:var(--text-h3-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h4{font-size:17px;font-size:var(--text-h4-size);font-weight:500;font-weight:var(--text-h4-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h4b{font-size:17px;font-size:var(--text-h4-size);font-weight:600;font-weight:var(--text-h4-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h5{font-size:15px;font-size:var(--text-h5-size);font-weight:500;font-weight:var(--text-h5-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).h5b{font-size:15px;font-size:var(--text-h5-size);font-weight:600;font-weight:var(--text-h5-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).body-1{font-size:18px;font-size:var(--text-body-1-size);font-weight:400;font-weight:var(--text-body-1-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).body-1b{font-size:18px;font-size:var(--text-body-1-size);font-weight:600;font-weight:var(--text-body-1-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).body-2{font-size:16px;font-size:var(--text-body-2-size);font-weight:400;font-weight:var(--text-body-2-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).body-2b{font-size:16px;font-size:var(--text-body-2-size);font-weight:600;font-weight:var(--text-body-2-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).body-3{font-size:14px;font-size:var(--text-body-3-size);font-weight:400;font-weight:var(--text-body-3-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).body-3b{font-size:14px;font-size:var(--text-body-3-size);font-weight:600;font-weight:var(--text-body-3-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).caption-1{font-size:12px;font-size:var(--text-caption-1-size);font-weight:400;font-weight:var(--text-caption-1-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).caption-1b{font-size:12px;font-size:var(--text-caption-1-size);font-weight:600;font-weight:var(--text-caption-1-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).caption-2{font-size:11px;font-size:var(--text-caption-2-size);font-weight:400;font-weight:var(--text-caption-2-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).caption-2b{font-size:11px;font-size:var(--text-caption-2-size);font-weight:600;font-weight:var(--text-caption-2-weight-bold)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).button-1{font-size:14px;font-size:var(--text-button-1-size);font-weight:500;font-weight:var(--text-button-1-weight)}:where(.ihabdevteam-core-scope) :where(h1,h2,h3,h4,h5,h6).button-2{font-size:13px;font-size:var(--text-button-2-size);font-weight:400;font-weight:var(--text-button-2-weight)}.ihabdevteam-core-scope ::-webkit-scrollbar{height:6px;width:6px}.ihabdevteam-core-scope ::-webkit-scrollbar-track{background:transparent}.ihabdevteam-core-scope ::-webkit-scrollbar-thumb{background:#eef2f6;background:var(--color-darkWhite);border-radius:3px}.ihabdevteam-core-scope ::-webkit-scrollbar-thumb:hover{background:#96a4b8;background:var(--color-lightGray)}.ihabdevteam-core-scope *{scrollbar-color:#eef2f6 transparent;scrollbar-color:var(--color-darkWhite) transparent;scrollbar-width:thin}@keyframes sub-to-main{0%{background-color:#4dcdc0;background-color:var(--color-sub)}to{background-color:#499cdf;background-color:var(--color-main)}}.ihabdevteam-core-scope .safearea{margin:0 auto;max-width:1920px;max-width:var(--container-page);width:100%}.ihabdevteam-core-scope{color:#111;color:var(--color-black);font-family:Pretendard Variable,Pretendard,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;font-family:var(--font-family);overflow-wrap:anywhere;white-space:normal;word-break:keep-all}.ihabdevteam-core-scope :focus-visible{outline:2px solid #499cdf;outline:2px solid var(--focus-ring);outline-offset:2px}@media (prefers-reduced-motion:reduce){.ihabdevteam-core-scope *,.ihabdevteam-core-scope :after,.ihabdevteam-core-scope :before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}

package/dist/ihabdevteam-core.d.ts

@@ -1626,7 +1626,7 @@ export declare function copyText(text: string): Promise<boolean>;
  *
  * 값은 손으로 적고 `test/coreVersion.test.ts` 가 package.json 과 어긋나면 운다.
  */
-export declare const CORE_VERSION = "0.193.0";
+export declare const CORE_VERSION = "0.195.0";
 
 /** @public */
 declare const coreDefault: Record<string, unknown>;
@@ -4889,6 +4889,35 @@ export declare interface PopupProps {
 
 export declare const POS_LABEL: Record<string, string>;
 
+/**
+ * **늦게 받는 화면 청크를 한가할 때 미리 받아 둔다.**
+ *
+ * `lazyPage` 로 미룬 화면은 **그리려는 순간** 청크를 받는다. 그 사이 화면에는 동그라미만 돌고
+ * 제목도 구획도 하나도 없다(말귀 실측 2026-09-20: 고객 상세가 누른 뒤 **364ms** 동안 빈 화면.
+ * 사용자가 짚었다 — "고객을 누르면 pagetitle, 차트섹션들이 하나도 안 보이는 순간이 있는데").
+ *
+ * 그래서 **누르기 전에** 받아 둔다. 목록이 선 뒤 한가할 때 같은 모듈을 한 번 부르면 번들러가
+ * 캐시하고, 누르는 순간 `lazy` 가 곧바로 풀려 **뼈대가 먼저 선다** — 자료를 기다리는 일은 그
+ * 뼈대 안에서 일어난다.
+ *
+ * 지키는 것 둘:
+ * - **첫 그리기를 안 건드린다.** 화면이 선 뒤 한가한 틈에만 받는다(`requestIdleCallback`).
+ *   그 함수는 **사파리에 없다** — 없으면 짧게 미뤄(300ms) 그리는 일을 막지 않을 만큼만 늦춘다.
+ * - **실패를 삼킨다.** 미리 받기가 안 되면 누를 때 받으면 된다(그러면 예전과 같을 뿐이다).
+ *   그것 때문에 오류 화면을 띄울 일이 아니다.
+ *
+ * 돌려주는 것은 **그만두는 함수**다 — 효과에서 그대로 돌려주면 화면을 떠날 때 예약이 걷힌다.
+ *
+ * ```ts
+ * useEffect(() => prefetchChunk(() => import('./pages/CustomerDetail')), [])
+ * ```
+ *
+ * 두 앱(회원앱 · 어드민)이 한 벌씩 들고 있던 것이다 — 번들이 갈려 앱끼리는 합칠 수 없는
+ * 자리라 코어로 왔다(2026-09-25). 브라우저 차이를 아는 일은 `chunkSkew`·`lazyPage` 와 같은 결이다.
+ * @public
+ */
+export declare function prefetchChunk(...loads: readonly (() => Promise<unknown>)[]): () => void;
+
 /**
  * @public
  * 여러 단어의 이미지 존재 여부를 사전 확인 (병렬). localStorage에 영구 저장됨.
@@ -9038,6 +9067,29 @@ export declare function usePagedList<T>(items: T[], perPage: number, page: numbe
     curPage: number;
 };
 
+/**
+ * **거르는 조건이 바뀌면 첫 쪽으로 돌아간다.** `usePagedList` 의 짝이다.
+ *
+ * 안 돌리면 **3쪽을 보던 채로 검색어를 바꿨을 때 결과가 한 쪽뿐이라 빈 표가 뜬다** — 찾는 것이
+ * 없어서가 아니라 **없는 쪽을 보고 있어서**다. 화면 셋(어드민 문장·낱말 자료, 회원앱 낱말 관리)이
+ * 같은 세 줄을 각자 적고 있었고, 그것을 한 벌로 모은 뒤에도 두 앱에 한 벌씩 남아 있었다
+ * (번들이 갈려 앱끼리는 합칠 수 없는 자리다 — 2026-09-25 코어로).
+ *
+ * **효과(`useEffect`)가 아니라 렌더 중에 고친다.** 효과로 미루면 한 번은 옛 쪽 번호로 그려진 뒤
+ * 다음 프레임에 1쪽이 되어, 새 조건의 결과가 **빈 표로 한 번 깜빡인다.** 렌더 중 상태 조정은
+ * React 가 이 꼴을 위해 내준 길이다(같은 컴포넌트를 바로 다시 그린다).
+ *
+ * ```ts
+ * usePageResetOnChange(`${검색어}|${갈래}|${정렬}`, setPage)
+ * const { pageItems, totalPages } = usePagedList(걸러낸것, 쪽크기, page)
+ * ```
+ *
+ * @param 열쇠 조건을 하나로 이어 붙인 글 — 이것이 달라지면 첫 쪽이다
+ * @param setPage 쪽 번호를 쥔 쪽에서 준다
+ * @public
+ */
+export declare function usePageResetOnChange(열쇠: string, setPage: (n: number) => void): void;
+
 /**
  * 비밀번호 변경 폼 상태와 핸들러를 캡슐화한 훅.
  * showModal 상태는 컴포넌트가 직접 관리 (훅 밖에 두어야 모달 열기 트리거 제어 가능).

package/dist/packages/core/src/gameShell.css

@@ -0,0 +1,190 @@
+/* ══════════════════════════════════════════════════════════
+   gameShell.css — 게임 껍데기 한 벌
+
+   타자 게임과 순발력 게임이 **같은 규칙 서른셋**을 각자 적고 있었다(말귀 실측 2026-09-25:
+   짝지어지는 선택자 62개 가운데 선언까지 글자대로 같은 것이 그만큼). 이름만 `tg-`/`rg-` 로
+   달랐다. 한쪽 여백을 고치면 다른 쪽이 조용히 뒤처지는 자리였다.
+
+   **여기 있는 것은 자리와 크기뿐이다.** 시트의 바탕과 글자색은 게임마다 다르고 그것이 각
+   게임의 얼굴이라, 색은 게임이 쥔다 — 두 게임이 이미 같은 값으로 쓰던 색만 여기 기본값으로
+   두고, 그마저 `--game-*` 변수로 열어 두어 게임이 얹을 수 있게 한다.
+
+   **앱에서 합치지 않고 코어가 새로 세운 까닭**이 있다. 옮기기로 합치면 조용히 모양이 바뀐다 —
+   `--play` 와 `sheet` 처럼 **같은 특이도의 형제**가 차례로만 이기고 있던 자리가 있어, 공용
+   파일이 먼저 읽히면 승부가 뒤집힌다. 게임 화면을 눈으로 보는 시험이 없어 그걸 시험이 못
+   잡는다. 그래서 **겹치는 것끼리는 특이도를 올려 차례에 기대지 않는다**(아래 `--play` 규칙이
+   클래스 둘을 겹쳐 쓰는 까닭이다).
+══════════════════════════════════════════════════════════ */
+
+/* 게임 판 — 창과 같은 층이다. **예전에는 3000(툴팁과 같은 값)이라**, 게임 안에서 띄운 툴팁이
+   차례에 따라 판에 가렸다. 창 층에 두면 그 위의 메뉴·툴팁이 게임 안에서도 제대로 뜬다. */
+.game-overlay {
+  position: fixed;
+  inset: 0;
+  /* 두 게임이 쓰던 값 그대로다. 코어의 `--color-overlay`(창 뒤 가림막)는 조금 더 어둡고
+     푸른 값이라 그것으로 바꾸면 **게임 판의 색이 조용히 달라진다** — 껍데기는 자리와 크기만
+     옮긴다는 약속을 여기서도 지킨다. 게임이 달리 쓰고 싶으면 변수로 얹는다. */
+  background: var(--game-overlay-bg, rgba(0, 0, 0, 0.5));
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: var(--z-modal);
+}
+
+/* ── 놀이 중 ─────────────────────────────────────────────
+   폰에서는 시트가 화면을 꽉 채운다. `.game-sheet` 도 폭·모서리·여백을 정하는데 둘 다
+   클래스 하나(0,1,0)라, 차례가 바뀌면 이 규칙이 진다 — 클래스를 겹쳐 특이도로 이긴다. */
+@media (max-width: 767px) {
+  .game-overlay:has(.game-sheet--play) { padding: 0; }
+  .game-sheet.game-sheet--play {
+    width: 100%;
+    max-width: none;
+    height: 100%;
+    max-height: none;
+    border-radius: 0;
+    border: none;
+    box-shadow: none;
+    padding: calc(28px + env(safe-area-inset-top)) 20px calc(16px + env(safe-area-inset-bottom));
+    justify-content: center;
+  }
+}
+
+/* 눕힌 폰 — 세로가 모자라면 머리와 여백부터 줄인다 */
+@media (max-height: 500px) {
+  .game-sheet.game-sheet--play {
+    gap: 6px;
+    padding-top: calc(10px + env(safe-area-inset-top));
+    padding-bottom: calc(10px + env(safe-area-inset-bottom));
+  }
+  .game-sheet--play .game-play-header { gap: 8px; }
+  .game-sheet--play .game-play-header__icon { width: 32px; height: 32px; font-size: 18px; }
+}
+
+/* ── 놀이 머리줄 ────────────────────────────────────────── */
+.game-play-header {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+}
+
+/* ── 남은 시간 ─────────────────────────────────────────── */
+.game-timer {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+}
+/* 숫자가 한 자리에서 두 자리로 바뀔 때 막대가 흔들리지 않게 자리를 미리 잡는다 */
+.game-timer__label {
+  min-width: 30px;
+  text-align: right;
+  transition: color 0.3s;
+}
+.game-timer-slider-wrap {
+  flex: 1;
+  display: flex;
+}
+
+/* ── 판 점(몇 판째인가) ──────────────────────────────────── */
+.game-rounds {
+  display: flex;
+  align-items: center;
+  gap: 7px;
+}
+.game-rounds__dot {
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  background: var(--game-dot-bg, rgba(255, 255, 255, 0.14));
+  transition: background 0.25s, transform 0.25s, box-shadow 0.25s;
+}
+.game-rounds__dot--correct { background: var(--game-dot-correct, #34d399); }
+.game-rounds__dot--wrong   { background: var(--game-dot-wrong, #f87171); }
+.game-rounds__label {
+  margin-left: auto;
+  color: var(--game-muted, rgba(255, 255, 255, 0.45));
+}
+
+/* ── 맞았다 / 틀렸다 ──────────────────────────────────────
+   자리를 **비우지 않고 감춘다**(`visibility`) — 없애면 그 줄만큼 아래가 들썩인다. */
+.game-feedback {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 12px 16px;
+  border-radius: var(--radius-s);
+  text-align: center;
+}
+.game-feedback--hidden { visibility: hidden; }
+
+/* ── 결과 ─────────────────────────────────────────────── */
+.game-result {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: var(--spacing-xs);
+}
+.game-result__emoji { font-size: 42px; }
+.game-result__item {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  padding: 8px 12px;
+  border-radius: var(--radius-sm);
+  width: 100%;
+  box-sizing: border-box;
+}
+.game-result__status {
+  width: 18px;
+  flex-shrink: 0;
+}
+.game-result__pct-row {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 6px;
+  width: 100%;
+  margin-bottom: var(--spacing-xs);
+}
+.game-result__footer {
+  display: flex;
+  gap: 10px;
+  width: 100%;
+  margin-top: 4px;
+}
+
+@media (max-height: 700px) {
+  .game-result { gap: 10px; }
+  .game-result__emoji-ring { width: 64px; height: 64px; font-size: 30px; }
+}
+
+/* 눕힌 폰에서 폭이 넉넉하면 **가로로 나눈다** — 위아래로 쌓으면 목록이 손바닥만 해진다 */
+@media (max-height: 500px) and (min-width: 520px) {
+  .game-result {
+    display: grid;
+    grid-template-columns: auto minmax(190px, 1fr);
+    align-items: center;
+    align-content: center;
+    column-gap: var(--spacing-l);
+    row-gap: 4px;
+    width: 100%;
+    height: 100%;
+    min-height: 0;
+    padding-right: 44px;
+  }
+  .game-result__emoji-ring { width: 52px; height: 52px; font-size: 24px; }
+  .game-result__list {
+    grid-column: 2;
+    grid-row: 1 / span 5;
+    max-height: 100%;
+    min-height: 0;
+    align-self: stretch;
+  }
+  .game-result__footer {
+    grid-column: 2;
+    grid-row: 6;
+    position: static;
+    margin-top: 0;
+    padding-top: 0;
+    background: none;
+  }
+}

package/dist/packages/core/src/hooks/usePageResetOnChange.d.ts

@@ -0,0 +1,22 @@
+/**
+ * **거르는 조건이 바뀌면 첫 쪽으로 돌아간다.** `usePagedList` 의 짝이다.
+ *
+ * 안 돌리면 **3쪽을 보던 채로 검색어를 바꿨을 때 결과가 한 쪽뿐이라 빈 표가 뜬다** — 찾는 것이
+ * 없어서가 아니라 **없는 쪽을 보고 있어서**다. 화면 셋(어드민 문장·낱말 자료, 회원앱 낱말 관리)이
+ * 같은 세 줄을 각자 적고 있었고, 그것을 한 벌로 모은 뒤에도 두 앱에 한 벌씩 남아 있었다
+ * (번들이 갈려 앱끼리는 합칠 수 없는 자리다 — 2026-09-25 코어로).
+ *
+ * **효과(`useEffect`)가 아니라 렌더 중에 고친다.** 효과로 미루면 한 번은 옛 쪽 번호로 그려진 뒤
+ * 다음 프레임에 1쪽이 되어, 새 조건의 결과가 **빈 표로 한 번 깜빡인다.** 렌더 중 상태 조정은
+ * React 가 이 꼴을 위해 내준 길이다(같은 컴포넌트를 바로 다시 그린다).
+ *
+ * ```ts
+ * usePageResetOnChange(`${검색어}|${갈래}|${정렬}`, setPage)
+ * const { pageItems, totalPages } = usePagedList(걸러낸것, 쪽크기, page)
+ * ```
+ *
+ * @param 열쇠 조건을 하나로 이어 붙인 글 — 이것이 달라지면 첫 쪽이다
+ * @param setPage 쪽 번호를 쥔 쪽에서 준다
+ * @public
+ */
+export declare function usePageResetOnChange(열쇠: string, setPage: (n: number) => void): void;

package/dist/packages/core/src/hooks/usePageResetOnChange.js

@@ -0,0 +1,30 @@
+'use client';
+import { useState } from 'react';
+/**
+ * **거르는 조건이 바뀌면 첫 쪽으로 돌아간다.** `usePagedList` 의 짝이다.
+ *
+ * 안 돌리면 **3쪽을 보던 채로 검색어를 바꿨을 때 결과가 한 쪽뿐이라 빈 표가 뜬다** — 찾는 것이
+ * 없어서가 아니라 **없는 쪽을 보고 있어서**다. 화면 셋(어드민 문장·낱말 자료, 회원앱 낱말 관리)이
+ * 같은 세 줄을 각자 적고 있었고, 그것을 한 벌로 모은 뒤에도 두 앱에 한 벌씩 남아 있었다
+ * (번들이 갈려 앱끼리는 합칠 수 없는 자리다 — 2026-09-25 코어로).
+ *
+ * **효과(`useEffect`)가 아니라 렌더 중에 고친다.** 효과로 미루면 한 번은 옛 쪽 번호로 그려진 뒤
+ * 다음 프레임에 1쪽이 되어, 새 조건의 결과가 **빈 표로 한 번 깜빡인다.** 렌더 중 상태 조정은
+ * React 가 이 꼴을 위해 내준 길이다(같은 컴포넌트를 바로 다시 그린다).
+ *
+ * ```ts
+ * usePageResetOnChange(`${검색어}|${갈래}|${정렬}`, setPage)
+ * const { pageItems, totalPages } = usePagedList(걸러낸것, 쪽크기, page)
+ * ```
+ *
+ * @param 열쇠 조건을 하나로 이어 붙인 글 — 이것이 달라지면 첫 쪽이다
+ * @param setPage 쪽 번호를 쥔 쪽에서 준다
+ * @public
+ */
+export function usePageResetOnChange(열쇠, setPage) {
+    const [본열쇠, set본열쇠] = useState(열쇠);
+    if (본열쇠 !== 열쇠) {
+        set본열쇠(열쇠);
+        setPage(1);
+    }
+}

package/dist/packages/core/src/hooks.d.ts

@@ -23,6 +23,7 @@ export * from './hooks/useEscToClose';
 export * from './hooks/useWordMeanings';
 export * from './hooks/useHoverAnchor';
 export * from './hooks/usePagedList';
+export * from './hooks/usePageResetOnChange';
 export * from './hooks/useToastState';
 export { useTrainingTypeLabels } from './hooks/useTrainingTypeLabels';
 export { CORE_VERSION } from './version';

package/dist/packages/core/src/hooks.js

@@ -22,6 +22,7 @@ export * from './hooks/useEscToClose';
 export * from './hooks/useWordMeanings';
 export * from './hooks/useHoverAnchor';
 export * from './hooks/usePagedList';
+export * from './hooks/usePageResetOnChange';
 // 토스트 상태(문구 + 종류 + 재실행 번호). 회원 앱의 useToast 가 이 위에 얹혀 있다 —
 // 같은 관용구를 두 벌로 두지 않으려면 패키지 밖에서도 보여야 한다.
 export * from './hooks/useToastState';

package/dist/packages/core/src/styles.css

@@ -8,6 +8,8 @@
 
 /* @import는 CSS 규격상 다른 규칙보다 앞서야 하므로 파일 최상단에 둔다. */
 @import './tokens.css';
+/* 게임 껍데기(자리·크기) — 타자·순발력이 한 벌씩 적던 것. 색은 게임이 쥔다(gameShell.css 의 글). */
+@import './gameShell.css';
 
 /* 여기 `@import './app/Page/Page.css'` 가 있었다 — 페이지 레이아웃(.page 여백·최대폭)과
    공통 모달을 전역으로 보장하려는 것이었다. 각 페이지가 Page.css 를 직접 import 하게

package/dist/packages/core/src/utils/prefetchChunk.d.ts

@@ -0,0 +1,28 @@
+/**
+ * **늦게 받는 화면 청크를 한가할 때 미리 받아 둔다.**
+ *
+ * `lazyPage` 로 미룬 화면은 **그리려는 순간** 청크를 받는다. 그 사이 화면에는 동그라미만 돌고
+ * 제목도 구획도 하나도 없다(말귀 실측 2026-09-20: 고객 상세가 누른 뒤 **364ms** 동안 빈 화면.
+ * 사용자가 짚었다 — "고객을 누르면 pagetitle, 차트섹션들이 하나도 안 보이는 순간이 있는데").
+ *
+ * 그래서 **누르기 전에** 받아 둔다. 목록이 선 뒤 한가할 때 같은 모듈을 한 번 부르면 번들러가
+ * 캐시하고, 누르는 순간 `lazy` 가 곧바로 풀려 **뼈대가 먼저 선다** — 자료를 기다리는 일은 그
+ * 뼈대 안에서 일어난다.
+ *
+ * 지키는 것 둘:
+ * - **첫 그리기를 안 건드린다.** 화면이 선 뒤 한가한 틈에만 받는다(`requestIdleCallback`).
+ *   그 함수는 **사파리에 없다** — 없으면 짧게 미뤄(300ms) 그리는 일을 막지 않을 만큼만 늦춘다.
+ * - **실패를 삼킨다.** 미리 받기가 안 되면 누를 때 받으면 된다(그러면 예전과 같을 뿐이다).
+ *   그것 때문에 오류 화면을 띄울 일이 아니다.
+ *
+ * 돌려주는 것은 **그만두는 함수**다 — 효과에서 그대로 돌려주면 화면을 떠날 때 예약이 걷힌다.
+ *
+ * ```ts
+ * useEffect(() => prefetchChunk(() => import('./pages/CustomerDetail')), [])
+ * ```
+ *
+ * 두 앱(회원앱 · 어드민)이 한 벌씩 들고 있던 것이다 — 번들이 갈려 앱끼리는 합칠 수 없는
+ * 자리라 코어로 왔다(2026-09-25). 브라우저 차이를 아는 일은 `chunkSkew`·`lazyPage` 와 같은 결이다.
+ * @public
+ */
+export declare function prefetchChunk(...loads: readonly (() => Promise<unknown>)[]): () => void;

package/dist/packages/core/src/utils/prefetchChunk.js

@@ -0,0 +1,44 @@
+/**
+ * **늦게 받는 화면 청크를 한가할 때 미리 받아 둔다.**
+ *
+ * `lazyPage` 로 미룬 화면은 **그리려는 순간** 청크를 받는다. 그 사이 화면에는 동그라미만 돌고
+ * 제목도 구획도 하나도 없다(말귀 실측 2026-09-20: 고객 상세가 누른 뒤 **364ms** 동안 빈 화면.
+ * 사용자가 짚었다 — "고객을 누르면 pagetitle, 차트섹션들이 하나도 안 보이는 순간이 있는데").
+ *
+ * 그래서 **누르기 전에** 받아 둔다. 목록이 선 뒤 한가할 때 같은 모듈을 한 번 부르면 번들러가
+ * 캐시하고, 누르는 순간 `lazy` 가 곧바로 풀려 **뼈대가 먼저 선다** — 자료를 기다리는 일은 그
+ * 뼈대 안에서 일어난다.
+ *
+ * 지키는 것 둘:
+ * - **첫 그리기를 안 건드린다.** 화면이 선 뒤 한가한 틈에만 받는다(`requestIdleCallback`).
+ *   그 함수는 **사파리에 없다** — 없으면 짧게 미뤄(300ms) 그리는 일을 막지 않을 만큼만 늦춘다.
+ * - **실패를 삼킨다.** 미리 받기가 안 되면 누를 때 받으면 된다(그러면 예전과 같을 뿐이다).
+ *   그것 때문에 오류 화면을 띄울 일이 아니다.
+ *
+ * 돌려주는 것은 **그만두는 함수**다 — 효과에서 그대로 돌려주면 화면을 떠날 때 예약이 걷힌다.
+ *
+ * ```ts
+ * useEffect(() => prefetchChunk(() => import('./pages/CustomerDetail')), [])
+ * ```
+ *
+ * 두 앱(회원앱 · 어드민)이 한 벌씩 들고 있던 것이다 — 번들이 갈려 앱끼리는 합칠 수 없는
+ * 자리라 코어로 왔다(2026-09-25). 브라우저 차이를 아는 일은 `chunkSkew`·`lazyPage` 와 같은 결이다.
+ * @public
+ */
+export function prefetchChunk(...loads) {
+    let 취소됨 = false;
+    const 받기 = () => { if (!취소됨)
+        for (const load of loads)
+            void load().catch(() => { }); };
+    const idle = globalThis.requestIdleCallback;
+    if (idle) {
+        const id = idle(받기, { timeout: 2000 });
+        return () => {
+            취소됨 = true;
+            const cancel = globalThis.cancelIdleCallback;
+            cancel?.(id);
+        };
+    }
+    const id = setTimeout(받기, 300);
+    return () => { 취소됨 = true; clearTimeout(id); };
+}

package/dist/packages/core/src/utils.d.ts

@@ -57,4 +57,5 @@ export { PLAN_FEATURES, PLAN_LIMITS, TIER_RANK, getPlanTier, isManagerTier, type
 export { WORD_SUGGESTION_WEEKLY_QUOTA, WORD_SUGGESTION_ACCOUNT_LIMIT, WORD_SUGGESTION_EXISTING_ERROR, isThisWeekPick, } from './utils/wordSuggestionPolicy';
 export { recoverFromSkew, skewReloadPending } from './utils/chunkSkew';
 export { lazyPage } from './utils/lazyPage';
+export { prefetchChunk } from './utils/prefetchChunk';
 export { CORE_VERSION } from './version';

package/dist/packages/core/src/utils.js

@@ -46,4 +46,5 @@ export { PLAN_FEATURES, PLAN_LIMITS, TIER_RANK, getPlanTier, isManagerTier, } fr
 export { WORD_SUGGESTION_WEEKLY_QUOTA, WORD_SUGGESTION_ACCOUNT_LIMIT, WORD_SUGGESTION_EXISTING_ERROR, isThisWeekPick, } from './utils/wordSuggestionPolicy';
 export { recoverFromSkew, skewReloadPending } from './utils/chunkSkew';
 export { lazyPage } from './utils/lazyPage';
+export { prefetchChunk } from './utils/prefetchChunk';
 export { CORE_VERSION } from './version';

package/dist/packages/core/src/version.d.ts

@@ -46,4 +46,4 @@
  *
  * 값은 손으로 적고 `test/coreVersion.test.ts` 가 package.json 과 어긋나면 운다.
  */
-export declare const CORE_VERSION = "0.193.0";
+export declare const CORE_VERSION = "0.195.0";

package/dist/packages/core/src/version.js

@@ -46,4 +46,4 @@
  *
  * 값은 손으로 적고 `test/coreVersion.test.ts` 가 package.json 과 어긋나면 운다.
  */
-export const CORE_VERSION = '0.193.0';
+export const CORE_VERSION = '0.195.0';