:root{--mg-desk:#e7dfcf;--mg-paper:#fbf7ec;--mg-grid:#6096cd33;--mg-margin-line:#d25a5073;--mg-ink:#3b3b40;--mg-muted:#7d7a72;--mg-red:#d4553f;--mg-blue:#3f74b5;--mg-yellow:#efc54a;--mg-bg:var(--mg-paper);--mg-surface:var(--mg-paper);--mg-accent:var(--mg-red);--mg-accent-ink:var(--mg-ink);--mg-line:color-mix(in srgb, var(--mg-ink) 25%, transparent);--mg-shadow:0 1px 2px #3c2d141f, 0 12px 32px #3c2d1429;--mg-font:"Gaegu", "Apple SD Gothic Neo", "Noto Sans KR", system-ui, sans-serif;--mg-display:"Nanum Pen Script", "Gaegu", system-ui, sans-serif;--mg-grid-size:22px;--mg-lamp:none;--mg-marker:color-mix(in srgb, var(--mg-yellow) 55%, transparent);--mg-scrap:#fffdf6;--mg-tape-alpha:55%;--mg-sketch-radius:255px 15px 225px 15px / 15px 225px 15px 255px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--mg-desk:#14120f;--mg-paper:#2a261f;--mg-grid:#82a5c81f;--mg-margin-line:#e1736452;--mg-ink:#e4ddcd;--mg-muted:#a39b8b;--mg-red:#e57a62;--mg-blue:#86ade0;--mg-yellow:#dcb54a;--mg-shadow:0 1px 2px #0006, 0 16px 40px #00000080;--mg-lamp:radial-gradient(ellipse 90% 55% at 50% 0%, #ffc47817, transparent 70%);--mg-marker:color-mix(in srgb, var(--mg-yellow) 28%, transparent);--mg-scrap:#322d25;--mg-tape-alpha:40%;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--mg-desk:#14120f;--mg-paper:#2a261f;--mg-grid:#82a5c81f;--mg-margin-line:#e1736452;--mg-ink:#e4ddcd;--mg-muted:#a39b8b;--mg-red:#e57a62;--mg-blue:#86ade0;--mg-yellow:#dcb54a;--mg-shadow:0 1px 2px #0006, 0 16px 40px #00000080;--mg-lamp:radial-gradient(ellipse 90% 55% at 50% 0%, #ffc47817, transparent 70%);--mg-marker:color-mix(in srgb, var(--mg-yellow) 28%, transparent);--mg-scrap:#322d25;--mg-tape-alpha:40%;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html{background:var(--mg-paper)}body{min-height:100dvh;color:var(--mg-ink);font-family:var(--mg-font);word-break:keep-all;-webkit-tap-highlight-color:transparent;margin:0;font-size:19px}.page{background:linear-gradient(var(--mg-grid) 1px, transparent 1px) 0 0 / var(--mg-grid-size) var(--mg-grid-size), linear-gradient(90deg, var(--mg-grid) 1px, transparent 1px) 0 0 / var(--mg-grid-size) var(--mg-grid-size), var(--mg-paper);position:relative}.page:before{content:"";background:var(--mg-margin-line);width:1.5px;position:absolute;top:0;bottom:0;left:14px}.book{background:var(--mg-lamp), var(--mg-paper);min-height:100dvh;position:relative}.book .page{background-color:#0000}.book:before{content:"";background:var(--mg-margin-line);width:1.5px;position:absolute;top:0;bottom:0;left:14px}.page-left:before{display:none}.page-left{padding:28px 18px 4px 30px}.page-right{padding:8px 14px 40px 30px}.page-right:before{display:none}.hub-head h1{font-family:var(--mg-display);margin:0;font-size:clamp(54px,15vw,84px);font-weight:400;line-height:.95}.hub-sub{color:var(--mg-muted);background:linear-gradient(var(--mg-red), var(--mg-red)) 0 100% / 100% 2px no-repeat;margin:6px 0 0;padding-bottom:2px;font-size:20px;display:inline-block}.hub-note{margin-top:14px}.hub-note p{margin:0;line-height:1.35}.hub-note-small{color:var(--mg-muted);font-size:17px;margin-top:4px!important}.page-left .hub-note p:first-child{display:none}.hub-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 16px;padding-top:16px;display:grid}.hub-card{--tape:var(--mg-yellow);--tilt:-1.2deg;background:var(--mg-scrap);color:inherit;transform:rotate(var(--tilt));border-radius:2px;flex-direction:column;gap:2px;padding:14px 12px 12px;text-decoration:none;transition:transform .12s;display:flex;position:relative;box-shadow:1px 2px #0000000f,0 6px 14px #3c2d141f}.hub-card:nth-child(3n+2){--tape:var(--mg-blue);--tilt:1deg}.hub-card:nth-child(3n+3){--tape:var(--mg-red);--tilt:-.4deg}.hub-card:nth-child(4n+4){--tilt:1.4deg}.hub-card:before{content:"";background:color-mix(in srgb, var(--tape) var(--mg-tape-alpha), transparent);width:64px;height:22px;transform:translateX(-50%) rotate(calc(var(--tilt) * -3));clip-path:polygon(3% 0,97% 4%,100% 50%,96% 100%,2% 96%,0 50%);position:absolute;top:-11px;left:50%}a.hub-card:hover{transform:rotate(0)translateY(-3px)}a.hub-card:active{transform:rotate(0)translate(1px,2px)}a.hub-card:focus-visible{outline:2px dashed var(--mg-blue);outline-offset:6px}.hub-thumb{aspect-ratio:4/3;border:2px solid var(--mg-ink);border-radius:var(--mg-sketch-radius);place-items:center;margin-bottom:6px;display:grid;overflow:hidden}.hub-thumb img{object-fit:cover;width:100%;height:100%;display:block}.hub-thumb.hub-photo{transform:rotate(calc(var(--tilt) * -.8));background:#fffdf8;border:0;border-radius:2px;padding:5px 5px 6px;box-shadow:0 1px 2px #0000002e,0 4px 10px #3c2d1429}.hub-thumb.hub-photo img{border-radius:1px}.hub-doodle{font-family:var(--mg-display);color:var(--mg-ink);font-size:56px;line-height:1}.hub-card strong{font-size:22px;line-height:1.1}.hub-card small{color:var(--mg-muted);font-size:16px;line-height:1.2}.hub-soon{box-shadow:none;color:var(--mg-muted);background:0 0}.hub-soon:before{display:none}.hub-soon .hub-thumb{border-style:dashed;border-color:var(--mg-muted)}.hub-soon .hub-doodle{color:var(--mg-muted)}@media (width>=880px){html{background:var(--mg-desk)}body{place-items:center;padding:32px 24px;display:grid}.book{background:var(--mg-lamp), var(--mg-paper);width:min(1120px,100%);min-height:min(720px,100dvh - 64px);box-shadow:var(--mg-shadow);border-radius:6px;grid-template-columns:1fr 1.45fr;display:grid;position:relative}.book:after{content:"";pointer-events:none;background:linear-gradient(90deg,#0000,#00000012 45%,#0000001a 50%,#00000012 55%,#0000);width:28px;position:absolute;top:0;bottom:0;left:40.8163%;transform:translate(-50%)}.book:before{display:none}.page:before{left:40px}.page-left:before,.page-right:before{display:block}.page-left{flex-direction:column;padding:56px 40px 40px 64px;display:flex}.page-right{padding:40px 40px 40px 64px}.page-left .hub-note p:first-child{display:block}.hub-note{margin-top:auto;font-size:22px}.hub-head h1{font-size:88px}.hub-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 22px}}