:root{--ink:#171614;--paper:#eee9df;--cream:#f7f3eb;--gold:#c58b35;--red:#a33b2d;--line:3px solid var(--ink);--serif:'Playfair Display',Georgia,serif;--mono:'DM Mono',ui-monospace,monospace}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--mono);line-height:1.65}a{color:inherit;text-decoration-thickness:2px;text-underline-offset:4px}img{max-width:100%;height:auto;display:block}.shell{width:min(1180px,calc(100% - 32px));margin:auto}.site-header{border-bottom:var(--line);background:var(--cream)}.masthead{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 0}.brand{display:flex;align-items:center;gap:14px;text-decoration:none}.brand img{width:58px;height:58px;object-fit:cover;border:var(--line)}.brand strong{font:800 1.3rem var(--serif);letter-spacing:.08em}.brand small{display:block;font-size:.62rem;letter-spacing:.13em}.menu{display:flex;gap:18px;flex-wrap:wrap;justify-content:flex-end}.menu a{font-size:.72rem;text-transform:uppercase;text-decoration:none;padding:6px 8px;border-bottom:2px solid transparent}.menu a:hover,.menu a[aria-current=page]{border-color:var(--red);color:var(--red)}.hero{padding:72px 0 64px;border-bottom:var(--line);background:linear-gradient(135deg,var(--cream) 0 70%,#d9c49d 70%)}.kicker{font-size:.7rem;text-transform:uppercase;letter-spacing:.18em;color:var(--red);font-weight:500}.hero h1{font:800 clamp(2.7rem,7vw,6.7rem)/.95 var(--serif);max-width:900px;margin:18px 0 25px;letter-spacing:-.06em}.hero p{max-width:690px;font-size:1rem}.hero-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:40px;align-items:end}.hero-mark{justify-self:end;border:var(--line);background:var(--gold);padding:18px;box-shadow:12px 12px 0 var(--ink)}.hero-mark img{width:220px;aspect-ratio:1;object-fit:cover;mix-blend-mode:multiply}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.button{display:inline-block;padding:13px 18px;border:var(--line);background:var(--ink);color:var(--cream);font-weight:500;text-decoration:none;text-transform:uppercase;font-size:.72rem}.button.alt{background:transparent;color:var(--ink)}.button:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--red)}.section{padding:68px 0;border-bottom:var(--line)}.section.tinted{background:var(--cream)}.section-head{display:grid;grid-template-columns:.35fr 1fr;gap:25px;margin-bottom:32px}.section h2{font:700 clamp(2rem,4vw,4rem)/1 var(--serif);margin:0;letter-spacing:-.04em}.section h3{font:700 1.2rem var(--serif);margin-top:0}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.card{border:var(--line);padding:22px;background:var(--cream);min-height:180px}.card:nth-child(2n){background:#d9c49d}.card:nth-child(3n){background:#d7d0c5}.number{font:2rem var(--serif);color:var(--red);font-weight:700}.rule{height:var(--line);background:var(--ink);margin:18px 0}.stats{display:grid;grid-template-columns:repeat(5,1fr);border-top:var(--line);border-bottom:var(--line)}.stat{padding:18px 12px;border-right:var(--line)}.stat:last-child{border:0}.stat strong{font:700 2rem var(--serif);display:block}.stat span{font-size:.65rem;text-transform:uppercase}.list{display:grid;gap:12px}.list article{border-left:9px solid var(--red);padding:15px 20px;background:var(--cream);border-top:var(--line);border-right:var(--line);border-bottom:var(--line)}.list h3{margin-bottom:4px}.table{width:100%;border-collapse:collapse;background:var(--cream)}.table th,.table td{padding:14px;text-align:left;border:var(--line)}.table th{width:30%;background:#d9c49d;font-family:var(--serif)}details{border-top:var(--line);padding:18px 0}summary{cursor:pointer;font:700 1.2rem var(--serif)}.contact{display:grid;grid-template-columns:1fr 1fr;gap:30px}.contact form{display:grid;gap:12px}.contact label{font-size:.72rem;text-transform:uppercase}.contact input,.contact textarea{width:100%;border:var(--line);background:var(--cream);padding:14px;font:inherit}.contact textarea{min-height:150px}.site-footer{background:var(--ink);color:var(--cream);padding:35px 0}.footer-grid{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.footer-grid nav{display:flex;gap:20px;flex-wrap:wrap}.footer-grid a{color:var(--cream)}.crumb{font-size:.7rem;text-transform:uppercase;margin-bottom:18px}.eyebrow{display:inline-block;background:var(--ink);color:var(--cream);padding:3px 8px;font-size:.7rem}.mobile-toggle{display:none;border:var(--line);background:transparent;padding:8px}@media(max-width:760px){.masthead{align-items:flex-start}.mobile-toggle{display:block}.menu{display:none;width:100%;flex-direction:column;border-top:var(--line);padding-top:10px}.menu.open{display:flex}.hero{padding:48px 0}.hero-grid,.section-head,.contact{grid-template-columns:1fr}.hero-mark{justify-self:start}.grid{grid-template-columns:1fr}.stats{grid-template-columns:repeat(2,1fr)}.stat:nth-child(2n){border-right:0}.stat:last-child{grid-column:1/-1;border-top:var(--line)}.footer-grid{display:grid}.shell{width:min(100% - 24px,1180px)}}

@font-face{font-family:'DM Mono';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/dm-mono-400.woff2') format('woff2')}
@font-face{font-family:'DM Mono';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/dm-mono-500.woff2') format('woff2')}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:600 800;font-display:swap;src:url('/fonts/playfair-display-600-800.woff2') format('woff2')}
/* Second-pass layout corrections: tighter editorial rhythm and compact mobile flow. */
.masthead{padding:12px 0}.brand img{width:48px;height:48px}.brand strong{font-size:1.08rem}.brand small{font-size:.56rem}.menu{gap:8px;align-items:center}.menu a{font-size:.64rem;padding:5px 6px}.auth-actions{display:flex;gap:8px;align-items:center;margin-left:8px}.auth-actions a{font-size:.7rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;text-decoration:none;padding:10px 14px;border:3px solid var(--ink);white-space:nowrap;background:var(--cream)}.auth-actions a:last-child{background:var(--red);color:var(--cream);border-color:var(--red);box-shadow:4px 4px 0 var(--ink)}
.hero{padding:46px 0 42px}.hero h1,.source-content>article>header h1,.source-content>header h1{font-size:clamp(2.15rem,5vw,4.8rem);max-width:820px;margin:12px 0 18px}.hero p,.source-content>article>header p,.source-content>header p{font-size:.88rem;line-height:1.55}.hero-mark{padding:12px;box-shadow:8px 8px 0 var(--ink)}.hero-mark img{width:165px}.section{padding:42px 0}.section-head{gap:18px;margin-bottom:22px}.section h2,.source-content h2{font-size:clamp(1.65rem,3vw,3rem)}.grid{gap:10px}.card{padding:16px;min-height:145px}.card h3{font-size:1.05rem}.card p{font-size:.82rem}.stats{grid-template-columns:repeat(5,1fr)}.stat{padding:12px 9px}.stat strong{font-size:1.45rem}.stat span{font-size:.55rem}.source-content>article>header,.source-content>header{padding:44px max(16px,calc((100% - 1180px)/2)) 40px}.source-content section{padding:40px max(16px,calc((100% - 1180px)/2))}.source-content article{padding:16px;margin:10px 0}.source-content h3{font-size:1.08rem;margin-top:18px}.source-content p,.source-content li{font-size:.84rem;line-height:1.6}.source-content>article>header img,.source-content>header img{width:130px;height:130px;margin:-110px 0 18px 25px}.site-footer{padding:24px 0;font-size:.78rem}
@media(max-width:940px){.menu{gap:3px}.menu a{font-size:.58rem}.auth-actions a{font-size:.56rem;padding:6px 7px}.brand{gap:8px}}
@media(max-width:760px){.masthead{display:grid;grid-template-columns:1fr auto;gap:10px}.brand img{width:42px;height:42px}.brand strong{font-size:.98rem}.brand small{font-size:.5rem}.mobile-toggle{font-size:.65rem;padding:7px}.menu{grid-column:1/-1;gap:2px}.menu a{font-size:.65rem;padding:7px 3px}.auth-actions{grid-column:1/-1;margin:5px 0 0;border-top:2px solid var(--ink);padding-top:10px}.auth-actions a{flex:1;text-align:center;padding:12px 10px;font-size:.72rem}.hero{padding:34px 0 30px}.hero-grid{gap:22px}.hero-mark{justify-self:start}.hero-mark img{width:120px}.hero h1,.source-content>article>header h1,.source-content>header h1{font-size:clamp(2rem,11vw,3.2rem);line-height:1}.section{padding:30px 0}.section-head{display:block}.section-head>.eyebrow{margin-bottom:14px}.stats{grid-template-columns:repeat(2,1fr)}.stat:nth-child(2n){border-right:0}.stat:last-child{grid-column:1/-1;border-top:var(--line)}.source-content>article>header,.source-content>header{padding:34px 12px 30px}.source-content section{padding:30px 12px}.source-content>article>header img,.source-content>header img{float:none;margin:18px 0 0;width:100px;height:100px}.source-content h2{font-size:clamp(1.55rem,8vw,2.25rem)}.footer-grid{gap:12px}.footer-grid nav{gap:12px}}

html,body{overflow-x:hidden}.source-content code{display:block;width:100%;max-width:calc(100vw - 24px);overflow-wrap:anywhere;word-break:break-word;white-space:pre-wrap}.source-content figure,.source-content table{max-width:100%;overflow-x:auto}.source-content img{width:auto;max-width:100%!important;height:auto}

/* Final semantic overrides for legacy content blocks. */
.source-content>article>nav[aria-label="Daftar isi"]{display:block!important;width:100%!important;max-width:none!important;margin:0!important;padding:18px max(16px,calc((100% - 1180px)/2))!important;background:var(--cream)!important;border-bottom:var(--line)!important;box-sizing:border-box!important}
.source-content>article>nav[aria-label="Daftar isi"]>div{display:block!important;width:min(1180px,100%)!important;max-width:1180px!important;margin:0 auto!important;padding:0!important;box-sizing:border-box!important}
.source-content>article>nav[aria-label="Daftar isi"] ol{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;align-items:center!important;gap:8px 28px!important;width:100%!important;margin:8px 0 0!important;padding:0 0 0 22px!important;box-sizing:border-box!important}
.source-content>article>nav[aria-label="Daftar isi"] li{width:auto!important;max-width:none!important;margin:0!important;padding:0!important;white-space:nowrap!important}
.source-content>article>nav[aria-label="Daftar isi"] a{display:inline-block!important;font-size:.78rem!important;line-height:1.35!important}
.source-content dl{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important}
.source-content dl>div{min-width:0!important;box-sizing:border-box!important}
.source-content section>div>div:has(> figure:nth-child(2)){display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:16px!important}
.source-content section>div>div:has(> figure:nth-child(2)) figure{min-width:0!important}
.source-content section>div>div:has(> figure:nth-child(2)) img{display:block!important;width:100%!important;max-width:100%!important;height:auto!important}
.source-content>div:has(#faqFinder){display:block!important;width:100%!important;max-width:none!important;margin:0!important;padding:26px max(16px,calc((100% - 1180px)/2))!important;background:var(--cream)!important;border-bottom:var(--line)!important;box-sizing:border-box!important}.source-content>div:has(#faqFinder)>div{display:block!important;width:min(1180px,100%)!important;max-width:1180px!important;margin:0 auto!important;padding:0!important}.source-content>div:has(#faqFinder) [role="search"]{display:block!important;width:100%!important;max-width:100%!important;margin:0!important;padding:0!important}.source-content>div:has(#faqFinder) [role="search"]>div:first-child{display:flex!important;align-items:stretch!important;gap:10px!important;width:100%!important}.source-content>div:has(#faqFinder) #faqFinder{display:block!important;flex:1 1 auto!important;width:100%!important;min-width:0!important;height:48px!important;padding:10px 14px!important;border:var(--line)!important;background:#fff!important;font:inherit!important}.source-content>div:has(#faqFinder) #faqFinderClear{display:block!important;flex:0 0 auto!important;height:48px!important;padding:0 18px!important;background:var(--ink)!important;color:var(--cream)!important;border:var(--line)!important}.source-content>div:has(#faqFinder) [role="search"]>div:nth-child(2){display:flex!important;flex-wrap:wrap!important;gap:8px!important;margin-top:12px!important}.source-content>div:has(#faqFinder) [role="search"]>div:nth-child(2) button{padding:9px 14px!important;background:var(--ink)!important;color:var(--cream)!important;border:2px solid var(--ink)!important;font-size:.72rem!important}.source-content>div:has(#faqFinder) #faqFinderMeter{margin:12px 0 0!important;font-size:.76rem!important}
.source-content>article>nav{display:block!important;width:100%!important;max-width:none!important;margin:0!important;padding:18px max(16px,calc((100% - 1180px)/2))!important;background:var(--cream)!important;border-bottom:var(--line)!important;box-sizing:border-box!important}.source-content>article>nav>div{display:block!important;width:min(1180px,100%)!important;max-width:1180px!important;margin:0 auto!important;padding:0!important}.source-content>article>nav ol{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;align-items:center!important;gap:8px 28px!important;width:100%!important;margin:8px 0 0!important;padding:0 0 0 22px!important;box-sizing:border-box!important}.source-content>article>nav li{width:auto!important;max-width:none!important;margin:0!important;padding:0!important;white-space:nowrap!important}
@media(max-width:760px){.source-content>article>nav[aria-label="Daftar isi"]{padding:14px 12px!important}.source-content>article>nav[aria-label="Daftar isi"] ol{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px 16px!important;padding-left:20px!important}.source-content>article>nav[aria-label="Daftar isi"] li{white-space:normal!important}.source-content dl{grid-template-columns:1fr!important}.source-content dl>div:nth-child(odd){border-right:0!important}.source-content section>div>div:has(> figure:nth-child(2)){grid-template-columns:1fr!important}}
@media(max-width:760px){.source-content>article>nav{padding:14px 12px!important}.source-content>article>nav ol{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px 16px!important;padding-left:20px!important}.source-content>article>nav li{white-space:normal!important}}
@media(max-width:760px){.source-content>div:has(#faqFinder){padding:16px 12px!important}.source-content>div:has(#faqFinder) [role="search"]>div:first-child{gap:7px!important}.source-content>div:has(#faqFinder) #faqFinder,.source-content>div:has(#faqFinder) #faqFinderClear{height:44px!important}.source-content>div:has(#faqFinder) #faqFinderClear{padding:0 12px!important}}

/* Display the supplied wide wordmark without cropping it to the old square icon. */
.site-header .brand img {
    width: 150px;
    height: 54px;
    object-fit: contain;
    border: 0;
}

.site-header .brand span {
    display: none;
}

main.source-content img[src="/image/ayo368-logo-display.webp"] {
    object-fit: contain !important;
}

main.source-content a.community-inline-action {
    display: block;
    width: fit-content;
    margin-top: 13px;
    font-size: .78rem;
    font-weight: 700;
}

main.source-content p.community-teaser {
    max-width: 100%;
    margin: 24px 0 0;
    padding: 14px 18px;
    border-left: 4px solid var(--red);
    background: var(--cream);
    font-size: .8rem;
}

main.source-content p.community-teaser a {
    color: var(--red);
    font-weight: 700;
}

main.source-content > section:first-of-type figure img[src="/image/ayo368-hero-display.webp"] {
    width: min(100%, 340px) !important;
    height: auto !important;
    object-fit: contain !important;
}

@media (max-width: 760px) {
    .site-header .brand img {
        width: 130px;
        height: 47px;
    }

    main.source-content > section:first-of-type figure img[src="/image/ayo368-hero-display.webp"] {
        width: min(100%, 260px) !important;
    }
}

/* One consistent, unmistakable APK action across the landing, catalog and guide. */
main.source-content a.apk-download {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 10px 18px;
    border: var(--line);
    background: var(--red);
    color: var(--cream) !important;
    box-shadow: 5px 5px 0 var(--ink);
    text-decoration: none;
    font-size: .8rem;
    font-weight: 700;
    line-height: 1.3;
}

main.source-content a.apk-download:hover,
main.source-content a.apk-download:focus-visible { background: var(--ink); box-shadow: 5px 5px 0 var(--red); }
main.source-content > section:first-of-type a.apk-download { margin: 0 14px 12px 0; }
main.source-content .release-card > a.apk-download { margin-bottom: 18px; }
main.source-content .apk-cta-row { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
main.source-content .apk-file-detail { font-size: .7rem; line-height: 1.5; }
main.source-content #apkChecksum { max-width: 100%; overflow-wrap: anywhere; word-break: break-all; }

@media (max-width: 520px) {
    main.source-content a.apk-download { width: fit-content; max-width: 100%; text-align: center; }
}

/* Locally hosted SVG icons: social destinations, no third-party font or runtime. */
.site-footer .footer-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px 30px;
}

.site-footer .social-links {
    display: flex;
    grid-column: 1 / -1;
    flex-wrap: wrap;
    gap: 10px;
    padding-top: 16px;
    border-top: 1px solid rgba(255,255,255,.34);
}

.site-footer .social-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    border: 1px solid rgba(255,255,255,.45);
    color: var(--cream);
    text-decoration: none;
    font-size: .72rem;
}

.site-footer .social-link:hover,
.site-footer .social-link:focus-visible { border-color: var(--gold); background: rgba(255,255,255,.13); }
.site-footer .social-link img { display: block; width: 25px; height: 25px; flex: 0 0 auto; }

main.source-content > section.social-section { background: var(--cream); }
main.source-content > section.social-section > div > header { margin-bottom: 27px; }
main.source-content > section.social-section .social-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
}

main.source-content .social-card {
    display: flex;
    align-items: center;
    gap: 13px;
    min-height: 72px;
    min-width: 0;
    padding: 13px;
    border: var(--line);
    background: #fffdf8;
    color: var(--ink);
    text-decoration: none;
    font-size: .78rem;
    font-weight: 700;
}

main.source-content .social-card:nth-child(even) { background: #dfc9a2; }
main.source-content .social-card:hover, main.source-content .social-card:focus-visible { box-shadow: 5px 5px 0 var(--red); }
main.source-content .social-card img { display: block; width: 32px; height: 32px; flex: 0 0 auto; }

main .contact-options { min-width: 0; padding: 25px; border: var(--line); background: var(--cream); }
main .contact-options h2 { margin: 15px 0; font: 700 clamp(1.8rem,3vw,2.5rem)/1.1 var(--serif); }
main .contact-option-links { display: grid; gap: 12px; margin-top: 22px; }
main .contact-option-links a { padding: 10px 12px; border: 2px solid var(--ink); color: var(--red); font-size: .8rem; font-weight: 700; text-decoration: none; }
main .contact-option-links a:hover, main .contact-option-links a:focus-visible { background: #dfc9a2; }

@media (max-width: 900px) {
    main.source-content > section.social-section .social-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    .site-footer .footer-grid { grid-template-columns: minmax(0, 1fr); }
    .site-footer .social-links { grid-column: 1; }
    main.source-content > section.social-section .social-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    main.source-content .social-card:last-child { grid-column: 1 / -1; }
}