@layer reset,base,layout,components,pages,motion,utilities;@font-face{font-family:Bricolage Grotesque Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url("./bricolage-grotesque-vietnamese-opsz-normal-6OAODYXI.woff2") format("woff2-variations");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Bricolage Grotesque Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url("./bricolage-grotesque-latin-ext-opsz-normal-FVLOWDEN.woff2") format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Bricolage Grotesque Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url("./bricolage-grotesque-latin-opsz-normal-XV2ZJLIL.woff2") format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:IBM Plex Sans;font-style:normal;font-display:swap;font-weight:400;src:url("./ibm-plex-sans-latin-400-normal-COQVXTP6.woff2") format("woff2"),url("./ibm-plex-sans-latin-400-normal-JC3YNCCZ.woff") format("woff")}@font-face{font-family:IBM Plex Sans;font-style:normal;font-display:swap;font-weight:500;src:url("./ibm-plex-sans-latin-500-normal-JTONHBWS.woff2") format("woff2"),url("./ibm-plex-sans-latin-500-normal-7DOULDHV.woff") format("woff")}@font-face{font-family:IBM Plex Sans;font-style:normal;font-display:swap;font-weight:600;src:url("./ibm-plex-sans-latin-600-normal-DTNZULF4.woff2") format("woff2"),url("./ibm-plex-sans-latin-600-normal-B3O423MA.woff") format("woff")}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:400;src:url("./ibm-plex-mono-latin-400-normal-A2WATXFY.woff2") format("woff2"),url("./ibm-plex-mono-latin-400-normal-4MWPPJAM.woff") format("woff")}:root{color-scheme:dark;--bg: #0c0a12;--bg-raised: #120f1a;--surface: #16131f;--surface-2: #1e1a2a;--line: rgb(243 238 248 / .1);--line-strong: rgb(243 238 248 / .2);--text: #f3eef8;--muted: #a8a0bb;--faint: #857d99;--pink: #ff76a4;--white: #ffffff;--violet: #c011d7;--black: #000000;--blue: #2f3cbe;--pink-text: #ff8db4;--violet-text: #da7ff2;--blue-text: #8f98ff;--error: #ff9aa9;--fluid: linear-gradient(110deg, var(--pink) 0%, var(--violet-text) 48%, var(--blue-text) 100%);--font-display: "Bricolage Grotesque Variable", "Bricolage Grotesque", system-ui, sans-serif;--font-body: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;--step--1: clamp(.84rem, .82rem + .1vw, .9rem);--step-0: clamp(1rem, .97rem + .15vw, 1.1rem);--step-1: clamp(1.15rem, 1.07rem + .4vw, 1.4rem);--step-2: clamp(1.35rem, 1.2rem + .75vw, 1.85rem);--step-3: clamp(1.7rem, 1.4rem + 1.5vw, 2.6rem);--step-4: clamp(2.2rem, 1.6rem + 3vw, 4.25rem);--step-5: clamp(2.8rem, 1.7rem + 5.5vw, 6.5rem);--radius-s: .6rem;--radius: 1rem;--radius-l: 1.5rem;--gutter: clamp(1rem, 4vw, 2.5rem);--container: 78rem;--section: clamp(4.5rem, 3rem + 7vw, 9rem);--header-h: 4.25rem;--ease-out: cubic-bezier(.22, 1, .36, 1);--ease-in-out: cubic-bezier(.65, 0, .35, 1)}@layer reset{*,*:before,*:after{box-sizing:border-box}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}img,svg,video,canvas{display:block;max-width:100%}img,video{height:auto}input,button,textarea,select{font:inherit;color:inherit}button{cursor:pointer}[hidden]{display:none!important}}@layer base{html{background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:100%;line-height:1.6;-webkit-text-size-adjust:100%;text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-padding-top:calc(var(--header-h) + 1rem);hanging-punctuation:first}@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}body{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;background:var(--bg);font-size:var(--step-0);overflow-x:clip}main{flex:1;padding-bottom:var(--section)}main:focus{outline:none}h1,h2,h3,h4{font-family:var(--font-display);font-weight:650;line-height:1.05;letter-spacing:-.025em;text-wrap:balance;overflow-wrap:break-word}p,li{text-wrap:pretty}a{color:inherit;text-underline-offset:.2em;text-decoration-thickness:1px}:focus-visible{outline:2px solid var(--pink-text);outline-offset:3px;border-radius:4px}::selection{background:var(--pink);color:var(--bg)}.icon{width:1.15em;height:1.15em;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.icon--play{fill:currentColor;stroke:none}}@layer utilities{.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.skip-link{position:fixed;top:.75rem;left:.75rem;z-index:100;padding:.75rem 1rem;border-radius:var(--radius-s);background:var(--text);color:var(--bg);font-weight:500;text-decoration:none;translate:0 -200%;transition:translate .2s}.skip-link:focus{translate:none}}@layer layout{.admin{--gutter: clamp(1rem, 3vw, 2rem);font-size:1rem}.bar{position:sticky;top:0;z-index:10;border-bottom:1px solid var(--line);background:#0c0a12d9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.bar__inner{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.5rem;max-width:72rem;margin:0 auto;padding:.6rem var(--gutter)}.bar__brand{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--font-display);font-size:1.2rem;font-weight:700;text-decoration:none}.bar__brand img{border-radius:50%}.bar__nav{display:flex;flex-wrap:wrap;gap:.25rem}.bar__nav a{padding:.5rem .8rem;border-radius:99px;color:var(--muted);text-decoration:none}.bar__nav a:hover{color:var(--text)}.bar__nav a[aria-current=page]{background:var(--surface-2);color:var(--text)}.bar__end{display:flex;align-items:center;gap:1rem;margin-left:auto}.main{max-width:72rem;margin:0 auto;padding:2rem var(--gutter) 5rem}.heading{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.5rem}.heading h1{font-size:clamp(1.8rem,1.4rem + 1.5vw,2.6rem)}}@layer components{.link{padding:0;border:0;background:none;color:var(--muted);font-size:.95rem;text-decoration:none;cursor:pointer}.link:hover{color:var(--text)}.button{display:inline-flex;align-items:center;justify-content:center;min-height:2.75rem;padding:0 1.25rem;border:1px solid transparent;border-radius:99px;background:var(--text);color:var(--bg);font-weight:500;text-decoration:none;transition:background-color .2s,border-color .2s}.button:hover{background:var(--pink-text)}.button--ghost{border-color:var(--line-strong);background:transparent;color:var(--text)}.button--ghost:hover{border-color:var(--text);background:transparent}.button--small{min-height:2.25rem;padding:0 .9rem;font-size:.9rem}.button--danger{border-color:#ff9aa980;background:transparent;color:var(--error)}.button--danger:hover{background:#ff6b811f}.notice{margin-bottom:1.5rem;padding:.85rem 1.1rem;border:1px solid var(--line);border-radius:.8rem}.notice--ok{border-color:#8f98ff80;background:#2f3cbe2e}.notice--error{border-color:#ff9aa980;background:#ff6b811f}.badge{padding:.15rem .55rem;border:1px solid var(--line-strong);border-radius:99px;font-family:var(--font-mono);font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}.badge--draft{border-style:dashed;border-color:#ff8db499;color:var(--pink-text)}.empty{color:var(--muted)}.form{display:grid;gap:1.25rem}.panel{display:grid;gap:1rem;padding:clamp(1.1rem,3vw,1.75rem);border:1px solid var(--line);border-radius:var(--radius-l);background:var(--surface)}.panel__title{font-size:1.35rem}.panel__subtitle{margin-top:.5rem;font-size:1.05rem}.panel__hint{margin-top:-.4rem;color:var(--muted);font-size:.9rem}.panel__hint code{padding:.1em .35em;border-radius:.3rem;background:#f3eef814;font-size:.85em}.grid{display:grid;gap:1rem}@media(min-width:48em){.grid.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}}.field{display:grid;gap:.35rem;align-content:start}.field__label{font-size:.88rem;font-weight:500;color:var(--muted)}.field__hint{font-size:.8rem;color:var(--faint)}.input{width:100%;min-height:2.75rem;padding:.6rem .85rem;border:1px solid var(--line-strong);border-radius:.65rem;background:var(--bg-raised);font-size:max(16px,.95rem);line-height:1.5}.input:focus{outline:none;border-color:var(--pink-text);box-shadow:0 0 0 3px #ff76a42e}.input:user-invalid{border-color:var(--error)}textarea.input{resize:vertical}.input--mono{font-family:var(--font-mono);font-size:max(16px,.88rem)}input[type=file].input{padding:.5rem}.checks{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem}.check{display:inline-flex;align-items:center;gap:.55rem;min-height:2.25rem;cursor:pointer}.check input{width:1.15rem;height:1.15rem;accent-color:var(--pink)}.pair{display:grid;gap:.35rem;margin:0;padding:0;border:0;min-width:0}.pair__fields{display:grid;gap:.5rem}@media(min-width:48em){.pair__fields{grid-template-columns:repeat(2,minmax(0,1fr))}}.pair__field{position:relative}.pair__field .input{padding-left:2.6rem}.pair__lang{position:absolute;top:.75rem;left:.75rem;font-family:var(--font-mono);font-size:.7rem;color:var(--faint);pointer-events:none}.langs{display:grid;gap:1.5rem}@media(min-width:64em){.langs{grid-template-columns:repeat(2,minmax(0,1fr))}}.lang{display:grid;gap:1rem;align-content:start}.lang__title{font-family:var(--font-mono);font-size:.8rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--pink-text)}.actions{position:sticky;bottom:0;display:flex;flex-wrap:wrap;gap:.75rem;padding:1rem 0 calc(1rem + env(safe-area-inset-bottom));background:linear-gradient(180deg,transparent,var(--bg) 35%)}.danger{margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--line)}.repeat{display:grid;gap:.75rem;justify-items:start}.repeat__list{display:grid;gap:.75rem;width:100%}.repeat__list:empty{display:none}.row{display:grid;gap:.9rem;margin:0;padding:1rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-raised);min-width:0}.row--nested{background:var(--surface)}.row__tools{display:flex;flex-wrap:wrap;gap:.4rem}.tool{min-height:2.25rem;padding:0 .75rem;border:1px solid var(--line);border-radius:.5rem;background:transparent;color:var(--muted);font-size:.85rem}.tool:hover{border-color:var(--line-strong);color:var(--text)}.tool--danger:hover{border-color:#ff9aa980;color:var(--error)}.cover{display:grid;gap:1rem}@media(min-width:48em){.cover{grid-template-columns:16rem minmax(0,1fr);align-items:start}}.cover__preview{display:grid;place-items:center;aspect-ratio:16 / 10;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-raised);color:var(--faint);font-size:.9rem}.cover__preview img{width:100%;height:100%;object-fit:cover}.cover__fields{display:grid;gap:.75rem}.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,14rem),1fr));gap:1rem;margin:0;padding:0;list-style:none}.gallery__item{display:grid;gap:.6rem;align-content:start;padding:.75rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-raised)}.gallery__img{width:100%;aspect-ratio:4 / 3;border-radius:.5rem;object-fit:cover}.gallery__name{font-size:.78rem;color:var(--muted);overflow-wrap:anywhere}.projects{display:grid;gap:.6rem;margin:0;padding:0;list-style:none}.project{display:grid;grid-template-columns:5.5rem minmax(0,1fr);align-items:center;gap:.5rem 1rem;padding:.6rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);text-decoration:none;transition:border-color .2s}.project:hover{border-color:var(--line-strong)}@media(min-width:40em){.project{grid-template-columns:7rem minmax(0,1fr) auto}}.project__thumb{aspect-ratio:16 / 10;overflow:hidden;border-radius:.5rem;background:var(--surface-2)}.project__thumb img{width:100%;height:100%;object-fit:cover}.project__text{display:grid;gap:.15rem}.project__title{font-weight:600}.project__meta{font-size:.85rem;color:var(--muted)}.project__badges{display:flex;flex-wrap:wrap;gap:.4rem}@media(max-width:39.99em){.project__badges{grid-column:2}}.login{display:grid;justify-items:center;gap:1rem;max-width:22rem;margin:12vh auto 0;text-align:center}.login__avatar{border-radius:50%;box-shadow:0 0 0 1px var(--line-strong),0 0 40px #ff76a44d}.login__form{display:grid;gap:1rem;width:100%;margin-top:.5rem;text-align:left}}
