:root{--ink:#1b0f2b;--ink-soft:#2a1743;--ink-line:#e6c8ff24;--paper:#fcf4fb;--paper-soft:#fff;--paper-line:#78288c1a;--text-hi:#f4e9ff;--text-mid:#c0a0de;--text-dark-hi:#3b1350;--text-dark-mid:#8a5fae;--purple:#a855f7;--cyan:#c084fc;--amber:#f472b6;--green:#e9b8f5;--coral:#e85d9e;--font-display:"Space Grotesk", sans-serif;--font-body:"Inter", sans-serif;--font-mono:"JetBrains Mono", monospace;--nav-h:76px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none}html::-webkit-scrollbar{display:none}body::-webkit-scrollbar{display:none}body{font-family:var(--font-body);background:var(--ink);color:var(--text-hi);-webkit-font-smoothing:antialiased;scrollbar-width:none;-ms-overflow-style:none;line-height:1.6;position:relative;overflow-x:hidden}body:before{content:"";z-index:-2;pointer-events:none;background-image:linear-gradient(#1b0f2bd9,#1b0f2bd9),url(/background-bg.png);background-position:50%;background-repeat:no-repeat;background-size:cover;position:fixed;inset:0}body.pointer-fine{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cdefs%3E%3ClinearGradient id='wg' x1='0%25' y1='0%25' x2='100%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%23a855f7'/%3E%3Cstop offset='60%25' stop-color='%23C084FC'/%3E%3Cstop offset='100%25' stop-color='%23f4d4ff'/%3E%3C/linearGradient%3E%3C/defs%3E%3C!-- Batang tongkat: ujung lancip di kiri-atas (1,2), melebar ke kanan-bawah --%3E%3Cpolygon points='1,2 4,0 42,37 39,41' fill='url(%23wg)' stroke='%231B0F2B' stroke-width='0.7' stroke-linejoin='round'/%3E%3C!-- Highlight sepanjang batang --%3E%3Cpolygon points='1,2 3,0 40,36 39,38' fill='%23ffffff' opacity='0.22'/%3E%3C!-- Kilap dekoratif kanan-atas --%3E%3Cpath d='M40 3 L41.2 7 L45.2 8.2 L41.2 9.4 L40 13.4 L38.8 9.4 L34.8 8.2 L38.8 7 Z' fill='%23f4d4ff' opacity='0.9'/%3E%3C!-- Kilap kecil kanan --%3E%3Cpath d='M46 17 L46.7 19.3 L49 20 L46.7 20.7 L46 23 L45.3 20.7 L43 20 L45.3 19.3 Z' fill='%23F472B6' opacity='0.8'/%3E%3C/svg%3E") 2 1,auto}body.pointer-fine a,body.pointer-fine button,body.pointer-fine .clickable{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='52' height='52' viewBox='0 0 52 52'%3E%3Cdefs%3E%3ClinearGradient id='wg2' x1='0%25' y1='0%25' x2='100%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%237e22ce'/%3E%3Cstop offset='50%25' stop-color='%23C084FC'/%3E%3Cstop offset='100%25' stop-color='%23f4d4ff'/%3E%3C/linearGradient%3E%3C/defs%3E%3C!-- Batang tongkat: ujung lancip di kiri-atas (1,2) --%3E%3Cpolygon points='1,2 5,0 46,40 42,45' fill='url(%23wg2)' stroke='%231B0F2B' stroke-width='0.7' stroke-linejoin='round'/%3E%3C!-- Highlight --%3E%3Cpolygon points='1,2 4,0 44,39 43,41' fill='%23ffffff' opacity='0.2'/%3E%3C!-- Kilap kanan-atas --%3E%3Cpath d='M43 3 L44.3 7.5 L48.8 8.8 L44.3 10.1 L43 14.6 L41.7 10.1 L37.2 8.8 L41.7 7.5 Z' fill='%23f4d4ff' opacity='0.95'/%3E%3C!-- Kilap kecil kanan --%3E%3Cpath d='M49 19 L49.8 21.6 L52.4 22.4 L49.8 23.2 L49 25.8 L48.2 23.2 L45.6 22.4 L48.2 21.6 Z' fill='%23F472B6' opacity='0.85'/%3E%3C!-- Kilap kecil tengah --%3E%3Cpath d='M34 30 L34.6 31.8 L36.4 32.4 L34.6 33 L34 34.8 L33.4 33 L31.6 32.4 L33.4 31.8 Z' fill='%23C084FC' opacity='0.8'/%3E%3C/svg%3E") 2 1,pointer}#glitter-canvas{pointer-events:none;z-index:9999;width:100%;height:100%;position:fixed;inset:0}a{color:inherit;text-decoration:none}ul{list-style:none}img,svg{max-width:100%;display:block}section{scroll-margin-top:var(--nav-h)}.eyebrow{font-family:var(--font-mono);letter-spacing:.02em;color:var(--amber);align-items:center;gap:.5em;margin-bottom:1rem;font-size:.8rem;display:inline-flex}section.on-light .eyebrow{color:#b23fa8}h1,h2,h3{font-family:var(--font-display);letter-spacing:-.01em;font-weight:700}.wrap{max-width:1160px;margin:0 auto;padding:0 clamp(1.25rem,4vw,2.5rem)}:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:3px}header.nav{z-index:500;height:var(--nav-h);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--ink-line);background:#0d1117b8;align-items:center;display:flex;position:fixed;top:0;left:0;right:0}.nav-inner{justify-content:space-between;align-items:center;width:100%;display:flex}.brand{font-family:var(--font-mono);color:var(--text-hi);align-items:center;gap:.4rem;font-size:1.05rem;font-weight:700;display:flex}.brand .brk{color:var(--purple)}.brand .dot{color:var(--amber);animation:1.4s steps(2,start) infinite blink}@keyframes blink{50%{opacity:0}}.tabs{font-family:var(--font-mono);gap:.35rem;font-size:.82rem;display:flex}.tabs a{color:var(--text-mid);border:1px solid #0000;border-radius:8px 8px 0 0;align-items:center;gap:.5rem;padding:.55rem .85rem;transition:color .2s,border-color .2s,background .2s;display:flex}.tabs a .tab-ext{color:var(--purple)}.tabs a:hover{color:var(--text-hi);background:var(--ink-soft)}.tabs a.active{color:var(--text-hi);background:var(--ink-soft);border-color:var(--ink-line);border-bottom-color:var(--ink-soft)}.lang-toggle{border:1px solid var(--ink-line);cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#2a174366;border-radius:30px;align-items:center;gap:0;margin-right:.25rem;padding:3px;transition:all .25s cubic-bezier(.4,0,.2,1);display:inline-flex}.lang-toggle:hover{background:#2a1743b3;border-color:#a855f780;transform:translateY(-1px);box-shadow:0 0 12px #a855f740}.lang-toggle span{font-family:var(--font-mono);color:var(--text-mid);border-radius:20px;padding:.25rem .65rem;font-size:.72rem;font-weight:700;line-height:1;transition:all .25s cubic-bezier(.4,0,.2,1);display:inline-block}.lang-toggle .lang-sep{display:none}.lang-toggle span.lang-active{color:#fff;background:linear-gradient(135deg, var(--purple) 0%, var(--coral) 100%);text-shadow:0 1px 2px #0003;box-shadow:0 2px 8px #e85d9e66}.lang-toggle:hover span:not(.lang-active){color:var(--text-hi)}.lang-toggle-mobile{text-align:left;cursor:pointer;width:100%;font-family:var(--font-mono);background:0 0;border:none}.btn-cv{font-family:var(--font-mono);color:var(--ink);background:linear-gradient(135deg, var(--amber) 0%, var(--purple) 100%);white-space:nowrap;border-radius:6px;align-items:center;gap:.4rem;padding:.45rem 1rem;font-size:.8rem;font-weight:600;transition:transform .2s,box-shadow .2s;display:inline-flex;position:relative;overflow:hidden;box-shadow:0 2px 10px #a855f74d}.btn-cv:after{content:"";background:linear-gradient(90deg,#0000,#ffffff2e,#0000);transition:transform .5s;position:absolute;inset:0;transform:translate(-100%)}.btn-cv:hover{transform:translateY(-2px);box-shadow:0 5px 18px #a855f773}.btn-cv:hover:after{transform:translate(100%)}.cv-icon{font-size:.95rem;font-style:normal;animation:1.6s ease-in-out infinite bounceDown}@keyframes bounceDown{0%,to{transform:translateY(0)}50%{transform:translateY(3px)}}@media (width<=768px){.btn-cv{display:none}}.hamburger{z-index:600;background:0 0;border:none;flex-direction:column;justify-content:space-between;width:24px;height:18px;padding:0;display:none}.hamburger .bar{background-color:var(--text-hi);width:100%;height:2px;transition:all .3s cubic-bezier(.645,.045,.355,1)}.hamburger.is-open .bar:first-child{transform:translateY(8px)rotate(45deg)}.hamburger.is-open .bar:nth-child(2){opacity:0}.hamburger.is-open .bar:nth-child(3){transform:translateY(-8px)rotate(-45deg)}.mobile-menu{z-index:550;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);opacity:0;visibility:hidden;background:#1b0f2bfa;justify-content:center;align-items:center;width:100vw;height:100vh;transition:opacity .3s,visibility .3s,transform .4s cubic-bezier(.16,1,.3,1);display:flex;position:fixed;inset:0;transform:translateY(-100%)}.mobile-menu.is-open{opacity:1;visibility:visible;transform:translateY(0)}.mobile-nav{font-family:var(--font-mono);flex-direction:column;align-items:center;gap:2rem;font-size:1.25rem;display:flex}.mobile-nav-link{color:var(--text-mid);font-family:inherit;font-size:inherit;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:8px;align-items:center;gap:.5rem;padding:.5rem 1.5rem;text-decoration:none;transition:all .2s;display:flex}.mobile-nav-link .mobile-nav-ext{color:var(--purple)}.mobile-nav-link:hover,.mobile-nav-link.active{color:var(--text-hi);background:var(--ink-soft);border-color:var(--ink-line)}.btn-cv-mobile{background:#a855f70d;border:1px solid #a855f740;box-shadow:0 4px 12px #a855f714}.btn-cv-mobile:hover{border-color:var(--purple)!important;background:#a855f726!important;box-shadow:0 4px 16px #a855f72e!important}.lang-toggle-mobile{background:#00f5ff08;border:1px solid #00f5ff1f}.lang-toggle-mobile:hover{border-color:var(--cyan)!important;background:#00f5ff1a!important}.hero{background:radial-gradient(ellipse 700px 400px at 85% 10%, #a855f729, transparent 60%), radial-gradient(ellipse 600px 500px at 5% 90%, #f472b61f, transparent 60%), var(--ink);align-items:center;min-height:100vh;display:flex;position:relative}.hero:before{content:"";opacity:.15;pointer-events:none;z-index:0;background-image:url(/background.png);background-position:50%;background-repeat:no-repeat;background-size:cover;position:absolute;inset:0}.hero-grid{z-index:1;grid-template-columns:1.05fr .95fr;align-items:center;gap:3.5rem;width:100%;display:grid;position:relative}.hero-eyebrow{font-family:var(--font-mono);color:var(--green);margin-bottom:1.1rem;font-size:.85rem}.hero h1{margin-bottom:1.3rem;font-size:clamp(2.3rem,4.4vw,3.6rem);line-height:1.08}.hero h1 .accent{color:var(--amber)}.hero p.lead{color:var(--text-mid);max-width:46ch;margin-bottom:2rem;font-size:1.06rem}.hero-ctas{flex-wrap:wrap;gap:.9rem;display:flex}.btn{font-family:var(--font-mono);border:1px solid #0000;border-radius:8px;align-items:center;gap:.5rem;padding:.85rem 1.4rem;font-size:.85rem;font-weight:500;transition:transform .18s,box-shadow .18s,background .18s;display:inline-flex}.btn-primary{background:var(--amber);color:#2a0845}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 24px #f472b659}.btn-ghost{border-color:var(--ink-line);color:var(--text-hi)}.btn-ghost:hover{border-color:var(--cyan);color:var(--cyan);transform:translateY(-2px)}.code-card{background:var(--ink-soft);border:1px solid var(--ink-line);border-radius:14px;overflow:hidden;box-shadow:0 30px 60px -25px #0009}.code-card-bar{border-bottom:1px solid var(--ink-line);align-items:center;gap:.4rem;padding:.75rem 1rem;display:flex}.code-card-bar span{background:#3a3f47;border-radius:50%;width:10px;height:10px}.code-card-bar span:first-child{background:#ff5f56}.code-card-bar span:nth-child(2){background:#ffbd2e}.code-card-bar span:nth-child(3){background:#27c93f}.code-card-bar .fname{font-family:var(--font-mono);color:var(--text-mid);margin-left:.6rem;font-size:.75rem}.code-card pre{font-family:var(--font-mono);scrollbar-width:none;-ms-overflow-style:none;padding:1.4rem 1.3rem;font-size:.86rem;overflow-x:auto}.code-card code .k{color:var(--purple)}.code-card code .p{color:var(--text-hi)}.code-card code .s{color:var(--green)}.code-card code .n{color:var(--cyan)}.code-card code .c{color:var(--text-mid)}.caret{background:var(--amber);vertical-align:text-bottom;width:8px;height:1.05em;animation:1s steps(2,start) infinite blink;display:inline-block}.scroll-hint{font-family:var(--font-mono);color:var(--text-mid);flex-direction:column;align-items:center;gap:.5rem;font-size:.72rem;display:flex;position:absolute;bottom:1rem;left:50%;transform:translate(-50%)}.scroll-hint .line{background:linear-gradient(var(--text-mid), transparent);width:1px;height:26px}.section-head{max-width:640px;margin-bottom:3rem}.section-head h2{margin-bottom:.9rem;font-size:clamp(1.7rem,3vw,2.3rem)}section.on-light .section-head h2{color:var(--text-dark-hi)}.section-head p{color:var(--text-mid)}section.on-light .section-head p{color:var(--text-dark-mid)}section{padding:6.5rem 0}.on-light{background:var(--paper);color:var(--text-dark-hi)}.project-grid{grid-template-columns:repeat(3,1fr);gap:1.6rem;display:grid}.project-card{background:var(--paper-soft);border:1px solid var(--paper-line);border-radius:14px;flex-direction:column;transition:transform .22s,box-shadow .22s,border-color .22s;display:flex;overflow:hidden}.project-card:hover{border-color:#141e3229;transform:translateY(-6px);box-shadow:0 22px 40px -20px #141e3238}.mockup{aspect-ratio:16/12;background:var(--mockup-bg,#eef1f6);position:relative;overflow:hidden}.device-stage{position:absolute;inset:0}.device-desktop{aspect-ratio:1030/680;isolation:isolate;width:90%;position:relative;top:8%;left:3%}.device-frame-container{pointer-events:none;background:#000;width:212px;height:140px;display:block;position:relative;top:3%;left:9%}.device-screen-img--desktop{object-fit:contain;object-position:top center;z-index:1;border-radius:1px;width:100%;height:100%;display:block;position:absolute}.device-phone{aspect-ratio:393/852;z-index:2;isolation:isolate;width:45%;position:absolute;top:-5%;bottom:2%;right:3%}.device-phone-frame-container{z-index:2;pointer-events:none;width:88px;height:180px;display:block;position:absolute;top:21%;left:22%}.device-screen-img--phone{object-fit:cover;object-position:top center;z-index:1;border-radius:7%;width:84%;height:86%;display:block;position:absolute;top:10%;left:8%}.device-frame{object-fit:contain;z-index:2;pointer-events:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;display:block;position:absolute;inset:0}.project-info{flex-direction:column;flex:1;gap:.7rem;padding:1.3rem 1.4rem 1.5rem;display:flex}.project-info h3{font-size:1.08rem}.project-info p{color:var(--text-dark-mid);font-size:.92rem}.tags{flex-wrap:wrap;gap:.4rem;margin-top:.2rem;display:flex}.tags span{font-family:var(--font-mono);color:var(--text-dark-mid);background:#141e320f;border-radius:5px;padding:.28rem .55rem;font-size:.7rem}.project-links{gap:1.1rem;margin-top:auto;padding-top:.6rem;display:flex}.project-links a{font-family:var(--font-mono);color:var(--text-dark-hi);border-bottom:1px solid #0000;align-items:center;gap:.35rem;font-size:.78rem;font-weight:500;display:inline-flex}.project-links a:hover{border-color:currentColor}#skills{background:#1b0f2b99}.skills-wrap{grid-template-columns:.9fr 1.1fr;align-items:start;gap:3rem;display:grid}.skill-groups{flex-direction:column;gap:1.6rem;display:flex}.skill-group h4{font-family:var(--font-mono);color:var(--text-mid);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.8rem;font-size:.78rem}.pill-row{flex-wrap:wrap;gap:.55rem;display:flex}.pill{font-family:var(--font-mono);border:1px solid var(--ink-line);color:var(--text-hi);background:var(--ink-soft);border-radius:7px;padding:.5rem .85rem;font-size:.8rem}.terminal{background:var(--ink-soft);border:1px solid var(--ink-line);border-radius:14px;overflow:hidden}.terminal .code-card-bar{border-bottom:1px solid var(--ink-line)}.terminal .stat-line{font-family:var(--font-mono);border-bottom:1px dashed var(--ink-line);justify-content:space-between;align-items:baseline;padding:1rem 1.3rem;font-size:.86rem;display:flex}.terminal .stat-line:last-child{border-bottom:none}.terminal .stat-line .cmd{color:var(--text-mid)}.terminal .stat-line .val{color:var(--amber);font-size:1.05rem;font-weight:700}.about-wrap{grid-template-columns:.7fr 1.15fr;align-items:center;gap:3.5rem;display:grid}.avatar-frame{aspect-ratio:1;border:1px solid var(--paper-line);background:radial-gradient(circle at 30% 25%,#a855f78c,#0000 55%),radial-gradient(circle at 75% 75%,#f472b680,#0000 55%),linear-gradient(160deg,#2a1743,#1b0f2b);border-radius:20px;position:relative;overflow:hidden}.avatar-frame img{object-fit:cover;width:100%;height:100%}.about-copy p{color:var(--text-dark-mid);margin-bottom:1.1rem}.about-copy p strong{color:var(--text-dark-hi)}.contact{background:radial-gradient(600px 300px at 15% 0,#e9b8f524,#0000 60%),#1b0f2b99}.contact-wrap{grid-template-columns:1.1fr .9fr;align-items:center;gap:3rem;display:grid}.contact h2{margin-bottom:1rem;font-size:clamp(1.9rem,3.4vw,2.6rem)}.contact p.lead{color:var(--text-mid);max-width:44ch;margin-bottom:2rem}.contact-links{font-family:var(--font-mono);flex-direction:column;gap:.9rem;display:flex}.contact-links a{color:var(--text-hi);word-break:break-all;flex-wrap:wrap;align-items:flex-start;gap:.3rem .7rem;display:flex}.contact-links a .tag{color:var(--purple);flex-shrink:0}.contact-links a:hover{color:var(--cyan)}.contact-terminal{background:var(--ink-soft);border:1px solid var(--ink-line);font-family:var(--font-mono);color:var(--text-mid);word-break:break-word;border-radius:14px;padding:1.4rem 1.3rem;font-size:.85rem}.contact-terminal .prompt{color:var(--green)}.contact-terminal .out{color:var(--text-hi);margin:.4rem 0 .9rem}.admin-page{background:var(--ink);min-height:100vh;color:var(--text-hi);font-family:var(--font-body);padding:2rem 0}.admin-header{border-bottom:1px solid var(--ink-line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:3rem;padding-bottom:1.5rem;display:flex}.admin-title-area h1{color:var(--text-hi);align-items:center;gap:.75rem;margin-bottom:.25rem;font-size:2rem;display:flex}.admin-title-area h1 span.badge{font-family:var(--font-mono);color:var(--cyan);background:#a855f726;border:1px solid #a855f74d;border-radius:20px;padding:.2rem .6rem;font-size:.8rem}.admin-title-area p{color:var(--text-mid);font-size:.9rem}.admin-actions{gap:.75rem;display:flex}.btn-sm{font-size:.85rem;font-family:var(--font-mono);cursor:pointer;border:none;border-radius:6px;align-items:center;gap:.5rem;padding:.5rem 1rem;font-weight:500;transition:all .2s;display:inline-flex}.btn-purple{background:var(--purple);color:#fff}.btn-purple:hover{background:#9333ea;transform:translateY(-1px)}.btn-outline{border:1px solid var(--ink-line);color:var(--text-mid);background:0 0}.btn-outline:hover{border-color:var(--text-hi);color:var(--text-hi);background:#ffffff08}.btn-danger-outline{color:#f87171;background:0 0;border:1px solid #ef44444d}.btn-danger-outline:hover{background:#ef44441a;border-color:#ef4444}.admin-stats{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem;margin-bottom:2.5rem;padding-block:1rem;display:grid}.stat-card{background:var(--ink-soft);border:1px solid var(--ink-line);border-radius:10px;flex-direction:column;padding:1.25rem;display:flex}.stat-card span.label{font-family:var(--font-mono);color:var(--text-mid);text-transform:uppercase;font-size:.75rem}.stat-card span.val{color:var(--cyan);margin-top:.25rem;font-size:2rem;font-weight:700}.table-container{scrollbar-width:none;-ms-overflow-style:none;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--ink-line);background:#1e123066;border-radius:12px;margin-bottom:2rem;overflow:hidden;box-shadow:0 10px 30px #0003;overflow-x:auto!important}.porto-table{border-collapse:collapse;text-align:left;width:100%}.porto-table th{font-family:var(--font-mono);color:var(--text-mid);text-transform:uppercase;border-bottom:1px solid var(--ink-line);letter-spacing:.05em;background:#12092099;padding:1rem 1.25rem;font-size:.8rem}.porto-table td{border-bottom:1px solid var(--ink-line);vertical-align:top;padding:1.25rem}.porto-table tr:last-child td{border-bottom:none}.porto-table tr:hover td{background:#ffffff04}.col-title{color:var(--text-hi);margin-bottom:.25rem;font-weight:600}.col-desc{color:var(--text-mid);-webkit-box-orient:vertical;max-width:320px;font-size:.85rem;line-height:1.4;display:-webkit-box;overflow:hidden}.badge-list{flex-wrap:wrap;gap:.35rem;display:flex}.badge-tag{font-family:var(--font-mono);background:var(--ink-soft);border:1px solid var(--ink-line);color:var(--text-mid);border-radius:4px;padding:.15rem .45rem;font-size:.7rem}.color-preview-container{font-family:var(--font-mono);align-items:center;gap:.5rem;font-size:.75rem;display:flex}.color-dot{border:1px solid #fff3;border-radius:3px;width:14px;height:14px;display:inline-block}.action-cell{gap:.5rem;display:flex}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1000;background:#0d0715cc;justify-content:center;align-items:flex-start;padding:2rem 1.5rem;display:flex;position:fixed;inset:0;overflow-y:auto}.modal-card{border:1px solid var(--purple);background:#1e1230f2;border-radius:14px;flex-direction:column;width:100%;max-width:600px;height:auto;margin:auto;animation:.3s cubic-bezier(.16,1,.3,1) forwards modalScaleIn;display:flex;box-shadow:0 25px 60px #0009}@keyframes modalScaleIn{0%{opacity:0;transform:scale(.95)translateY(10px)}to{opacity:1;transform:scale(1)translateY(0)}}.modal-header{border-bottom:1px solid var(--ink-line);justify-content:space-between;align-items:center;padding:1.25rem 1.75rem;display:flex}.modal-header h2{color:var(--text-hi);font-size:1.4rem;font-family:var(--font-display)}.modal-close{color:var(--text-mid);cursor:pointer;background:0 0;border:none;font-size:1.5rem}.modal-close:hover{color:var(--text-hi)}.modal-body{padding:1.75rem;overflow-y:visible}.modal-footer{border-top:1px solid var(--ink-line);justify-content:flex-end;gap:.75rem;padding:1.25rem 1.75rem;display:flex}.form-grid{grid-template-columns:1fr 1fr;gap:1rem;display:grid}@media (width<=580px){.form-grid{grid-template-columns:1fr}}.form-full{grid-column:span 2}@media (width<=580px){.form-full{grid-column:span 1}}.modal-form-group{margin-bottom:1.25rem}.modal-form-group label{font-size:.8rem;font-family:var(--font-mono);color:var(--text-mid);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.4rem;display:block}.modal-input,.modal-textarea{border:1px solid var(--ink-line);width:100%;color:var(--text-hi);font-family:var(--font-body);background:#0f081899;border-radius:6px;padding:.65rem .85rem;font-size:.9rem;transition:all .2s}.modal-input:focus,.modal-textarea:focus{border-color:var(--purple);background:#0f0818e6;outline:none;box-shadow:0 0 8px #a855f726}.modal-textarea{resize:vertical;min-height:80px;font-family:var(--font-body)}.preset-group{flex-wrap:wrap;gap:.4rem;margin-top:.4rem;display:flex}.preset-badge{font-size:.75rem;font-family:var(--font-mono);border:1px solid var(--ink-line);cursor:pointer;color:var(--text-mid);background:0 0;border-radius:4px;align-items:center;gap:.35rem;padding:.25rem .5rem;transition:all .15s;display:flex}.preset-badge:hover{border-color:var(--text-hi);color:var(--text-hi)}.preset-badge.selected{border-color:var(--purple);color:var(--text-hi);background:#a855f726}.color-dot-preset{border:1px solid #fff3;border-radius:50%;width:12px;height:12px;display:inline-block}.preset-circle{cursor:pointer;border:2px solid #0000;border-radius:50%;width:22px;height:22px;transition:all .15s;box-shadow:0 2px 5px #0003}.preset-circle:hover{transform:scale(1.1)}.preset-circle.selected{border-color:var(--purple);transform:scale(1.1)}.empty-state{text-align:center;color:var(--text-mid);font-family:var(--font-mono);padding:4rem 2rem}.empty-state h3{color:var(--text-hi);font-family:var(--font-display);margin-bottom:.5rem;font-size:1.25rem}.empty-state p{margin-bottom:1.5rem;font-size:.85rem}.login-page{background:radial-gradient(circle at center, #24133b 0%, var(--ink) 100%);justify-content:center;align-items:center;min-height:100vh;padding:1.5rem;display:flex}.login-container{perspective:1000px;width:100%;max-width:440px}.terminal-card{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--ink-line);background:#1e1230bf;border-radius:12px;animation:.6s cubic-bezier(.16,1,.3,1) forwards terminalFadeIn;overflow:hidden;box-shadow:0 20px 50px #0006}@keyframes terminalFadeIn{0%{opacity:0;transform:translateY(20px)rotateX(-5deg)}to{opacity:1;transform:translateY(0)rotateX(0)}}.terminal-header{border-bottom:1px solid var(--ink-line);background:#12092099;align-items:center;padding:.85rem 1.25rem;display:flex}.terminal-dots{gap:6px;display:flex}.t-dot{border-radius:50%;width:10px;height:10px}.t-dot.red{background:#ef4444}.t-dot.yellow{background:#f59e0b}.t-dot.green{background:#10b981}.terminal-title{font-family:var(--font-mono);color:var(--text-mid);letter-spacing:.05em;margin-left:1.5rem;font-size:.8rem}.terminal-body{font-family:var(--font-mono);padding:2rem}.terminal-prompt{color:var(--purple);margin-bottom:1.5rem;font-size:.9rem}.terminal-prompt span{color:var(--cyan)}.form-group{margin-bottom:1.5rem;position:relative}.form-group label{color:var(--text-mid);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem;font-size:.8rem;display:block}.input-wrapper{align-items:center;display:flex;position:relative}.input-prefix{color:var(--amber);font-size:.9rem;position:absolute;left:.75rem}.terminal-input{border:1px solid var(--ink-line);width:100%;color:var(--text-hi);font-family:var(--font-mono);background:#0f081880;border-radius:6px;padding:.75rem .75rem .75rem 1.75rem;font-size:.95rem;transition:all .25s}.terminal-input:focus{border-color:var(--purple);background:#0f0818cc;outline:none;box-shadow:0 0 10px #a855f740}.error-message{color:#f87171;background:#ef44441a;border:1px solid #ef44444d;border-radius:6px;align-items:center;gap:.5rem;margin-bottom:1.5rem;padding:.75rem;font-size:.85rem;display:flex}.btn-container{flex-direction:column;gap:.75rem;margin-top:2rem;display:flex}.login-btn{background:linear-gradient(135deg, var(--purple) 0%, #8b5cf6 100%);color:#fff;width:100%;font-family:var(--font-mono);cursor:pointer;border:none;border-radius:6px;padding:.85rem;font-size:.95rem;font-weight:600;transition:all .25s;box-shadow:0 4px 12px #a855f74d}.login-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #a855f773}.login-btn:active{transform:translateY(0)}.back-btn{border:1px solid var(--ink-line);width:100%;color:var(--text-mid);font-family:var(--font-mono);cursor:pointer;background:0 0;border-radius:6px;justify-content:center;align-items:center;gap:.5rem;padding:.85rem;font-size:.95rem;transition:all .25s;display:inline-flex}.back-btn:hover{border-color:var(--text-mid);color:var(--text-hi);background:#ffffff08}@media (width<=640px){.contact-wrap{gap:2.5rem}.contact-terminal{padding:1.2rem 1rem;font-size:.8rem}}footer{border-top:1px solid var(--paper-line);font-family:var(--font-mono);color:var(--text-dark-hi);background:#fff;padding:1.6rem 0;font-size:.75rem}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}@media (width<=980px){.hero{margin-top:3rem!important}.hero-grid,.skills-wrap,.about-wrap,.contact-wrap{grid-template-columns:1fr}.project-grid{grid-template-columns:repeat(2,1fr)}.avatar-frame{justify-self:center;max-width:280px}}@media (width<=768px){.hero:before{background-position:70%}.tabs{display:none!important}.hamburger{display:flex}}@media (width<=640px){.project-grid{grid-template-columns:1fr}section{padding:3rem 0}}.cv-modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:10000;background:#1b0f2bbf;justify-content:center;align-items:center;padding:1.5rem;animation:.25s cubic-bezier(.4,0,.2,1) fadeIn;display:flex;position:fixed;inset:0}.cv-modal-container{background:var(--paper-soft);border:1px solid var(--paper-line);border-radius:16px;flex-direction:column;width:100%;max-width:960px;height:90vh;animation:.3s cubic-bezier(.34,1.56,.64,1) slideUp;display:flex;overflow:hidden;box-shadow:0 24px 48px -12px #1b0f2b80}.cv-modal-header{border-bottom:1px solid var(--paper-line);background:var(--paper);justify-content:space-between;align-items:center;padding:1rem 1.5rem;display:flex}.cv-modal-header h3{font-family:var(--font-display);color:var(--text-dark-hi);margin:0;font-size:1.2rem}.cv-modal-close-btn{color:var(--text-dark-mid);cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:.25rem .5rem;font-size:1.8rem;line-height:1;transition:all .2s;display:flex}.cv-modal-close-btn:hover{color:var(--coral);background:#e85d9e1a;transform:rotate(90deg)}.cv-modal-body{background:#3b3346;flex:1;position:relative}.cv-modal-body iframe{width:100%;height:100%}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@media (width<=640px){.cv-modal-overlay{padding:.5rem}.cv-modal-container{border-radius:12px;height:95vh}.cv-modal-header{padding:.85rem 1rem}}.skeleton-card{pointer-events:none;border-color:#a855f714!important}.skeleton-mockup{position:relative;overflow:hidden;background:#f4ecfb!important}.shimmer-sweep{z-index:3;background:linear-gradient(90deg,#0000 0%,#ffffff73 50%,#0000 100%) 0 0/200% 100%;animation:1.5s linear infinite shimmerAnim;position:absolute;inset:0}@keyframes shimmerAnim{0%{background-position:-150% 0}to{background-position:150% 0}}.skeleton-device-desktop{background:#fff9;border:1px dashed #a855f726;border-radius:6px;width:65%;height:60%;position:absolute;top:15%;left:10%}.skeleton-device-phone{z-index:2;background:#ffffffd9;border:1px dashed #a855f733;border-radius:6px;width:20%;height:50%;position:absolute;bottom:8%;right:10%;box-shadow:0 4px 10px #00000008}.skeleton-line{background:linear-gradient(90deg,#e9e0f2 25%,#f3ecf9 50%,#e9e0f2 75%) 0 0/200% 100%;border-radius:4px;animation:1.5s linear infinite shimmerAnim}.skeleton-title{width:60%;height:1.4rem;margin-bottom:1rem}.skeleton-desc{width:100%;height:.85rem;margin-bottom:.5rem}.skeleton-desc.second-line{width:85%;margin-bottom:1.5rem}.skeleton-tags{gap:.5rem;margin-bottom:1.5rem;display:flex}.skeleton-tag{background:linear-gradient(90deg,#efe7f7 25%,#f8f3fc 50%,#efe7f7 75%) 0 0/200% 100%;border-radius:20px;width:4rem;height:1.5rem;animation:1.5s linear infinite shimmerAnim;display:inline-block}.skeleton-links{border-top:1px solid var(--paper-line);gap:1rem;padding-top:1rem;display:flex}.skeleton-link{background:linear-gradient(90deg,#e9e0f2 25%,#f3ecf9 50%,#e9e0f2 75%) 0 0/200% 100%;border-radius:3px;width:5rem;height:1rem;animation:1.5s linear infinite shimmerAnim;display:inline-block}.skeleton-row-admin{pointer-events:none}.skeleton-row-admin td{padding:1.25rem 1rem!important}.skeleton-line-admin{background:linear-gradient(90deg, var(--ink-soft) 25%, #a855f71f 50%, var(--ink-soft) 75%);background-size:200% 100%;border-radius:4px;animation:1.5s linear infinite shimmerAnim;display:block}.skeleton-badge-admin{background:linear-gradient(90deg, var(--ink-soft) 25%, #a855f71f 50%, var(--ink-soft) 75%);background-size:200% 100%;border-radius:4px;width:3.5rem;height:1.3rem;animation:1.5s linear infinite shimmerAnim;display:inline-block}.skeleton-btn-admin{background:linear-gradient(90deg, var(--ink-soft) 25%, #a855f71f 50%, var(--ink-soft) 75%);background-size:200% 100%;border-radius:6px;width:4rem;height:1.8rem;animation:1.5s linear infinite shimmerAnim;display:inline-block}