@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;600&family=Playfair+Display:ital,wght@1,600&display=swap');
:root{color-scheme:dark;--bg:#080808;--tile:#141414;--ink:#e9e9e5;--muted:#999995;--line:#303030;--accent:#c3acf7;--dots:#9c83d2}*{box-sizing:border-box}body{margin:0;padding:16px;background:var(--bg);color:var(--ink);font-family:'DM Sans',sans-serif;transition:background .25s,color .25s}body.light{color-scheme:light;--bg:#e9e9e7;--tile:#f8f8f6;--ink:#242423;--muted:#6d6d69;--line:#d3d3cf;--accent:#6b45a2;--dots:#8560b5}.dashboard{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:250px minmax(360px,1fr) 150px;gap:12px;min-height:calc(100svh - 32px);max-width:1600px;margin:auto}.tile{border:1px solid var(--line);border-radius:20px;background:var(--tile);padding:24px;overflow:hidden;position:relative}.label{font-size:14px;color:var(--muted)}.intro{grid-column:1/4;grid-row:1}.intro header{display:flex;gap:12px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:18px;font-size:14px}.avatar{width:35px;height:35px;background:var(--accent);color:var(--bg);border-radius:50%;display:grid;place-items:center;font-weight:600}.intro small{display:block;font-size:12px;color:var(--muted);margin-top:3px}.index{margin-left:auto;color:var(--muted);font-size:12px}.intro p{font-size:23px;margin:24px 0 9px;letter-spacing:-.5px}.cursor{color:var(--accent)}.muted{color:var(--muted);font-size:14px}.intro-bottom{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;margin-top:26px}.clock{grid-column:4/5;grid-row:1;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:19px}.clock>.label{align-self:flex-start}.clock-face{position:relative;width:126px;height:126px;border-radius:50%;border:1px solid var(--line);background:repeating-conic-gradient(from -1deg,var(--muted) 0deg 1deg,transparent 1deg 30deg);box-shadow:inset 0 0 0 9px var(--tile)}.clock-face:before{content:'';position:absolute;inset:13px;background:var(--tile);border-radius:50%}.hand{position:absolute;bottom:50%;left:calc(50% - 1px);width:2px;transform-origin:bottom;border-radius:2px;background:var(--ink)}.hour{height:29px}.minute{height:43px}.second{height:47px;width:1px;background:var(--accent)}.clock-face i{position:absolute;top:calc(50% - 3px);left:calc(50% - 3px);width:6px;height:6px;background:var(--accent);border-radius:50%}time{font-size:14px;font-variant-numeric:tabular-nums;color:var(--muted)}.school{grid-column:5/7;grid-row:1/3;display:flex;flex-direction:column;justify-content:space-between}.school-mark{font-family:Georgia,serif;font-size:clamp(110px,17vw,250px);letter-spacing:-.12em;text-align:center;color:var(--accent);text-shadow:0 0 70px #8d67bf44;padding-right:15px}.school-mark span{font-size:.5em}.school h2{font-size:21px;font-weight:450;letter-spacing:-.5px;margin:0 0 7px}.school p{font-size:14px;color:var(--muted);margin:0}.name{grid-column:1/4;grid-row:2/4;display:flex;flex-direction:column;justify-content:space-between}.name h1{font-family:'Playfair Display',Georgia,serif;font-size:clamp(65px,9.5vw,155px);font-style:italic;line-height:1.05;font-weight:600;letter-spacing:-.07em;margin:20px 0 40px}.name h1 span{font-size:1.32em}.name h1 i{color:var(--accent);font-style:normal}.name-bottom{display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:14px}.tag{font-size:12px;border:1px solid var(--line);border-radius:30px;padding:7px 10px;color:var(--muted)}.experiment{grid-column:4/5;grid-row:2/4;display:flex;flex-direction:column;padding:20px}.experiment-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.experiment-top .label{font-size:13px}.experiment button{background:none;color:var(--muted);border:0;font-size:22px;cursor:pointer;padding:8px}#dots{display:grid;grid-template-columns:repeat(7,1fr);gap:9px;align-content:center;flex:1;min-height:180px}#dots i{width:100%;aspect-ratio:1;border-radius:50%;background:var(--dots);opacity:.25;transform:scale(.55);transition:transform .5s,opacity .5s,background .3s}#dots i.active{opacity:.9;transform:scale(1)}#dots i:hover{background:var(--ink);transform:scale(1.45);opacity:1}.experiment-bottom{display:flex;justify-content:space-between;gap:10px;font-size:12px;line-height:1.6;color:var(--muted)}.theme-tile{grid-column:5/7;grid-row:3;display:grid;grid-template-columns:1fr 150px;align-items:center;gap:10px}.theme-tile>.label{align-self:end}.theme-tile>span:last-child{font-size:12px;color:var(--muted);align-self:start}#theme{grid-column:2;grid-row:1/3;background:none;border:0;cursor:pointer;padding:0}.theme-track{display:block;border:1px solid var(--line);background:var(--bg);border-radius:100px;height:84px;padding:7px}.theme-knob{display:block;width:68px;height:68px;border-radius:50%;background:var(--ink);transform:translateX(65px);transition:transform .3s;position:relative;overflow:hidden}.theme-knob:after{content:'';width:56px;height:56px;background:var(--bg);border-radius:50%;position:absolute;top:-16px;right:-15px;transition:transform .3s}.light .theme-knob{transform:translateX(0);background:var(--accent)}.light .theme-knob:after{transform:translate(55px,-55px)}button:focus-visible{outline:2px solid var(--accent);outline-offset:5px;border-radius:12px}@media(min-width:1600px){.dashboard{min-height:880px}}@media(max-width:1000px){.dashboard{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:250px 390px 160px}.intro{grid-column:1/4}.clock{grid-column:4}.name{grid-column:1/3;grid-row:2/4}.school{grid-column:3/5;grid-row:2}.school-mark{font-size:150px}.experiment{display:none}.theme-tile{grid-column:3/5;grid-row:3}.name h1{font-size:9.5vw}}@media(max-width:600px){body{padding:10px}.dashboard{gap:10px;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto 360px 250px 135px;min-height:auto}.tile{padding:20px;border-radius:17px}.intro{grid-column:1/3;grid-row:1;min-height:245px}.clock{grid-column:2;grid-row:3}.name{grid-column:1/3;grid-row:2}.name h1{font-size:79px;margin:12px 0;line-height:.95}.name h1 br{display:none}.name h1 span{display:block}.school{grid-column:1;grid-row:3}.school-mark{font-size:100px}.school h2{font-size:16px}.school p{font-size:12px}.theme-tile{grid-column:1/3;grid-row:4}.name-bottom{font-size:13px}.experiment{display:none}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

html{scroll-behavior:smooth;scroll-padding-top:16px}.section-nav{display:flex;gap:18px;margin-left:auto;font-size:12px}.section-nav a{color:var(--muted);text-decoration:none}.section-nav a:hover{color:var(--accent)}a:focus-visible{outline:2px solid var(--accent);outline-offset:5px}.portfolio-sections{max-width:1600px;margin:12px auto 0;display:grid;grid-template-columns:2fr 1fr;gap:12px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}.section-heading h2{font-weight:450;font-size:18px;letter-spacing:-.4px;margin:0}.projects-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:28px}.project-card{border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:border-color .25s,transform .25s}.project-card:hover{border-color:var(--accent);transform:translateY(-4px)}.project-cover{height:160px;display:flex;align-items:flex-end;padding:18px;background:var(--bg);border-bottom:1px solid var(--line)}.project-cover span{font-family:'Playfair Display',Georgia,serif;font-style:italic;font-size:72px;line-height:1;color:var(--accent);letter-spacing:-5px}.placeholder .project-cover span{color:var(--muted);opacity:.4}.project-info{padding:18px;min-height:125px}.project-info h3{font-size:16px;font-weight:450;margin:0 0 8px}.project-info p{font-size:14px;color:var(--muted);margin:0}.project-tech{display:block;font-size:12px;color:var(--muted);margin-top:20px}.contact{display:flex;flex-direction:column;justify-content:space-between;min-height:300px}.contact .section-heading>span{font-size:28px;color:var(--muted)}.contact-invite{font-size:clamp(30px,3.3vw,52px);line-height:1.1;letter-spacing:-2px;margin:36px 0}.contact-invite>span{color:var(--accent)}.contact-details{display:flex;flex-direction:column;gap:12px;padding-top:20px;border-top:1px solid var(--line)}.contact-pending{font-size:16px;color:var(--muted)}@media(max-width:1000px){.portfolio-sections{grid-template-columns:1fr}.contact{min-height:230px}.contact-invite{margin:25px 0}.contact-details{flex-direction:row;justify-content:space-between}}@media(max-width:600px){.portfolio-sections{margin-top:10px;gap:10px}.projects-grid{grid-template-columns:1fr}.project-card{display:grid;grid-template-columns:95px 1fr}.project-cover{height:100%;min-height:135px;border-bottom:0;border-right:1px solid var(--line);align-items:center;justify-content:center;padding:12px}.project-cover span{font-size:54px}.project-info{min-height:135px;padding:20px 16px}.section-nav{gap:12px}.intro header{flex-wrap:wrap}.intro header small{font-size:11px}.contact-details{flex-direction:column}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.contact-details{display:flex;flex-direction:column;gap:0;padding-top:0;border-top:0}.contact-row{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:14px 0;border-top:1px solid var(--line);font-size:14px}.link-pending{font-size:12px;color:var(--muted)}.contact-invite{font-size:clamp(30px,3vw,46px);margin:24px 0}

a.contact-row{color:var(--ink);text-decoration:none;transition:color .2s}a.contact-row:hover{color:var(--accent)}a.contact-row>span:first-child{overflow-wrap:anywhere}

.project-cover{padding:0;overflow:hidden}.project-cover img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s}.project-card:hover .project-cover img{transform:scale(1.04)}@media(max-width:600px){.project-cover img{min-height:150px}}

