@import url('https://fonts.googleapis.com/css2?family=Huninn&family=Nunito:wght@400;500;600;700;800;900&display=swap');
:root{--ink:#49343f;--paper:#fffdfd;--desktop:#f7e6ed;--line:#9b7687;--lime:#f7cddd;--purple:#eed8e7;--chrome:#fff3f7;--muted:#79616e;--shadow:5px 5px 0 #49343f38;font-family:'Nunito','Huninn','PingFang TC',sans-serif;color:var(--ink);font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:var(--desktop);font-size:16px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #a14171;outline-offset:4px}button{border:0;background:none}button:hover{filter:brightness(.97)}a{color:inherit}.skip{position:fixed;left:12px;top:-80px;background:var(--paper);padding:14px;z-index:9999}.skip:focus{top:10px}.menubar{height:44px;padding:0 24px;display:flex;align-items:center;gap:20px;background:var(--chrome);border-bottom:1px solid var(--ink);position:relative;z-index:1000;font-size:14px}.brand{text-decoration:none;font-size:24px;font-weight:900;position:relative;line-height:1}.brand span{font-size:10px;position:absolute;right:-9px;top:-3px}.menubar strong{font-size:14px;letter-spacing:.07em}.menubar nav{display:flex;gap:20px;margin-left:12px}.menubar nav button{padding:8px 3px}.system{display:flex;align-items:center;gap:16px;margin-left:auto;font-size:13px}.system button{font-size:24px;line-height:1}.desktop{min-height:calc(100svh - 98px);position:relative;padding:38px 8vw 120px 160px;background-image:radial-gradient(#b9819822 .7px,transparent .7px);background-size:6px 6px;overflow:hidden}.desktop-icons{position:absolute;top:35px;left:23px;display:flex;flex-direction:column;gap:27px;z-index:2}.desktop-icons button{display:flex;align-items:center;flex-direction:column;width:94px;padding:6px;border:1px solid transparent;border-radius:3px}.desktop-icons button:hover{background:#ffffff30;border-color:#ffffff90}.desktop-icons svg{width:58px;height:52px;stroke:var(--ink);stroke-width:1.7;filter:drop-shadow(3px 3px 0 #a3668130);margin-bottom:8px}.desktop-icons span{background:#fff7fbef;padding:2px 5px;font-size:14px}.desktop-icons small{font-size:11px;margin-top:5px;color:#755563}.desktop-word{position:absolute;right:3vw;bottom:55px;font-size:clamp(80px,11vw,190px);line-height:.84;letter-spacing:-.07em;font-weight:500;color:#d9aabe65;pointer-events:none}.window{background:var(--paper);border:1px solid var(--ink);box-shadow:var(--shadow);position:relative;min-width:0}.window[hidden]{display:none!important}.welcome{width:min(690px,63vw);z-index:3}.titlebar{height:37px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--ink);position:relative;background:var(--chrome);cursor:grab;touch-action:none;user-select:none}.titlebar:active{cursor:grabbing}.titlebar h1,.titlebar h2{font-size:12px;letter-spacing:.08em;font-weight:600;margin:0;max-width:62%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.window-controls{position:absolute;left:10px;display:flex;gap:7px}.window-controls button{display:grid;place-items:center;width:16px;height:16px;padding:0;border:1px solid var(--ink);border-radius:50%;background:#efafc4;font-size:14px;line-height:1}.window-controls button:nth-child(2){background:#f9d9e5}.window-controls button:nth-child(3){background:#e8d2e5}.title-mark{position:absolute;right:12px;font-size:17px}.window-toolbar{display:flex;justify-content:space-between;padding:10px 18px;border-bottom:1px solid #e6ced9;font-size:11px;letter-spacing:.045em;color:var(--muted);gap:12px}.welcome-content{padding:28px 35px 24px}.eyebrow{display:flex;justify-content:space-between;align-items:start;font-size:12px;letter-spacing:.09em;font-weight:500}.stamp{border:1px solid var(--ink);padding:6px 8px;font-size:10px;text-align:center;transform:rotate(6deg);line-height:1.3}.hello{margin:18px 0 6px;font-size:17px;letter-spacing:.15em}.name{font-size:clamp(52px,6.5vw,91px);letter-spacing:-.065em;font-weight:800;line-height:1.22;margin:0;display:flex;align-items:center;justify-content:space-between;gap:14px}.spark{font-family:'Nunito','Huninn','PingFang TC',sans-serif;font-size:100px;font-weight:400;color:#cc7599;line-height:1}.intro-row{display:flex;justify-content:space-between;align-items:end;margin-top:18px}.latin{font-size:31px;line-height:1.05;letter-spacing:-.04em;margin:0;font-weight:500}.intro{font-size:17px;line-height:1.8;margin:0 14px 0 0;letter-spacing:.04em}.welcome-bottom{border-top:1px solid #e6ced9;margin-top:28px;padding-top:20px;display:flex;align-items:center;justify-content:space-between;gap:16px}.welcome-bottom>span{font-size:13px;color:var(--muted)}.primary{padding:11px 16px;background:var(--ink);color:var(--paper);font-size:14px;border:1px solid var(--ink);display:inline-flex;gap:25px;justify-content:space-between;align-items:center;box-shadow:3px 3px 0 #edc4d4}.primary:hover{background:#795269}.window-footer{display:flex;justify-content:space-between;gap:14px;border-top:1px solid #e6ced9;padding:8px 13px;font-size:10px;letter-spacing:.02em;color:var(--muted)}.work{width:min(760px,70vw);margin:-15px 0 0 105px;z-index:4}.work-content{padding:22px 22px 25px}.section-label{display:flex;align-items:center;justify-content:space-between;gap:15px}.section-label h3{font-size:20px;margin:0;font-weight:600;letter-spacing:.02em}.section-label>span{font-size:10px;letter-spacing:.08em}.demo-note{font-size:12px;color:var(--muted);margin:8px 0 18px}.projects{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.project{text-align:left;padding:0;min-width:0}.art{aspect-ratio:1.18;display:flex;flex-direction:column;justify-content:space-between;padding:13px;overflow:hidden;border:1px solid var(--ink);transition:transform .2s,box-shadow .2s;position:relative}.project:hover .art{transform:translateY(-4px);box-shadow:3px 4px 0 #49343f25}.art-meta,.art-small{font-size:7px;letter-spacing:.03em;position:relative;z-index:1}.art-one{background:#f1d9eb;color:#55374c}.art-one>strong{font-size:49px;line-height:.95;letter-spacing:-.12em;font-weight:900;transform:rotate(-7deg);padding-left:6px}.art-one i{font-style:normal;margin-left:37px;font-size:39px}.art-two{background:#ffe6ef;color:#653f52}.art-two>strong{font-family:'Nunito','Huninn','PingFang TC',sans-serif;font-size:65px;letter-spacing:-.08em;line-height:.8}.art-two>strong span{font-family:'Nunito','Huninn','PingFang TC',sans-serif;font-size:17px;vertical-align:top;letter-spacing:0;margin-left:8px}.art-three{background:#f5b8ca;color:#5f3447}.art-three>strong{font-size:40px;line-height:1.1;letter-spacing:-.08em}.art-three>strong span{position:absolute;right:12px;bottom:36px;font-family:'Nunito','Huninn','PingFang TC',sans-serif;font-size:50px;font-style:italic;font-weight:400;writing-mode:vertical-rl}.project-caption{display:flex;justify-content:space-between;align-items:center;gap:8px;padding-top:10px}.project-caption strong{font-size:13px;font-weight:600}.project-caption>span{font-size:10px;color:var(--muted)}.desktop-note{position:absolute;right:30px;top:60px;display:flex;align-items:center;gap:12px;transform:rotate(7deg);color:#93627c}.desktop-note>span{font-size:45px}.desktop-note p{font-size:12px;line-height:1.5}.taskbar{position:fixed;z-index:1000;bottom:0;left:0;right:0;height:54px;border-top:1px solid var(--ink);background:var(--chrome);display:flex;align-items:center;padding:7px 12px;gap:10px}.start{background:var(--lime);border:1px solid var(--ink);padding:7px 12px;font-size:13px;display:flex;align-items:center;gap:10px;white-space:nowrap}.start span{font-size:20px;line-height:1}.tasks{display:flex;gap:6px;overflow-x:auto}.tasks button{border:1px solid #c9a9ba;padding:8px 15px;font-size:11px;white-space:nowrap}.tasks button.active{background:var(--paper);border-color:var(--ink);box-shadow:inset 0 -2px var(--ink)}.tasks button.minimized{opacity:.55}.taskbar-note{margin-left:auto;white-space:nowrap;font-size:11px;color:var(--muted)}.show-desktop{font-size:24px;border-left:1px solid #c9a9ba;margin-left:5px;padding:2px 8px}.secondary{position:fixed;left:50%;top:16%;width:min(580px,calc(100vw - 40px));transform:translateX(-50%);z-index:10;max-height:calc(84svh - 74px);display:flex;flex-direction:column}.secondary-body,.detail-body{padding:35px;overflow:auto}.secondary-body h3{font-size:52px;line-height:1.3;letter-spacing:-.05em;margin:24px 0}.secondary-body h3 span{display:block;font-size:18px;letter-spacing:.03em;font-weight:400;margin-top:8px}.secondary-body p{font-size:16px;line-height:1.9}.about-line{border-top:1px solid #e7d1dc;padding:14px 0;display:flex;justify-content:space-between;gap:20px;font-size:13px}.about-line>span{font-size:11px;color:var(--muted)}.about-line strong{font-weight:400}.pending{background:#fff3f7;border:1px dashed #c8a5b7;padding:16px;font-size:14px!important;color:var(--muted)}.contact .secondary-body{background:#fff0f6}.contact .pending{background:#fffafd}.detail{width:min(650px,calc(100vw - 40px));top:10%;max-height:calc(90svh - 74px)}.detail-body .art{aspect-ratio:1.8;max-height:330px;padding:24px}.detail-body .art>strong{font-size:85px}.detail-body .art-one i{font-size:70px}.detail-body .art-meta,.detail-body .art-small{font-size:10px}.detail-body h3{font-size:28px;margin-bottom:5px}.detail-body p{font-size:16px;line-height:1.8}.detail-body .type{font-size:12px;color:var(--muted)}.window.maximized{position:fixed!important;left:16px!important;top:60px!important;transform:none!important;margin:0!important;width:calc(100vw - 32px)!important;max-height:calc(100svh - 130px)!important;overflow:auto}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}body.night{--desktop:#654b60}body.night .desktop-word{color:#dca5c855}body.night .desktop-note{color:#f9deed}body.night .desktop-icons small{color:#f9deed}@media(min-width:1500px){.desktop{padding-left:calc((100vw - 1100px)/2)}.welcome{width:720px}.work{margin-left:240px;width:800px}}@media(max-width:1050px){.desktop{padding-left:125px;padding-right:30px}.work{margin-left:35px;width:calc(100% - 35px)}.welcome{width:90%}.desktop-note{display:none}.name{font-size:76px}.spark{font-size:84px}.intro{font-size:15px}.art-one>strong{font-size:40px}.art-one i{font-size:32px;margin-left:25px}.art-two>strong{font-size:51px}.art-three>strong{font-size:33px}.art-three>strong span{font-size:38px}.project-caption{align-items:start;flex-direction:column;gap:3px}}@media(max-width:700px){.menubar{height:48px;padding:0 14px;gap:15px}.menubar strong{font-size:11px}.menubar nav{gap:12px;margin-left:auto}.menubar nav button{font-size:13px}.system{margin-left:0;gap:0}.system .date,.system time{display:none}.desktop{padding:18px 14px 100px;overflow:visible;min-height:calc(100svh - 48px)}.desktop-icons{position:relative;left:auto;top:auto;flex-direction:row;gap:15px;margin-bottom:22px;justify-content:center}.desktop-icons button{width:90px}.desktop-icons svg{height:40px;width:46px}.desktop-icons small{display:none}.desktop-icons span{font-size:12px}.welcome,.work{width:100%;margin:0 0 22px;left:auto!important;top:auto!important;transform:none!important}.titlebar{touch-action:auto;cursor:default}.welcome-content{padding:24px 22px}.eyebrow{font-size:10px}.name{font-size:clamp(54px,12vw,76px)}.spark{font-size:66px}.hello{font-size:14px}.latin{font-size:25px}.intro{font-size:14px;margin:0}.welcome-bottom{align-items:start;flex-direction:column;gap:14px;margin-top:24px}.welcome-bottom .primary{width:100%}.window-footer{font-size:9px}.window-footer span:last-child{max-width:48%;text-align:right}.work-content{padding:20px 17px}.section-label h3{font-size:18px}.section-label>span{font-size:8px}.projects{grid-template-columns:1fr;gap:22px}.art{aspect-ratio:1.4;padding:22px}.art-meta,.art-small{font-size:10px}.art-one>strong{font-size:69px}.art-one i{font-size:56px;margin-left:50px}.art-two>strong{font-size:95px}.art-three>strong{font-size:56px}.art-three>strong span{font-size:66px;bottom:50px;right:24px}.project-caption{flex-direction:row;padding-top:12px}.project-caption strong{font-size:15px}.project-caption>span{font-size:12px}.taskbar-note{display:none}.start{padding:7px 9px;font-size:11px}.tasks button{padding:8px;font-size:10px}.show-desktop{margin-left:auto}.desktop-word{display:none}.secondary{top:70px!important;left:14px!important;transform:none!important;width:calc(100vw - 28px);max-height:calc(100svh - 145px)}.secondary-body,.detail-body{padding:24px}.secondary-body h3{font-size:40px}.about-line{font-size:12px}.window.maximized{top:62px!important;left:10px!important;width:calc(100vw - 20px)!important}.detail-body .art>strong{font-size:58px}.detail-body .art-one i{font-size:46px}.window-controls button{width:19px;height:19px}.window-controls{gap:8px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* About portrait */
.about-profile{display:grid;grid-template-columns:minmax(0,1fr) 170px;gap:24px;align-items:center;margin-bottom:24px}
.about-profile h3{font-size:46px;margin:20px 0 0}
.portrait-frame{margin:0;padding:8px;background:#ffffff;border:1px solid #e7cbd7;box-shadow:0 3px 12px #9b768714;transform:none}
.portrait-frame img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:center 24%;border:0}
.portrait-frame figcaption{text-align:center;font-size:10px;letter-spacing:.04em;padding:9px 0}
@media(max-width:700px){.about-profile{grid-template-columns:minmax(0,1fr) 125px;gap:14px}.about-profile h3{font-size:32px}.about-profile .eyebrow{font-size:9px}.portrait-frame figcaption{font-size:8px}.about-profile h3 span{font-size:15px}}
@media(max-width:360px){.about-profile{grid-template-columns:1fr}.portrait-frame{width:150px;justify-self:center}.about-profile h3{margin-bottom:8px}}

/* Rounded name typography with generous spacing */
#welcome .name{font-family:'Nunito','Huninn','PingFang TC',sans-serif;font-size:clamp(52px,6vw,86px);font-weight:500;letter-spacing:.14em;line-height:1.5;margin:4px 0 8px;gap:16px}
#welcome .name .spark{letter-spacing:0;flex-shrink:0}
@media(max-width:700px){#welcome .name{font-size:clamp(40px,10vw,64px);letter-spacing:.12em;line-height:1.5;gap:10px}#welcome .name .spark{font-size:clamp(42px,10vw,60px)}}

/* Window resizing */
.resize-handle{position:absolute;right:0;bottom:0;width:24px;height:24px;padding:0;z-index:2;cursor:nwse-resize;touch-action:none;background:linear-gradient(135deg,transparent 44%,#ae7890 45%,#ae7890 50%,transparent 51%,transparent 64%,#ae7890 65%,#ae7890 70%,transparent 71%) center/13px 13px no-repeat}
.resize-handle:hover{background-color:#f7e6ed}
.window.maximized .resize-handle{display:none}
.window.resizing{user-select:none}
@media(min-width:701px){
.window.user-sized{display:flex;flex-direction:column;max-height:none;overflow:hidden}
.window.user-sized>.titlebar,.window.user-sized>.window-toolbar,.window.user-sized>.window-footer{flex-shrink:0}
.window.user-sized>.welcome-content,.window.user-sized>.work-content,.window.user-sized>.secondary-body,.window.user-sized>.detail-body{flex:1;min-height:0;overflow:auto}
.window>.window-footer{padding-right:30px}
.window.secondary>.secondary-body,.window.secondary>.detail-body{padding-bottom:40px}
.window.maximized.user-sized{height:calc(100svh - 130px)!important}
}
@media(max-width:700px){.resize-handle{display:none}}

/* Soft, rounded desktop icon outlines */
.desktop-icons svg{stroke:#805b70;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 3px 2px #a366811c)}
.desktop-icons button{border-radius:14px}
.desktop-icons span{border-radius:6px}

/* Consistent rounded typography in all text and controls */
body,button,input,textarea,select{font-family:'Nunito','Huninn','PingFang TC',sans-serif}
.art-three>strong span{font-style:normal}

/* A casually pasted portrait, keeping the photo itself unchanged. */
.portrait-frame{position:relative;transform:rotate(5deg);box-shadow:3px 7px 14px #805b7026;margin:10px 6px 8px}
.portrait-frame::before{content:"";position:absolute;z-index:1;top:-12px;left:50%;width:66px;height:24px;transform:translateX(-50%) rotate(-11deg);background:#f2d4e4bd;border:1px solid #ffffff70;box-shadow:0 1px 2px #805b7010;pointer-events:none}
@media(max-width:700px){.portrait-frame{margin:10px 5px 8px;transform:rotate(4deg)}.portrait-frame::before{width:52px;height:21px;top:-10px}}

/* Editable resume content, transcribed from the supplied resume. */
#about .secondary-body{min-height:0;overflow-y:auto;overscroll-behavior:contain}
#about .about-profile h3 span{font-size:14px;letter-spacing:.02em;line-height:1.6}
.resume-intro p{font-size:16px;line-height:1.95}
.resume-section{border-top:1px solid #e7cbd7;margin-top:28px;padding-top:22px;margin-bottom:26px}
.resume-section h4{font-size:20px;margin:0 0 18px;line-height:1.5;font-weight:700}
.resume-section h4>span{display:block;font-size:12px;letter-spacing:.1em;color:#92647c;margin-bottom:4px}
.education-item{margin-bottom:18px}.education-item>div{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px}.education-item>div>span{font-size:14px;color:var(--muted)}
#about .education-item p{margin:5px 0;font-size:15px}
.resume-list{margin:0;padding-left:22px;line-height:1.9;font-size:16px}.resume-list li{margin-bottom:5px}.resume-list li::marker{color:#be809d}
.software-tags{list-style:none;display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:0}.software-tags li{font-size:14px;padding:7px 12px;border-radius:20px;background:#fff0f6;border:1px solid #ecd0dd}
.resume-timeline{list-style:none;padding:0;margin:0}.resume-timeline li{display:grid;grid-template-columns:52px minmax(0,1fr);gap:16px;padding-bottom:22px}.resume-timeline time{color:#a05277;font-weight:700;font-size:17px}.resume-timeline li>div{border-left:2px solid #edccdc;padding-left:16px}
#about .resume-timeline p{margin:0 0 8px;font-size:15px;line-height:1.75}.resume-timeline strong{font-size:16px;font-weight:600;line-height:1.7}.award-label{display:inline-block;border-radius:12px;background:#f9e4ee;color:#8b3c63;padding:3px 10px;font-size:13px}
.resume-contact{display:flex;flex-direction:column;gap:13px;font-size:16px;line-height:1.7;overflow-wrap:anywhere}.resume-contact a{text-underline-offset:4px}
@media(max-width:700px){.resume-timeline li{grid-template-columns:44px minmax(0,1fr);gap:10px}.resume-timeline li>div{padding-left:12px}}

/* Compact, keyboard-accessible resume sections and original resume download. */
.resume-download{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin:4px 0 25px}.resume-download a{text-decoration:none;border-radius:8px}.resume-download>span{font-size:13px;color:var(--muted)}
.resume-disclosure{padding-top:0;border:1px solid #e7cbd7;border-radius:12px;overflow:hidden}
.resume-disclosure summary{display:flex;align-items:center;gap:12px;cursor:pointer;padding:18px 20px;list-style:none;background:#fff3f7}
.resume-disclosure summary::-webkit-details-marker{display:none}
.resume-disclosure summary:hover{background:#fbeaf2}
.resume-disclosure summary:focus-visible{outline:3px solid #a14171;outline-offset:-4px;border-radius:12px}
.disclosure-heading{display:flex;flex-direction:column;gap:4px}.disclosure-heading>span{font-size:12px;letter-spacing:.08em;color:#92647c}.disclosure-heading strong{font-size:20px;font-weight:700}
.disclosure-count{margin-left:auto;white-space:nowrap;font-size:13px;color:var(--muted)}.disclosure-chevron{font-size:23px;transition:transform .2s}
.resume-disclosure[open] .disclosure-chevron{transform:rotate(180deg)}
.disclosure-content{padding:22px 20px 0;border-top:1px solid #e7cbd7}
@media(max-width:700px){.resume-disclosure summary{padding:16px 14px}.disclosure-content{padding:20px 14px 0}.disclosure-heading>span{font-size:10px}}

/* Soft graph-paper desktop with a small colour-swatch sticker. */
:root{--desktop:#fff8f8}
.desktop{isolation:isolate;background-color:var(--desktop);background-image:linear-gradient(#e8bdce38 1px,transparent 1px),linear-gradient(90deg,#e8bdce38 1px,transparent 1px);background-size:32px 32px}
.palette-sticker{position:absolute;right:34px;bottom:32px;z-index:-1;width:172px;padding:15px 13px 11px;background:#fffdfb;border:1px solid #ecd9df;box-shadow:2px 5px 12px #805b7015;transform:rotate(-6deg);pointer-events:none}
.palette-sticker::before{content:"";position:absolute;top:-8px;left:58px;width:52px;height:18px;background:#f0d7e4b5;transform:rotate(9deg)}
.palette-label{font-size:9px;letter-spacing:.08em;color:#8b6678}.palette-chips{display:flex;height:42px;margin:10px 0 7px;border-radius:3px;overflow:hidden}.palette-chips i{flex:1;background:#fff0f4}.palette-chips i:nth-child(2){background:#f6cedf}.palette-chips i:nth-child(3){background:#d99ab7}.palette-chips i:nth-child(4){background:#87556f}.palette-signature{font-size:11px;color:#93667e}
body.night .desktop{background-image:linear-gradient(#e8bdce15 1px,transparent 1px),linear-gradient(90deg,#e8bdce15 1px,transparent 1px)}
@media(max-width:700px){.desktop{padding-bottom:180px;background-size:28px 28px}.palette-sticker{right:24px;bottom:32px;width:150px}.palette-chips{height:32px}}

/* Personal art direction: pink graph paper, berry ink, blush and lavender accents. */
:root{--ink:#392443;--paper:#fffdf9;--chrome:#fff7fb;--muted:#715d78;--lime:#f1cade;--purple:#cab5eb;--shadow:6px 6px 0 #7151893d;--accent-berry:#80416d}
.menubar,.taskbar{background:#fffdf9}
.brand{color:var(--accent-berry)}
.menubar>strong{letter-spacing:.06em}
.window{border:2px solid var(--ink);box-shadow:var(--shadow)}
.titlebar{height:39px;border-bottom:2px solid var(--ink);background:#e9dcef}
#welcome>.titlebar{background:#ecc1d7}
#work>.titlebar{background:#f1cade}
#about>.titlebar{background:#dcd5f1}
#contact>.titlebar{background:#ecdeef}
.window-controls button{border-color:var(--ink);background:#ed97b9}
.window-controls button:nth-child(2){background:#f1cade}
.window-controls button:nth-child(3){background:#c7acd9}
.window-toolbar{background:#fffdf9}
.primary{background:var(--accent-berry);border:1px solid var(--ink);color:#fff;box-shadow:3px 3px 0 #d7b6cd;transition:transform .15s,box-shadow .15s}
.primary:hover{background:#653255;transform:translate(-1px,-1px);box-shadow:4px 4px 0 #d7b6cd}
.primary:active{transform:translate(2px,2px);box-shadow:1px 1px 0 #d7b6cd}
.stamp{background:#f1cade;box-shadow:2px 2px 0 var(--ink);transform:rotate(7deg);font-weight:700}
#welcome .name{color:#62345f}
#welcome .name .spark{color:var(--accent-berry);transform:rotate(12deg)}
.latin{color:var(--accent-berry)}
.intro{border-left:3px solid #b486b8;padding-left:14px}
.desktop-icons svg{stroke:var(--ink);stroke-width:1.8;filter:drop-shadow(2px 3px 0 #39244325)}
.desktop-icons [data-open="work"] svg path{fill:#dba1bd}
.desktop-icons [data-open="work"] svg rect{fill:#f1cade}
.desktop-icons [data-open="about"] svg rect{fill:#eee3ff}
.desktop-icons [data-open="about"] svg circle,.desktop-icons [data-open="about"] svg path[fill]:not([fill="none"]){fill:#bea0dd}
.desktop-icons [data-open="contact"] svg rect{fill:#dac3e7}
.desktop-icons span{background:#fffdf9;border:1px solid #39244325;padding:3px 7px}
.desktop-icons button:hover{background:#ffffff75;border-color:#b396c0}
.desktop-note{color:#563b68}
.desktop-note>span{color:var(--accent-berry)}
.desktop-note p{border-bottom:3px solid #d5a2c0;padding-bottom:6px}
.start{background:#f1cade;box-shadow:2px 2px 0 #39244330}
.tasks button.active{box-shadow:inset 0 -3px var(--accent-berry)}
.section-label>span{background:#f1cade;color:#392443;padding:5px 7px;transform:rotate(-2deg)}
.art-one{background:#d5bfe9;color:#392443}
.art-two{background:#f1cade;color:#593449}
.art-three{background:#854b77;color:#fffaf3}
.project:hover .art{box-shadow:4px 5px 0 #39244355;transform:translateY(-4px) rotate(-1deg)}
.project-caption>span{color:#614a70}
.portrait-frame{border-color:#9e80ac;box-shadow:4px 6px 0 #ceb9de66}
.portrait-frame::before{background:#e9c9dfc9;border-color:#fff2fa99}
.contact .secondary-body{background:#f7edf7}
.software-tags li:nth-child(3n+1){background:#f5deec;border-color:#dfb4ce}
.software-tags li:nth-child(3n+2){background:#eee2f6;border-color:#d6bfe5}
.software-tags li:nth-child(3n){background:#f1e7f6;border-color:#d3b9df}
.award-label{background:#f5deec;color:#713d5e}
.resume-disclosure summary{background:#f1e7f6}
.resume-disclosure summary:hover{background:#e8d9f0}
.resize-handle{filter:contrast(1.5)}
.palette-sticker{border:1px solid #735981;box-shadow:3px 4px 0 #73598125;background:#fffdf9}
.palette-sticker::before{background:#e7c4dab5}
.palette-chips i{background:#efbfd7}
.palette-chips i:nth-child(2){background:#c5ade3}
.palette-chips i:nth-child(3){background:#f1cade}
.palette-chips i:nth-child(4){background:#854b77}
.palette-label,.palette-signature{color:#604672}
@media(max-width:700px){.intro{padding-left:10px}.section-label>span{font-size:8px;padding:4px}}

/* Sparse floral line-art wallpaper. */
.desktop{background-color:#fff8f8;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22620%22%20height%3D%22520%22%20viewBox%3D%220%200%20620%20520%22%3E%3Cdefs%3E%3Cg%20id%3D%22flower%22%20fill%3D%22none%22%20stroke%3D%22%23c49aad%22%20stroke-width%3D%221.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M0-9C-22-29-7-48%203-37C10-49%2029-29%209-8C38-15%2045%209%2027%2013C42%2030%2018%2043%207%2016C1%2046-24%2040-22%2023C-44%2022-35-5-10%200C-34-17-18-35%200-9Z%22%2F%3E%3Ccircle%20cx%3D%220%22%20cy%3D%224%22%20r%3D%227%22%2F%3E%3Cpath%20d%3D%22M1%2034Q-9%2065%203%20102M-2%2070Q-26%2046-28%2065Q-24%2077-2%2070M0%2087Q22%2061%2025%2078Q20%2091%200%2087%22%2F%3E%3C%2Fg%3E%3C%2Fdefs%3E%3Cg%20opacity%3D%22.47%22%3E%3Cuse%20href%3D%22%23flower%22%20transform%3D%22translate%2895%2078%29%20rotate%28-18%29%20scale%28.9%29%22%2F%3E%3Cuse%20href%3D%22%23flower%22%20transform%3D%22translate%28433%20308%29%20rotate%2824%29%20scale%281.05%29%22%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23d9b7c8%22%20stroke-width%3D%221.2%22%20stroke-linecap%3D%22round%22%20opacity%3D%22.5%22%3E%3Cpath%20d%3D%22M307%2090q-8%2017%200%2028m-1-17q-18-16-19-3q2%209%2019%203m1%208q17-18%2020-6q-2%2010-20%206M155%20355q-8%2017%200%2028m-1-17q-18-16-19-3q2%209%2019%203%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");background-size:620px 520px;background-repeat:repeat}
body.night .desktop{background-color:#654b60;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22620%22%20height%3D%22520%22%20viewBox%3D%220%200%20620%20520%22%3E%3Cdefs%3E%3Cg%20id%3D%22flower%22%20fill%3D%22none%22%20stroke%3D%22%23ecd0df%22%20stroke-width%3D%221.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M0-9C-22-29-7-48%203-37C10-49%2029-29%209-8C38-15%2045%209%2027%2013C42%2030%2018%2043%207%2016C1%2046-24%2040-22%2023C-44%2022-35-5-10%200C-34-17-18-35%200-9Z%22%2F%3E%3Ccircle%20cx%3D%220%22%20cy%3D%224%22%20r%3D%227%22%2F%3E%3Cpath%20d%3D%22M1%2034Q-9%2065%203%20102M-2%2070Q-26%2046-28%2065Q-24%2077-2%2070M0%2087Q22%2061%2025%2078Q20%2091%200%2087%22%2F%3E%3C%2Fg%3E%3C%2Fdefs%3E%3Cg%20opacity%3D%22.47%22%3E%3Cuse%20href%3D%22%23flower%22%20transform%3D%22translate%2895%2078%29%20rotate%28-18%29%20scale%28.9%29%22%2F%3E%3Cuse%20href%3D%22%23flower%22%20transform%3D%22translate%28433%20308%29%20rotate%2824%29%20scale%281.05%29%22%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23dfc3d8%22%20stroke-width%3D%221.2%22%20stroke-linecap%3D%22round%22%20opacity%3D%22.5%22%3E%3Cpath%20d%3D%22M307%2090q-8%2017%200%2028m-1-17q-18-16-19-3q2%209%2019%203m1%208q17-18%2020-6q-2%2010-20%206M155%20355q-8%2017%200%2028m-1-17q-18-16-19-3q2%209%2019%203%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}
@media(max-width:700px){.desktop{background-size:465px 390px}}

/* Pointer trail stays behind windows and never intercepts clicks. */
.cursor-trail{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:0}
@media(prefers-reduced-motion:reduce),(hover:none),(pointer:coarse){.cursor-trail{display:none}}

/* Welcome opens with a soft bounce, then reveals its contents in sequence. */
@keyframes welcome-bounce{
  0%{opacity:0;scale:.86;translate:0 32px}
  55%{opacity:1;scale:1.025;translate:0 -8px}
  78%{scale:.993;translate:0 3px}
  100%{opacity:1;scale:1;translate:0 0}
}
@keyframes welcome-reveal{
  from{opacity:0;translate:0 12px}
  to{opacity:1;translate:0 0}
}
#welcome.welcome-enter{transform-origin:center 35%;animation:welcome-bounce .85s cubic-bezier(.2,.7,.3,1) both}
#welcome.welcome-enter .eyebrow,
#welcome.welcome-enter .hello,
#welcome.welcome-enter .name,
#welcome.welcome-enter .intro-row,
#welcome.welcome-enter .welcome-bottom,
#welcome.welcome-enter .window-footer{animation:welcome-reveal .8s ease-out both}
#welcome.welcome-enter .eyebrow{animation-delay:.35s}
#welcome.welcome-enter .hello{animation-delay:.5s}
#welcome.welcome-enter .name{animation-delay:.65s}
#welcome.welcome-enter .intro-row{animation-delay:.85s}
#welcome.welcome-enter .welcome-bottom{animation-delay:1.05s}
#welcome.welcome-enter .window-footer{animation-delay:1.15s}
@media(prefers-reduced-motion:reduce){
  #welcome.welcome-enter,#welcome.welcome-enter .eyebrow,#welcome.welcome-enter .hello,#welcome.welcome-enter .name,#welcome.welcome-enter .intro-row,#welcome.welcome-enter .welcome-bottom,#welcome.welcome-enter .window-footer{animation:none;opacity:1;scale:1;translate:none}
}

/* Two welcoming actions, each with a distinct gentle hover/focus response. */
#welcome .welcome-bottom{flex-wrap:wrap;row-gap:16px}
#welcome .welcome-bottom>span{flex-basis:100%}
.welcome-actions{display:flex;flex-wrap:wrap;gap:12px;width:100%}
.welcome-actions .primary{min-height:44px;border-radius:8px;gap:18px;transition:transform .22s ease,box-shadow .22s ease,background-color .22s ease}
.welcome-actions .about-action{background:#f1e4f5;color:#62345f;box-shadow:3px 3px 0 #d3b8df}
.welcome-actions .primary span{display:inline-block;transition:transform .3s ease}
.welcome-actions .work-action:hover,.welcome-actions .work-action:focus-visible{transform:translateY(-3px);box-shadow:3px 6px 0 #d7b6cd}
.welcome-actions .work-action:hover span,.welcome-actions .work-action:focus-visible span{transform:translate(2px,-2px)}
.welcome-actions .about-action:hover,.welcome-actions .about-action:focus-visible{background:#e8d5f0;transform:translateY(-2px) rotate(-1deg);box-shadow:4px 5px 0 #d3b8df}
.welcome-actions .about-action:hover span,.welcome-actions .about-action:focus-visible span{transform:rotate(45deg)}
.welcome-actions .primary:active{transform:translateY(1px);box-shadow:1px 1px 0 #d7b6cd}
@media(max-width:700px){#welcome .welcome-actions .primary{width:auto;flex:1 1 145px;justify-content:center;gap:10px}}
@media(prefers-reduced-motion:reduce){.welcome-actions .primary,.welcome-actions .primary span{transition:none!important}.welcome-actions .primary:hover,.welcome-actions .primary:focus-visible,.welcome-actions .primary:active,.welcome-actions .primary:hover span,.welcome-actions .primary:focus-visible span{transform:none!important}}

/* Staggered, restrained idle invitations; keep hover/click transforms independent. */
@keyframes action-invite{0%,8%,24%,100%{translate:0 0}14%{translate:0 -3px}19%{translate:0 -1px}}
@keyframes arrow-invite{0%,8%,24%,100%{translate:0 0}14%{translate:2px -2px}19%{translate:1px -1px}}
@keyframes flower-invite{0%,8%,26%,100%{rotate:0deg}14%{rotate:18deg}20%{rotate:-8deg}}
.welcome-actions .work-action{animation:action-invite 6s ease-in-out 2.5s infinite}
.welcome-actions .work-action span{animation:arrow-invite 6s ease-in-out 2.5s infinite}
.welcome-actions .about-action{animation:action-invite 6s ease-in-out 5.5s infinite}
.welcome-actions .about-action span{animation:flower-invite 6s ease-in-out 5.5s infinite}
.welcome-actions:has(.primary:hover) .primary,.welcome-actions:has(.primary:hover) .primary span,
.welcome-actions:focus-within .primary,.welcome-actions:focus-within .primary span{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.welcome-actions .primary,.welcome-actions .primary span{animation:none!important;translate:none!important;rotate:none!important}}

/* Place the About action at the right edge of the welcome action row. */
.welcome-actions .about-action{margin-left:auto}
@media(max-width:700px){#welcome .welcome-actions .primary{flex:0 1 auto}}

/* Pixel cursors; retain text, drag and resize cues. */
@media(hover:hover) and (pointer:fine){
:root{--pixel-arrow:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20shape-rendering%3D%22crispEdges%22%3E%3Cpath%20d%3D%22M3%202h3v3h3v3h3v3h3v3h3v3h3v3h-9v3h-3v3H6V8H3Z%22%20fill%3D%22%23fff0f7%22%2F%3E%3Cpath%20d%3D%22M6%205h3v3h3v3h3v3h3v3H9v6H6Z%22%20fill%3D%22%2362345f%22%2F%3E%3Cpath%20d%3D%22M12%2020h3v6h3v3h-6v-3H9v-6Z%22%20fill%3D%22%23fff0f7%22%2F%3E%3Cpath%20d%3D%22M12%2020h3v6h-3Z%22%20fill%3D%22%2362345f%22%2F%3E%3C%2Fsvg%3E") 6 5,default;--pixel-hand:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20shape-rendering%3D%22crispEdges%22%3E%3Cpath%20d%3D%22M10%202h7v10h3v2h4v2h4v10h-3v4H10v-3H7v-4H4v-7h6Z%22%20fill%3D%22%2362345f%22%2F%3E%3Cpath%20d%3D%22M12%204h3v14h3v-4h2v5h2v-3h2v4h2v5h-3v3H12v-3H9v-4H6v-3h3v3h3Z%22%20fill%3D%22%23ffe0ef%22%2F%3E%3C%2Fsvg%3E") 13 4,pointer}
body{cursor:var(--pixel-arrow)}
a,button,summary{cursor:var(--pixel-hand)}
.titlebar{cursor:grab}.titlebar:active{cursor:grabbing}.resize-handle{cursor:nwse-resize}
input,textarea,[contenteditable="true"]{cursor:text}
}