:root{--bg-base: #0c0c0e;--bg-canvas: #08080a;--bg-surface: #121215;--bg-elevated: #1a1a1e;--bg-elevated-hover: #232328;--border: rgba(255, 255, 255, .08);--border-light: rgba(255, 255, 255, .03);--border-focus: rgba(255, 255, 255, .15);--text-main: #e4e4e7;--text-muted: #8a8a93;--accent: #3b82f6;--accent-glow: rgba(59, 130, 246, .15);--success: #30d158;--warning: #ff9f0a;--danger: #ff453a;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--radius-sm: 8px;--radius-md: 14px;--radius-lg: 22px;--radius-full: 9999px;--nav-height: 72px;--ease-apple-in-out: cubic-bezier(.25, 1, .5, 1);--ease-spring: cubic-bezier(.175, .885, .32, 1.2);--ease-google-out: cubic-bezier(.2, 0, 0, 1);--transition-fast: .15s var(--ease-apple-in-out);--transition-normal: .3s var(--ease-apple-in-out);--transition-bounce: .4s var(--ease-spring);--shadow-sm: 0 2px 10px rgba(0, 0, 0, .3), 0 1px 2px rgba(0, 0, 0, .15);--shadow-md: 0 8px 24px rgba(0, 0, 0, .5), 0 2px 8px rgba(0, 0, 0, .3);--shadow-lg: 0 20px 40px rgba(0, 0, 0, .6), 0 8px 16px rgba(0, 0, 0, .4)}[data-theme=light]{--bg-base: #ffffff;--bg-canvas: #f9f9fb;--bg-surface: #f5f5f7;--bg-elevated: #ffffff;--bg-elevated-hover: #f0f0f0;--border: rgba(0, 0, 0, .1);--border-light: rgba(0, 0, 0, .05);--border-focus: rgba(0, 0, 0, .2);--text-main: #1d1d1f;--text-muted: #86868b;--accent-glow: rgba(59, 130, 246, .2);--shadow-sm: 0 2px 10px rgba(0, 0, 0, .05), 0 1px 2px rgba(0, 0, 0, .02);--shadow-md: 0 8px 24px rgba(0, 0, 0, .08), 0 2px 8px rgba(0, 0, 0, .04);--shadow-lg: 0 20px 40px rgba(0, 0, 0, .12), 0 8px 16px rgba(0, 0, 0, .08)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-sans);background-color:var(--bg-base);color:var(--text-main);font-size:1.05rem;font-weight:400;letter-spacing:-.015em;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;transition:background-color var(--transition-normal),color var(--transition-normal)}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--bg-base)}::-webkit-scrollbar-thumb{background:#333;border-radius:var(--radius-full);border:2px solid var(--bg-base)}::-webkit-scrollbar-thumb:hover{background:#555}[data-theme=light] ::-webkit-scrollbar-thumb{background:#ccc}[data-theme=light] ::-webkit-scrollbar-thumb:hover{background:#aaa}.tag{font-size:.85rem;font-weight:500;letter-spacing:.01em;line-height:1.3;padding:6px 12px;border-radius:var(--radius-sm);background:var(--bg-elevated);color:var(--text-muted);border:1px solid var(--border);font-family:monospace;cursor:default;transition:background var(--transition-fast),color var(--transition-fast),border-color var(--transition-fast)}.tag:hover{border-color:var(--tag-hover-color, var(--text-main))}.btn-primary,.btn-outline{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;border-radius:var(--radius-full);font-weight:600;font-size:.95rem;cursor:pointer;text-decoration:none;transition:transform var(--transition-fast),box-shadow var(--transition-fast),background-color var(--transition-fast),opacity var(--transition-fast);will-change:transform}.btn-primary:hover,.btn-outline:hover{transform:scale(1.02)}.btn-primary:active,.btn-outline:active{transform:scale(.96);transition-duration:.05s}.btn-primary:focus-visible,.btn-outline:focus-visible{outline:none;box-shadow:0 0 0 3px var(--bg-base),0 0 0 5px var(--accent)}.btn-primary{background:var(--text-main);color:var(--bg-base);border:1px solid transparent}.btn-outline{background:transparent;color:var(--text-main);border:1px solid var(--border)}.btn-outline:hover{background:var(--bg-elevated);border-color:var(--border-focus)}.lucide{vertical-align:middle}.top-nav{position:fixed;top:0;left:0;width:100%;height:var(--nav-height);z-index:100;display:flex;align-items:center;background:color-mix(in srgb,var(--bg-surface) 85%,transparent);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border-bottom:1px solid var(--border-light);box-shadow:0 4px 24px #0000000d;transition:transform var(--transition-normal),background var(--transition-normal)}.nav-container{width:100%;max-width:1200px;margin:0 auto;padding:0 32px;display:flex;justify-content:space-between;align-items:center}.nav-actions{display:flex;align-items:center;gap:16px}@media (max-width: 768px){.nav-actions{gap:8px;flex-wrap:nowrap}}.desktop-text{display:inline}.mobile-text{display:none}@media (max-width: 768px){.desktop-text{display:none}.mobile-text{display:inline}}#proposal-btn{white-space:nowrap}@media (max-width: 480px){#proposal-btn{padding:8px 14px;font-size:.8rem}}.theme-btn{background:transparent;border:none;color:var(--text-main);cursor:pointer;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;transition:transform var(--transition-fast),box-shadow var(--transition-fast),background-color var(--transition-fast),opacity var(--transition-fast);will-change:transform}.theme-btn:hover{transform:scale(1.02)}.theme-btn:active{transform:scale(.96);transition-duration:.05s}.theme-btn:focus-visible{outline:none;box-shadow:0 0 0 3px var(--bg-base),0 0 0 5px var(--accent)}.theme-btn:hover{background:var(--bg-elevated)}.brand{font-size:1.25rem;font-weight:700;display:flex;align-items:center;gap:10px;letter-spacing:-.02em;color:var(--text-main);text-decoration:none;transition:opacity var(--transition-fast);white-space:nowrap}.brand:hover{opacity:.8}.floating-tg{position:fixed;bottom:32px;right:32px;width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-md);z-index:90;transition:transform var(--transition-bounce),box-shadow var(--transition-fast)}.floating-tg svg{width:100%;height:100%}.floating-tg:hover{transform:translateY(-4px) scale(1.05);box-shadow:var(--shadow-lg)}@media (max-width: 768px){.floating-tg{bottom:24px;right:24px;width:50px;height:50px}}.main-footer{border-top:1px solid var(--border);background:var(--bg-surface);padding:80px 32px 32px;margin-top:auto}.footer-container{max-width:1200px;margin:0 auto}.footer-main{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:48px;margin-bottom:80px}@media (max-width: 768px){.footer-main{flex-direction:column;align-items:flex-start;gap:32px}}.footer-content{max-width:460px}.footer-content .brand{margin-bottom:20px;display:inline-flex;align-items:center;gap:12px}.footer-content .footer-bio{color:var(--text-muted);font-size:1.1rem;line-height:1.6}.footer-btn-huge{padding:12px 24px;font-size:.95rem;border-radius:var(--radius-full)}.footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:24px;padding-top:32px;border-top:1px solid var(--border-light)}@media (max-width: 768px){.footer-bottom{flex-direction:column;align-items:flex-start;text-align:left}}.footer-socials{display:flex;gap:24px}.footer-socials a{color:var(--text-main);text-decoration:none;font-size:.95rem;font-weight:500;transition:color var(--transition-fast)}.footer-socials a:hover{color:var(--accent)}.footer-meta{display:flex;align-items:center;gap:24px}@media (max-width: 768px){.footer-meta{flex-direction:column;align-items:center;gap:12px}}.copyright{color:var(--text-muted);font-size:.85rem}.source-link{display:inline-flex;align-items:center;gap:10px;color:var(--text-muted);text-decoration:none;font-size:.85rem;font-weight:500;padding:6px 12px;border-radius:var(--radius-sm);background:var(--bg-elevated);border:1px solid var(--border);transition:all var(--transition-fast)}.source-link:hover{color:var(--text-main);border-color:var(--text-main)}.scroll-top-btn{width:48px;height:48px;border-radius:var(--radius-sm);background:var(--bg-elevated);border:1px solid var(--border);color:var(--text-muted);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--transition-fast)}.scroll-top-btn:hover{background:var(--text-main);color:var(--bg-base);border-color:var(--text-main);transform:translateY(-4px)}body{display:flex;flex-direction:column;min-height:100vh}.view-toggle{display:flex;background:var(--bg-elevated);border:1px solid var(--border-light);border-radius:var(--radius-full);padding:4px;gap:4px}@media (max-width: 768px){.view-toggle{display:none}}.toggle-btn{background:transparent;border:none;color:var(--text-muted);padding:8px 20px;border-radius:var(--radius-full);font-size:.9rem;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:8px;transition:background-color var(--transition-fast),color var(--transition-fast)}.toggle-btn.active{background:var(--text-main);color:var(--bg-base)}.toggle-btn:hover:not(.active){color:var(--text-main)}.view-container{flex:1;width:100%;display:none;opacity:0}.view-container.active{display:block;opacity:1}#view-catalog{padding:120px 48px;background:var(--bg-base)}@media (max-width: 768px){#view-catalog{padding:100px 24px 40px}}.grid-header{max-width:1200px;margin:0 auto 64px;text-align:center}.grid-header h1{font-size:clamp(2.5rem,5vw,4.5rem);font-weight:800;letter-spacing:-.04em;line-height:1.05;margin-bottom:32px}.filters{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-bottom:48px}.filter-btn{background:transparent;border:1px solid var(--border);color:var(--text-muted);padding:10px 20px;border-radius:var(--radius-full);font-size:.9rem;font-weight:500;cursor:pointer;transition:all var(--transition-fast)}.filter-btn:hover{border-color:var(--accent);color:var(--text-main)}.filter-btn.active{background:var(--bg-elevated);border-color:var(--accent);color:var(--text-main)}.bento-grid{position:relative;max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:24px;align-items:stretch}.bento-grid.list-view{grid-template-columns:1fr;max-width:900px;align-items:start}.bento-grid.list-view .grid-card{height:auto;min-height:0}.bento-grid.list-view .grid-card.is-expanded .gc-front{position:relative;display:flex;opacity:1;visibility:visible;pointer-events:auto;border-bottom:1px solid var(--border);cursor:pointer;height:auto;transition:none}.bento-grid.list-view .grid-card.is-expanded .gc-expand-icon{transform:rotate(180deg)}.bento-grid.list-view .grid-card.is-expanded .gc-expanded-content{position:relative;height:auto}.bento-grid.list-view .gc-inner{height:auto;min-height:0}.bento-grid.list-view .gc-front{flex-direction:row;align-items:flex-start;gap:32px;padding:24px 32px}@media (max-width: 768px){.bento-grid.list-view .gc-front{flex-direction:column;align-items:flex-start;gap:20px}}.bento-grid.list-view .gc-list-thumb{display:block}@media (max-width: 768px){.bento-grid.list-view .gc-list-thumb{width:100%;height:200px}}.bento-grid.list-view .gc-desc{margin-bottom:12px}.bento-grid.list-view .gc-expand-icon{display:flex}.bento-grid.list-view .gc-expanded-content{height:0;min-height:0;overflow:hidden}.bento-grid.list-view .close-card-btn,.bento-grid.list-view .gc-img-panel,.bento-grid.list-view .expanded-title{display:none}.bento-grid.list-view .gc-split-view{flex-direction:column}.bento-grid.list-view .gc-content-panel{width:100%;margin-left:0;padding:40px}.bento-grid.list-view .gc-feature-view{padding:40px}.grid-card{position:relative;display:flex;flex-direction:column;z-index:1;will-change:transform,width,height;height:100%}.grid-card.row-sibling-hidden{display:none}.grid-card.is-expanded{grid-column:1/-1;z-index:50}.grid-card.is-expanded .gc-inner{cursor:default}.grid-card.is-expanded .gc-front{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .4s ease,visibility 0s linear .4s}.grid-card.is-expanded .gc-expanded-content{position:relative;opacity:1;visibility:visible;pointer-events:auto;transition:opacity .5s ease .2s}@keyframes googleGradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.gc-inner{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-lg);display:flex;flex-direction:column;transition:border-color var(--transition-fast);overflow:hidden;position:relative;width:100%;height:100%}.gc-inner:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--radius-lg);padding:2px;background:linear-gradient(90deg,#4285f4,#ea4335,#fbbc05,#34a853,#4285f4);background-size:300% 100%;animation:googleGradient 3s linear infinite;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity var(--transition-fast);pointer-events:none;z-index:10}.grid-card:not(.is-expanded) .gc-inner:hover{border-color:transparent}.grid-card.is-expanded .gc-inner{border-color:transparent}.grid-card:not(.is-expanded) .gc-inner:hover:after,.grid-card.is-expanded .gc-inner:after{opacity:1}.gc-front{padding:32px;cursor:pointer;display:flex;flex-direction:column;height:100%;opacity:1;visibility:visible;transition:opacity .4s ease,visibility 0s linear}.gc-front:hover .gc-icon{color:var(--icon-hover-color, var(--text-main))}.gc-list-thumb{display:none;width:140px;height:140px;border-radius:var(--radius-md);background-size:cover;background-position:center;flex-shrink:0;border:1px solid var(--border)}.gc-info{flex:1}.gc-header{display:flex;align-items:center;gap:16px;margin-bottom:16px}.gc-icon{width:44px;height:44px;border-radius:50%;background:var(--bg-elevated);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--text-main);transition:color var(--transition-fast),border-color var(--transition-fast)}.gc-title{font-size:1.25rem;font-weight:500;letter-spacing:-.01em}.gc-desc{color:var(--text-muted);margin-bottom:24px;line-height:1.6;font-size:.95rem}.gc-tags{display:flex;flex-wrap:wrap;gap:8px}.gc-expand-icon{display:none;align-items:center;justify-content:center;color:var(--text-muted);width:40px;height:40px;border-radius:50%;border:1px solid var(--border);margin-left:auto;transition:transform var(--transition-bounce),color var(--transition-fast),border-color var(--transition-fast)}.gc-expand-icon:hover{color:var(--text-main);border-color:var(--text-main)}.gc-expanded-content{position:absolute;top:0;left:0;width:100%;opacity:0;visibility:hidden;pointer-events:none;flex:1;min-height:450px;overflow:hidden;transition:opacity .3s ease,visibility 0s linear .3s}.gc-expanded-content.show-feature .gc-split-view{transform:translate(-20%);opacity:0;pointer-events:none}.gc-expanded-content.show-feature .gc-feature-view{transform:translate(0);opacity:1}.close-card-btn{position:absolute;top:16px;right:16px;width:40px;height:40px;border-radius:50%;background:var(--bg-surface);border:1px solid var(--border);color:var(--text-main);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:20;transition:border-color var(--transition-fast),color var(--transition-fast)}.close-card-btn:hover{border-color:var(--danger);color:var(--danger)}.gc-split-view{display:flex;height:100%;width:100%;transition:transform .5s cubic-bezier(.2,0,0,1),opacity .5s ease}@media (max-width: 900px){.gc-split-view{flex-direction:column}}.gc-img-panel{width:45%;height:100%;position:absolute;left:0;top:0;background-size:cover;background-position:center;border-right:1px solid var(--border)}@media (max-width: 900px){.gc-img-panel{position:relative;width:100%;height:250px;border-right:none;border-bottom:1px solid var(--border)}}.gc-content-panel{width:55%;margin-left:45%;padding:48px;display:flex;flex-direction:column}@media (max-width: 900px){.gc-content-panel{width:100%;margin-left:0;padding:32px 24px}}.expanded-title{font-size:clamp(1.8rem,3vw,2.5rem);font-weight:700;letter-spacing:-.025em;line-height:1.15;margin-bottom:32px;padding-right:40px;font-weight:600}.gc-features{display:flex;flex-direction:column;gap:12px;margin-bottom:40px}.feature-btn{width:100%;text-align:left;background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px 20px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;color:var(--text-main);transition:transform .2s ease,opacity .2s ease,border-color var(--transition-fast)}.feature-btn:hover{transform:scale(1.02);opacity:.9;border-color:var(--border-focus)}.icon-circle{width:32px;height:32px;border-radius:50%;background:transparent;border:1px solid rgba(0,0,0,.1);color:inherit;display:flex;align-items:center;justify-content:center;flex-shrink:0}[data-theme=light] .icon-circle{border-color:#fff3}.fb-text{display:flex;flex-direction:column;gap:4px;padding-right:20px}.fb-title{font-weight:500;font-size:1.05rem}.fb-desc{font-size:.85rem;opacity:.7}.gc-actions-horizontal{margin-top:auto;display:flex;align-items:center;gap:20px}@media (max-width: 768px){.gc-actions-horizontal{flex-direction:column;align-items:stretch;gap:16px}}.live-actions{display:flex;align-items:center;gap:12px}@media (max-width: 768px){.live-actions{justify-content:center;width:100%}}.btn-link{color:var(--text-muted);text-decoration:none;font-size:.95rem;font-weight:500;display:flex;align-items:center;gap:8px;transition:color var(--transition-fast)}.btn-link:hover{color:var(--text-main)}@media (max-width: 768px){.btn-link{justify-content:center;border:1px solid var(--border);border-radius:var(--radius-full);padding:12px;flex:1}}.github-icon-link{color:var(--text-main);opacity:.5;transition:opacity var(--transition-fast);display:flex;align-items:center;justify-content:center;margin-bottom:4px}.github-icon-link:hover{opacity:1}.gc-feature-view{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--bg-surface);z-index:10;padding:48px;transform:translate(100%);transition:transform .5s cubic-bezier(.2,0,0,1),opacity .5s ease;overflow-y:auto;opacity:0}@media (max-width: 900px){.gc-feature-view{padding:40px 24px}}.matryoshka-content{max-width:700px;margin:0 auto}.back-btn{display:inline-flex;align-items:center;background:transparent;border:none;cursor:pointer;margin-bottom:40px;padding:0;transition:transform .2s ease}.back-btn .icon-circle{background:transparent;border:1px solid var(--border);color:var(--text-muted);width:40px;height:40px}.back-btn:hover{transform:translate(-4px)}.back-btn:hover .icon-circle{border-color:var(--text-main);color:var(--text-main)}.m-title{font-size:clamp(1.8rem,3vw,2.5rem);font-weight:700;letter-spacing:-.025em;line-height:1.15;margin-bottom:24px;font-weight:600}.m-text{font-size:1.05rem;color:var(--text-muted);line-height:1.7}
