:root{--font-title: "HSSanTokki2", sans-serif;--font-body: "Paperlogy", "Noto Sans KR", sans-serif;--font-special: "PyeongChang Peace", sans-serif;--font-logo: "Cafe24 PRO UP", sans-serif;--font-button: "Gmarket Sans", sans-serif;--primary: #7C3AED;--primary-dark: #6D28D9;--primary-light: #A78BFA;--secondary: #EC4899;--accent: #10B981;--accent-lime: #A3E635;--gray-50: #F9FAFB;--gray-100: #F3F4F6;--gray-200: #E5E7EB;--gray-300: #D1D5DB;--gray-400: #9CA3AF;--gray-500: #6B7280;--gray-600: #4B5563;--gray-700: #374151;--gray-800: #1F2937;--gray-900: #111827;--alpaca-light: #FFE5B4;--alpaca-dark: #DEB887;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .1);--shadow-xl: 0 20px 25px rgba(0, 0, 0, .15);--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: 1rem;--radius-xl: 1.5rem;--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--space-2xl: 3rem;--transition-fast: .15s ease-in-out;--transition-base: .25s ease-in-out;--transition-slow: .35s ease-in-out}@font-face{font-family:Paperlogy-5;src:url(/fonts/Paperlogy-5Medium.ttf) format("truetype");font-weight:500 700;font-style:normal;font-display:swap}@font-face{font-family:HSSanTokki2;src:url("/fonts/HSSanTokki2.0(2024).ttf") format("truetype");font-weight:300 700;font-style:normal;font-display:swap}*{margin:0;padding:0;box-sizing:border-box}:root{--header-height: 80px}@font-face{font-family:Gmarket Sans TTF;src:url(/assets/GmarketSansTTFBold-CX19kcqA.ttf) format("truetype");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:HSSanTokki2;src:url("/assets/HSSanTokki2.0(2024)-D5jTyhMF.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Paperlogy-5;src:url(/assets/Paperlogy-5Medium-D0pf9AtY.ttf) format("truetype");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:Paperlogy-6;src:url(/assets/Paperlogy-6SemiBold-Bgpe6yyI.ttf) format("truetype");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:Paperlogy-7;src:url(/assets/Paperlogy-7Bold-C_MikIAt.ttf) format("truetype");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:Paperlogy-4;src:url(/assets/Paperlogy-4Regular-Bxwq9xuH.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:PyeongChangPeace-Light;src:url(/assets/PyeongChangPeace-Light-C5S0iZFv.ttf) format("truetype");font-weight:300;font-style:normal;font-display:swap}@font-face{font-family:PyeongChangPeace-Bold;src:url(/assets/PyeongChangPeace-Bold-Dl-Bcd5s.ttf) format("truetype");font-weight:700;font-style:normal;font-display:swap}html,body{margin:0;padding:0;width:100%;overflow-x:hidden}body{background:#7c3aed;color:#fff}button{border:none;background:none;cursor:pointer}a{text-decoration:none;color:inherit}.header{position:fixed;top:0;left:0;right:0;width:100%;height:var(--header-height);background:#3a1c6e;z-index:100;margin:0;padding:0}.header-inner{width:100%;height:100%;margin:0;padding:0 40px;display:flex;align-items:center;justify-content:space-between;box-sizing:border-box}.logo{display:flex;align-items:center}.logo-circle{width:70px;height:70px;background:#00000080;border-radius:50%;display:flex;align-items:center;justify-content:center;overflow:hidden}.logo-image{width:59px;height:80px;object-fit:contain}.header-actions{display:flex;align-items:center;gap:20px}.btn-signup{width:149px;height:46px;background:#000;color:#fff;border-radius:50px;font-family:Gmarket Sans TTF,Gmarket Sans,sans-serif;font-size:24px;font-weight:700;cursor:pointer;transition:all .3s ease;border:none}.btn-signup:hover{background:#1a1a1a;transform:translateY(-2px)}.btn-login{width:122px;height:46px;background:#fff;color:#000;border-radius:50px;font-family:Gmarket Sans TTF,Gmarket Sans,sans-serif;font-size:24px;font-weight:700;cursor:pointer;transition:all .3s ease;border:none}.btn-login:hover{background:#f0f0f0;transform:translateY(-2px)}.btn-menu{width:50px;height:50px;background:transparent;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:0;cursor:pointer;margin-left:20px;border:none}.menu-line{width:32px;height:4px;background:#fff;border-radius:3px;transition:all .3s ease}.btn-menu:hover .menu-line{background:#a3e635}.main-content{padding-top:var(--header-height);max-width:1440px;margin:0 auto;padding-left:49px;padding-right:49px}.side-menu{position:fixed;top:0;right:0;bottom:0;z-index:200;pointer-events:none}.side-menu.active{pointer-events:auto}.side-menu-overlay{position:fixed;inset:0;background:#00000080;opacity:0;transition:opacity .3s ease}.side-menu.active .side-menu-overlay{opacity:1}.side-menu-content{position:absolute;top:0;right:0;bottom:0;width:400px;background:#3a1c6e;transform:translate(100%);transition:transform .3s ease;padding:40px;overflow-y:auto}.side-menu.active .side-menu-content{transform:translate(0)}.side-menu-close{position:absolute;top:20px;right:20px;width:40px;height:40px;background:transparent;color:#fff;font-size:32px;cursor:pointer;border:none}.side-menu-nav{margin-top:80px;display:flex;flex-direction:column;gap:20px}.side-menu-link{color:#fff;font-family:Paperlogy,sans-serif;font-size:24px;padding:20px;border-radius:10px;transition:background .3s ease}.side-menu-link:hover{background:#ffffff1a}@media(max-width:768px){.header-inner{padding:0 20px}.btn-signup{width:100px;font-size:18px}.btn-login{width:90px;font-size:18px}.main-content{padding-left:20px;padding-right:20px}.side-menu-content{width:300px}}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.skip-nav{position:absolute;top:-100%;left:0;background:#7c3aed;color:#fff;padding:8px 16px;z-index:10000;font-size:14px;text-decoration:none;border-radius:0 0 4px}.skip-nav:focus{top:0}.link-button{background:none;border:none;color:inherit;cursor:pointer;padding:0;font:inherit;text-decoration:underline}.link-button:hover{opacity:.8}.page-loader{display:flex;align-items:center;justify-content:center;min-height:100vh;background:#f8f9fa}.spinner{width:40px;height:40px;border:4px solid #e9ecef;border-top-color:#7c3aed;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.arcade-page{background-color:#7c3aed;min-height:100vh;padding:20px}.header-section{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.page-title{color:#fff;font-size:24px;font-weight:700}.category-dropdown{position:relative}.category-button{background-color:#fff;color:#000;border:none;border-radius:10px;padding:10px 20px;font-size:16px;cursor:pointer}.category-list{position:absolute;top:100%;left:0;background-color:#fff;border-radius:10px;padding:10px;display:none}.category-list.open{display:block}.category-item{padding:5px;cursor:pointer}.category-item:hover{background-color:#f0f0f0}.featured-section{background-color:#8b5cf6;padding:20px;border-radius:10px;margin-bottom:20px}.featured-title{color:#fff;font-size:20px;font-weight:700;margin-bottom:10px}.featured-description{color:#fff;font-size:16px;margin-bottom:10px}.featured-button{background-color:#fff;color:#8b5cf6;border:none;border-radius:10px;padding:10px 20px;font-size:16px;font-weight:700;cursor:pointer}.game-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.game-card{background-color:#fff;border-radius:10px;padding:20px;text-align:center;cursor:pointer}.game-image{width:100%;height:150px;object-fit:cover;border-radius:10px;margin-bottom:10px}.game-title{font-size:18px;font-weight:700;margin-bottom:5px}.game-creator{font-size:14px;color:#666}.toast-container{position:fixed;top:20px;right:20px;z-index:10000;display:flex;flex-direction:column;gap:8px;pointer-events:none}.toast{display:flex;align-items:center;gap:12px;min-width:260px;max-width:420px;padding:12px 16px;border-radius:8px;box-shadow:0 4px 12px #00000026;font-family:Paperlogy-5,sans-serif;font-size:14px;line-height:1.4;pointer-events:auto;animation:toast-slide-in .25s ease-out}@keyframes toast-slide-in{0%{opacity:0;transform:translate(40px)}to{opacity:1;transform:translate(0)}}.toast--info{background:#fff;color:#333;border-left:4px solid #4a90d9}.toast--success{background:#f0fdf4;color:#166534;border-left:4px solid #22c55e}.toast--error{background:#fef2f2;color:#991b1b;border-left:4px solid #ef4444}.toast--warning{background:#fffbeb;color:#92400e;border-left:4px solid #f59e0b}.toast__message{flex:1}.toast__close{flex-shrink:0;background:none;border:none;cursor:pointer;font-size:14px;color:inherit;opacity:.6;padding:0 4px;line-height:1}.toast__close:hover{opacity:1}.header{width:100%;height:var(--header-height, 40px);background:#3a1c6e;position:fixed;top:0;z-index:1000}.header-inner{height:100%;margin:0;padding:0 20px;display:flex;justify-content:space-between;align-items:center}.logo{display:flex;align-items:center;justify-content:center;cursor:pointer;margin-right:auto}.logo-image{height:20px;width:auto}.header .logo-image{height:25px!important;width:auto!important}.header-actions{display:flex;gap:16px;align-items:center}.btn-create-header{padding:8px 18px;background:transparent;color:#fff;border-radius:30px;font-family:"PyeongChangPeace-Bold",var(--font-button);font-size:16px;font-weight:500;cursor:pointer;border:2px solid rgba(255,255,255,.12);transition:all .3s ease}.btn-arcade-header{padding:8px 18px;background:transparent;color:#fff;border-radius:30px;font-family:"Gmarket Sans TTF",var(--font-button);font-size:16px;font-weight:500;cursor:pointer;border:2px solid rgba(255,255,255,.12);transition:all .3s ease}.btn-signup,.btn-login{padding:4px 20px;background:#fff;color:#3a1c6e;border:1px solid rgba(0,0,0,.06);border-radius:50px;font-family:"Gmarket Sans TTF",var(--font-button);font-size:14px;font-weight:700;cursor:pointer;transition:all .18s ease;min-width:0;width:auto}.btn-create-header:hover,.btn-arcade-header:hover{background:#ffffff1a}.btn-signup:hover,.btn-login:hover{background:#f0f0f0;transform:translateY(-2px)}.btn-create-header.active,.btn-arcade-header.active{background:#a3e635;color:#000;border-color:transparent}.mypage-btn{width:40px;height:40px;border-radius:50%;background:#fff;color:#3a1c6e;border:1px solid rgba(0,0,0,.06);display:flex;align-items:center;justify-content:center;font-size:20px;cursor:pointer;transition:all .3s ease;padding:0}.mypage-btn:hover{background:#f0f0f0;transform:translateY(-2px);box-shadow:0 4px 6px #0000001a}.error-boundary{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:2rem;text-align:center;background-color:#fafafa;font-family:Paperlogy-5,sans-serif}.error-boundary h2{font-size:1.5rem;color:#333;margin-bottom:1rem}.error-boundary p{font-size:1rem;color:#666;margin-bottom:1.5rem;max-width:480px;word-break:break-word}.error-boundary-actions{display:flex;gap:1rem}.error-boundary-actions button{padding:.625rem 1.25rem;border:none;border-radius:8px;font-size:.9rem;cursor:pointer;transition:opacity .2s}.error-boundary-actions button:first-child{background-color:#4a90d9;color:#fff}.error-boundary-actions button:last-child{background-color:#eee;color:#333}.error-boundary-actions button:hover{opacity:.85}.confirm-overlay{position:fixed;inset:0;z-index:10001;display:flex;align-items:center;justify-content:center;background:#0006}.confirm-dialog{background:#fff;border-radius:12px;padding:28px 32px 20px;min-width:320px;max-width:440px;box-shadow:0 8px 24px #0003;font-family:Paperlogy-5,sans-serif;animation:confirm-pop .2s ease-out}@keyframes confirm-pop{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}.confirm-message{font-size:15px;line-height:1.5;color:#333;margin:0 0 20px;white-space:pre-wrap}.confirm-actions{display:flex;justify-content:flex-end;gap:8px}.confirm-btn{padding:8px 20px;border-radius:6px;border:none;font-size:14px;font-family:Paperlogy-5,sans-serif;cursor:pointer;transition:opacity .15s}.confirm-btn:hover{opacity:.85}.confirm-btn--cancel{background:#e5e7eb;color:#333}.confirm-btn--ok{background:#4a90d9;color:#fff}
