:root{--bg-primary:#0a0a0f;--bg-secondary:#141420;--bg-card:#1a1a2e;--bg-card-hover:#1e1e32;--border-primary:#1e1e2e;--border-hover:#2a2a40;--border-active:rgba(0,212,255,.3);--text-primary:#e0e0e0;--text-secondary:#a0a0a0;--text-muted:#707070;--text-link:#00d4ff;--color-cyan:#00d4ff;--color-green:#0f8;--color-pink:#f36;--color-purple:#7c3aed;--color-orange:#ff8c00;--color-red:#f44;--media-hype:#00d4ff;--media-swipe:#7c3aed;--media-interactive:#0f8;--media-photo:#ff8c00;--media-video:#f44;--gradient-primary:linear-gradient(135deg,#00d4ff,#7c3aed);--gradient-secondary:linear-gradient(135deg,#f36,#ff8c00);--shadow-card:0 4px 20px rgba(0,0,0,.3);--shadow-card-hover:0 8px 30px rgba(0,0,0,.4);--shadow-glow-cyan:0 0 20px rgba(0,212,255,.2);--shadow-glow-green:0 0 20px rgba(0,255,136,.2);--spacing-xs:4px;--spacing-sm:8px;--spacing-md:16px;--spacing-lg:24px;--spacing-xl:32px;--font-sans:"Inter","Noto Sans KR",system-ui,-apple-system,sans-serif;--font-mono:"JetBrains Mono","Fira Code",monospace;--radius-sm:6px;--radius-md:12px;--radius-lg:16px;--radius-full:9999px;--sidebar-width:240px;--sidebar-collapsed-width:72px;--header-height:64px}*,:after,:before{box-sizing:border-box;margin:0;padding:0}body,html{height:100%;scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{background:var(--bg-primary);color:var(--text-primary);font-family:var(--font-sans);line-height:1.6;overflow-x:hidden}a{color:inherit;text-decoration:none}img,video{max-width:100%;height:auto;display:block}button{cursor:pointer;background:none}button,input,textarea{font-family:inherit;border:none}input,textarea{outline:none}ol,ul{list-style:none}.app-layout{display:flex;min-height:100vh}.sidebar{width:var(--sidebar-width);background:var(--bg-secondary);border-right:1px solid var(--border-primary);display:flex;flex-direction:column;position:fixed;top:0;left:0;height:100vh;z-index:100;transition:width .3s ease}.sidebar-header{padding:var(--spacing-lg);border-bottom:1px solid var(--border-primary)}.sidebar-logo{display:flex;align-items:center;gap:var(--spacing-sm)}.sidebar-logo .logo-icon{width:32px;height:32px;background:var(--gradient-primary);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--bg-primary)}.sidebar-logo .logo-text{font-size:18px;font-weight:700;color:var(--text-primary)}.sidebar-nav{flex:1 1;flex-direction:column;gap:var(--spacing-xs)}.nav-item,.sidebar-nav{padding:var(--spacing-md);display:flex}.nav-item{align-items:center;gap:var(--spacing-md);border-radius:var(--radius-md);color:var(--text-secondary);transition:all .2s ease;font-size:15px}.nav-item:hover{background:hsla(0,0%,100%,.05);color:var(--text-primary)}.nav-item.active{background:rgba(0,212,255,.1);color:var(--color-cyan)}.nav-item-icon{width:20px;height:20px;display:flex;align-items:center;justify-content:center}.nav-item-label{flex:1 1}.nav-item-badge{background:var(--color-pink);color:#fff;font-size:11px;padding:2px 6px;border-radius:var(--radius-full);font-weight:600}.sidebar-footer{padding:var(--spacing-md);border-top:1px solid var(--border-primary)}.main-content{flex:1 1;margin-left:var(--sidebar-width);min-height:100vh;display:flex;flex-direction:column}.header{height:var(--header-height);background:rgba(10,10,15,.8);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--border-primary);display:flex;align-items:center;padding:0 var(--spacing-lg);position:-webkit-sticky;position:sticky;top:0;z-index:50}.header-tabs{display:flex;gap:var(--spacing-sm);margin-right:auto}.header-tab{padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-full);font-size:14px;font-weight:500;color:var(--text-secondary);transition:all .2s ease;cursor:pointer}.header-tab:hover{color:var(--text-primary);background:hsla(0,0%,100%,.05)}.header-tab.active{background:var(--color-cyan);color:var(--bg-primary);font-weight:600}.header-search{display:flex;align-items:center;gap:var(--spacing-sm);background:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-full);padding:var(--spacing-sm) var(--spacing-md);margin-left:auto}.header-search input{background:transparent;color:var(--text-primary);width:200px;font-size:14px}.header-search input::placeholder{color:var(--text-muted)}.header-actions{gap:var(--spacing-md);margin-left:var(--spacing-lg)}.header-actions,.header-icon{display:flex;align-items:center}.header-icon{width:40px;height:40px;border-radius:var(--radius-full);justify-content:center;color:var(--text-secondary);transition:all .2s ease}.header-icon:hover{background:hsla(0,0%,100%,.05);color:var(--text-primary)}.header-avatar{width:36px;height:36px;border-radius:var(--radius-full);background:var(--gradient-primary);display:flex;align-items:center;justify-content:center;font-weight:600;color:#fff;font-size:14px}.page-content{flex:1 1;padding:var(--spacing-lg);display:flex;gap:var(--spacing-lg)}.feed-main{flex:1 1;max-width:800px}.feed-sidebar{width:300px;flex-shrink:0}.content-card{background:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-lg);overflow:hidden;transition:all .3s ease;margin-bottom:var(--spacing-lg)}.content-card:hover{border-color:var(--border-hover);box-shadow:var(--shadow-card-hover);transform:translateY(-2px)}.content-card-thumbnail{width:100%;aspect-ratio:16/9;background:var(--bg-secondary);position:relative;overflow:hidden}.content-card-thumbnail img{width:100%;height:100%;object-fit:cover}.content-card-badge{position:absolute;top:var(--spacing-sm);left:var(--spacing-sm);padding:4px 10px;border-radius:var(--radius-sm);font-size:11px;font-weight:600;text-transform:uppercase}.content-card-badge.hype{background:rgba(0,212,255,.2);color:var(--media-hype)}.content-card-badge.swipe{background:rgba(124,58,237,.2);color:var(--media-swipe)}.content-card-badge.interactive{background:rgba(0,255,136,.2);color:var(--media-interactive)}.content-card-badge.photo{background:rgba(255,140,0,.2);color:var(--media-photo)}.content-card-badge.video{background:rgba(255,68,68,.2);color:var(--media-video)}.content-card-body{padding:var(--spacing-md)}.content-card-title{font-size:16px;font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-sm);line-height:1.4}.content-card-author{display:flex;align-items:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-md)}.content-card-author-avatar{width:24px;height:24px;border-radius:var(--radius-full);background:var(--gradient-secondary);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;color:#fff}.content-card-author-name{font-size:13px;color:var(--text-secondary)}.content-card-stats{display:flex;gap:var(--spacing-md);font-size:13px;color:var(--text-muted)}.content-card-stat{display:flex;align-items:center;gap:var(--spacing-xs)}.content-card-tags{display:flex;flex-wrap:wrap;gap:var(--spacing-sm);margin-top:var(--spacing-md)}.content-tag{padding:4px 8px;background:hsla(0,0%,100%,.05);border-radius:var(--radius-sm);font-size:12px;color:var(--text-secondary)}.feed-tabs{display:flex;gap:var(--spacing-sm);margin-bottom:var(--spacing-lg)}.feed-tab{padding:8px 20px;border:1px solid var(--border-primary);border-radius:var(--radius-full);background:transparent;color:var(--text-secondary);font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;font-family:var(--font-sans)}.feed-tab:hover{border-color:var(--border-hover);color:var(--text-primary)}.feed-tab.active{background:var(--color-cyan);border-color:var(--color-cyan);color:#000;font-weight:600}.feed-grid{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:var(--spacing-lg);gap:var(--spacing-lg)}.feed-grid .content-card{margin-bottom:0}.feed-empty{text-align:center;padding:var(--spacing-xl) 0;color:var(--text-muted);font-size:15px}.content-card-thumbnail-placeholder{width:100%;height:100%;background:linear-gradient(135deg,#1a1a2e,#2a2a40);display:flex;align-items:center;justify-content:center;font-size:48px}.content-card-actions{margin-top:var(--spacing-sm)}.like-btn{background:none;border:none;cursor:pointer;font-size:inherit;color:inherit;padding:0;font-family:var(--font-sans);transition:transform .15s ease}.like-btn:hover{transform:scale(1.1)}.like-btn.liked{color:var(--color-pink)}.game-item-rank{font-size:14px;font-weight:700;color:var(--color-cyan);width:20px;text-align:center;flex-shrink:0}.sidebar-widget{background:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-lg);padding:var(--spacing-md);margin-bottom:var(--spacing-lg)}.sidebar-widget-title{font-size:16px;font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-md);display:flex;align-items:center;gap:var(--spacing-sm)}.sidebar-widget-title:before{content:"";width:4px;height:16px;background:var(--gradient-primary);border-radius:2px}.game-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-sm);border-radius:var(--radius-md);transition:background .2s ease}.game-item:hover{background:hsla(0,0%,100%,.05)}.game-item-icon{width:40px;height:40px;border-radius:var(--radius-sm);background:var(--bg-secondary);display:flex;align-items:center;justify-content:center;font-size:18px}.game-item-info{flex:1 1;min-width:0}.game-item-name{font-size:14px;font-weight:500;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.game-item-players{font-size:12px;color:var(--text-muted)}.popular-item{display:flex;gap:var(--spacing-md);padding:var(--spacing-sm) 0;border-bottom:1px solid var(--border-primary)}.popular-item:last-child{border-bottom:none}.popular-item-rank{font-size:14px;font-weight:700;color:var(--color-cyan);width:24px}.popular-item-info{flex:1 1}.popular-item-title{font-size:14px;color:var(--text-primary);margin-bottom:2px}.popular-item-meta{font-size:12px;color:var(--text-muted)}.swipe-feed{display:flex;flex-direction:column;gap:var(--spacing-md);max-width:400px;margin:0 auto}.swipe-card{background:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-lg);overflow:hidden;aspect-ratio:9/16;position:relative}.swipe-card-video{width:100%;height:100%;background:var(--bg-secondary);display:flex;align-items:center;justify-content:center}.swipe-card-overlay{position:absolute;bottom:0;left:0;right:0;padding:var(--spacing-lg);background:linear-gradient(transparent,rgba(0,0,0,.8))}.swipe-card-title{font-size:16px;font-weight:600;color:#fff;margin-bottom:var(--spacing-sm)}.swipe-card-author{display:flex;align-items:center;gap:var(--spacing-sm);color:hsla(0,0%,100%,.8);font-size:13px}.swipe-card-actions{position:absolute;right:var(--spacing-md);bottom:var(--spacing-lg);gap:var(--spacing-lg)}.swipe-action,.swipe-card-actions{display:flex;flex-direction:column}.swipe-action{align-items:center;gap:4px;color:#fff;font-size:12px}.swipe-action-icon{width:44px;height:44px;border-radius:var(--radius-full);background:hsla(0,0%,100%,.1);display:flex;align-items:center;justify-content:center;font-size:20px;transition:background .2s ease}.swipe-action-icon:hover{background:hsla(0,0%,100%,.2)}.jump-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));grid-gap:var(--spacing-lg);gap:var(--spacing-lg)}.jump-card{background:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-lg);overflow:hidden;transition:all .3s ease}.jump-card:hover{border-color:var(--border-hover);box-shadow:var(--shadow-card-hover);transform:translateY(-2px)}.jump-card-thumbnail{width:100%;aspect-ratio:16/10;background:var(--bg-secondary);position:relative}.jump-card-status{position:absolute;top:var(--spacing-sm);right:var(--spacing-sm);padding:4px 10px;border-radius:var(--radius-sm);font-size:11px;font-weight:600;background:rgba(0,255,136,.2);color:var(--color-green)}.jump-card-body{padding:var(--spacing-md)}.jump-card-title{font-size:16px;font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-sm)}.jump-card-desc{font-size:13px;color:var(--text-secondary);margin-bottom:var(--spacing-md);line-height:1.5}.jump-card-footer{display:flex;align-items:center;justify-content:space-between}.jump-card-play{padding:var(--spacing-sm) var(--spacing-md);background:var(--color-green);color:var(--bg-primary);border-radius:var(--radius-sm);font-size:13px;font-weight:600;transition:opacity .2s ease}.jump-card-play:hover{opacity:.9}.jump-card-stats{font-size:12px;color:var(--text-muted)}.profile-header{display:flex;gap:var(--spacing-xl);padding:var(--spacing-xl);background:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-lg);margin-bottom:var(--spacing-lg)}.profile-avatar{width:120px;height:120px;border-radius:var(--radius-full);background:var(--gradient-primary);display:flex;align-items:center;justify-content:center;font-size:48px;font-weight:700;color:#fff;flex-shrink:0}.profile-info{flex:1 1}.profile-name{font-size:24px;font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-sm)}.profile-username{font-size:14px;color:var(--text-muted)}.profile-bio,.profile-username{margin-bottom:var(--spacing-md)}.profile-bio{font-size:15px;color:var(--text-secondary);line-height:1.6}.profile-stats{display:flex;gap:var(--spacing-xl)}.profile-stat{text-align:center}.profile-stat-value{font-size:20px;font-weight:700;color:var(--text-primary)}.profile-stat-label{font-size:13px;color:var(--text-muted)}.profile-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));grid-gap:var(--spacing-md);gap:var(--spacing-md)}.notification-list{display:flex;flex-direction:column;gap:var(--spacing-sm)}.notification-item{display:flex;gap:var(--spacing-md);padding:var(--spacing-md);background:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-md);transition:background .2s ease}.notification-item:hover{background:var(--bg-card-hover)}.notification-item.unread{border-left:3px solid var(--color-cyan)}.notification-avatar{width:40px;height:40px;border-radius:var(--radius-full);background:var(--gradient-secondary);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;color:#fff;flex-shrink:0}.notification-content{flex:1 1}.notification-text{font-size:14px;color:var(--text-primary);margin-bottom:4px}.notification-text strong{font-weight:600}.notification-time{font-size:12px;color:var(--text-muted)}.content-detail{max-width:800px;margin:0 auto}.content-detail-header{margin-bottom:var(--spacing-lg)}.content-detail-title{font-size:28px;font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-md)}.content-detail-meta{display:flex;align-items:center;gap:var(--spacing-md);font-size:14px;color:var(--text-secondary)}.content-detail-viewer{width:100%;aspect-ratio:16/9;background:var(--bg-secondary);border-radius:var(--radius-lg);margin-bottom:var(--spacing-lg);display:flex;align-items:center;justify-content:center;font-size:48px}.content-detail-body{font-size:16px;line-height:1.8;color:var(--text-primary);margin-bottom:var(--spacing-xl)}.content-detail-tags{display:flex;flex-wrap:wrap;gap:var(--spacing-sm);margin-bottom:var(--spacing-xl)}.comments-section{border-top:1px solid var(--border-primary);padding-top:var(--spacing-lg)}.comments-title{font-size:18px;font-weight:600;color:var(--text-primary)}.comment-input,.comments-title{margin-bottom:var(--spacing-lg)}.comment-input{display:flex;gap:var(--spacing-md)}.comment-input textarea{flex:1 1;background:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-md);padding:var(--spacing-md);color:var(--text-primary);resize:none;min-height:80px}.comment-input textarea:focus{border-color:var(--color-cyan)}.comment-list{flex-direction:column}.comment-item,.comment-list{display:flex;gap:var(--spacing-md)}.comment-avatar{width:36px;height:36px;border-radius:var(--radius-full);background:var(--gradient-primary);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;color:#fff;flex-shrink:0}.comment-body{flex:1 1}.comment-header{display:flex;align-items:center;gap:var(--spacing-sm);margin-bottom:4px}.comment-author{font-size:14px;font-weight:600;color:var(--text-primary)}.comment-time{font-size:12px;color:var(--text-muted)}.comment-text{font-size:14px;color:var(--text-secondary);line-height:1.6}@media (max-width:1024px){.sidebar{width:var(--sidebar-collapsed-width)}.sidebar .logo-text,.sidebar .nav-item-label{display:none}.main-content{margin-left:var(--sidebar-collapsed-width)}.feed-sidebar{display:none}.feed-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.sidebar{display:none}.main-content{margin-left:0}.header-tabs{display:none}.page-content{padding:var(--spacing-md)}.feed-grid{grid-template-columns:1fr}.feed-tabs{overflow-x:auto;-webkit-overflow-scrolling:touch}.profile-header{flex-direction:column;align-items:center;text-align:center}.profile-stats{justify-content:center}}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-sm{gap:var(--spacing-sm)}.gap-md{gap:var(--spacing-md)}.gap-lg{gap:var(--spacing-lg)}.mt-sm{margin-top:var(--spacing-sm)}.mt-md{margin-top:var(--spacing-md)}.mt-lg{margin-top:var(--spacing-lg)}.mb-sm{margin-bottom:var(--spacing-sm)}.mb-md{margin-bottom:var(--spacing-md)}.mb-lg{margin-bottom:var(--spacing-lg)}.font-bold{font-weight:700}.font-medium{font-weight:500}.text-primary{color:var(--text-primary)}.text-secondary{color:var(--text-secondary)}.text-muted{color:var(--text-muted)}.text-cyan{color:var(--color-cyan)}.text-green{color:var(--color-green)}.text-pink{color:var(--color-pink)}.hidden{display:none}.visible{visibility:visible}.invisible{visibility:hidden}