*{box-sizing:border-box;margin:0;padding:0}body{color:#e0e0e0;background:#0a0e17;min-height:100vh;font-family:Segoe UI,Meiryo,sans-serif}a{color:#4fc3f7;text-decoration:none}a:hover{text-decoration:underline}.nav{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100;background:#0a0e17f2;border-bottom:1px solid #1a2030;position:sticky;top:0}.nav-inner{justify-content:space-between;align-items:center;max-width:900px;margin:0 auto;padding:12px 20px;display:flex}.nav-brand{color:#fff;letter-spacing:2px;font-size:18px;font-weight:700;text-decoration:none}.nav-brand-dot{color:#4fc3f7}.at-mark{color:#666;margin:0 1px;font-size:12px}.nav-links{gap:24px;display:flex}.nav-links a{color:#b0b0b0;font-size:15px;text-decoration:none;transition:color .2s}.nav-links a:hover{color:#4fc3f7;text-decoration:none}.nav-toggle{color:#888;cursor:pointer;background:0 0;border:none;font-size:20px;display:none}@media (max-width:640px){.nav-toggle{display:block}.nav-links{background:#0a0e17fa;border-bottom:1px solid #1a2030;flex-direction:column;gap:12px;padding:16px 20px;display:none;position:absolute;top:48px;left:0;right:0}.nav-links.open{display:flex}}.hero{text-align:center;padding:28px 20px 16px}.hero h1{color:#fff;margin-bottom:2px;font-size:32px}.hero .hero-en{color:#555;letter-spacing:3px;margin-bottom:6px;font-size:12px}.hero .tagline{color:#aaa;margin-bottom:8px;font-size:15px}.hero .description{color:#999;max-width:500px;margin:0 auto 12px;font-size:14px;line-height:1.7}.social-links{justify-content:center;gap:12px;display:flex}.social-link{color:#888;border:1px solid #2a3a4a;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;text-decoration:none;transition:all .2s;display:flex}.social-link svg{width:16px;height:16px}.social-link:hover{color:#4fc3f7;border-color:#4fc3f7;text-decoration:none}.apps-section{max-width:900px;margin:0 auto;padding:20px 20px 80px}.apps-section h2{color:#999;text-transform:uppercase;letter-spacing:3px;text-align:center;margin-bottom:24px;font-size:16px}.apps-grid{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:20px;display:grid}.app-card-wrapper{flex-direction:column;display:flex}.app-card{color:inherit;background:#141a26;border:1px solid #2a3a4a;border-radius:12px;flex:1;padding:28px;text-decoration:none;transition:all .3s;display:block}.app-card:hover{border-color:#4fc3f7;text-decoration:none;transform:translateY(-2px);box-shadow:0 8px 30px #4fc3f714}.app-card .app-icon{margin-bottom:16px;font-size:36px}.app-card .app-thumbnail{aspect-ratio:1;object-fit:cover;border-radius:8px;width:100%;margin-bottom:16px}.app-card h3{color:#fff;margin-bottom:8px;font-size:20px}.app-card .app-desc{color:#aaa;margin-bottom:16px;font-size:14px;line-height:1.7}.app-card .app-tags{flex-wrap:wrap;gap:6px;display:flex}.app-card .tag{color:#4fc3f7;background:#4fc3f71a;border-radius:12px;padding:4px 12px;font-size:12px}.guide-link{text-align:right;color:#4fc3f7;padding:10px 12px 0;font-size:14px;font-weight:500;display:block}.guide-link:hover{text-decoration:underline}.blog-section{max-width:900px;margin:0 auto;padding:0 20px 80px}.blog-section h2{color:#999;text-transform:uppercase;letter-spacing:3px;text-align:center;margin-bottom:24px;font-size:16px}.blog-more-link{text-align:center;color:#4fc3f7;margin-top:20px;font-size:15px;font-weight:500;display:block}.blog-more-link:hover{text-decoration:underline}.footer{border-top:1px solid #1a2030;padding:40px 20px}.footer-inner{text-align:center;max-width:900px;margin:0 auto}.footer-nav{justify-content:center;gap:24px;margin-bottom:16px;display:flex}.footer-nav a{color:#999;font-size:13px}.footer-nav a:hover{color:#4fc3f7}.footer-social{justify-content:center;gap:20px;margin-bottom:20px;display:flex}.footer-social a{color:#888;font-size:13px}.footer-social a:hover{color:#4fc3f7}.footer-copy{color:#555;font-size:12px}.page{max-width:700px;margin:0 auto;padding:40px 20px 80px}.page-with-sidebar{grid-template-columns:200px minmax(0,700px) 160px;justify-content:center;gap:24px;padding:0 20px;display:grid}.page-with-sidebar .page{max-width:none;margin:0}.sidebar-left,.sidebar-right{padding-top:40px}.sidebar-section{margin-bottom:28px}.sidebar-title{letter-spacing:2px;color:#456;text-transform:uppercase;border-bottom:1px solid #1a2a3a;margin-bottom:10px;padding-bottom:6px;font-size:11px;font-weight:700}.sidebar-posts{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.sidebar-posts li a{color:#7a9ab8;font-size:12px;line-height:1.5;text-decoration:none;display:block}.sidebar-posts li a:hover{color:#4fc3f7}.sidebar-tags{flex-wrap:wrap;gap:6px;display:flex}.sidebar-tag{color:#4a6a82;background:#0f1a24;border:1px solid #1a2a3a;border-radius:3px;padding:2px 7px;font-size:11px;text-decoration:none}.sidebar-tag:hover{color:#4fc3f7;border-color:#4fc3f7}.sidebar-apps{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.sidebar-apps li a{color:#7a9ab8;font-size:12px;text-decoration:none}.sidebar-apps li a:hover{color:#4fc3f7}@media (max-width:1080px){.page-with-sidebar{grid-template-columns:1fr}.sidebar-left,.sidebar-right{display:none}}.page h1{color:#fff;border-bottom:1px solid #1a2030;margin-bottom:24px;padding-bottom:12px;font-size:28px}.page h2{color:#ddd;margin:32px 0 12px;font-size:18px}.page h3{color:#ccc;margin:24px 0 8px;font-size:15px}.page p{color:#aaa;margin-bottom:16px;font-size:14px;line-height:1.8}.page ul,.page ol{color:#aaa;margin:0 0 16px 24px;font-size:14px;line-height:1.8}.page li{margin-bottom:4px}.page a{color:#4fc3f7}.page .info-card{background:#141a26;border:1px solid #2a3a4a;border-radius:8px;margin:16px 0;padding:20px}.page .info-card dt{color:#666;margin-bottom:2px;font-size:12px}.page .info-card dd{color:#ddd;margin-bottom:12px;font-size:14px}.page .info-card dd:last-child{margin-bottom:0}.page table{border-collapse:collapse;width:100%;margin-bottom:16px;font-size:14px}.page th{color:#ddd;text-align:left;background:#1a2030;border:1px solid #2a3a4a;padding:10px 14px;font-weight:700}.page td{color:#aaa;border:1px solid #2a3a4a;padding:10px 14px}.page tr:nth-child(2n) td{background:#141a2680}.steps{counter-reset:step}.steps .step{margin-bottom:20px;padding-left:40px;position:relative}.steps .step:before{counter-increment:step;content:counter(step);color:#fff;background:#1e88e5;border-radius:50%;justify-content:center;align-items:center;width:26px;height:26px;font-size:13px;font-weight:700;display:flex;position:absolute;top:0;left:0}.steps .step h3{margin-top:0;font-size:15px}.steps .step p{margin-bottom:4px}.blog-list{flex-direction:column;gap:16px;margin-top:24px;display:flex}.blog-card{color:inherit;background:#141a26;border:1px solid #2a3a4a;border-radius:12px;padding:24px;text-decoration:none;transition:all .3s;display:block}.blog-card:hover{border-color:#4fc3f7;text-decoration:none;transform:translateY(-2px);box-shadow:0 8px 30px #4fc3f714}.blog-date{color:#666;font-size:12px}.blog-title{color:#fff;margin:4px 0 8px;font-size:18px}.blog-excerpt{color:#aaa;margin-bottom:12px;font-size:14px;line-height:1.7}.blog-tags{flex-wrap:wrap;gap:6px;display:flex}.blog-tags .tag{color:#4fc3f7;background:#4fc3f71a;border-radius:12px;padding:4px 12px;font-size:12px}.blog-empty{color:#666;text-align:center;padding:40px 0;font-size:14px}.tag-filter{flex-wrap:wrap;gap:8px;margin-top:16px;display:flex}.tag-filter-btn{color:#888;cursor:pointer;background:0 0;border:1px solid #2a3a4a;border-radius:12px;padding:4px 12px;font-family:inherit;font-size:12px;text-decoration:none;transition:all .2s;display:inline-block}.tag-filter-btn:hover{color:#4fc3f7;border-color:#4fc3f7}.tag-filter-btn.active{color:#4fc3f7;background:#4fc3f71a;border-color:#4fc3f7}.blog-post-header{border-bottom:1px solid #1a2030;margin-bottom:32px;padding-bottom:16px}.blog-post-header h1{border-bottom:none;margin-bottom:12px;padding-bottom:0}.blog-content h2{color:#ddd;margin:32px 0 12px;font-size:18px}.blog-content h3{color:#ccc;margin:24px 0 8px;font-size:15px}.blog-content p{color:#aaa;margin-bottom:16px;font-size:14px;line-height:1.8}.blog-content ul,.blog-content ol{color:#aaa;margin:0 0 16px 24px;font-size:14px;line-height:1.8}.blog-content li{margin-bottom:4px}.blog-content a{color:#4fc3f7}.blog-content strong{color:#ddd}.blog-content table{border-collapse:collapse;width:100%;margin-bottom:16px;font-size:14px}.blog-content th{color:#ddd;text-align:left;background:#1a2030;border:1px solid #2a3a4a;padding:10px 14px;font-weight:700}.blog-content td{color:#aaa;border:1px solid #2a3a4a;padding:10px 14px}.blog-content tr:nth-child(2n) td{background:#141a2680}.blog-content pre{background:#141a26;border:1px solid #2a3a4a;border-radius:8px;margin-bottom:16px;padding:16px;font-size:13px;line-height:1.6;overflow-x:auto}.blog-content code{font-family:Cascadia Code,Consolas,monospace;font-size:13px}.blog-content p code{color:#4fc3f7;background:#4fc3f71a;border-radius:4px;padding:2px 6px}.blog-content blockquote{color:#888;border-left:3px solid #4fc3f7;margin:0 0 16px;padding:8px 16px;font-size:14px}.blog-content img{border-radius:8px;max-width:100%;margin:16px 0}.breadcrumb{color:#555;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:24px;font-size:12px;display:flex}.breadcrumb a{color:#555;text-decoration:none}.breadcrumb a:hover{color:#4fc3f7}.breadcrumb-sep{color:#333}.breadcrumb-current{color:#888;text-overflow:ellipsis;white-space:nowrap;max-width:300px;overflow:hidden}.post-nav{border-top:1px solid #1a2030;grid-template-columns:1fr 1fr;gap:12px;margin-top:48px;padding-top:24px;display:grid}.post-nav-item{background:#141a26;border:1px solid #2a3a4a;border-radius:6px;flex-direction:column;gap:6px;padding:14px 16px;text-decoration:none;transition:all .2s;display:flex}.post-nav-item:hover{border-color:#4fc3f7;text-decoration:none}.post-nav-next{text-align:right}.post-nav-label{color:#4fc3f7;font-size:11px;font-weight:600}.post-nav-title{color:#ccc;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:13px;line-height:1.5;display:-webkit-box;overflow:hidden}@media (max-width:600px){.post-nav{grid-template-columns:1fr}.post-nav-next{text-align:left}.breadcrumb-current{max-width:180px}}.related-posts{border-top:1px solid #1a2030;margin-top:48px;padding-top:24px}.related-posts h2{color:#555;text-transform:uppercase;letter-spacing:3px;margin-bottom:16px;font-size:14px}.related-posts-list{flex-direction:column;gap:12px;display:flex}.related-post-card{color:inherit;background:#141a26;border:1px solid #2a3a4a;border-radius:8px;padding:16px;text-decoration:none;transition:all .3s;display:block}.related-post-card:hover{border-color:#4fc3f7;text-decoration:none}.related-post-card h3{color:#ddd;margin:4px 0 0;font-size:14px}
