:root{--bg-primary:#FFFFFF;--bg-secondary:#FFFFFF;--bg-tertiary:#F5F5F7;--bg-section:#FAFAFA;--text-primary:#1D1D1F;--text-secondary:#555555;--text-tertiary:#8E8E93;--text-caption:#AEAEB2;--accent:#6B5CE7;--accent-hover:#5A4BD6;--accent-light:rgba(107, 92, 231, 0.08);--border:#E5E5EA;--border-light:#F2F2F7;--shadow-sm:0 1px 3px rgba(0,0,0,0.04),0 1px 2px rgba(0,0,0,0.02);--shadow-md:0 4px 14px rgba(0,0,0,0.06);--shadow-lg:0 10px 30px rgba(0,0,0,0.08);--shadow-book:2px 4px 12px rgba(0,0,0,0.08),0 1px 3px rgba(0,0,0,0.04);--radius-xs:4px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--radius-full:9999px;--font-family:'Pretendard Variable','Pretendard',-apple-system,BlinkMacSystemFont,system-ui,sans-serif;--max-width:960px;--header-height:56px;--transition:0.2s ease}*,::after,::before{box-sizing:border-box;margin:0;padding:0}body,html{-webkit-text-size-adjust:100%!important;text-size-adjust:100%!important}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}body{font-family:var(--font-family);background:var(--bg-primary);color:var(--text-primary);line-height:1.6;min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden}a{color:inherit;text-decoration:none}img{max-width:100%;height:auto;display:block}button{font-family:inherit;cursor:pointer;border:none;background:0 0}input,textarea{font-family:inherit}#content{flex:1;width:100%}.section{padding:40px 20px}.section-inner{max-width:var(--max-width);margin:0 auto}.section-title-icon{display:flex;align-items:center;gap:6px;font-size:.9375rem;font-weight:600;color:var(--text-primary);margin-bottom:16px}.section-title-icon svg{color:var(--text-tertiary);flex-shrink:0}.site-header{position:sticky;top:0;z-index:250;background:rgba(255,255,255,.92);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border-light)}.header-inner{max-width:var(--max-width);margin:0 auto;padding:0 20px;height:var(--header-height);display:flex;align-items:center;justify-content:space-between;gap:16px}.header-logo{display:flex;align-items:center;text-decoration:none;flex-shrink:0}.header-logo-img{height:32px;width:auto}.header-logo-text{font-size:1.125rem;font-weight:700;color:var(--text-primary)}.header-nav{display:flex;align-items:center;gap:2px;flex:1;margin-left:24px}.nav-link{display:inline-flex;align-items:center;gap:5px;padding:6px 14px;border-radius:var(--radius-sm);font-size:.8125rem;font-weight:500;color:var(--text-tertiary);transition:all var(--transition)}.nav-link svg{opacity:.6;flex-shrink:0}.nav-link.active svg{opacity:1}.nav-link:hover{color:var(--text-primary);background:var(--bg-tertiary)}.nav-link.active{color:var(--accent);font-weight:600}.nav-cart-badge{display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;padding:0 5px;margin-left:1px;border-radius:999px;background:var(--accent);color:#fff;font-size:.6875rem;font-weight:700;line-height:1;font-variant-numeric:tabular-nums}.nav-cart-badge[hidden]{display:none}.header-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}.user-menu{position:relative}.user-menu-trigger{width:32px;height:32px;border-radius:50%;overflow:hidden;cursor:pointer}.user-avatar{width:100%;height:100%;object-fit:cover;border-radius:50%}.user-avatar-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--accent);color:#fff;font-size:.8rem;font-weight:700;border-radius:50%}.login-avatar-btn{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--bg-tertiary);border:1.5px solid var(--border);color:var(--text-caption);text-decoration:none;transition:all var(--transition)}.login-avatar-btn:hover{border-color:var(--accent);color:var(--accent)}.user-dropdown{display:none;position:absolute;top:calc(100% + 8px);right:0;width:220px;background:#fff;border:1px solid var(--border-light);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);overflow:hidden;z-index:200}.user-dropdown.open{display:block}.dropdown-header{padding:12px 14px}.dropdown-name{display:block;font-weight:600;font-size:.8125rem}.dropdown-email{display:block;font-size:.6875rem;color:var(--text-caption);margin-top:2px}.dropdown-divider{height:1px;background:var(--border-light)}.dropdown-item{display:block;width:100%;padding:9px 14px;font-size:.8125rem;color:var(--text-secondary);text-align:left;transition:background var(--transition)}.dropdown-item:hover{background:var(--bg-tertiary)}.btn-login{padding:5px 14px;font-size:.8125rem;font-weight:500;color:var(--text-secondary);border:1px solid var(--border);border-radius:var(--radius-full);transition:all var(--transition)}.btn-login:hover{color:var(--text-primary);border-color:var(--text-tertiary)}.hamburger-btn{padding:4px;color:var(--text-secondary);flex-shrink:0}.hero-section{padding:48px 20px 32px;text-align:center;background:var(--bg-primary)}.hero-inner{max-width:640px;margin:0 auto}.brand-area{margin-bottom:28px}.brand-logo-img{height:56px;margin:0 auto}.brand-description{font-size:.875rem;color:var(--text-tertiary);margin-top:8px;font-weight:400}.hero-examples{margin-top:16px;text-align:left;max-width:520px;margin-left:auto;margin-right:auto}.hero-example-row{display:flex;align-items:baseline;gap:8px;margin-bottom:6px;font-size:.8125rem;line-height:1.5}.hero-example-label{flex-shrink:0;font-weight:600;font-size:.75rem;color:var(--accent);white-space:nowrap}.example-chip{color:var(--text-tertiary);font-size:.8125rem;background:0 0;padding:0;transition:color var(--transition);text-align:left;cursor:pointer}.example-chip:hover{color:var(--accent)}.site-footer{padding:10px 8px;margin-top:auto}.footer-inner{max-width:var(--max-width);margin:0 auto;display:flex;align-items:center;justify-content:center;gap:10px}.footer-links{display:flex;align-items:center;gap:6px}.footer-links a{font-size:.625rem;font-weight:500;color:#888;transition:color var(--transition);cursor:pointer;white-space:nowrap}.footer-links a:hover{color:var(--text-primary)}.footer-dot{font-size:.5rem;color:#ccc}.footer-copyright{font-size:.5625rem;color:#aaa;white-space:nowrap}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 18px;font-size:.8125rem;font-weight:500;border-radius:var(--radius-sm);transition:all var(--transition);cursor:pointer}.btn-primary{background:var(--accent);color:#fff;border:none}.btn-primary:hover{background:var(--accent-hover)}.btn-secondary{background:var(--bg-tertiary);color:var(--text-secondary);border:1px solid var(--border)}.btn-secondary:hover{background:var(--border-light)}.error-page{display:flex;align-items:center;justify-content:center;min-height:70vh;padding:40px 24px}.error-content{text-align:center;max-width:420px}.error-illustration{position:relative;display:inline-block;margin-bottom:32px}.error-book{position:relative;display:inline-block;animation:errorBookFloat 3s ease-in-out infinite}@keyframes errorBookFloat{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-8px) rotate(0)}}.error-book-cover{position:relative;width:120px;height:160px;perspective:400px}.error-book-spine{position:absolute;left:0;top:0;bottom:0;width:14px;background:var(--accent);border-radius:3px 0 0 3px;box-shadow:inset -2px 0 4px rgba(0,0,0,.15)}.error-book-front{position:absolute;left:10px;top:0;right:0;bottom:0;background:linear-gradient(135deg,var(--accent-light) 0,#fff 100%);border:2px solid var(--accent);border-radius:0 6px 6px 0;display:flex;align-items:center;justify-content:center;transform:rotateY(-8deg);transform-origin:left center;box-shadow:4px 4px 12px rgba(0,0,0,.1)}.error-book-code{font-size:2rem;font-weight:900;color:var(--accent);letter-spacing:2px;opacity:.7}.error-book-shadow{width:100px;height:12px;margin:8px auto 0;background:radial-gradient(ellipse,rgba(0,0,0,.08) 0,transparent 70%);animation:errorShadowPulse 3s ease-in-out infinite}@keyframes errorShadowPulse{0%,100%{transform:scaleX(1);opacity:1}50%{transform:scaleX(.85);opacity:.6}}.error-magnifier{position:absolute;right:-20px;top:-10px;animation:errorSearchBounce 2s ease-in-out infinite .5s}@keyframes errorSearchBounce{0%,100%{transform:translate(0,0) rotate(0)}25%{transform:translate(5px,-3px) rotate(5deg)}75%{transform:translate(-3px,2px) rotate(-3deg)}}.error-title{font-size:1.25rem;font-weight:700;color:var(--text-primary);margin-bottom:8px;line-height:1.5}.error-subtitle{font-size:.875rem;color:var(--text-secondary);line-height:1.7;margin-bottom:28px}.error-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.error-btn{padding:11px 24px;font-size:.8125rem;font-weight:600;border-radius:var(--radius-full);text-decoration:none;transition:all var(--transition);cursor:pointer}.error-btn.primary{background:var(--accent);color:#fff;border:none}.error-btn.primary:hover{opacity:.9}.error-btn.secondary{background:#fff;color:var(--accent);border:1.5px solid var(--accent)}.error-btn.secondary:hover{background:var(--accent-light)}.skeleton-row{display:flex;gap:14px;overflow:hidden}.skeleton-card{flex:0 0 130px;height:180px;background:linear-gradient(110deg,#f0f0f0 30%,#fafafa 50%,#f0f0f0 70%);background-size:200% 100%;border-radius:var(--radius-sm);animation:skeleton-shimmer 1.5s ease-in-out infinite}.skeleton-list{display:flex;flex-direction:column;gap:10px}.skeleton-item{height:56px;background:linear-gradient(110deg,#f0f0f0 30%,#fafafa 50%,#f0f0f0 70%);background-size:200% 100%;border-radius:var(--radius-sm);animation:skeleton-shimmer 1.5s ease-in-out infinite}@keyframes skeleton-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}.stats-section{border-top:1px solid var(--border-light);padding:32px 20px 24px}.stats-header{text-align:center;margin-bottom:20px}.stats-title{font-size:.9375rem;font-weight:600;color:var(--text-primary)}.stats-subtitle{font-size:.6875rem;color:#bdbdbd;margin-top:4px}.stats-table{display:flex;gap:0;max-width:600px;margin:0 auto}.stats-col{flex:1}.stats-divider{width:1px;background:var(--border-light);margin:0 16px}.stats-row{display:flex;align-items:center;justify-content:space-between;padding:11px 16px;border-bottom:1px solid #f0f0f0}.stats-row:last-child{border-bottom:none}.stats-label{font-size:.75rem;color:#bdbdbd}.stats-value-wrap{display:flex;align-items:baseline;gap:3px}.stats-val{font-size:.9375rem;font-weight:600;color:#bdbdbd}.stats-unit{font-size:.625rem;color:#d5d5d5}.stats-row.highlighted .stats-val{font-weight:700;color:#9e9e9e;font-size:1rem}@media (max-width:768px){.stats-table{flex-direction:column}.stats-divider{width:100%;height:1px;margin:8px 0}.stats-row{padding:9px 8px}}.mobile-nav-overlay{display:none;position:fixed;inset:0;z-index:300}.mobile-nav-overlay.open{display:block}.mobile-nav-content{position:absolute;top:calc(var(--header-height) + 4px);left:12px;width:220px;background:#fff;border:1px solid var(--border-light);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);overflow:hidden}.mobile-nav-close{display:none}.mobile-nav-links{display:flex;flex-direction:column;gap:0;margin:0}.mobile-nav-link{display:flex;align-items:center;gap:8px;padding:9px 14px;font-size:.8125rem;font-weight:500;color:var(--text-secondary);text-decoration:none;text-align:left;width:100%;transition:background var(--transition)}.mobile-nav-link svg{color:var(--text-caption);flex-shrink:0}.mobile-nav-link:hover{background:var(--bg-tertiary)}#toast-container{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:400;display:flex;flex-direction:column;gap:8px;align-items:center}.toast{padding:10px 20px;background:var(--text-primary);color:#fff;border-radius:var(--radius-full);font-size:.8125rem;box-shadow:var(--shadow-lg);white-space:nowrap}.desktop-only{display:flex}.mobile-only{display:none}.home-fun-banner-section{padding:16px 20px}.home-fun-banner-section .section-inner{padding-top:0;padding-bottom:0}.home-fun-banner{position:relative;display:flex;align-items:center;gap:16px;padding:22px 24px;background:radial-gradient(circle at 92% 20%,color-mix(in srgb,var(--accent) 14%,transparent),transparent 55%),linear-gradient(135deg,color-mix(in srgb,var(--accent) 5%,var(--bg-primary)) 0,var(--bg-primary) 75%);border:1px solid color-mix(in srgb,var(--accent) 22%,var(--border));border-radius:var(--radius-md);text-decoration:none;color:inherit;overflow:hidden;transition:transform 150ms ease,border-color 150ms ease,background 150ms ease}.home-fun-banner:hover{border-color:color-mix(in srgb,var(--accent) 38%,var(--border));transform:translateY(-1px)}.home-fun-banner-text{flex:1;min-width:0;position:relative;z-index:1}.home-fun-banner-eyebrow{display:inline-block;padding:3px 9px;margin-bottom:7px;font-size:.6875rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);background:var(--accent-light);border-radius:var(--radius-full)}.home-fun-banner-title{margin:0 0 3px 0;font-size:1.125rem;font-weight:700;letter-spacing:-.01em;color:var(--text-primary)}.home-fun-banner-desc{margin:0;font-size:.875rem;color:var(--text-secondary)}.home-fun-banner-art{position:relative;flex-shrink:0;width:120px;height:84px;pointer-events:none}.home-fun-banner-art .dot{position:absolute;border-radius:50%;background:var(--accent);transition:transform 220ms ease}.home-fun-banner-art .dot-1{top:12px;left:4px;width:26px;height:26px;opacity:.16}.home-fun-banner-art .dot-2{top:44px;left:30px;width:14px;height:14px;opacity:.42}.home-fun-banner-art .dot-3{top:6px;left:60px;width:10px;height:10px;opacity:.6}.home-fun-banner-art .dot-4{top:52px;left:66px;width:30px;height:30px;opacity:.14}.home-fun-banner-art .dot-5{top:26px;left:94px;width:12px;height:12px;opacity:.5}.home-fun-banner:hover .dot-1{transform:translate(-2px,-2px)}.home-fun-banner:hover .dot-2{transform:translate(2px,-3px)}.home-fun-banner:hover .dot-3{transform:translate(0,3px)}.home-fun-banner:hover .dot-4{transform:translate(3px,1px)}.home-fun-banner:hover .dot-5{transform:translate(-2px,-1px)}.home-fun-banner-arrow{flex-shrink:0;width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent);transition:background 150ms ease,transform 150ms ease}.home-fun-banner:hover .home-fun-banner-arrow{background:color-mix(in srgb,var(--accent) 22%,transparent);transform:translateX(2px)}@media (max-width:540px){.home-fun-banner{padding:18px 18px;gap:12px}.home-fun-banner-art{display:none}.home-fun-banner-title{font-size:1rem}.home-fun-banner-desc{font-size:.8125rem}}