:root{--bg: #F5F5F5;--bg-card: #FFFFFF;--bg-hover: #EFEFEF;--bg-input: #FFFFFF;--bg-danger: #FEF2F2;--text-primary: #1C1C1E;--text-secondary: #636366;--text-tertiary: #AEAEB2;--text-inverse: #FFFFFF;--accent: #E8740C;--accent-hover: #D06808;--accent-light: #FFF4EB;--accent-muted: #F0B88A;--green: #34A853;--green-light: #EBF5EE;--red: #D32F2F;--red-light: #FEF2F2;--border: #E0E0E0;--border-light: #EBEBEB;--border-focus: #E8740C;--border-input: #D6D6D6;--shadow-sm: 0 1px 2px rgba(0,0,0,.04);--shadow-md: 0 2px 8px rgba(0,0,0,.06);--shadow-lg: 0 4px 16px rgba(0,0,0,.08);--shadow-hover: 0 2px 12px rgba(0,0,0,.1);--font-body: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, sans-serif;--font-display: "DM Serif Display", Georgia, serif;--text-xs: .75rem;--text-sm: .8125rem;--text-base: .9375rem;--text-md: 1rem;--text-lg: 1.125rem;--text-xl: 1.375rem;--text-2xl: 1.75rem;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--radius-full: 100px;--ease: cubic-bezier(.25, .1, .25, 1);--duration: .2s}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}body{font-family:var(--font-body);background:var(--bg);color:var(--text-primary);line-height:1.6;min-height:100svh;max-height:100svh;overflow-y:auto}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer;border:none;background:none;font-size:inherit;color:inherit}input,textarea{font-family:inherit;font-size:inherit;color:inherit;outline:none;border:1px solid var(--border-input);background:var(--bg-input);transition:border-color var(--duration) var(--ease),box-shadow var(--duration) var(--ease)}input:focus,textarea:focus{border-color:var(--border-focus);box-shadow:0 0 0 3px #e8740c1f}ul{list-style:none}h1,h2,h3,h4{line-height:1.3;font-weight:650}hr{border:none;border-top:1px solid var(--border-light)}.app-container{max-width:800px;margin:0 auto;padding:0 24px;min-height:100svh;display:flex;flex-direction:column}.header{display:flex;align-items:center;justify-content:space-between;padding:20px 0;border-bottom:1px solid var(--border)}.header-brand{font-family:var(--font-display);font-size:1.5rem;letter-spacing:-.01em;color:var(--accent);transition:opacity var(--duration) var(--ease)}.header-brand:hover{opacity:.8}.header-nav{display:flex;align-items:center;gap:6px}.header-nav-link{padding:6px 14px;font-size:var(--text-sm);font-weight:500;color:var(--text-secondary);border-radius:var(--radius-full);transition:all var(--duration) var(--ease)}.header-nav-link:hover{color:var(--text-primary);background:var(--bg-hover)}.header-right{display:flex;align-items:center;gap:12px}.header-user{font-size:var(--text-sm);font-weight:500;color:var(--text-secondary);transition:color var(--duration) var(--ease)}.header-user:hover{color:var(--accent)}.header-logout{font-size:var(--text-xs);color:var(--text-tertiary);padding:4px 10px;border:1px solid var(--border);border-radius:var(--radius-full);transition:all var(--duration) var(--ease)}.header-logout:hover{border-color:var(--text-tertiary);color:var(--text-secondary)}.main-content{flex:1;padding:32px 0 64px}.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.page-title{font-size:var(--text-xl);font-weight:700;letter-spacing:-.02em}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-weight:550;border-radius:var(--radius-md);transition:all var(--duration) var(--ease);white-space:nowrap}.btn-primary{padding:9px 20px;font-size:var(--text-sm);background:var(--text-primary);color:var(--text-inverse)}.btn-primary:hover{background:#333;box-shadow:var(--shadow-md);transform:translateY(-1px)}.btn-accent{padding:9px 20px;font-size:var(--text-sm);background:var(--accent);color:var(--text-inverse)}.btn-accent:hover{background:var(--accent-hover);box-shadow:var(--shadow-md);transform:translateY(-1px)}.btn-outline{padding:9px 20px;font-size:var(--text-sm);border:1px solid var(--border);color:var(--text-secondary);background:var(--bg-card)}.btn-outline:hover{border-color:var(--text-tertiary);color:var(--text-primary)}.btn-ghost{padding:6px 12px;font-size:var(--text-xs);color:var(--text-tertiary);border-radius:var(--radius-sm)}.btn-ghost:hover{color:var(--text-secondary);background:var(--bg-hover)}.btn-danger{padding:9px 20px;font-size:var(--text-sm);background:var(--red);color:var(--text-inverse);border-radius:var(--radius-md)}.btn-danger:hover{background:#a83228}.btn-danger-outline{padding:9px 20px;font-size:var(--text-sm);border:1px solid var(--red);color:var(--red);background:var(--bg-card);border-radius:var(--radius-md)}.btn-danger-outline:hover{background:var(--red-light)}.btn:disabled{opacity:.4;cursor:not-allowed;transform:none!important;box-shadow:none!important}.btn-full{width:100%}.category-tabs{display:flex;gap:6px;margin-bottom:20px;flex-wrap:wrap}.category-tab{padding:6px 16px;font-size:var(--text-sm);font-weight:500;border-radius:var(--radius-full);border:1px solid var(--border);color:var(--text-secondary);background:var(--bg-card);transition:all var(--duration) var(--ease)}.category-tab:hover{border-color:var(--text-tertiary);color:var(--text-primary)}.category-tab.active{background:var(--text-primary);color:var(--text-inverse);border-color:var(--text-primary)}.post-list{background:var(--bg-card);border-radius:var(--radius-lg);border:1px solid var(--border-light);overflow:hidden;box-shadow:var(--shadow-sm)}.post-item{display:block;padding:16px 20px;border-bottom:1px solid var(--border-light);transition:background var(--duration) var(--ease)}.post-item:last-child{border-bottom:none}.post-item:hover{background:var(--bg-hover)}.post-item-title{font-size:var(--text-base);font-weight:550;color:var(--text-primary);margin-bottom:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.post-item-comment-count{color:var(--accent);font-size:var(--text-sm);font-weight:500;margin-left:6px}.post-item-meta{font-size:var(--text-xs);color:var(--text-tertiary);display:flex;align-items:center;gap:4px}.post-item-meta .sep{margin:0 3px;opacity:.5}.post-item-score{font-weight:600}.post-item-score.positive{color:var(--green)}.post-item-score.negative{color:var(--red)}.post-article{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:32px;box-shadow:var(--shadow-sm);margin-bottom:20px}.post-title{font-size:var(--text-2xl);font-weight:700;letter-spacing:-.03em;margin-bottom:12px;line-height:1.35}.post-meta{display:flex;justify-content:space-between;align-items:center;font-size:var(--text-sm);color:var(--text-tertiary);padding-bottom:24px;margin-bottom:24px;border-bottom:1px solid var(--border-light)}.post-body{font-size:var(--text-base);line-height:1.85;word-break:break-word;color:var(--text-primary)}.markdown-body h1,.markdown-body h2,.markdown-body h3,.markdown-body h4,.markdown-body h5,.markdown-body h6{margin-top:1.4em;margin-bottom:.6em;line-height:1.35}.markdown-body h1{font-size:1.5em}.markdown-body h2{font-size:1.3em}.markdown-body h3{font-size:1.15em}.markdown-body p{margin-bottom:.8em}.markdown-body ul,.markdown-body ol{margin-bottom:.8em;padding-left:1.6em}.markdown-body ul{list-style:disc}.markdown-body ol{list-style:decimal}.markdown-body li{margin-bottom:.3em}.markdown-body blockquote{border-left:3px solid var(--accent-muted);padding:4px 16px;margin:.8em 0;color:var(--text-secondary);background:var(--bg-hover);border-radius:0 var(--radius-sm) var(--radius-sm) 0}.markdown-body code{background:var(--bg-hover);padding:2px 6px;border-radius:4px;font-size:.875em;font-family:SF Mono,Fira Code,monospace}.markdown-body pre{background:var(--text-primary);color:var(--text-inverse);padding:16px;border-radius:var(--radius-md);overflow-x:auto;margin:.8em 0}.markdown-body pre code{background:none;padding:0;color:inherit}.markdown-body img{max-width:100%;border-radius:var(--radius-md);margin:.8em 0}.markdown-body a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}.markdown-body a:hover{color:var(--accent-hover)}.markdown-body hr{margin:1.5em 0}.markdown-body table{width:100%;border-collapse:collapse;margin:.8em 0;font-size:var(--text-sm)}.markdown-body th,.markdown-body td{border:1px solid var(--border);padding:8px 12px;text-align:left}.markdown-body th{background:var(--bg-hover);font-weight:600}.vote-bar{display:flex;align-items:center;gap:8px;padding-top:24px;margin-top:24px;border-top:1px solid var(--border-light)}.vote-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 16px;font-size:var(--text-sm);font-weight:550;border:1px solid var(--border);border-radius:var(--radius-full);background:var(--bg-card);color:var(--text-secondary);transition:all var(--duration) var(--ease)}.vote-btn:hover{border-color:var(--accent-muted);color:var(--accent);background:var(--accent-light)}.vote-btn .arrow{font-size:10px}.comments-section{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-sm)}.comments-title{font-size:var(--text-md);font-weight:650;margin-bottom:20px;display:flex;align-items:center;gap:8px}.comments-count{font-size:var(--text-sm);color:var(--text-tertiary);font-weight:500}.comment-item{padding:14px 0;border-bottom:1px solid var(--border-light)}.comment-item:last-of-type{border-bottom:none}.comment-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.comment-author{font-size:var(--text-sm);font-weight:600}.comment-date{color:var(--text-tertiary);font-weight:400;margin-left:8px;font-size:var(--text-xs)}.comment-body{font-size:var(--text-sm);line-height:1.65;color:var(--text-primary)}.comment-mention{color:var(--accent);font-weight:550}.comment-actions{display:flex;gap:4px}.comment-form{margin-top:20px;padding-top:20px;border-top:1px solid var(--border-light)}.comment-form-mention{display:flex;align-items:center;gap:8px;font-size:var(--text-xs);color:var(--accent);margin-bottom:10px;font-weight:550}.comment-form-row{display:flex;gap:8px}.comment-input{flex:1;padding:10px 14px;border-radius:var(--radius-md);font-size:var(--text-sm)}.card{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-sm)}.card-label{font-size:var(--text-xs);color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.05em;font-weight:600;margin-bottom:10px}.form-input{width:100%;padding:12px 14px;border-radius:var(--radius-md);font-size:var(--text-base)}.form-textarea{width:100%;padding:14px;border-radius:var(--radius-md);font-size:var(--text-base);line-height:1.75;resize:vertical}.form-error{font-size:var(--text-xs);color:var(--red);margin-top:6px}.form-help{font-size:var(--text-xs);color:var(--text-tertiary)}.back-link{display:inline-flex;align-items:center;gap:6px;font-size:var(--text-sm);color:var(--text-tertiary);margin-bottom:20px;font-weight:500;transition:color var(--duration) var(--ease)}.back-link:hover{color:var(--text-primary)}.back-link .arrow{transition:transform var(--duration) var(--ease)}.back-link:hover .arrow{transform:translate(-3px)}.login-container{max-width:380px;margin:80px auto;text-align:center}.login-title{font-family:var(--font-display);font-size:var(--text-2xl);color:var(--accent);margin-bottom:8px}.login-subtitle{color:var(--text-tertiary);font-size:var(--text-sm);margin-bottom:36px}.login-btn{width:100%;padding:14px 20px;font-size:var(--text-base);font-weight:550;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--bg-card);display:flex;align-items:center;justify-content:center;gap:10px;transition:all var(--duration) var(--ease);box-shadow:var(--shadow-sm)}.login-btn:hover{border-color:var(--text-tertiary);box-shadow:var(--shadow-md);transform:translateY(-1px)}.login-btn svg{width:20px;height:20px}.setup-container{max-width:420px;margin:60px auto}.setup-title{font-size:var(--text-xl);font-weight:700;margin-bottom:12px}.setup-desc{color:var(--text-secondary);font-size:var(--text-sm);line-height:1.7;margin-bottom:28px}.setup-input-row{display:flex;align-items:center;gap:6px;margin-bottom:8px}.setup-at{font-size:var(--text-lg);color:var(--text-tertiary);font-weight:600}.setup-rules{font-size:var(--text-xs);color:var(--text-tertiary);line-height:2;margin:4px 0 20px;padding-left:18px;list-style:disc}.setup-status{font-size:var(--text-xs);min-height:20px;margin-bottom:4px}.status-checking{color:var(--text-tertiary)}.status-available{color:var(--green);font-weight:550}.status-error{color:var(--red)}.mypage-container{max-width:520px;margin:0 auto}.mypage-name{font-size:var(--text-lg);font-weight:650}.mypage-email{font-size:var(--text-sm);color:var(--text-tertiary);margin-top:2px}.mypage-section{margin-bottom:20px}.danger-zone{border:1px solid #F5C6C0;background:var(--bg-danger);border-radius:var(--radius-lg);padding:24px}.danger-title{font-size:var(--text-base);font-weight:650;color:var(--red);margin-bottom:8px}.danger-desc{font-size:var(--text-sm);color:var(--text-secondary);line-height:1.65;margin-bottom:16px}.empty-state,.loading-state{text-align:center;padding:48px 20px;color:var(--text-tertiary);font-size:var(--text-sm)}.loading-state:after{content:"";display:inline-block;width:16px;height:16px;border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite;margin-left:8px;vertical-align:middle}@keyframes spin{to{transform:rotate(360deg)}}.write-container{max-width:720px;margin:0 auto}.write-title-input{width:100%;padding:16px 0;font-size:var(--text-xl);font-weight:650;border:none;border-bottom:2px solid var(--border-light);background:transparent;margin-bottom:16px;letter-spacing:-.02em}.write-title-input:focus{border-bottom-color:var(--accent);box-shadow:none}.write-title-input::placeholder{color:var(--text-tertiary)}.write-body-textarea{width:100%;padding:16px 0;font-size:var(--text-base);border:none;background:transparent;line-height:1.85;min-height:400px;resize:none}.write-body-textarea:focus{box-shadow:none}.write-body-textarea::placeholder{color:var(--text-tertiary)}.write-actions{display:flex;gap:10px;justify-content:flex-end;padding-top:20px;border-top:1px solid var(--border-light)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeInUp .35s var(--ease) both}.fade-in-delay-1{animation-delay:.05s}.fade-in-delay-2{animation-delay:.1s}.fade-in-delay-3{animation-delay:.15s}.notif-bell{position:relative;display:inline-flex;align-items:center;justify-content:center;padding:6px;color:var(--text-secondary);border-radius:var(--radius-sm);transition:all var(--duration) var(--ease)}.notif-bell:hover{color:var(--text-primary);background:var(--bg-hover)}.notif-badge{position:absolute;top:0;right:-2px;min-width:16px;height:16px;padding:0 4px;font-size:10px;font-weight:700;line-height:16px;text-align:center;color:var(--text-inverse);background:var(--accent);border-radius:var(--radius-full)}.hamburger{display:none;flex-direction:column;gap:5px;padding:8px;cursor:pointer}.hamburger-line{display:block;width:20px;height:2px;background:var(--text-primary);border-radius:2px;transition:all .25s var(--ease)}.hamburger-line.open:nth-child(1){transform:rotate(45deg) translate(4px,5px)}.hamburger-line.open:nth-child(2){opacity:0}.hamburger-line.open:nth-child(3){transform:rotate(-45deg) translate(4px,-5px)}.mobile-menu{position:fixed;inset:61px 0 0;background:#0000004d;z-index:100;animation:fadeIn .2s var(--ease)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.mobile-menu-nav{background:var(--bg-card);border-bottom:1px solid var(--border);padding:12px 20px;box-shadow:var(--shadow-lg)}.mobile-menu-link{display:block;padding:12px 4px;font-size:var(--text-base);font-weight:500;color:var(--text-primary);transition:color var(--duration) var(--ease)}.mobile-menu-link:hover{color:var(--accent)}.skill-grid{display:grid;gap:12px}.skill-card{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--shadow-sm);transition:box-shadow var(--duration) var(--ease),transform var(--duration) var(--ease)}.skill-card:hover{box-shadow:var(--shadow-hover);transform:translateY(-1px)}.skill-card-header{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:8px}.skill-card-category{font-size:var(--text-xs);color:var(--accent);font-weight:600;margin-bottom:4px}.skill-card-name{font-size:var(--text-base);font-weight:650;line-height:1.3}.skill-card-repo{font-size:.6875rem;color:var(--text-tertiary);font-family:SF Mono,Fira Code,monospace;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.skill-card-desc{font-size:var(--text-sm);color:var(--text-secondary);line-height:1.6;margin-bottom:12px}.skill-card-tags{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:12px}.skill-tag{font-size:11px;padding:2px 8px;border-radius:var(--radius-full);background:var(--bg-hover);color:var(--text-secondary);font-weight:500;transition:all var(--duration) var(--ease);border:1px solid transparent}.skill-tag:hover,.skill-tag.active{background:var(--accent-light);color:var(--accent);border-color:var(--accent-muted)}.skill-card-platforms{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:12px}.skill-platform-badge{font-size:10px;padding:2px 8px;border-radius:var(--radius-full);background:var(--accent-light);color:var(--accent);font-weight:600;border:1px solid var(--accent-muted)}.skill-card-link{display:inline-flex;align-items:center;gap:5px;font-size:var(--text-xs);color:var(--accent);font-weight:550;transition:opacity var(--duration) var(--ease)}.skill-card-link:hover{opacity:.7}.skill-bookmark-btn{padding:4px;color:var(--text-tertiary);border-radius:var(--radius-sm);transition:all var(--duration) var(--ease);flex-shrink:0}.skill-bookmark-btn:hover{color:var(--accent);background:var(--accent-light)}.skill-guide{max-width:680px}.skill-guide-section{margin-bottom:28px}.skill-guide-section h2{font-size:var(--text-base);font-weight:650;margin-bottom:10px;color:var(--text-primary)}.skill-guide-section h3{font-size:var(--text-sm);font-weight:600;margin:14px 0 6px;color:var(--text-secondary)}.skill-guide-section p{font-size:var(--text-sm);line-height:1.7;color:var(--text-secondary);margin-bottom:8px}.skill-guide-section ol,.skill-guide-section ul{font-size:var(--text-sm);line-height:1.8;color:var(--text-secondary);padding-left:20px;margin-bottom:10px}.skill-guide-section a{color:var(--accent);font-weight:550}.skill-guide-section a:hover{opacity:.7}.skill-guide-code{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius-sm);padding:10px 14px;margin:6px 0 12px;overflow-x:auto}.skill-guide-code code{font-family:SF Mono,Fira Code,monospace;font-size:.8125rem;color:var(--accent)}.skill-guide-note{background:var(--accent-light);border:1px solid var(--accent-muted);border-radius:var(--radius-sm);padding:10px 14px;font-size:var(--text-xs)!important}.admin-skill-form{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);padding:20px;margin-bottom:20px}.about-page{max-width:640px;margin:0 auto}.about-hero{text-align:center;padding:48px 0 32px}.about-bulb-wrap{display:inline-block;margin-bottom:24px;animation:about-float 3s ease-in-out infinite}.about-bulb{width:80px;height:80px;filter:drop-shadow(0 0 20px rgba(232,116,12,.3))}.about-bulb-glow{fill:var(--accent);opacity:0;animation:about-glow 2.5s ease-in-out infinite}.about-headline{font-family:var(--font-body);font-size:1.75rem;font-weight:700;color:var(--text-primary);line-height:1.4;letter-spacing:-.02em}.about-headline em{font-style:normal;color:var(--accent);font-weight:800}.about-desc-section{text-align:center;padding:0 0 40px}.about-desc{font-size:var(--text-lg);color:var(--text-secondary);line-height:1.8;margin-bottom:16px;word-break:keep-all}.about-sub{font-size:var(--text-base);color:var(--text-tertiary);line-height:1.7}.about-sub em{font-style:normal;color:var(--accent);font-weight:600}.about-br{display:none}.about-features{display:grid;grid-template-columns:1fr;gap:16px;padding-bottom:40px}.about-feature{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius-md);padding:24px;transition:box-shadow var(--duration) var(--ease),border-color var(--duration) var(--ease)}.about-feature:hover{border-color:var(--accent-muted);box-shadow:var(--shadow-hover)}.about-feature-icon{width:48px;height:48px;background:var(--accent-light);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;margin-bottom:14px}.about-feature h3{font-size:var(--text-base);font-weight:650;color:var(--text-primary);margin-bottom:6px}.about-feature p{font-size:var(--text-sm);color:var(--text-secondary);line-height:1.6}.about-cta{padding-bottom:48px}.about-cta-inner{background:var(--accent-light);border:1px solid var(--accent-muted);border-radius:var(--radius-lg);padding:32px 24px;text-align:center}.about-cta-inner>p{font-size:var(--text-base);color:var(--text-secondary);line-height:1.7;margin-bottom:20px;word-break:keep-all}.about-cta-buttons{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.about-cta-btn{padding:10px 20px!important;font-size:var(--text-sm)!important}@keyframes about-glow{0%,to{opacity:.08}50%{opacity:.25}}@keyframes about-float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}.mobile-only{display:none!important}@media(max-width:640px){.app-container{padding:0 16px}.desktop-only{display:none!important}.mobile-only{display:flex!important}.hamburger{display:flex}.post-article{padding:24px 20px}.comments-section{padding:20px 16px}.post-title{font-size:var(--text-xl)}.about-headline{font-size:1.375rem}.about-br{display:inline}.about-desc{font-size:var(--text-base)}}.pin-badge{display:inline-block;font-size:.6875rem;font-weight:650;padding:1px 7px;border-radius:var(--radius-sm);background:var(--accent-light);color:var(--accent);margin-right:6px;vertical-align:middle;letter-spacing:.01em;flex-shrink:0}.pin-badge-global{background:var(--red-light);color:var(--red)}.post-item-pinned{background:var(--accent-light)!important;border-left:3px solid var(--accent)}.post-item-pinned:hover{background:#ffecd6!important}.post-item-category{color:var(--accent);font-weight:600}