:root{--page-bg:#f7f8fc;--surface:#fff;--surface-muted:#edf2f7;--text:#172033;--text-muted:#536075;--text-subtle:#64748b;--border:#e4e8f0;--border-strong:#d9e0ea;--shadow:#1720330b;--overlay:#17203388;color:var(--text);background:var(--page-bg);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-family:Inter,ui-sans-serif,system-ui,sans-serif}:root[data-theme=dark]{--page-bg:#111827;--surface:#1f2937;--surface-muted:#273449;--text:#f1f5f9;--text-muted:#cbd5e1;--text-subtle:#aebdd0;--border:#334155;--border-strong:#475569;--shadow:#02061766;--overlay:#020617aa;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}body{background:var(--page-bg);margin:0}main{width:min(1120px,100% - 40px);margin:0 auto}.state{place-items:center;min-height:100vh;display:grid}.portal-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;min-height:72px;padding:10px 0;display:flex}.brand{color:var(--text);align-items:center;gap:10px;font-size:1.36rem;font-weight:800;text-decoration:none;display:inline-flex}.brand-thumbnail{object-fit:cover;object-position:center;border-radius:8px;width:52px;height:52px}.header-link{color:var(--text-muted);font-size:.92rem;text-decoration:none}.header-actions,.header-navigation{align-items:center;gap:18px;display:flex}.header-link:hover{color:var(--text);text-underline-offset:4px;text-decoration:underline}.header-link.active{color:var(--text);text-underline-offset:6px;font-weight:800;-webkit-text-decoration:underline #149eca;text-decoration:underline #149eca;text-decoration-thickness:2px}.theme-toggle{border:1px solid var(--border-strong);background:var(--surface);width:36px;height:36px;color:var(--text);font:inherit;cursor:pointer;border-radius:50%;place-items:center;font-size:1.15rem;line-height:1;display:grid}.theme-toggle img{width:20px;height:20px;display:block}:root:not([data-theme=dark]) .theme-toggle img{filter:brightness(0)saturate()}.theme-toggle:hover{background:var(--surface-muted)}.theme-toggle:focus-visible{outline-offset:2px;outline:3px solid #149eca66}.hero{isolation:isolate;max-width:none;min-height:332px;padding:42px 0 34px;position:relative}.hero:after{z-index:-1;content:"";opacity:.2;pointer-events:none;background:url(/backgrounds/mid-autumn-lion-dance-line-art.png) bottom/100% no-repeat;height:210px;position:absolute;bottom:0;left:0;right:0}.hero>*{position:relative}.eyebrow{color:var(--text-muted);letter-spacing:.12em;font-size:.74rem;font-weight:800}h1{letter-spacing:-.055em;margin:12px 0;font-size:clamp(3.1rem,5vw,4.5rem);line-height:1}.hero>p:not(.eyebrow){max-width:640px;color:var(--text-muted);font-size:1.08rem;line-height:1.65}.hero .resource-search input{width:min(100%,620px)}.resource-search{margin-top:18px;display:block;position:relative}.resource-search input{border:1px solid var(--border-strong);background:var(--surface);-webkit-backdrop-filter:blur(8px);width:min(100%,430px);color:var(--text);font:inherit;border-radius:10px;padding:12px 14px 12px 40px}.resource-search input:focus{border-color:#149eca;outline:3px solid #149eca33}.search-icon{width:18px;height:18px;color:var(--text-subtle);pointer-events:none;position:absolute;top:50%;left:14px;transform:translateY(-50%)}.global-results{grid-template-columns:repeat(3,1fr);gap:16px;margin:-28px 0 62px;display:grid}.global-results>h2{grid-column:1/-1;margin:0;font-size:1.25rem}.global-results>div{border:1px solid var(--border);background:var(--surface);border-radius:12px;gap:8px;padding:16px;display:grid}.global-results h3{color:var(--text-subtle);letter-spacing:.08em;text-transform:uppercase;margin:0 0 2px;font-size:.76rem}.global-results a{color:var(--text);font-weight:700;text-decoration:none}.global-results a:hover{text-underline-offset:3px;text-decoration:underline}.global-results a span{color:var(--text-subtle);margin-top:3px;font-size:.82rem;font-weight:500;display:block}.resource-overview{gap:36px;padding-bottom:76px;display:grid}.section-title{justify-content:space-between;align-items:end;gap:20px;margin-bottom:20px;display:flex}.section-title h2{letter-spacing:-.035em;margin:7px 0 0;font-size:clamp(1.55rem,3vw,2.25rem)}.resource-overview>section .section-title h2{align-items:baseline;gap:14px;display:flex}.resource-overview>section .section-title h2:after{color:var(--text-subtle);letter-spacing:normal;font-size:.85rem;font-weight:400;line-height:1.4}.section-title--documents h2:after{content:"Các tài liệu lập trình đang được dịch sang tiếng Việt"}.section-title--other-documents h2:after{content:"Cẩm nang, kinh nghiệm và kiến thức hữu ích"}.section-title--books h2:after{content:"Ebook chọn lọc để học và thực hành"}.section-title--apps h2:after{content:"Ứng dụng hữu ích cho việc học và sáng tạo"}.section-title>a{color:var(--text);white-space:nowrap;font-size:.92rem;font-weight:800;text-decoration:none}.section-title>a:hover{text-underline-offset:4px;text-decoration:underline}.documents.preview-grid{padding-bottom:0}.listing-hero{padding:54px 0 30px}.listing-toolbar{justify-content:space-between;align-items:center;gap:28px;display:flex}.listing-hero h1{margin:0;font-size:clamp(2.3rem,5vw,3.6rem)}.listing-toolbar .resource-search{width:min(100%,400px);margin:0}.listing-toolbar .resource-search input{width:100%}.listing-section{padding-bottom:76px}.documents{grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px;padding-bottom:64px;display:grid}.other-document-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px;display:grid}.other-document-card{min-height:232px}.resources{border-top:1px solid var(--border);padding:68px 0 76px}.section-introduction{max-width:680px;margin-bottom:36px}.section-introduction h2{letter-spacing:-.04em;margin:10px 0;font-size:clamp(1.8rem,4vw,2.7rem)}.section-introduction>p:last-child,.resource-heading p{color:var(--text-subtle);margin:0;line-height:1.55}.resource-heading{justify-content:space-between;align-items:end;gap:20px;margin-bottom:16px;display:flex}.resource-heading h3{margin:0 0 5px;font-size:1.25rem}.tag-list{flex-wrap:wrap;gap:8px;margin:18px 0 22px;display:flex}.tag{border:1px solid var(--border-strong);background:var(--surface);color:var(--text-muted);font:inherit;cursor:pointer;border-radius:999px;padding:7px 11px;font-size:.78rem;font-weight:400}.tag:hover,.tag.active{border-color:var(--text);background:var(--text);color:var(--surface)}.book-grid{grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:16px;display:grid}.book-card{border:1px solid var(--border);background:var(--surface);min-height:238px;box-shadow:0 10px 24px var(--shadow);border-radius:14px;gap:18px;padding:18px;display:flex;overflow:hidden}.book-cover-trigger{cursor:pointer;background:0 0;border:0;flex:0 0 126px;align-self:flex-start;width:126px;padding:0;display:block}.book-cover{aspect-ratio:2/3;object-fit:contain;object-position:center top;width:100%;display:block}.book-information{flex-direction:column;flex:1;padding:0;display:flex}.resource-meta{color:var(--text-subtle);margin:0;font-size:.78rem;font-weight:700}.book-information h4,.app-card h4{margin:8px 0;font-size:1.08rem}.book-information h4{margin:0 0 5px}.book-title-trigger,.app-card h4 a{color:var(--text);text-decoration:none}.book-title-trigger{font:inherit;font-weight:inherit;text-align:left;cursor:pointer;background:0 0;border:0;padding:0}.book-title-trigger:hover,.app-card h4 a:hover{text-underline-offset:3px;text-decoration:underline}.book-information>p:not(.resource-meta),.app-card>p:not(.resource-meta){color:var(--text-muted);margin:0;font-size:.9rem;line-height:1.5}.book-author{font-weight:500;color:var(--text-subtle)!important;margin-bottom:4px!important;font-size:.78rem!important}.book-availability{color:var(--text-subtle)!important;margin:0 0 14px!important;font-size:.78rem!important}.book-details-trigger{color:var(--text);font:inherit;cursor:pointer;background:0 0;border:0;align-self:flex-end;margin-top:auto;padding:14px 0 0;font-size:.86rem;font-weight:700}.book-details-trigger span{color:#149eca;font-size:1.1rem;transition:transform .18s}.book-details-trigger:hover span{display:inline-block;transform:translate(3px)}.modal-backdrop{z-index:200;background:var(--overlay);place-items:center;padding:24px;display:grid;position:fixed;inset:0;overflow-y:auto}.book-modal{background:var(--surface);width:min(760px,100%);box-shadow:0 24px 80px var(--overlay);border-radius:18px;padding:32px;position:relative}.community-notice-modal{background:var(--surface);width:min(540px,100%);box-shadow:0 24px 80px var(--overlay);border-radius:18px;padding:32px;position:relative}.community-notice-eyebrow{color:var(--text-subtle);letter-spacing:.08em;text-transform:uppercase;margin:0 0 8px;font-size:.76rem;font-weight:800}.community-notice-modal h2{margin:0 40px 14px 0;font-size:clamp(1.45rem,4vw,2rem);line-height:1.2}.community-notice-modal>p:not(.community-notice-eyebrow){color:var(--text-muted);margin:0;line-height:1.65}.community-notice-modal>p:not(.community-notice-eyebrow) a{color:var(--text);font-weight:700}.community-source-link{color:var(--text);margin-top:16px;font-size:.88rem;font-weight:700;display:inline-block}.community-notice-actions{justify-content:flex-end;gap:10px;margin-top:28px;display:flex}.community-notice-cancel,.community-notice-confirm{border:1px solid var(--border-strong);font:inherit;cursor:pointer;border-radius:8px;padding:10px 14px;font-size:.9rem;font-weight:700;text-decoration:none}.community-notice-cancel{background:var(--surface);color:var(--text)}.community-notice-confirm{border-color:var(--text);background:var(--text);color:var(--surface)}.modal-close{background:var(--surface-muted);width:34px;height:34px;color:var(--text);cursor:pointer;border:0;border-radius:50%;font-size:1.5rem;line-height:1;position:absolute;top:14px;right:16px}.book-modal-layout{grid-template-columns:180px minmax(0,1fr);align-items:start;gap:30px;display:grid}.book-modal-cover{object-fit:contain;object-position:center top;width:100%;max-height:300px;display:block}.book-modal h2{margin:7px 40px 5px 0;font-size:clamp(1.45rem,4vw,2rem);line-height:1.2}.book-modal .book-author{margin-bottom:4px!important}.book-modal .resource-meta{margin-bottom:20px}.book-modal-summary{color:var(--text-muted);margin:0;line-height:1.65}.book-modal h3{margin:22px 0 8px;font-size:.92rem}.book-modal ul{color:var(--text-muted);margin:0 0 24px;padding-left:20px;line-height:1.7}.modal-source-link{background:var(--text);color:var(--surface);border-radius:8px;align-items:center;gap:7px;padding:10px 14px;font-size:.9rem;font-weight:700;text-decoration:none;display:inline-flex}.app-section{margin-top:46px}.app-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;display:grid}.app-card{border:1px solid var(--border);background:var(--surface);border-radius:14px;flex-direction:column;min-height:185px;padding:20px;display:flex}.app-card-header{align-items:flex-start;gap:14px;display:flex}.app-icon-link{flex:0 0 58px;width:58px;height:58px;display:block}.app-icon{object-fit:contain;width:100%;height:100%;display:block}.app-icon-fallback{background:var(--surface-muted);color:var(--text-muted);border-radius:14px;place-items:center;font-size:1.35rem;font-weight:700;display:grid}.app-card h4{margin:1px 0 4px}.app-card>p:not(.resource-meta){margin-top:20px}.empty-results{border:1px dashed var(--border-strong);color:var(--text-subtle);text-align:center;border-radius:12px;padding:28px}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.technology-card{--accent-soft:color-mix(in srgb, var(--accent) 14%, var(--surface));border:1px solid var(--border);border-top:5px solid var(--accent);background:var(--surface);box-shadow:0 12px 30px var(--shadow);border-radius:16px;flex-direction:column;padding:24px;display:flex;position:relative;overflow:hidden}.technology-card>:not(.technology-logo-link){z-index:1;position:relative}.technology-logo-link{z-index:2;cursor:pointer;pointer-events:auto;width:42px;height:42px;display:block;position:absolute;top:20px;right:20px}.technology-logo{object-fit:contain;width:42px;height:42px;transform:scale(var(--logo-scale,1));filter:var(--logo-filter,none);pointer-events:none;display:block}.technology-card h2{margin:0 0 8px;padding-right:54px;font-size:1.08rem}.version-label{font-size:.85rem;font-weight:600;color:var(--text-subtle)!important;margin:-3px 0 6px!important}.technology-title-link{color:inherit;text-decoration:none}.technology-title-link:hover{text-decoration:underline;-webkit-text-decoration-color:var(--accent);text-decoration-color:var(--accent);text-underline-offset:4px;text-decoration-thickness:2px}.technology-card>p{color:var(--text-muted);line-height:1.55}.technology-card>.technology-description{margin:0 0 14px;font-size:.9rem}.card-action-area{margin:auto -24px -24px;padding-top:18px}.translation-status{align-items:center;gap:7px;margin:0;padding:0 24px 8px;font-size:.76rem;font-weight:500;display:flex;color:var(--text-muted)!important}.translation-status svg,.translation-status>span{flex:none}.translation-status>span{font-size:1.1rem;line-height:1}.status-progress{color:#0b7a9e!important}.status-complete{color:#16803d!important}.status-review{color:#8a5a06!important}.status-planned,.status-paused{color:#64748b!important}.status-experimental{color:#7a4bba!important}.progress-divider{background:var(--accent-soft);height:7px;position:relative;overflow:hidden}.progress-divider:after{width:var(--progress,0%);background:var(--accent);content:"";transition:width .3s;position:absolute;inset:0 auto 0 0}.community-attribution{color:var(--text-subtle);flex-wrap:wrap;align-items:center;gap:5px 11px;padding:0 24px 12px;font-size:.72rem;line-height:1.35;display:flex}.community-ribbon-row{flex-basis:100%}.community-ribbon{clip-path:polygon(0 0,calc(100% - 8px) 0,100% 50%,calc(100% - 8px) 100%,0 100%);color:#fff;letter-spacing:.06em;text-transform:uppercase;background:#334155;padding:4px 15px 4px 8px;font-size:.7rem;font-weight:800;display:inline-block}.community-attribution strong{color:var(--text-muted)}.community-attribution a{width:fit-content;color:var(--text-muted);align-items:center;gap:5px;font-weight:700;text-decoration:none;display:inline-flex}.community-attribution a:hover{color:var(--text);text-underline-offset:3px;text-decoration:underline}.license-attribution{flex-basis:100%}.document-entry{min-height:66px;color:var(--text);justify-content:space-between;align-items:center;padding:14px 24px;text-decoration:none;transition:background-color .18s;display:flex}.document-entry-arrow{color:var(--accent);font-size:1.35rem;font-weight:800;transition:transform .18s}.document-entry:hover{background:var(--accent-soft)}.document-entry:hover .document-entry-arrow{transform:translate(4px)}.document-entry-disabled{color:var(--text-subtle);cursor:not-allowed}.document-entry-disabled:hover{background:0 0}.document-entry-disabled .document-entry-arrow{color:var(--text-subtle)}main>.portal-footer:not(.site-footer){display:none}.site-footer{border-top:1px solid var(--border-strong);width:min(1120px,100% - 40px);color:var(--text-muted);margin:0 auto;font-size:.86rem}.site-footer-inner{width:100%;padding:42px 10px 20px}.footer-grid{grid-template-columns:minmax(0,1.7fr) repeat(2,minmax(150px,1fr));gap:48px;display:grid}.footer-grid section{align-content:start;gap:12px;display:grid}.footer-grid h2,.footer-grid h3{color:var(--text);margin:0;font-size:.92rem}.footer-grid p{max-width:420px;margin:0;line-height:1.65}.site-footer a{color:#1685af;text-decoration:none}.site-footer a:hover{color:var(--text);text-underline-offset:4px;text-decoration:underline}.footer-bottom{border-top:1px solid var(--border-strong);justify-content:space-between;align-items:center;gap:18px;margin:36px -10px 0;padding:20px 10px 0;display:flex}.footer-bottom>div{flex-wrap:wrap;gap:18px;display:flex}.footer-facebook-link{align-items:center;display:inline-flex}.footer-facebook-link img{object-fit:contain;width:18px;height:18px}.facebook-icon-dark,[data-theme=dark] .facebook-icon-light{display:none}[data-theme=dark] .facebook-icon-dark{display:block}.legal-page{width:100%;margin:0}.legal-page>.portal-header,.legal-content{width:min(840px,100% - 40px);margin-left:auto;margin-right:auto}.legal-page>.portal-header{width:min(1120px,100% - 40px)}.legal-content{padding:68px 0 76px}.legal-content h1{margin-bottom:18px;font-size:clamp(2.6rem,6vw,4.5rem)}.legal-intro{max-width:650px;color:var(--text-muted);margin:0 0 44px;font-size:1.1rem;line-height:1.65}.legal-content section{margin-top:30px}.legal-content section h2{margin:0 0 8px;font-size:1.2rem}.legal-content section p{color:var(--text-muted);margin:0;line-height:1.7}@media (width<=540px){.portal-header{min-height:64px;padding:8px 0}.header-navigation{display:none}.hero{min-height:303px;padding-top:34px}.hero:after{opacity:.16;background-size:auto 150px;height:150px;left:0;right:0}.resource-heading,.section-title,.listing-toolbar{flex-direction:column;align-items:stretch}.resource-overview>section .section-title h2{flex-direction:column;align-items:start;gap:4px}.listing-hero{padding-top:38px}.resource-search input{width:100%}.global-results{grid-template-columns:1fr;margin-top:-12px}.book-card{min-height:210px}.book-cover-trigger{flex-basis:108px;width:108px}.book-modal,.community-notice-modal{padding:24px}.community-notice-actions{flex-direction:column-reverse;align-items:stretch}.community-notice-actions>*{text-align:center}.book-modal-layout{grid-template-columns:1fr}.book-modal-cover{width:150px;max-height:230px}}@media (width<=640px){.footer-grid{grid-template-columns:1fr;gap:28px}.site-footer-inner{padding-top:34px}.footer-bottom{flex-direction:column;align-items:start;margin-top:28px}.legal-content{padding:42px 0 56px}}
