:root{color-scheme:dark;--paper:#080b1b;--paper-2:#0d1328;--white:#121a33;--ink:#f3f5ff;--muted:#b2bdd8;--line:#293555;--accent:#a6b2ff;--accent-dark:#c5ccff;--accent-soft:#20294b;--signal:#ff9b9b;--mint:#153c43;--lilac:#25234d;--yellow:#49381f;--serif:ui-rounded, "SF Pro Rounded", "SF Pro Display", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--sans:"SF Pro Text", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;--mono:ui-monospace, "SF Mono", "Cascadia Code", "Roboto Mono", monospace;--measure:72rem;--reading:43rem;--gutter:clamp(1.1rem, 4vw, 4rem);--space-1:.5rem;--space-2:1rem;--space-3:1.5rem;--space-4:2.25rem;--space-5:3.5rem;--space-6:5.5rem;--space-7:8rem;--radius:18px;--shadow:0 18px 52px #00071470, 0 0 30px #687cff0c;--shadow-hover:0 24px 58px #000714a0, 0 0 34px #8b9dff20;--focus:0 0 0 4px #a6b2ff66;--layer-nav:20;--layer-overlay:50;--motion:.22s cubic-bezier(.2, .75, .25, 1)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:6rem}main{overflow-x:clip}body{background-color:var(--paper);min-height:100vh;color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;background-image:radial-gradient(1px 1px at 8% 14%,#dce5ff9c 98%,#0000),radial-gradient(1px 1px at 28% 73%,#cbd6ff78 98%,#0000),radial-gradient(1.5px 1.5px at 73% 24%,#fff6d88c 98%,#0000),radial-gradient(1px 1px at 91% 61%,#d4d9ff8c 98%,#0000),radial-gradient(1px 1px at 55% 47%,#dce5ff70 98%,#0000),radial-gradient(at 82% 2%,#32275b45,#0000 38%),radial-gradient(at 8% 35%,#122a5140,#0000 34%);background-size:340px 280px,410px 380px,520px 420px,460px 360px,580px 510px,auto,auto;background-attachment:fixed;margin:0;font-size:16px;line-height:1.65}a{color:inherit;text-underline-offset:.22em;text-decoration-thickness:1px}a:hover{color:var(--accent)}button,input,textarea,select{font:inherit}button,a,input,textarea,select{touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{box-shadow:var(--focus);outline:0}img,svg{max-width:100%}::selection{color:#080b1b;background:var(--accent)}.skip-link{z-index:100;background:var(--ink);color:var(--paper);border-radius:12px;padding:.7rem 1rem;position:absolute;top:-5rem;left:1rem}.skip-link:focus{top:1rem}.wrap{width:min(100% - 2 * var(--gutter), var(--measure));margin-inline:auto}.reading{max-width:var(--reading)}.eyebrow,.mono,.meta,.label{font-family:var(--mono);letter-spacing:.035em;font-size:.72rem}.eyebrow{color:var(--accent);text-transform:uppercase;font-weight:650}.muted{color:var(--muted)}.serif{font-family:var(--serif);letter-spacing:-.045em;font-weight:650}.rule{border:0;border-top:1px solid var(--line);margin:0}.button{min-height:48px;color:var(--ink);transition:transform var(--motion), background var(--motion), color var(--motion), border-color var(--motion), box-shadow var(--motion);background:#121a33;border:1px solid #64729a;border-radius:999px;justify-content:center;align-items:center;gap:.65rem;padding:.68rem 1.2rem;font-weight:650;text-decoration:none;display:inline-flex;box-shadow:0 4px 15px #00061455}.button:hover{color:var(--ink);box-shadow:var(--shadow-hover);background:#1a2546;border-color:#a6b2ff;transform:translateY(-2px)}.button.primary{color:#10142c;background:linear-gradient(120deg,#8798ff,#b68dff);border-color:#a6b2ff;box-shadow:0 8px 24px #8798ff3a}.button.primary:hover{color:#10142c;background:linear-gradient(120deg,#a8b5ff,#caaeff);border-color:#d4d7ff;box-shadow:0 10px 28px #8798ff55}.button.text{min-height:38px;color:var(--accent);box-shadow:none;background:0 0;border:0;padding:.25rem .2rem}.button.text:hover{color:#d1d6ff;box-shadow:none;background:0 0;transform:translate(3px)}.section{padding-block:var(--space-6)}.section-head{justify-content:space-between;align-items:end;gap:1.5rem;margin-bottom:2rem;display:flex}.section-head h2{font:680 clamp(2rem, 4vw, 3.15rem)/1.08 var(--serif);letter-spacing:-.05em;margin:.35rem 0 0}.section-head p{max-width:28rem;color:var(--muted);margin:0}.tag{font:.67rem var(--mono);color:#d2daf3;background:#151d37;border:1px solid #3a4668;border-radius:999px;align-items:center;padding:.24rem .7rem;display:inline-flex}.index{font:.7rem var(--mono);color:var(--accent);letter-spacing:.045em}.topbar{z-index:var(--layer-nav);backdrop-filter:blur(20px);background:#090d20d6;border-bottom:1px solid #344065a8;position:sticky;top:0}.nav{justify-content:space-between;align-items:center;gap:2rem;min-height:76px;display:flex}.brand{color:var(--ink);align-items:center;gap:.65rem;text-decoration:none;display:inline-flex}.brand:hover{color:var(--ink)}.brand-mark{color:#10142c;width:36px;height:36px;font:800 .82rem var(--sans);background:radial-gradient(circle at 30% 26%,#f5dca9,#a8a5ff 42%,#574a9e 75%,#22204d);border:1px solid #c9d0ff9c;border-radius:50%;place-items:center;display:grid;position:relative;box-shadow:0 0 20px #9e9eff53}.brand-mark:after{content:"";border:1px solid #c8caffb8;border-radius:50%;width:46px;height:14px;position:absolute;transform:rotate(-32deg)}.brand-copy{font:.8rem var(--mono);letter-spacing:.035em;align-items:baseline;display:flex}.brand-copy strong{font-weight:750}.brand-copy span{color:var(--muted)}.nav-links{align-items:center;gap:.3rem;display:flex}.nav-links a{color:var(--muted);transition:background var(--motion), color var(--motion);border-radius:999px;padding:.52rem .78rem;font-size:.85rem;text-decoration:none}.nav-links a:hover{color:var(--ink);background:#1b2441}.nav-links a[aria-current=page]{color:var(--ink);background:#1a2340;box-shadow:inset 0 0 0 1px #4c5a84}.menu-toggle{color:var(--ink);background:#131c36;border:1px solid #536083;border-radius:999px;padding:.5rem .85rem;font-weight:600;display:none}.footer{color:#f3f5ff;background:radial-gradient(at 80% 0,#282753,#0000 48%),linear-gradient(130deg,#080b1b,#10172d 65%,#171832);border-top:1px solid #343d63;padding-block:2.5rem 3rem}.footer a:hover{color:#c8d0ff}.footer-top{justify-content:space-between;align-items:start;gap:2rem;display:flex}.footer .brand{color:#fff}.footer-links{flex-wrap:wrap;gap:1.2rem;display:flex}.footer small{color:#b2bdd8}.page-intro{padding-block:clamp(4rem, 10vw, 8rem) var(--space-5)}.page-intro h1{font:700 clamp(3rem, 8vw, 6.5rem)/.99 var(--serif);letter-spacing:-.065em;text-wrap:balance;max-width:16ch;margin:.7rem 0 1rem}.page-intro p{color:var(--muted);max-width:44rem;font-size:1.1rem}.item-list{gap:.8rem;display:grid}.item-row{border:1px solid var(--line);transition:transform var(--motion), box-shadow var(--motion), border-color var(--motion);background:linear-gradient(135deg,#111a33ed,#0e152be8);border-radius:22px;grid-template-columns:minmax(8rem,1fr) 2fr minmax(8rem,.8fr);align-items:start;gap:1.5rem;padding:1.5rem;display:grid;box-shadow:0 8px 24px #00061545}.item-row:hover{box-shadow:var(--shadow-hover);border-color:#6676ad;transform:translateY(-3px)}.item-row h2,.item-row h3{font:680 clamp(1.3rem, 2.5vw, 1.8rem)/1.2 var(--serif);letter-spacing:-.04em;margin:0}.item-row h2 a,.item-row h3 a{text-decoration:none}.item-row p{color:var(--muted);margin:.45rem 0}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;display:grid}.panel{box-shadow:var(--shadow);background:linear-gradient(145deg,#151e39f2,#10172fef);border:1px solid #303c61;border-radius:24px;padding:clamp(1.2rem,3vw,1.7rem)}.form-field{gap:.4rem;margin:1rem 0;display:grid}.form-field label{font-weight:650}.form-field input,.form-field textarea,.form-field select{width:100%;color:var(--ink);background:#0a1023;border:1px solid #465477;border-radius:14px;padding:.78rem .9rem}.form-field input::placeholder,.form-field textarea::placeholder{color:#8995b4}.form-field input:focus,.form-field textarea:focus,.form-field select:focus{border-color:var(--accent)}.form-field textarea{resize:vertical;min-height:9rem}.notice{border:1px solid #46588e;border-left:4px solid var(--accent);background:#172144;border-radius:16px;padding:.85rem 1rem}.notice.warn{border-color:#754d5b;border-left-color:var(--signal);background:#2d1d30}.status{font:.68rem var(--mono);text-transform:uppercase;letter-spacing:.035em;color:#a1e5cf;background:#102b31;border:1px solid #286957;border-radius:999px;align-items:center;gap:.48rem;padding:.28rem .68rem;display:inline-flex}.status:before{content:"";background:#65e0b0;border-radius:100%;width:.43rem;height:.43rem;box-shadow:0 0 0 3px #65e0b020,0 0 10px #65e0b0a0}.reading-content h2{font:680 2rem/1.2 var(--serif);letter-spacing:-.04em;margin-top:2.5rem}.reading-content p{font-size:1.05rem}.reading-content pre{color:#e4e9ff;background:#080d1d;border:1px solid #303b5d;border-radius:16px;padding:1rem;overflow:auto}.prose-link{color:var(--accent)}.empty{color:var(--muted);background:#121a30b8;border:1px dashed #667294;border-radius:22px;padding:2rem}.admin-shell{padding-block:3rem 6rem}.admin-shell h1{font:700 clamp(2.5rem, 6vw, 4.5rem)/1 var(--serif);letter-spacing:-.055em}.admin-editor{min-height:55vh;font:.82rem/1.55 var(--mono);white-space:pre;tab-size:2}.admin-actions{flex-wrap:wrap;gap:.75rem;display:flex}.admin-status{min-height:1.6rem;color:var(--muted)}.admin-status.error{color:#ffaaa8}.admin-editor-form{gap:1rem;margin-top:1rem;display:grid}.admin-section>summary{cursor:pointer;justify-content:space-between;align-items:center;gap:1rem;list-style:none;display:flex}.admin-section>summary::-webkit-details-marker{display:none}.admin-section-title .eyebrow{font-size:.76rem}.admin-entry-list{gap:.8rem;margin:1rem 0;display:grid}.admin-entry{background:#0d142b99;border:1px solid #354264;border-radius:18px;padding:1rem}.admin-entry-head{justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:.5rem;display:flex}.admin-entry-head strong{color:var(--accent);font:.72rem var(--mono);letter-spacing:.08em}.admin-sublist{gap:.7rem;margin:1rem 0;display:grid}.admin-subentry{background:#080e20aa;border:1px solid #2c385a;border-radius:16px;padding:.8rem}.admin-subtitle{font:650 1.1rem/1.3 var(--serif);margin:1.25rem 0 .5rem}.admin-checkbox{align-items:center;gap:.55rem;margin:1rem 0;display:flex}.admin-checkbox input{width:1.15rem;height:1.15rem;accent-color:var(--accent)}.button.danger{color:#ffd2d1;background:#2d1d30;border-color:#754d5b}.tool-output{white-space:pre-wrap;overflow-wrap:anywhere;color:#e4e9ff;min-height:3rem;font:.84rem/1.6 var(--mono);background:#080d1d;border:1px solid #303b5d;border-radius:16px;padding:1rem}.tool-output:empty:before{content:"Hasil akan tampil di sini.";color:#aab4d0}.hero{isolation:isolate;padding-block:clamp(4.5rem,10vw,8.5rem) clamp(3.5rem,8vw,6rem);position:relative}.hero:before{content:"";z-index:-1;aspect-ratio:1;opacity:.9;width:min(42vw,35rem);translate:var(--planet-x,0px) var(--planet-y,0px);background:radial-gradient(circle at 32% 27%,#fff4d9 0 2%,#c1c4ff 5%,#8889e8 18%,#4c4b9a 40%,#282659 65%,#171638 78%);border-radius:50%;transition:translate .52s ease-out;animation:28s ease-in-out infinite alternate planet-drift;position:absolute;top:1.2rem;right:-2vw;box-shadow:inset -22px -20px 50px #07091d,0 0 55px #7674df55,0 0 140px #6456b833}.hero:after{content:"✦";z-index:-1;color:#ffe4a7;text-shadow:0 0 24px #ffe4a7a8;transform:rotate(12deg);translate:var(--star-x,0px) var(--star-y,0px);font-size:clamp(2rem,5vw,4rem);line-height:1;transition:translate .42s ease-out;animation:7s ease-in-out infinite alternate star-glint;position:absolute;top:17%;right:7%}.hero-grid{grid-template-columns:minmax(0,1.5fr) minmax(13rem,.65fr);align-items:center;gap:clamp(2rem,8vw,8rem);display:grid;position:relative}.hero-grid:after{content:"";z-index:-1;width:min(49vw,41rem);height:min(17vw,14rem);transform:rotate(-24deg);translate:var(--orbit-x,0px) var(--orbit-y,0px);border:1px solid #c0c5ff85;border-radius:50%;transition:translate .56s ease-out;animation:34s ease-in-out infinite alternate orbit-drift;position:absolute;top:8%;right:-5vw;box-shadow:0 0 16px #858fff26}@keyframes planet-drift{0%{transform:translateY(0)scale(1)}to{transform:translateY(-7px)scale(1.012)}}@keyframes orbit-drift{0%{opacity:.62;transform:rotate(-24deg)scale(1)}to{opacity:.92;transform:rotate(-20deg)scale(1.025)}}@keyframes star-glint{0%{opacity:.68;transform:rotate(10deg)scale(.96)}to{opacity:1;transform:rotate(18deg)scale(1.04)}}.hero:not([data-motion-ready]):before,.hero:not([data-motion-ready]):after,.hero:not([data-motion-ready]) .hero-grid:after,.hero[data-motion-paused]:before,.hero[data-motion-paused]:after,.hero[data-motion-paused] .hero-grid:after{animation-play-state:paused}.motion-actions{justify-items:start;gap:.5rem;margin-top:1rem;display:none}.hero[data-motion-ready] .motion-actions{display:grid}.motion-toggle{min-height:40px;color:var(--ink);cursor:pointer;font:.68rem var(--mono);transition:border-color var(--motion), background var(--motion), color var(--motion);background:#0b1227d9;border:1px solid #69739b;border-radius:999px;align-items:center;gap:.55rem;padding:.45rem .8rem;display:inline-flex}.motion-toggle:hover:not(:disabled){border-color:var(--accent);background:#172040}.motion-toggle:disabled{cursor:not-allowed;color:var(--muted)}.motion-toggle:disabled+.motion-hint{display:none}.motion-symbol{width:1em;color:var(--accent);font-family:var(--sans);text-align:center;font-weight:800}.motion-hint{color:var(--muted);font-size:.72rem}.hero h1{font:750 clamp(3.25rem, 6.1vw, 5.9rem)/.96 var(--serif);letter-spacing:-.07em;text-wrap:balance;max-width:12ch;margin:1rem 0 1.4rem}.hero-lede{max-width:40rem;color:var(--muted);font-size:clamp(1.04rem,1.5vw,1.2rem)}.hero-actions{flex-wrap:wrap;gap:.75rem;margin-top:2rem;display:flex}.hero-note{max-width:18rem;box-shadow:var(--shadow);backdrop-filter:blur(12px);color:var(--muted);background:#111a33dc;border:1px solid #69739b;border-radius:22px;justify-self:end;padding:1.25rem 1.35rem;font-size:.86rem}.hero-note strong{color:#a8ead5;font:650 .68rem var(--mono);text-transform:uppercase;background:#1a3c41;border-radius:999px;margin-bottom:.65rem;padding:.26rem .68rem;display:inline-flex}.hero-index{background:#141b35db;border:1px solid #545d8a;border-radius:999px;margin-bottom:.15rem;padding:.35rem .7rem;display:inline-flex}.feature-project{border:1px solid var(--line);box-shadow:var(--shadow);background:linear-gradient(135deg,#111a33f2,#15152fe8);border-radius:28px;grid-template-columns:.8fr 1.2fr;gap:clamp(2rem,6vw,6rem);padding:1.25rem;display:grid}.feature-project h3{font:700 clamp(2rem, 4vw, 3.5rem)/1.03 var(--serif);letter-spacing:-.055em;margin:.75rem 0 .5rem}.feature-project h3 a{text-decoration:none}.feature-project p{color:var(--muted);max-width:38rem}.feature-mark{background:radial-gradient(circle at 28% 28%,#fff1d3 0 2%,#0000 2.6%),radial-gradient(circle at 78% 68%,#e6b6ff 0 2px,#0000 3px),radial-gradient(circle at 20% 77%,#d5ddff 0 1.5px,#0000 2px),radial-gradient(circle at 72% 22%,#bcdcff 0 1.5px,#0000 2px),radial-gradient(circle at 56% 45%,#b0a2ff 0 0,#5859a6 18%,#24244d 43%,#0000 44%),radial-gradient(at 52% 60%,#514da8,#12162e 72%);border:1px solid #48527d;border-radius:22px;justify-content:center;align-items:center;min-height:18rem;display:flex;position:relative;overflow:hidden}.feature-mark:before,.feature-mark:after{content:"";border:1px solid #c7c8ff99;border-radius:50%;width:11rem;height:11rem;position:absolute;transform:rotate(-25deg)scaleX(1.5);box-shadow:0 0 15px #8185ff25}.feature-mark:after{border-color:#c5d1ff75;width:17rem;height:17rem;transform:rotate(22deg)scaleX(1.45)}.feature-mark span{z-index:1;color:#e4e8ff;font:.74rem var(--mono);backdrop-filter:blur(8px);background:#10172ce8;border:1px solid #929bc4;border-radius:999px;padding:.55rem .9rem;position:relative;box-shadow:0 5px 18px #00082350}.home-columns{grid-template-columns:1fr 1fr;gap:clamp(2rem,7vw,7rem);display:grid}.home-entry{border:1px solid var(--line);transition:transform var(--motion), box-shadow var(--motion), border-color var(--motion);background:linear-gradient(140deg,#111a33e8,#10162bea);border-radius:20px;margin-top:.8rem;padding:1.2rem;box-shadow:0 8px 22px #00061538}.home-entry:hover{box-shadow:var(--shadow-hover);border-color:#6875a6;transform:translateY(-3px)}.home-entry h3{font:680 1.5rem/1.2 var(--serif);letter-spacing:-.04em;margin:.5rem 0}.home-entry h3 a{text-decoration:none}.home-entry p{color:var(--muted);margin:.35rem 0 .8rem}.closeout{padding-block:var(--space-7);background:radial-gradient(at 86%,#38306480,#0000 38%),linear-gradient(115deg,#11152e,#151a39 56%,#10252f);border-block:1px solid #30395b;position:relative;overflow:hidden}.closeout:after{content:"✦";right:max(8vw, calc((100vw - var(--measure)) / 2));color:#ffe2a0;text-shadow:0 0 28px #ffe2a0aa;font-size:4rem;position:absolute;top:20%;transform:rotate(12deg)}.closeout h2{font:700 clamp(2.5rem, 6vw, 5.2rem)/1.02 var(--serif);letter-spacing:-.06em;max-width:13ch;margin:.7rem 0 1.4rem}@media (width<=760px){.nav{min-height:68px}.menu-toggle{display:inline-flex}.nav-links{padding:.75rem var(--gutter) 1rem;border-bottom:1px solid var(--line);background:#090d20f5;flex-direction:column;align-items:stretch;gap:.1rem;display:none;position:absolute;inset:68px 0 auto;box-shadow:0 14px 24px #00071880}.nav-links.open{display:flex}.nav-links a{padding:.72rem .85rem}.hero:before{opacity:.62;width:76vw;animation-duration:42s;top:1rem;right:-24vw}.hero:after{animation-duration:9s}.hero-grid:after{animation-duration:48s}.motion-hint{display:none}.hero:after{top:11%;right:7%}.hero-grid:after{width:90vw;height:30vw;top:6%;right:-20vw}.hero-grid,.feature-project{grid-template-columns:1fr}.hero h1{max-width:11.5ch}.hero-note{justify-self:start}.feature-mark{min-height:13rem}.home-columns,.grid-2{grid-template-columns:1fr}.section-head{flex-direction:column;align-items:start}.item-row{grid-template-columns:1fr;gap:.5rem}.item-row>div:last-child{flex-wrap:wrap;align-items:center;gap:.4rem;display:flex}.footer-top{flex-direction:column}.page-intro{padding-top:4rem}.admin-editor{min-height:65vh}.closeout:after{font-size:2.5rem;top:9%;right:7%}}@media (width<=420px){:root{--gutter:1rem}.hero h1{max-width:100%;font-size:3.05rem}.button{width:100%}.hero-actions{align-items:stretch}.section{padding-block:3.5rem}.feature-project{padding:.75rem}.feature-project>div:first-child{padding:.45rem}.item-row{padding:1.1rem}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.hero:before,.hero:after,.hero-grid:after{animation:none!important;translate:none!important}}
