.desk{background-color:#f2f2f2;background-image:linear-gradient(90deg,#e0e0e0 1px,#0000 1px),linear-gradient(#e0e0e0 1px,#0000 1px);background-size:calc(28px * var(--zoom,1)) calc(28px * var(--zoom,1));background-position:50%;flex-direction:column;min-height:100svh;padding-inline:20px;display:flex;position:relative;overflow:hidden}.intro-loader{z-index:2000;background-color:#f2f2f2;background-image:linear-gradient(90deg,#e0e0e0 1px,#0000 1px),linear-gradient(#e0e0e0 1px,#0000 1px);background-position:50%;background-size:28px 28px;place-items:center;transition:opacity .5s,visibility .5s;display:grid;position:fixed;inset:0}.intro-loader.is-leaving{opacity:0;visibility:hidden;pointer-events:none}.intro-word{width:min(560px,82vw);height:auto;transition:transform .45s;overflow:visible}.intro-loader.is-leaving .intro-word{transform:translateY(-14px)scale(.96)}.intro-word path{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1px;animation-name:intro-draw;animation-timing-function:cubic-bezier(.45,.05,.35,1);animation-fill-mode:forwards}@keyframes intro-draw{to{stroke-dashoffset:0}}.desk.is-loading .sticker,.desk.is-loading .stack,.desk.is-loading .desk-hint{opacity:0}.desk.is-dropping .sticker{animation:sticker-drop .95s cubic-bezier(.22, .9, .32, 1) var(--drop-delay,0s) both}@keyframes sticker-drop{0%{translate:0 -115vh;rotate:-14deg}62%{translate:0 10px;rotate:3deg}80%{translate:0 -5px;rotate:-1deg}to{translate:0;rotate:0deg}}.desk.is-dropping .stack{animation:.6s both stack-in}@keyframes stack-in{0%{opacity:0;translate:0 18px}}.desk.is-dropping .desk-hint{animation:.6s 1.2s both stack-in}.scribbles{z-index:0;pointer-events:none;width:min(1200px,100%);height:clamp(640px,100svh - 120px,900px);position:absolute;top:0;left:50%;overflow:visible;transform:translate(-50%)}.scribbles path{fill:none;stroke-linecap:round;stroke-linejoin:round;opacity:.9;stroke-dasharray:1;stroke-dashoffset:1px}.scribbles.is-drawing path{animation:scribble-draw var(--dur,1.2s) cubic-bezier(.45, .05, .35, 1) var(--delay,0s) forwards}.scribbles.is-drawn path{stroke-dashoffset:0;animation:none}@keyframes scribble-draw{to{stroke-dashoffset:0}}.world{transform-origin:50%;transition:transform .18s ease-out;position:relative}.desk-bar{z-index:2100;padding-block:20px;position:relative}.board{width:min(1200px,100%);height:clamp(640px,100svh - 120px,900px);margin-inline:auto;position:relative}.sticker{width:var(--s);transform:translate(-50%, -50%) translate(var(--dx,0px), var(--dy,0px)) rotate(var(--r,0deg));cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;transition:scale .15s;display:block;position:absolute;top:0;left:0}.sticker:hover{scale:1.06}.sticker:active{cursor:grabbing;scale:1.1}.sticker:focus-visible{outline:2px solid var(--fg);outline-offset:6px;border-radius:12px}.sticker svg{display:block;overflow:visible}.pill{white-space:nowrap;color:#111;font-family:var(--font-mono), ui-monospace, monospace;background:#fff;border:2px solid #111;border-radius:999px;padding:7px 16px;font-size:14px;font-weight:600;display:inline-block;box-shadow:0 0 0 5px #fff,0 6px 14px #00000024}.sticker-role{width:auto}.combo{display:block;position:relative}.combo .cutout{margin-inline:auto}.sticker-monas .combo .cutout{width:58%}.sticker-monas .combo{padding-bottom:14px}.combo-tag{white-space:nowrap;position:absolute;left:50%}.combo-tag-bottom{bottom:0;transform:translate(-50%)rotate(4deg)}.sticker-laptop .combo{padding-bottom:14px}.sticker-resume .combo,.sticker-email .combo,.sticker-calendar .combo,.sticker-scooter .combo,.sticker-plane .combo,.sticker-cart .combo{padding-bottom:10px}.sticker-email .combo-tag,.sticker-phone .combo-tag,.sticker-calendar .combo-tag,.sticker-monas .combo-tag,.sticker-scooter .combo-tag,.sticker-plane .combo-tag,.sticker-cart .combo-tag{opacity:0;transition:opacity .25s,scale .45s cubic-bezier(.34,1.56,.64,1);scale:.4}.email-hover .sticker-email .combo-tag,.phone-hover .sticker-phone .combo-tag,.calendar-hover .sticker-calendar .combo-tag,.monas-hover .sticker-monas .combo-tag,.scooter-hover .sticker-scooter .combo-tag,.plane-hover .sticker-plane .combo-tag,.cart-hover .sticker-cart .combo-tag{opacity:1;scale:1}.bubble{color:#111;width:220px;font-family:var(--font-sans), ui-sans-serif, system-ui, sans-serif;text-align:left;white-space:normal;pointer-events:none;opacity:0;transform:translateY(-50%) rotate(calc(var(--r,0deg) * -1)) scale(.6);background:#fff;border:1.5px solid #111;border-radius:16px;padding:10px 13px;font-size:14px;font-weight:500;line-height:1.4;transition:opacity .18s,transform .35s cubic-bezier(.34,1.56,.64,1);position:absolute;top:50%;box-shadow:0 8px 20px #00000024}.bubble-right{transform-origin:0;border-bottom-left-radius:4px;left:calc(100% + 12px)}.bubble-left{transform-origin:100%;border-bottom-right-radius:4px;right:calc(100% + 12px)}.sticker:hover .bubble,.sticker:focus-visible .bubble{opacity:1;transform:translateY(-50%) rotate(calc(var(--r,0deg) * -1)) scale(1)}.sticker:hover,.sticker:focus-visible{z-index:300!important}.desk:has(.sticker-photo:hover,.sticker-photo:focus-visible) :is(.sticker-cart,.sticker-plane,.sticker-scooter) .combo-tag{opacity:1;scale:1}.desk:has(.sticker-photo:hover,.sticker-photo:focus-visible) :is(.sticker-cart,.sticker-plane,.sticker-scooter) .cutout{animation:.55s cubic-bezier(.34,1.56,.64,1) both case-pop}.desk:has(.sticker-photo:hover,.sticker-photo:focus-visible) .sticker-plane .cutout{animation-delay:60ms}.desk:has(.sticker-photo:hover,.sticker-photo:focus-visible) .sticker-scooter .cutout{animation-delay:.12s}@keyframes case-pop{0%{transform:scale(1)}45%{transform:scale(1.18)rotate(-4deg)}to{transform:scale(1.08)}}:is(.sticker-resume,.sticker-laptop) .combo-tag{opacity:0;transition:opacity .25s,scale .45s cubic-bezier(.34,1.56,.64,1);scale:.4}:is(.sticker-resume,.sticker-laptop):is(:hover,:focus-visible) .combo-tag{opacity:1;scale:1}.lab-widget{text-align:left;background:#fff;border:1.5px solid #111;border-radius:14px;width:100%;display:block;overflow:hidden;box-shadow:0 0 0 5px #fff,0 10px 24px #0000002e}.lab-bar{font-family:var(--font-mono), ui-monospace, monospace;color:var(--muted);border-bottom:1.5px solid #111;align-items:center;gap:5px;padding:7px 10px;font-size:10px;display:flex}.lab-bar i{border:1.5px solid #111;border-radius:50%;width:8px;height:8px}.lab-bar span{margin-left:6px}.lab-body{gap:4px;padding:10px 10px 11px;display:grid}.lab-title{font-family:var(--font-sans), ui-sans-serif, system-ui, sans-serif;letter-spacing:-.01em;color:#111;font-size:16px;font-weight:600;line-height:1.2}.lab-sub{font-family:var(--font-mono), ui-monospace, monospace;color:var(--muted);font-size:10.5px}.lab-soon{font-family:var(--font-mono), ui-monospace, monospace;color:#111;background:#ffd60a;border:1px solid #111;border-radius:6px;justify-self:start;margin-top:4px;padding:2px 7px;font-size:9.5px;font-weight:600}.lab-grid{grid-template-columns:1fr 1fr;gap:5px;margin-top:6px;display:grid}.lab-grid img{aspect-ratio:8/5;object-fit:cover;object-position:top;border:1px solid #e3e3e3;border-radius:6px;width:100%;height:auto;transition:transform .4s cubic-bezier(.34,1.56,.64,1);display:block}.lab-go{font-family:var(--font-mono), ui-monospace, monospace;color:#111;margin-top:6px;font-size:11px;font-weight:600}.sticker-lab:hover .lab-grid img:first-child{transform:rotate(-4deg)translate(-2px,-2px)}.sticker-lab:hover .lab-grid img:nth-child(2){transform:rotate(3deg)translate(2px,-3px)}.sticker-lab:hover .lab-grid img:nth-child(3){transform:rotate(3deg)translate(-2px,2px)}.sticker-lab:hover .lab-grid img:nth-child(4){transform:rotate(-3deg)translate(2px,2px)}.sticker-lab:hover .lab-go{color:#ff3b30}.bubble-by{font-family:var(--font-mono), ui-monospace, monospace;color:var(--muted);margin-top:6px;font-size:11px;font-weight:400;display:block}.kind-words{background:0 0;border:0;width:min(640px,100vw - 32px);max-height:calc(100dvh - 48px);margin:auto;padding:0;overflow:visible}.kind-words::backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0a0a0a73}.kind-words[open]{animation:.28s cubic-bezier(.34,1.4,.64,1) kind-in}@keyframes kind-in{0%{opacity:0;transform:translateY(14px)scale(.97)}}.kind-words-panel{background:#f2f2f2;border-radius:22px;max-height:calc(100dvh - 48px);padding:20px 20px 24px;overflow-y:auto;box-shadow:0 24px 60px #00000040}.kind-words-panel header{justify-content:space-between;align-items:center;display:flex}.kind-words-panel h2{letter-spacing:-.01em;font-size:22px;font-weight:500}.kind-words-panel header button{cursor:pointer;background:#fff;border:1.5px solid #111;border-radius:50%;width:36px;height:36px;font-size:20px;line-height:1}.kind-words-panel header button:focus-visible{outline-offset:2px;outline:2px solid #111}.kind-words-intro{color:var(--muted);margin-top:4px;font-size:14px}.kind-words-list{gap:12px;margin-top:16px;display:grid}@media (prefers-reduced-motion:reduce){.kind-words[open]{animation:none}}.kind-board{color:#f2f2f2;width:100%;font-family:var(--font-mono), ui-monospace, monospace;text-align:left;background:#0d0d0d;border-radius:14px;gap:8px;padding:12px;display:grid;box-shadow:0 0 0 5px #fff,0 10px 24px #00000038}.kb-head{justify-content:space-between;align-items:baseline;gap:8px;display:flex}.kb-title{font-size:12.5px;font-weight:600}.kb-live{color:#9a9a9a;text-transform:uppercase;letter-spacing:.05em;align-items:center;gap:5px;font-size:9.5px;display:inline-flex}.kb-dot{background:#34c759;border-radius:50%;width:6px;height:6px;animation:1.6s ease-in-out infinite kb-blink;box-shadow:0 0 6px #34c759}@keyframes kb-blink{50%{opacity:.25}}.kb-cols,.kb-row{grid-template-columns:10fr 8fr;gap:6px;display:grid}.kb-cols{color:#7a7a7a;text-transform:uppercase;letter-spacing:.08em;font-size:8.5px}.kb-rows{gap:3px;display:grid}.flaps{gap:1px;min-width:0;display:flex}.flap{color:#f2f2f2;font-variant-numeric:tabular-nums;background:linear-gradient(#202020 50%,#191919 50%);border-radius:2px;flex:1 1 0;place-items:center;min-width:0;height:15px;font-size:9.5px;font-weight:600;line-height:1;display:grid}.kb-quote{min-height:3.6em;font-family:var(--font-sans), ui-sans-serif, system-ui, sans-serif;color:#e6e6e6;font-size:11.5px;line-height:1.35;animation:.4s both kb-quote-in;display:block}.kb-by{color:#9a9a9a}@keyframes kb-quote-in{0%{opacity:0;transform:translateY(4px)}}.kb-foot{color:#9a9a9a;font-size:10px}.sticker-kind:hover .kb-foot{color:#fff}@media (prefers-reduced-motion:reduce){.kb-dot,.kb-quote{animation:none}}.phone-combo{justify-items:center;display:grid}.phone-cord{width:18px;height:58px;margin-bottom:-6px;display:block}.phone-combo .cutout{width:36%}.phone-tag{top:62%;left:64%;transform:rotate(-8deg)}.tag{color:#111;font:600 12px var(--font-mono), ui-monospace, monospace;background:#fff;border:1.5px solid #111;border-radius:6px;padding:3px 9px;display:inline-block;box-shadow:0 0 0 4px #fff,0 4px 10px #00000024}.cutout{pointer-events:none;filter:drop-shadow(0 4px 8px #0000002e);width:100%;height:auto;display:block}.stack{z-index:50;outline:none;width:min(400px,92%);position:absolute;top:53%;left:50%;transform:translate(-50%,-50%)}.stack:focus-visible .card{outline:2px solid var(--fg);outline-offset:4px}.stack-shadow span{background:#fff;border:1.5px solid #111;border-radius:20px;position:absolute;inset:0}.stack-shadow span:first-child{transform:translateY(10px)scale(.97)}.stack-shadow span:nth-child(2){transform:translateY(20px)scale(.94)}.stack-shadow span:nth-child(3){transform:translateY(30px)scale(.91)}.stack-shadow span:first-child{z-index:3}.stack-shadow span:nth-child(2){z-index:2}.stack-shadow span:nth-child(3){z-index:1}.card{z-index:4;color:#fff;min-height:228px;font-family:var(--font-mono), ui-monospace, monospace;background:#111;border-radius:20px;flex-direction:column;gap:16px;padding:20px 22px 22px;animation:.28s both card-in;display:flex;position:relative;box-shadow:0 16px 40px #0000002e}@keyframes card-in{0%{opacity:0;transform:translateY(8px)}}.card-top{color:#9a9a9a;justify-content:space-between;align-items:center;font-size:12px;display:flex}.card-eyebrow{text-transform:uppercase;letter-spacing:.08em}.card-nav{font-variant-numeric:tabular-nums;align-items:center;gap:8px;display:flex}.card-nav button{color:#fff;cursor:pointer;background:0 0;border:1px solid #555;border-radius:50%;width:24px;height:24px;font-size:15px;line-height:1}.card-nav button:hover{border-color:#fff}.card-count{color:#fff}.card-text{text-wrap:pretty;flex:1;font-size:16px;line-height:1.55}.card-cta{color:#111;font:600 12.5px var(--font-mono), ui-monospace, monospace;cursor:pointer;background:#fff;border:0;border-radius:999px;align-self:flex-start;padding:7px 14px}.card-cta:hover{background:#e8e8e8}.card-more{color:#a3a3a3;text-underline-offset:3px;align-self:flex-start;margin-top:-6px;font-size:12px;text-decoration:underline}.card-more:hover{color:#fff}.card button:focus-visible,.card a:focus-visible{outline-offset:3px;outline:2px solid #fff}.desk-hint{text-align:center;font-family:var(--font-mono), ui-monospace, monospace;color:var(--muted);padding-block:8px 24px;font-size:12px}.draw-layer{pointer-events:none;width:300%;height:300%;position:absolute;top:-100%;left:-100%;overflow:visible}.draw-ink,.draw-capture{z-index:0}.draw-layer.is-drawing{z-index:1000;pointer-events:auto;cursor:crosshair;touch-action:none}.draw-layer.is-erasing{cursor:cell}.draw-toggle{z-index:120;color:#111;cursor:pointer;background:#fff;border:1.5px solid #111;border-radius:50%;place-items:center;width:52px;height:52px;display:grid;position:fixed;bottom:20px;right:20px;box-shadow:0 6px 18px #00000024}.draw-toggle.is-open{color:#fff;background:#111}.draw-toggle:focus-visible{outline-offset:3px;outline:2px solid #111}.draw-panel{z-index:120;color:#fff;width:min(320px,100vw - 40px);font-family:var(--font-mono), ui-monospace, monospace;background:#111;border-radius:18px;gap:14px;padding:16px;font-size:13px;display:grid;position:fixed;bottom:84px;right:20px;box-shadow:0 16px 40px #00000038}.draw-colors{grid-template-columns:repeat(8,1fr);gap:6px;display:grid}.swatch{aspect-ratio:1;cursor:pointer;border:2px solid #0000;border-radius:50%;width:100%}.swatch[aria-checked=true]{border-color:#fff;box-shadow:inset 0 0 0 2px #111}.swatch[style*=\#111111]{border-color:#555}.swatch[style*=\#111111][aria-checked=true]{border-color:#fff}.draw-tools{justify-content:space-between;gap:8px;display:flex}.draw-history{gap:6px;display:flex}.tool{font:inherit;color:#fff;cursor:pointer;background:0 0;border:1px solid #444;border-radius:999px;padding:5px 11px}.tool[aria-pressed=true]{color:#111;background:#fff;border-color:#fff}.tool:disabled{opacity:.35;cursor:default}.draw-panel button:focus-visible,.draw-panel input:focus-visible{outline-offset:2px;outline:2px solid #fff}.draw-size{grid-template-columns:auto 1fr;align-items:center;gap:12px;display:grid}.draw-size input{accent-color:#0a84ff;width:100%}.draw-note{color:#9a9a9a;font-size:12px;line-height:1.5}.desk-dock{z-index:120;align-items:center;gap:10px;display:flex;position:fixed;bottom:26px;right:84px}.zoom-controls{font-family:var(--font-mono), ui-monospace, monospace;background:#fff;border:1.5px solid #111;border-radius:999px;align-items:center;font-size:13px;display:flex;box-shadow:0 6px 18px #0000001f}.zoom-controls button{font:inherit;color:#111;cursor:pointer;font-variant-numeric:tabular-nums;background:0 0;border:0;min-width:38px;height:38px;padding-inline:8px}.zoom-controls button:first-child,.zoom-controls button:last-child{font-size:18px}.zoom-controls .zoom-value{border-inline:1px solid #e3e3e3;min-width:52px}.zoom-controls button:disabled{color:#c4c4c4;cursor:default}.zoom-controls button:focus-visible{outline-offset:-3px;border-radius:999px;outline:2px solid #111}@media (prefers-reduced-motion:reduce){.desk:has(.sticker-photo:hover,.sticker-photo:focus-visible) :is(.sticker-cart,.sticker-plane,.sticker-scooter) .cutout{animation:none}.scribbles.is-drawing path{stroke-dashoffset:0;animation:none}.desk.is-dropping .sticker,.desk.is-dropping .stack,.desk.is-dropping .desk-hint{animation:none}.intro-word{transition:none}.intro-word path{stroke-dashoffset:0;animation:none}.bubble{transition:opacity .15s}.world,.sticker-email .combo-tag,.sticker-phone .combo-tag,.sticker-calendar .combo-tag,.sticker-monas .combo-tag,.sticker-scooter .combo-tag,.sticker-plane .combo-tag,.sticker-cart .combo-tag{transition:none}.card{animation:none}.sticker{transition:none}}.m-tag{display:none}@media (max-width:760px){.board{grid-template-columns:repeat(3,minmax(0,1fr));place-items:start center;gap:10px 6px;height:auto;padding-block:0 110px;display:grid}.sticker{width:min(88px, calc(var(--s) * .62));transform:rotate(var(--r,0deg));touch-action:auto;position:relative;top:auto!important;left:auto!important}.stack,.sticker-photo,.sticker-role,.sticker-phone{grid-area:1/1/auto/-1}.stack{align-self:start;width:100%;margin-block:100px 86px;position:relative;top:auto;left:auto;transform:none}.sticker-photo{justify-self:end;width:114px;margin-top:4px;margin-right:6px}.sticker-role{justify-self:start;width:auto;margin-top:60px;margin-left:2px}.sticker-phone{place-self:end;width:92px;margin-right:24px}.sticker-linkedin{order:1;width:54px;margin-top:8px}.sticker-email{order:2;width:80px}.sticker-calendar{order:3;width:80px}.sticker-resume{order:4;width:64px}.sticker-cart{order:5;width:72px}.sticker-plane{order:6;width:96px}.sticker-scooter{order:7;width:78px}.sticker-kind{order:7;grid-column:1/-1;width:100%;max-width:330px;margin-block:6px 4px}.sticker-laptop{order:8;width:84px}.sticker-monas{order:9;width:88px}.sticker-terminal{order:10;width:82px}.sticker-kopi{order:11;width:64px}.sticker-persib{order:12;width:70px}.sticker-gta6{order:13;width:84px}.sticker-lab{order:14;grid-column:1/-1;width:100%;max-width:330px;margin-block:6px 4px}.sticker-flag{order:15;width:82px}.sticker-email,.sticker-cart,.sticker-laptop,.sticker-kopi{margin-top:16px}.sticker-calendar,.sticker-plane,.sticker-monas,.sticker-persib,.sticker-flag{margin-top:6px}.sticker:not(.sticker-phone) .combo-tag,.m-tag{text-align:center;z-index:1;width:max-content;max-width:118px;margin-top:-12px;display:block;position:relative;bottom:auto;left:50%;transform:translate(-50%)rotate(3deg)}.sticker .combo-tag{opacity:1!important;scale:1!important}.combo{padding:0!important}.sticker-monas .combo .cutout{width:64%}.card{gap:12px;min-height:0;padding:16px 18px 18px}.card-text{font-size:14.5px;line-height:1.5}.sticker .tag{white-space:normal;max-width:118px;padding:3px 7px;font-size:10.5px;line-height:1.25}.sticker-phone .tag{white-space:nowrap}.pill{padding:6px 12px;font-size:12px}.desk-bar{padding-block:14px 8px}.desk-hint,.zoom-controls,.bubble,.peek,.scribbles{display:none}.world{transform:none!important}.desk{background-size:28px 28px}}
