@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700;800;900&display=swap');
:root{--bg:#fffbf7;--paper:#fff;--ink:#30262b;--muted:#647184;--coral:#f65b3d;--teal:#087f7b;--border:#e9e4e0;--shadow:0 4px 16px #3a292417;--radius:18px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);font-family:Nunito,'Segoe UI',Arial,sans-serif;color:var(--ink);font-size:15px}button,input,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}img{max-width:100%}h1,h2,h3,p{margin-top:0}.site-header{background:white;position:sticky;top:0;z-index:20;border-bottom:1px solid #f0e9e3}.header-inner{max-width:1570px;padding:11px 22px;margin:auto;display:flex;gap:30px;align-items:center;min-height:75px}.brand{display:flex;align-items:center;gap:8px;white-space:nowrap}.brand-icon{width:53px;height:53px;object-fit:contain}.brand strong{font-weight:900;font-size:31px;line-height:.9;display:block;letter-spacing:-1.6px}.brand small{font-size:11px;display:block;font-weight:900;margin-top:5px}.top-nav{display:flex;gap:3px;align-items:center;margin:auto}.top-nav a{display:flex;align-items:center;gap:9px;padding:10px 15px;border-radius:24px;font-weight:900;font-size:14px;white-space:nowrap}.top-nav a img{width:19px;height:19px}.top-nav a:hover,.top-nav .nav-active{background:#ffebe2;color:#a9341e}.header-actions{display:flex;align-items:center;gap:12px}.header-search{display:flex;align-items:center;gap:12px;border:1px solid #dce0e7;border-radius:30px;padding:8px 15px;min-width:320px;background:#fafbfe}.header-search img,.icon-button img{width:22px;height:22px}.header-search input{border:0;background:transparent;outline:0;width:100%;font-size:13px}.icon-button{background:transparent;border:0;width:36px;height:36px;display:grid;place-items:center;position:relative}.notif-dot{position:absolute;right:3px;top:2px;width:9px;height:9px;border-radius:50%;background:var(--coral)}.avatar{background:#ffc168;width:40px;height:40px;border-radius:50%;border:0;font-size:25px}.mobile-menu,.mobile-search{display:none}.hero{max-width:1672px;margin:0 auto;min-height:218px;background:#fff0e4;display:flex;align-items:stretch;overflow:hidden;position:relative}.hero-copy{padding:29px max(24px,calc((100vw - 1490px)/2));padding-right:0;position:relative;z-index:2;flex:0 0 45%}.hero h1{font-size:clamp(24px,2.35vw,35px);font-weight:900;letter-spacing:-1px;line-height:1.08;margin-bottom:13px}.hero h1 span{color:var(--coral)}.hero p{font-weight:700;line-height:1.35;max-width:520px;color:#546273;margin-bottom:15px}.hero-art{background-image:url('/images/hero-community-desktop.jpg');background-position:center right;background-size:cover;flex:1;min-width:0}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.button{display:inline-flex;align-items:center;gap:8px;border:0;border-radius:13px;padding:10px 19px;font-weight:900;justify-content:center}.button img{width:20px;height:20px}.button-coral{background:var(--coral);color:white}.button-coral img{filter:brightness(0) invert(1)}.button-outline{color:var(--teal);background:#faffff;border:2px solid var(--teal)}.button-outline img{filter:invert(40%) sepia(44%) saturate(1152%) hue-rotate(130deg)}.button-teal{background:var(--teal);color:#fff;width:100%}.layout{max-width:1580px;margin:25px auto;padding:0 20px;display:grid;grid-template-columns:minmax(210px,1fr) minmax(480px,1.95fr) minmax(240px,1.04fr);gap:20px;align-items:start}.left-sidebar,.right-sidebar{display:grid;gap:18px}.panel,.post{background:white;border:1px solid var(--border);box-shadow:var(--shadow);border-radius:var(--radius);padding:17px}.panel h2{display:flex;align-items:center;gap:9px;font-size:19px;font-weight:900;margin:0 0 10px}.panel h2 img{width:30px;height:30px;object-fit:contain}.panel p{line-height:1.4;color:var(--muted);font-size:13px;margin-bottom:12px}.chips{display:flex;gap:9px;flex-wrap:wrap}.chips button,.tag{border:0;background:#fcece8;padding:8px 13px;border-radius:22px;font-weight:800;font-size:12px;color:#453c41}.chips button:nth-child(2),.tag-css{background:#e9f2ff}.chips button:nth-child(3){background:#fff0d1}.chips button:nth-child(4){background:#e7fbff}.chips button:nth-child(5){background:#efebff}.chips button:nth-child(6){background:#f0efff}.chips button:hover{outline:2px solid #faa47e}.more{display:inline-block;color:#007779;font-size:13px;font-weight:900;margin-top:16px}.questions-panel{background:#effaff;border-color:#bbe4ff}.question-list{display:grid;gap:2px}.question-item{background:white;border:0;padding:12px 10px;display:flex;gap:12px;align-items:center;text-align:left;width:100%;border-bottom:1px solid #e7edf3;font-size:13px;font-weight:900}.question-item:before{content:'?';color:var(--coral);border:2px solid var(--coral);border-radius:50%;width:19px;height:19px;display:grid;place-items:center;flex:none}.question-item span{margin-left:auto;color:#697184}.feed-toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}.feed-tabs{display:flex;gap:5px;overflow:auto}.feed-tabs button{border:0;background:transparent;padding:11px 14px;white-space:nowrap;font-weight:900;border-radius:22px}.feed-tabs button.active{background:#ffebe5;color:#de4c26}.feed-toolbar select{border-radius:28px;border:1px solid #e4e5e8;background:white;padding:8px}.post{padding:15px;margin-bottom:12px}.post-head{display:flex;align-items:center;gap:9px;font-size:13px}.post-head .post-avatar{width:38px;height:38px;border-radius:50%;object-fit:cover}.post-head b{font-weight:900}.post-time{color:var(--muted);font-size:12px}.post-label{margin-left:auto;font-size:12px;font-weight:900;padding:4px 10px;border-radius:25px;background:#e6f7e3;color:#31743a}.post-label.soalan{background:#ebeaff;color:#474bb2}.post-label.tips{background:#eef8d8;color:#68710c}.post-more{font-weight:900;padding:3px;color:#6a6f75}.post h3{font-size:16px;font-weight:900;line-height:1.25;margin:7px 0}.post-body{display:flex;gap:13px}.post-thumb{width:145px;max-height:95px;flex:none;object-fit:cover;border-radius:10px}.post-content p{color:#4a5362;line-height:1.38;font-size:13px;margin:0 0 7px}.tags{display:flex;gap:6px;flex-wrap:wrap}.tag{background:#f0eff8;padding:4px 10px}.post-actions{display:flex;align-items:center;gap:19px;margin-top:10px;color:#434953}.post-actions button{border:0;background:none;display:inline-flex;gap:6px;align-items:center;font-size:13px}.post-actions img{width:18px;height:18px}.post-actions button.liked{color:var(--coral)}.post-actions button.saved{color:var(--teal)}.post-actions .views{margin-left:auto;font-size:12px;color:var(--muted)}.ai-panel{background:#fff0ed;border-color:#ffd8d1}.ai-panel h2 img{width:41px;height:41px}.chat-bubble{padding:13px;border-radius:15px;background:#fff;font-size:13px;line-height:1.45;margin:8px 0}.user-chat{margin-left:26px}.ai-chat{margin-left:26px}pre{background:#1e2431;color:#eaf0ff;border-radius:8px;padding:12px;overflow:auto;margin:7px 0 0;font-size:12px}.community-panel{background:#ebfbf5;border-color:#c7eee3}.members{font-size:21px;margin-bottom:12px}.members span{display:block;font-size:12px;font-weight:800}.mobile-topics{display:none}.ask-section{max-width:900px;margin:20px auto 45px;padding:22px;background:#fff;border:1px solid var(--border);box-shadow:var(--shadow);border-radius:22px}.ask-section h2{margin-bottom:6px}.ask-section p{color:var(--muted)}.ask-section label{display:block;font-weight:900;margin-bottom:7px}.ask-row{display:flex;gap:9px}.ask-row input{flex:1;padding:13px;border:1px solid #ddd;border-radius:12px;min-width:0}.ask-result{margin-top:14px;line-height:1.6}.result-card{border:1px solid #bee7da;background:#f4fcf9;border-radius:12px;padding:15px}.footer{padding:30px 20px;text-align:center;background:#fff3e8;font-weight:900}.footer span{font-weight:600;color:var(--muted);display:block;font-size:12px}.bottom-nav{display:none}.toast{position:fixed;bottom:90px;left:50%;transform:translateX(-50%);z-index:100;background:#272535;color:#fff;padding:10px 15px;border-radius:12px;box-shadow:var(--shadow);display:none;max-width:90vw;text-align:center}.toast.show{display:block}.empty-state{text-align:center;padding:35px;color:#7b8190}#artikel,#tanya,#komuniti,#feed{scroll-margin-top:90px}
@media(max-width:1180px){.header-inner{gap:12px}.header-search{min-width:200px}.top-nav a{padding:9px}.layout{grid-template-columns:230px minmax(350px,1fr)}.right-sidebar{grid-column:2;grid-row:2;grid-template-columns:1fr 1fr}.hero-copy{flex-basis:52%;padding-left:25px}}
@media(max-width:760px){body{padding-bottom:72px;font-size:14px}.site-header{position:sticky}.header-inner{padding:8px 13px;min-height:67px;gap:10px}.mobile-menu,.mobile-search{display:grid}.brand-icon{width:44px;height:44px}.brand strong{font-size:27px}.brand small{font-size:9px}.top-nav{display:none;position:absolute;top:65px;left:10px;right:10px;background:white;border:1px solid var(--border);box-shadow:var(--shadow);border-radius:16px;padding:12px;flex-direction:column;align-items:stretch}.top-nav.open{display:flex}.header-search{display:none;position:absolute;top:64px;left:12px;right:12px;z-index:20;background:white;min-width:0}.header-search.open{display:flex}.header-actions{margin-left:auto;gap:1px}.avatar-main{width:32px;height:32px;font-size:21px}.hero{min-height:0;display:block;background:#fff3e9}.hero-copy{padding:22px 18px 10px}.hero h1{font-size:clamp(25px,6vw,34px);max-width:490px}.hero h1 br{display:none}.hero p{font-size:13px;margin-bottom:11px}.hero-art{height:160px;background-image:url('/images/hero-community-mobile.jpg');background-position:center center;background-size:cover}.hero-actions .button{font-size:13px;padding:9px 14px}.mobile-topics{display:flex;align-items:center;gap:9px;background:white;border-radius:14px;margin:12px;overflow:auto;padding:12px;border:1px solid var(--border);box-shadow:var(--shadow)}.mobile-topics strong{white-space:nowrap;font-size:12px}.mobile-topics .chips{flex-wrap:nowrap}.mobile-topics .chips button{white-space:nowrap;padding:7px 10px}.layout{display:flex;flex-direction:column;padding:0 12px;margin:18px auto;gap:12px}.feed-column{width:100%;order:1}.right-sidebar{display:contents}.right-sidebar .ai-panel{order:2;width:100%}.left-sidebar{display:contents}.left-sidebar .topic-panel{display:none}.left-sidebar .questions-panel{order:3;width:100%}.right-sidebar .community-panel{order:4;width:100%}.feed-toolbar select{display:none}.feed-tabs{width:100%}.feed-tabs button{padding:9px 10px;font-size:13px}.post{padding:12px}.post-thumb{width:107px;max-height:90px}.post h3{font-size:14px}.post-content p{font-size:12px}.post-actions{gap:12px}.post-actions .views{display:none}.post-head .post-avatar{width:32px;height:32px}.post-head{font-size:12px}.post-label{font-size:11px}.panel{padding:14px}.panel h2{font-size:18px}.ask-section{margin:14px 12px;padding:15px}.ask-row{flex-direction:column}.bottom-nav{display:flex;position:fixed;bottom:0;left:0;right:0;height:67px;z-index:40;background:#fff;border-top:1px solid var(--border);justify-content:space-around;box-shadow:0 -4px 18px #00000012}.bottom-nav a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:12px;gap:3px}.bottom-nav img{width:22px;height:22px}.bottom-nav a.active{background:#fff0e9;color:var(--coral)}.footer{font-size:12px}.toast{bottom:80px}}
@media(max-width:390px){.brand strong{font-size:24px}.header-inner{gap:3px}.hero h1{font-size:25px}.post-thumb{width:87px}.post-content p{font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}