a.project-card{display:block;color:var(--ink);text-decoration:none}a.project-card:focus-visible{outline:2px solid var(--accent);outline-offset:4px}@media(max-width:600px){a.project-card{display:grid}}

.intro-bio{display:block;line-height:1.5}.dashboard{grid-template-rows:minmax(300px,auto) minmax(360px,1fr) 150px}.intro{display:flex;flex-direction:column}.intro-bottom{margin-top:auto;padding-top:18px}.intro p{margin-top:18px}@media(max-width:1000px){.dashboard{grid-template-rows:minmax(300px,auto) 390px 160px}}@media(max-width:600px){.dashboard{grid-template-rows:auto 360px 250px 135px}.intro{min-height:320px}}

.music-symbol{color:var(--accent);font-size:24px}.music-wave{display:flex;align-items:center;justify-content:center;gap:5px;flex:1;min-height:100px;padding:24px 0}.music-wave i{display:block;width:5px;height:12px;border-radius:5px;background:var(--accent);opacity:.5;transition:height .2s}.music-wave i:nth-child(3n){height:30px}.music-wave i:nth-child(4n){height:48px}.music-wave i:nth-child(5n){height:70px}.sounding .music-wave i{animation:synth-wave .45s ease-in-out infinite alternate;opacity:1}.music-wave i:nth-child(2n){animation-delay:-.2s}.music-wave i:nth-child(3n){animation-delay:-.35s}@keyframes synth-wave{from{transform:scaleY(.5)}to{transform:scaleY(1.7)}}.synth-keys{display:flex;gap:5px;padding-bottom:22px}.synth-keys .note{flex:1;min-width:0;min-height:100px;padding:13px 0;background:var(--bg);border:1px solid var(--line);border-radius:8px;color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:space-between;font-size:14px;transition:background .15s,transform .15s}.note kbd{font:11px 'DM Sans',sans-serif;color:var(--muted)}.synth-keys .note:hover,.synth-keys .note.playing{background:var(--accent);color:var(--bg);transform:translateY(3px)}.note:hover kbd,.note.playing kbd{color:var(--bg)}@media(max-width:1000px){.experiment.music{display:flex;grid-column:1/-1;grid-row:5;min-height:240px}.music-wave{padding:22px 0}.synth-keys .note{min-height:75px}}@media(prefers-reduced-motion:reduce){.sounding .music-wave i{animation:none}}