:root{color-scheme:dark;--chrome:#111;--chrome-2:#1b1b1b;--chrome-3:#282828;--border:#343434;--muted:#909090;--blue:#2186ff;--editor-font:Arial,Helvetica,sans-serif;--site-font:Arial,"Helvetica Neue",sans-serif;--site-color:rgba(255,255,255,.75);--site-bg:#151515;font-family:var(--editor-font)}
*{box-sizing:border-box}html,body{height:100%;margin:0;background:var(--chrome);color:#efefef}body{overflow:hidden;font-size:12px}button,select,input,textarea{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.35}.topbar{height:32px;display:flex;align-items:center;gap:2px;background:#101010;border-bottom:1px solid #2b2b2b;user-select:none;position:relative;z-index:30;white-space:nowrap}.toolbar-group{height:100%;display:flex;align-items:center;gap:1px}.account-tools{padding-left:7px}.edit-tools{margin-left:13px}.tool-button{height:30px;min-width:30px;border:0;background:transparent;display:inline-flex;align-items:center;justify-content:center;color:#d3d3d3;padding:0 7px;border-radius:2px}.tool-button:hover,.rail-button:hover{background:#292929}.tool-button.active{color:#fff}.tool-button svg,.rail-button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round}.toolbar-separator{height:20px;width:1px;background:#3c3c3c;margin:0 3px}.toolbar-select{height:27px;min-width:102px;background:#202020;border:0;border-radius:2px;padding:0 24px 0 7px;color:#ddd;outline:none}.toolbar-select:hover,.page-select:hover,.add-button:hover{background:#303030}.add-wrap,.page-select-wrap{position:relative}.add-button{height:27px;min-width:82px;padding:0 7px;border:0;border-radius:2px;background:#202020;color:#ddd;text-align:left}.plus{font-size:16px;vertical-align:-1px;margin-right:3px}.caret{color:#aaa;margin-left:7px}.toolbar-spacer{flex:1}.top-end{padding:0 7px 0 4px;gap:4px}.page-select{height:27px;min-width:110px;max-width:170px;padding:0 9px;border:0;border-radius:2px;background:#202020;color:#eee;text-align:left;overflow:hidden;text-overflow:ellipsis}.page-select-wrap{margin-left:5px}.page-menu,.mini-menu{position:absolute;top:30px;right:0;min-width:220px;padding:5px;background:#252525;border:1px solid #414141;box-shadow:0 8px 24px #0009;z-index:80}.mini-menu{right:auto;left:0;min-width:145px}.page-menu[hidden],.mini-menu[hidden]{display:none}.page-menu button,.mini-menu button{display:flex;width:100%;align-items:center;gap:9px;text-align:left;border:0;background:transparent;padding:8px 10px;border-radius:2px;color:#ddd}.page-menu button:hover,.mini-menu button:hover,.page-menu button.selected{background:#383838}.page-menu button.selected:before{content:"";width:5px;height:5px;border-radius:50%;background:#1689ff}.page-menu .menu-divider{border-top:1px solid #444;margin:5px 0}.workspace{height:calc(100% - 32px);position:relative;display:flex;overflow:hidden}.stage{flex:1;min-width:0;position:relative;overflow:hidden;background:#151515}.right-rail{width:34px;flex:0 0 34px;background:#121212;border-left:1px solid #343434;display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 0;z-index:20}.rail-button{width:31px;height:32px;border:0;background:transparent;display:flex;align-items:center;justify-content:center;color:#d7d7d7}.rail-button svg{width:18px;height:18px}.text-rail{font-size:16px;font-weight:500}.rail-bottom{margin-top:auto}.drawer{position:absolute;z-index:25;right:34px;top:0;bottom:0;width:min(320px,calc(100vw - 50px));background:#1c1c1c;border-left:1px solid #383838;box-shadow:-10px 0 30px #0005;display:flex;flex-direction:column}.drawer[hidden]{display:none}.drawer-header{display:flex;align-items:center;justify-content:space-between;padding:17px 16px 13px;border-bottom:1px solid #363636}.drawer-kicker{font-size:9px;letter-spacing:.14em;color:#888}.drawer-header h2{font:500 16px var(--editor-font);margin:5px 0 0;color:#f2f2f2}.close-drawer{border:0;background:transparent;color:#aaa;font-size:24px;line-height:1;padding:0 3px}.drawer-body{overflow:auto;padding:14px 16px 22px}.panel-section{border-bottom:1px solid #373737;padding:0 0 15px;margin:0 0 15px}.panel-section:last-child{border-bottom:0}.panel-section h3{font-size:11px;font-weight:600;margin:2px 0 10px;color:#eee}.panel-section p{font-size:11px;color:#aaa;line-height:1.5;margin:8px 0}.panel-label{display:block;color:#aaa;font-size:10px;margin:11px 0 5px}.panel-input,.panel-select,.panel-textarea{width:100%;border:1px solid #484848;border-radius:3px;background:#121212;padding:8px;color:#e8e8e8;outline:none}.panel-input:focus,.panel-select:focus,.panel-textarea:focus{border-color:#7a7a7a}.panel-textarea{min-height:150px;resize:vertical;font:11px/1.5 ui-monospace,Menlo,monospace}.panel-row{display:flex;align-items:center;gap:8px}.panel-row>*{flex:1;min-width:0}.panel-button{border:1px solid #4a4a4a;background:#2b2b2b;border-radius:3px;padding:8px 10px;color:#eee}.panel-button:hover{background:#373737}.panel-button.primary{border-color:#1171df;background:#1477eb}.panel-button.danger{color:#ff7777}.panel-page-list{display:flex;flex-direction:column;gap:3px}.panel-page{width:100%;display:flex;align-items:center;gap:9px;border:0;background:transparent;padding:8px 7px;border-radius:3px;text-align:left;color:#d3d3d3}.panel-page:hover,.panel-page.selected{background:#333}.page-dot{width:7px;height:7px;border-radius:50%;background:#777;flex:none}.panel-page.selected .page-dot{background:#2788ff}.page-actions{display:flex;gap:7px;margin-top:11px}.page-actions button{flex:1}.asset-list{display:flex;flex-direction:column;gap:6px}.asset-row{display:flex;gap:9px;align-items:center;padding:7px;border:1px solid #373737;border-radius:3px;background:#171717}.asset-row img{width:50px;height:32px;object-fit:cover;background:#080808}.asset-row strong{display:block;font-size:10px;font-weight:500;color:#e2e2e2}.asset-row small{display:block;color:#888;font-size:9px;margin-top:3px}.color-row{display:flex;align-items:center;gap:8px}.color-row input[type=color]{width:32px;height:28px;border:0;background:transparent;padding:0}.range-row{display:flex;align-items:center;gap:8px}.range-row input{flex:1}.range-value{width:40px;color:#aaa;text-align:right}.site-view{position:absolute;inset:0;overflow:auto;isolation:isolate;background:#151515;color:var(--site-color);font-family:var(--site-font);font-size:16px}.filter-defs{position:absolute;width:0;height:0;pointer-events:none}.wallpaper{position:fixed;z-index:-2;inset:0;background-image:url("./assets/home-background.jpg");background-size:cover;background-position:center;filter:url(#refraction) saturate(1.16) contrast(1.04);transform:scale(1.06)}.wallpaper-glow{position:fixed;z-index:-1;inset:0;background:radial-gradient(ellipse at 19% 28%,#ff1e00a0 0,transparent 48%),radial-gradient(ellipse at 75% 65%,#9a001e66 0,transparent 60%);mix-blend-mode:screen;opacity:.45;pointer-events:none}.site-nav{position:fixed;z-index:4;left:20px;top:17px;bottom:12px;width:clamp(165px,22vw,270px);overflow:visible;pointer-events:auto}.site-nav .page-layout{width:100%;max-width:100%;display:block}.site-nav .page-content{width:100%;padding:0;overflow:visible}.site-nav bodycopy{display:block}.site-nav h1{font-family:var(--site-font);font-weight:400;font-size:2.25rem;line-height:1;color:rgba(255,255,255,.85);margin:0;letter-spacing:0}.site-nav h1:first-child{display:inline-block;white-space:nowrap;padding:0 2px 3px 0}.site-nav h1:nth-of-type(2){display:inline-block;width:155px;max-width:100%;background:#000!important;padding:0 3px 4px 0;margin-top:23px;overflow-wrap:anywhere}.site-nav h1 a{color:inherit;text-decoration:none}.site-nav h1 a:hover{color:#fff}.page{position:absolute;inset:0;display:flex;justify-content:flex-end;min-height:100%;pointer-events:none}.page-layout{width:100%;max-width:60%;display:flex;align-items:flex-start;pointer-events:auto}.page-content{width:100%;padding:1.5rem;text-align:left;align-items:flex-start;min-height:100%;font-family:var(--site-font);color:var(--site-color);background:transparent;box-shadow:none;pointer-events:auto}.page-canvas.overlay{background-color:rgba(0,0,0,.15)}.page-canvas.overlay .page-content{background:#000;box-shadow:0 0 5rem #0004}.page-canvas[hidden]{display:none}.page-anchor{position:absolute;top:0;left:0}.page-canvas bodycopy{display:block;font-family:var(--site-font);font-size:1.4rem;line-height:1.2;font-weight:400;color:var(--site-color);font-variation-settings:'slnt' 0,'MONO' 0}.page-canvas h1{font:400 2.8rem/1 var(--site-font);color:rgba(255,255,255,.85);margin:0;letter-spacing:0}.page-canvas h2{font:500 2.6rem/1 var(--site-font);color:rgba(255,255,255,.85);margin:0;letter-spacing:0}.page-canvas .workcv{font-family:var(--site-font);font-size:1.4rem;line-height:.95;letter-spacing:.245em;font-weight:400;color:rgba(255,255,255,.75);display:block;font-variation-settings:'slnt' 0,'MONO' 0}.page-canvas .workcv a{color:inherit;text-decoration:none}.page-canvas .workcv a:hover{text-decoration:underline}.page-canvas a{cursor:pointer}.page-canvas .page-content[contenteditable=true]{outline:0;caret-color:#fff}.page-canvas .page-content[contenteditable=true]:focus{outline:1px dashed #278cff;outline-offset:-2px}.page-canvas b{font-weight:600}.page-canvas br{line-height:1.05}.page-canvas column-set{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;align-items:start}.page-canvas column-unit{display:block;min-width:0}.page-canvas gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.page-canvas gallery-grid[columns="1"]{grid-template-columns:1fr}.page-canvas .media-frame{position:relative;display:block;width:100%;max-width:100%;overflow:hidden;background:#050505;aspect-ratio:16/9}.page-canvas .media-frame.audio-frame{aspect-ratio:1/1;max-width:min(100%,38.2rem)}.page-canvas .media-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.page-canvas .media-image{display:block;width:100%;max-width:100%;height:auto;background:#050505}.page-canvas .media-caption{font-size:1.1rem;margin-top:.4rem;color:rgba(255,255,255,.8)}.page-canvas .media-frame[style*="border"]{box-sizing:border-box}.page-canvas text-icon{display:inline-block;font:inherit;vertical-align:middle}.page-canvas text-icon[icon="close"]:after{content:"×"}.page-canvas text-icon[icon^="menu"]:after{content:"☰";font-size:.82em}.page-canvas .icon-link{text-decoration:none!important}.site-hint{position:fixed;z-index:10;left:50%;bottom:14px;transform:translateX(-50%);padding:5px 9px;background:#151515d9;color:#aaa;font:10px var(--editor-font);opacity:0;transition:opacity .2s;pointer-events:none}.site-view.editing .site-hint{opacity:1}.site-view.editing .page-canvas bodycopy{cursor:text}.selection-outline{position:fixed;z-index:8;border:1px dashed #1887ff;pointer-events:none}.mobile-header,.mobile-nav{display:none}.mobile-device-frame{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(390px,calc(100% - 45px));height:min(844px,calc(100% - 28px));border:1px solid #5a5a5a;border-radius:18px;box-shadow:0 8px 38px #000b;overflow:hidden;background:#151515;z-index:6}.stage.device-mobile .site-view{width:min(390px,calc(100% - 45px));height:min(844px,calc(100% - 28px));inset:50% auto auto 50%;transform:translate(-50%,-50%);border:1px solid #5a5a5a;border-radius:18px;box-shadow:0 8px 38px #000b}.stage.device-mobile .wallpaper,.stage.device-mobile .wallpaper-glow{position:absolute}.stage.device-mobile .site-nav{display:none}.stage.device-mobile .mobile-header,.stage.device-mobile .mobile-nav{display:flex;position:absolute;z-index:6;left:0;right:0;top:0;bottom:auto;min-height:0;background:transparent;pointer-events:auto}.stage.device-mobile .mobile-header .page-layout,.stage.device-mobile .mobile-nav .page-layout{max-width:100%;width:100%}.stage.device-mobile .mobile-header .page-content,.stage.device-mobile .mobile-nav .page-content{padding:10px;width:100%}.stage.device-mobile .mobile-header h1,.stage.device-mobile .mobile-nav h1{font:400 1.65rem/1 var(--site-font)}.stage.device-mobile .mobile-header column-set{grid-template-columns:1fr auto;align-items:center}.stage.device-mobile .mobile-nav{top:0;bottom:0;background:#000;display:none}.stage.device-mobile .mobile-nav.open{display:flex}.stage.device-mobile .page-canvas{overflow:auto;padding-top:58px}.stage.device-mobile .page-canvas .page-layout{max-width:100%}.stage.device-mobile .page-canvas .page-content{padding:1rem}.stage.device-mobile .page-canvas .workcv{font-size:1rem;letter-spacing:.04em;line-height:1.15}.stage.device-mobile .page-canvas column-set:not([mobile-stack="false"]){grid-template-columns:1fr;gap:.2rem}.stage.device-mobile .page-canvas gallery-grid{grid-template-columns:1fr}.stage.device-mobile .page-canvas h1{font-size:2.2rem}.stage.device-mobile .page-canvas h2{font-size:2rem}.stage.device-mobile .page-canvas.overlay{width:100%}.stage.device-mobile .page-canvas .media-frame.audio-frame{max-width:100%}.stage.device-mobile .page-canvas .page-content[contenteditable=true]{outline:1px dashed #278cff}
.toast{position:fixed;z-index:100;bottom:17px;right:49px;background:#252525;border:1px solid #444;border-radius:3px;padding:8px 12px;color:#e9e9e9;box-shadow:0 4px 14px #0008;opacity:0;pointer-events:none;transform:translateY(5px);transition:.18s}.toast.show{opacity:1;transform:translateY(0)}body.preview-only .topbar,body.preview-only .right-rail,body.preview-only .drawer,body.preview-only .site-hint{display:none!important}body.preview-only .workspace{height:100vh}body.preview-only .stage{width:100vw}
@media(max-width:760px){.edit-tools .toolbar-separator:nth-of-type(2),.edit-tools [title="Lock"],.edit-tools [title="Align left"],.edit-tools [title="Add link"]{display:none}.edit-tools{margin-left:2px}.toolbar-select{min-width:75px}.account-tools{padding-left:2px}.site-nav{width:140px;left:12px;top:12px}.site-nav h1{font-size:1.75rem}.site-nav h1:nth-of-type(2){width:120px;margin-top:14px}.page-layout{max-width:100%}.page-canvas .page-content{padding:1rem}.page-canvas .workcv{font-size:1rem;letter-spacing:.04em;line-height:1.1}.page-canvas column-set:not([mobile-stack="false"]){grid-template-columns:1fr;gap:.3rem}.page-canvas gallery-grid{grid-template-columns:1fr}.page-canvas h1{font-size:2.1rem}.page-canvas h2{font-size:1.9rem}.right-rail{width:32px;flex-basis:32px}.drawer{right:32px}.toolbar-spacer{min-width:0}.code-shortcut{display:none}}
.text-edit-button{gap:3px}.text-edit-button span{font:11px Arial,Helvetica,sans-serif}.page-canvas .workcv{font-size:var(--workcv-size,1.4rem);letter-spacing:var(--workcv-spacing,.245em);color:var(--site-color)}.page-canvas.component-page{background:#171717;inset:6% 8%;min-height:88%;overflow:auto;border:1px solid #393939;box-shadow:0 8px 35px #0008}.page-canvas.component-page .page-layout{max-width:100%}.page-canvas.component-page .page-content{padding:24px}.site-view.no-refraction .wallpaper{filter:saturate(1.1) contrast(1.05)}.site-view.no-refraction .wallpaper-glow{opacity:.16}.panel-page .editor-only-label{margin-left:auto;color:#8b8b8b;font-size:9px}.asset-placeholder{display:grid;place-items:center;width:50px;height:32px;background:#080808;color:#777;font-size:20px}
.hidden-color{position:fixed;left:-100px;top:-100px;width:1px;height:1px;opacity:0}.site-view{background:var(--site-bg,#151515)}.page-canvas.overlay .page-layout{max-width:70%}.page-canvas.overlay .page-content{padding:1rem;background:#000;box-shadow:0 0 5rem #0004}.site-view.editing .page-canvas{pointer-events:auto}.site-view.editing .page-canvas .page-content{outline:1px dashed #278cff;outline-offset:-2px}

.site-nav{position:fixed;inset:17px auto 12px 20px}.page-canvas.overlay .page-content{min-height:100vh}
/* Keep the captured portfolio proportions in the system-font rendering. */
.site-nav{top:49px}
.page-canvas .workcv{text-decoration:none}
.page-canvas .workcv a{text-decoration:none}
.page-canvas.overlay #contentBody>bodycopy>br:nth-of-type(2){font-size:4px}
.page-canvas.overlay #contentBody>bodycopy>column-set:first-child text-icon{position:relative;top:-9px}
.page-canvas.overlay #contentBody>bodycopy>br:nth-of-type(2){display:none}
.page-canvas.overlay #contentBody>bodycopy>column-set:nth-of-type(2){margin-top:5px}
.page-canvas.overlay #contentBody>bodycopy>column-set:first-child .text-icon-copy{position:relative;top:-9px}
.stage.device-mobile .page-canvas column-set:not([mobile-stack="false"]){grid-template-columns:1fr!important}
.mobile-header a,.mobile-nav a{color:inherit;text-decoration:none}
/* Public site view: the local copy is edited in code, not through a Cargo toolbar. */
#topbar,.right-rail,.drawer,.toast,.site-hint,.selection-outline{display:none!important}
.workspace{height:100vh}
.site-nav{top:17px}
@media(max-width:760px){
  .site-nav{display:none}
  .mobile-header{display:flex;position:absolute;z-index:6;left:0;right:0;top:0;bottom:auto;min-height:0;background:transparent;pointer-events:auto}
  .mobile-header .page-layout,.mobile-nav .page-layout{max-width:100%;width:100%}
  .mobile-header .page-content,.mobile-nav .page-content{width:100%;padding:10px}
  .mobile-header column-set{grid-template-columns:minmax(0,1fr) auto!important;align-items:center}
  .mobile-header h1,.mobile-nav h1{font:400 1.65rem/1 var(--site-font)}
  .mobile-header a,.mobile-nav a{color:inherit;text-decoration:none}
  .mobile-nav{display:none;position:absolute;z-index:7;left:0;right:0;top:0;bottom:0;background:#000;pointer-events:auto}
  .mobile-nav.open{display:flex}
  .page-canvas{overflow:auto;padding-top:58px}
  .page-canvas .page-layout,.page-canvas.overlay .page-layout{max-width:100%}
  .page-canvas .page-content{padding:1rem}
  .page-canvas column-set:not([mobile-stack="false"]){grid-template-columns:1fr!important;gap:.3rem}
  .page-canvas .workcv{font-size:1rem;letter-spacing:.04em;line-height:1.1}
  .page-canvas .media-frame.audio-frame{max-width:100%}
}
@media(max-width:760px){.page-canvas.overlay #contentBody>bodycopy>column-set:first-of-type{grid-template-columns:10fr 2fr!important}}
@media(max-width:760px){
  .site-view{background:#14171b!important}
  .wallpaper,.wallpaper-glow{display:none}
  .page-canvas,.page-canvas.overlay,.page-canvas.overlay .page-content{background:#14171b!important;box-shadow:none}
  .mobile-header .page-content{padding:0 16px}
  .mobile-header h1,.mobile-nav h1{font-size:2rem;background:transparent!important}
  .mobile-header .icon-link{display:inline-flex;align-items:center;justify-content:center;width:40px;height:34px;background:#050607}
  .mobile-header .icon-link .text-icon-copy{font-size:.8em;letter-spacing:.08em}
  .page-canvas{padding-top:94px}
  .page-canvas .page-content{padding:17px 16px 16px;background:#14171b!important}
  .page-canvas h1{font-size:2rem;line-height:1}
  .page-canvas:not(.overlay) #contentBody h1:first-child{margin-bottom:2.5rem}
  .page-canvas bodycopy{font-size:.9rem;line-height:1.35}
  .page-canvas .media-image{width:100%;max-width:100%;height:auto;border:0}
}
@media(max-width:760px){
  .mobile-header column-set{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important}
  .page-canvas:not(.overlay) #contentBody h1:first-child{margin-bottom:.5rem}
  .page-canvas bodycopy{font-size:.85rem;line-height:1.43}
}
@media(max-width:760px){
  .wallpaper,.wallpaper-glow{display:block}
  .site-view{background:#151515!important}
  .site-view.is-home{background:#151515!important}
  .site-view.is-home .page-canvas,.site-view.is-home .page-canvas.overlay .page-content{background:transparent!important;box-shadow:none}
}
@media(max-width:760px){
  .site-view:not(.is-home){background:#14171b!important}
  .site-view:not(.is-home) .wallpaper,.site-view:not(.is-home) .wallpaper-glow{display:none}
}
@media(max-width:760px){
  .site-view.is-home .page-canvas .page-content{background:transparent!important}
  .site-view.is-home .mobile-header h1:first-child{background:#000!important}
}
@media(max-width:760px){
  .mobile-header{top:-5px}
  .page-canvas{padding-top:90px}
  .page-canvas:not(.overlay) #contentBody h1:first-child{margin-bottom:.6875rem}
}

html,body,.stage{background:#fff;color:#111;color-scheme:light}
#siteView{--site-bg:#fff!important;--site-color:#111!important;background:#fff!important;color:#111}
#siteView .wallpaper,#siteView .wallpaper-glow{display:none!important}
#siteView .page-canvas,#siteView .page-content,#siteView .mobile-nav{background:#fff!important;box-shadow:none}
#siteView h1,#siteView h2,#siteView a,#siteView .workcv{color:#111!important}
#siteView .site-nav h1,#siteView .mobile-header h1,#siteView .mobile-nav h1{background:transparent!important}
#siteView .mobile-header .icon-link{background:#f2f2f2}

#siteView:is([data-page="workcv"],[data-page="sets"],[data-page="projects"],[data-page="musiqa"]) #contentBody{--site-color:#bfbfbf;background:#000!important;color:#bfbfbf}
#siteView:is([data-page="workcv"],[data-page="sets"],[data-page="projects"],[data-page="musiqa"]) #contentBody :is(h1,h2,a,.workcv){color:#bfbfbf!important}
#siteView:is([data-page="workcv"],[data-page="sets"],[data-page="projects"],[data-page="musiqa"]) #contentBody .workcv[style*="background"]{color:#000!important}
#siteView:is([data-page="workcv"],[data-page="sets"],[data-page="projects"],[data-page="musiqa"]) #contentBody .workcv[style*="color: rgb(255, 255, 255)"]{color:#fff!important}
@media(max-width:760px){
  #siteView:is([data-page="workcv"],[data-page="sets"],[data-page="projects"],[data-page="musiqa"]) .mobile-header,#siteView:is([data-page="workcv"],[data-page="sets"],[data-page="projects"],[data-page="musiqa"]) .mobile-nav{display:none!important}
  #siteView:is([data-page="workcv"],[data-page="sets"],[data-page="projects"],[data-page="musiqa"]) .page-canvas{padding-top:0;background:#000!important}
  #siteView:is([data-page="workcv"],[data-page="sets"],[data-page="projects"],[data-page="musiqa"]) #contentBody{padding:12px}
  #siteView:is([data-page="workcv"],[data-page="sets"],[data-page="projects"],[data-page="musiqa"]) #contentBody .workcv{font-size:1rem;line-height:1;letter-spacing:.245em}
  #siteView:is([data-page="workcv"],[data-page="sets"],[data-page="projects"],[data-page="musiqa"]) .page-canvas column-set{gap:.75rem}
  #siteView:is([data-page="workcv"],[data-page="sets"],[data-page="projects"],[data-page="musiqa"]) .media-frame[style*="border"]{border-width:.6875rem!important}
  #siteView:is([data-page="workcv"],[data-page="sets"],[data-page="projects"],[data-page="musiqa"]) #contentBody>bodycopy>column-set:nth-of-type(2){margin-top:14px}
  #siteView:is([data-page="workcv"],[data-page="sets"],[data-page="projects"],[data-page="musiqa"]) #contentBody>bodycopy>column-set:first-child .text-icon-copy{top:0}
}

#pattern-canvas{position:fixed;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
#siteView,#siteView .page-canvas{background:transparent!important}
#siteView.is-home .page-content{background:transparent!important}
#siteView .site-nav .page-content{background:transparent!important}
#siteView .site-nav h1,#siteView .mobile-header h1{background:#fff!important}
#siteView:is([data-page="workcv"],[data-page="sets"],[data-page="projects"],[data-page="musiqa"]) #contentBody{background:#000!important}

#siteView:is([data-page="workcv"],[data-page="sets"],[data-page="projects"],[data-page="musiqa"]) #contentBody column-set>column-unit:first-child .workcv{background:#fff!important;color:#000!important}
#siteView:is([data-page="workcv"],[data-page="sets"],[data-page="projects"],[data-page="musiqa"]) #contentBody>bodycopy>.workcv-media-row,
#siteView:is([data-page="workcv"],[data-page="sets"],[data-page="projects"],[data-page="musiqa"]) #contentBody .squish-slot:has(>.squish-pin>.workcv-media-row){margin-top:1rem}

#siteView[data-page="sets"] .media-frame.audio-frame{max-width:100%;height:300px;aspect-ratio:auto}

.page-canvas .media-frame.media-loading::before{content:"";position:absolute;inset:0;background:#050505;z-index:1;pointer-events:none}
.page-canvas .media-frame.media-loading::after{content:"";position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px;background:transparent;box-shadow:0 -14px #fff,10px -10px #bbb,14px 0 #888,10px 10px #666,0 14px #555,-10px 10px #555,-14px 0 #555,-10px -10px #555;animation:media-spin .8s steps(4) infinite;z-index:2;pointer-events:none}
@keyframes media-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.page-canvas .media-frame.media-loading::after{animation:none}}

#siteView[data-page="projects"] .project-card{display:grid;place-items:center;aspect-ratio:4/3;border:1rem solid #fff}
#siteView[data-page="projects"] .project-card img{width:40%;max-width:160px;max-height:65%;object-fit:contain}
@media(max-width:760px){#siteView[data-page="projects"] .project-card{border-width:.6875rem}}

#siteView[data-page="musiqa"] .musiqa-gallery{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:1rem;margin:1rem 0}
#siteView[data-page="musiqa"] .musiqa-item{margin:0;min-width:0;color:#fff;font:600 .68rem/1.3 Arial, sans-serif}
#siteView[data-page="musiqa"] .musiqa-item img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover}
#siteView[data-page="musiqa"] .musiqa-item figcaption{margin-top:.4rem;overflow-wrap:anywhere}
@media(max-width:760px){
  #siteView[data-page="musiqa"] .musiqa-gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}
  #siteView.is-home .site-nav{display:block;left:16px;top:16px;width:auto;max-width:calc(100vw - 32px)}
  #siteView.is-home .site-nav h1{font-size:clamp(1.75rem,7vw,2.25rem)}
  #siteView.is-home .site-nav h1:nth-of-type(2){width:max-content;max-width:calc(100vw - 32px)}
  #siteView.is-home .mobile-header,#siteView.is-home .mobile-nav{display:none!important}
}

.site-nav .project-nav-menu,.mobile-nav .project-nav-menu{position:relative;display:block}
.site-nav .project-nav-menu summary,.mobile-nav .project-nav-menu summary{list-style:none;cursor:pointer}
.site-nav .project-nav-menu summary::-webkit-details-marker,.mobile-nav .project-nav-menu summary::-webkit-details-marker{display:none}
.site-nav .project-nav-menu+br,.mobile-nav .project-nav-menu+br{display:none}
.site-nav .project-nav-submenu,.mobile-nav .project-nav-submenu{position:absolute;left:calc(100% + .35rem);top:0;z-index:8;display:grid;gap:.12em;min-width:max-content;padding:.4em .55em;font-size:.52em;line-height:1.15;background:#fff;color:#111;box-shadow:0 4px 16px #0003}
.site-nav .project-nav-submenu a,.mobile-nav .project-nav-submenu a{display:block;color:inherit;text-decoration:none;white-space:nowrap}
.site-nav .project-nav-submenu a:hover,.mobile-nav .project-nav-submenu a:hover{text-decoration:underline}
.site-nav .project-nav-menu[open]>.project-nav-submenu,.mobile-nav .project-nav-menu[open]>.project-nav-submenu{transform-origin:top left;animation:project-nav-reveal .42s cubic-bezier(.22,1,.36,1) both}
.site-nav .project-nav-menu[open]>.project-nav-submenu a:first-child,.mobile-nav .project-nav-menu[open]>.project-nav-submenu a:first-child{animation:project-nav-link-in .2s ease-out .08s both}
.site-nav .project-nav-menu[open]>.project-nav-submenu a:nth-child(2),.mobile-nav .project-nav-menu[open]>.project-nav-submenu a:nth-child(2){animation:project-nav-link-in .2s ease-out .16s both}
@keyframes project-nav-reveal{from{opacity:0;clip-path:inset(0 0 100% 0)}to{opacity:1;clip-path:inset(0)}}
@keyframes project-nav-link-in{from{opacity:0;transform:translateY(-.2em)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.site-nav .project-nav-menu[open]>.project-nav-submenu,.mobile-nav .project-nav-menu[open]>.project-nav-submenu{animation:none;clip-path:none;opacity:1;transform:none}.site-nav .project-nav-menu[open]>.project-nav-submenu a,.mobile-nav .project-nav-menu[open]>.project-nav-submenu a{animation:none;opacity:1;transform:none}}

.home-stories{position:relative;min-height:100dvh;z-index:3;display:grid;place-items:start end;padding:16px 20px;pointer-events:none}
.home-story-viewer{--story-ratio:.5625;width:min(43vw,540px,calc((100dvh - 82px)*var(--story-ratio)));pointer-events:auto}
.home-story-controls{display:flex;align-items:center;gap:10px;margin:0 0 9px;color:#fff}
.home-story-progress{display:flex;align-items:center;gap:4px;flex:1;min-width:0}
.home-story-progress button{display:block;flex:1;min-width:0;height:16px;padding:6px 0;border:0;background:transparent;cursor:pointer}
.home-story-progress span{display:block;height:3px;overflow:hidden;border-radius:3px;background:#ffffff55}
.home-story-progress i{display:block;width:0;height:100%;background:#fff}
.home-story-progress button.is-done i{width:100%}
.home-stories:not(.is-video) .home-story-progress button.is-active i{animation:home-story-progress 7.5s linear forwards}
.home-stories.is-paused .home-story-progress button.is-active i{animation-play-state:paused}
.home-stories.is-video .home-story-progress button.is-active i{width:100%}
.home-story-toggle[hidden]{display:none}
.home-story-progress{gap:2px}
.home-story-counter{font:600 10px/1 Arial,sans-serif;white-space:nowrap}
.home-story-toggle{width:26px;height:26px;padding:0;border:0;background:transparent;color:#fff;font-size:15px;line-height:1}
.home-story-frame{position:relative;box-sizing:content-box;aspect-ratio:var(--story-ratio);overflow:hidden;border:clamp(5px,1vw,14px) solid #fff;border-radius:0;background:#050505;box-shadow:0 18px 55px #0007;touch-action:pan-y}
.home-story-slide{position:absolute;inset:0;margin:0}
.home-story-slide[hidden]{display:none}
.home-story-slide :is(img,video){display:block;width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none}
.home-story-arrow{position:absolute;top:50%;z-index:2;display:grid;place-items:center;width:38px;height:38px;margin-top:-19px;border:1px solid #ffffff70;border-radius:50%;background:#0008;color:#fff;font:300 28px/1 Arial,sans-serif;opacity:.78}
.home-story-arrow:hover,.home-story-arrow:focus-visible{background:#000c;opacity:1}
.home-story-prev{left:10px}
.home-story-next{right:10px}
@keyframes home-story-progress{to{width:100%}}
.home-story-open{position:absolute;inset:0;z-index:1;width:100%;border:0;background:transparent;cursor:zoom-in}
.home-story-open:focus-visible{outline:2px solid #fff;outline-offset:-4px}
.home-story-dialog{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#000;color:#fff;overflow:hidden}
.home-story-dialog[open]{display:grid;place-items:center;pointer-events:auto}
.home-story-dialog::backdrop{background:#000}
.home-story-dialog .home-story-viewer{width:min(calc(100vw - 28px),calc((100dvh - 90px)*var(--story-ratio)))}
.home-story-dialog .home-story-frame{border:0;touch-action:pan-y}
.home-story-dialog .home-story-open{display:none}
.home-story-close{position:absolute;top:max(10px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));z-index:3;width:44px;height:44px;border:1px solid #fff;background:#000;color:#fff;font:30px/1 Arial,sans-serif}
@media(max-width:760px){.home-stories{padding:16px}.home-story-viewer{width:min(44vw,calc((100dvh - 82px)*var(--story-ratio)))}.home-story-arrow{width:34px;height:34px;margin-top:-17px}.home-stories>.home-story-viewer .home-story-arrow{display:none}}
@media(prefers-reduced-motion:reduce){.home-story-progress button.is-active i{animation:none}}

#siteView:is([data-page="about"],.is-home) #contentBody .about-profile{display:flex;flex-direction:column;align-items:flex-start;gap:.45rem;max-width:52rem}
#siteView:is([data-page="about"],.is-home) #contentBody .about-profile h1{font-size:clamp(2.4rem,5vw,4rem);line-height:.95;margin:0 0 .35rem}
#siteView:is([data-page="about"],.is-home) #contentBody .about-location{margin:0 0 1.2rem;font-size:clamp(1.1rem,2vw,1.5rem)}
#siteView:is([data-page="about"],.is-home) #contentBody .about-line{display:flex;flex-wrap:wrap;align-items:baseline;gap:.35rem .55rem;margin:.2rem 0;font-size:clamp(1rem,1.7vw,1.35rem);line-height:1.3}
#siteView:is([data-page="about"],.is-home) #contentBody .about-line a{color:inherit;text-decoration:none;border-bottom:1px solid currentColor}
#siteView:is([data-page="about"],.is-home) #contentBody .about-line a:hover{opacity:.62}
#siteView:is([data-page="about"],.is-home) #contentBody .about-social-links{display:flex;align-items:center;gap:.8rem;margin-top:1rem}
#siteView:is([data-page="about"],.is-home) #contentBody .about-social-links a{display:grid;place-items:center;width:38px;height:38px;border:1px solid #111;border-radius:50%;transition:background-color .18s ease,transform .18s ease}
#siteView:is([data-page="about"],.is-home) #contentBody .about-social-links a:hover{background:#eee;transform:translateY(-2px)}
#siteView:is([data-page="about"],.is-home) #contentBody .about-social-links img{display:block;width:19px;height:19px;object-fit:contain}
@media(prefers-reduced-motion:reduce){#siteView:is([data-page="about"],.is-home) #contentBody .about-social-links a{transition:none}}

.about-posts{width:100%;max-width:52rem;margin-top:1.65rem;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
.about-post-tile{position:relative;display:block;width:100%;aspect-ratio:1;padding:0;border:1px solid #111;background:#111;overflow:hidden}
.about-post-tile :is(img,video){display:block;width:100%;height:100%;object-fit:cover}
.about-post-tile span{position:absolute;right:6px;top:6px;padding:1px 5px;background:#fff;color:#111}
.about-post-tile:focus-visible{outline:2px solid #111;outline-offset:2px;z-index:1}
.about-post-dialog{width:min(42rem,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:0;border:0;background:#fff;overflow:auto}
.about-post-dialog::backdrop{background:#000b}
.about-post-close{min-width:44px;min-height:44px;border:1px solid #111;background:#fff;color:#111;font-size:1.4rem}
.about-post{min-width:0;border:1px solid #111;color:#111;background:#fff}
.about-post header,.about-post-controls{display:flex;align-items:center;justify-content:space-between;padding:.45rem .75rem;font:inherit}
.about-post header a{color:inherit}
.about-post-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;background:#000}
.about-post-track::-webkit-scrollbar{display:none}
.about-post-track>:is(img,video){display:block;flex:0 0 100%;width:100%;min-width:0;aspect-ratio:4/5;object-fit:contain;scroll-snap-align:start}
.about-post-controls{border-bottom:1px solid #111}
.about-post-controls button{min-width:44px;min-height:44px;border:1px solid #111;background:#fff;color:#111;font-size:1.4rem}
.about-post-caption{white-space:pre-wrap;overflow-wrap:anywhere;margin:0;padding:.75rem}

#siteView.is-home .page-canvas{padding-top:0}
#siteView.is-home #contentBody{padding:0}
.home-info{min-height:100dvh;padding:1.5rem;background:#fff;color:#111}
@media(max-width:760px){
  .home-info{position:relative;z-index:5;padding:1rem}
}

@media(max-width:760px){
  #siteView[data-page="about"] .mobile-header{top:0;justify-content:flex-end;padding:8px 12px;background:#fff}
  #siteView[data-page="about"] .mobile-info-close{display:grid;place-items:center;width:44px;height:44px;font:32px/1 Arial,sans-serif}
  #siteView[data-page="about"] .page-canvas{padding-top:60px}
}

@media (max-width: 760px) {
  #siteView { overflow: hidden; }
  #siteView .page-canvas { pointer-events: auto; overflow-y: auto; -webkit-overflow-scrolling: touch; }
}
