.home.home-contilemma{--accent:#c1dcd5;--muted:#b9c3c8;--line:#afc9d52b;background:#070c13}
.home-contilemma .atmosphere{background:#070c13}
.site-contilemma .atmosphere:before,.site-contilemma .atmosphere:after{display:none}
.site-contilemma .atmosphere canvas{animation:none}
.home-contilemma header{max-width:none;border:0;padding:0 5vw;min-height:92px}
.home-contilemma header nav{margin-left:auto;justify-content:flex-end}
.home-contilemma header .brand{font-size:10px;letter-spacing:.18em;color:#bdc6c9}
.home-contilemma header nav a{color:#d6dedd}
.home-contilemma header nav a[aria-current=page]{color:#fff}
.home-contilemma main{max-width:1440px;padding-top:0}
.home-contilemma .masthead{min-height:calc(100svh - 92px);margin:0;padding:40px 0 120px;align-items:center}
.home-contilemma .masthead>div{position:relative}
.home-contilemma .masthead h1{font-size:clamp(62px,7.2vw,104px);font-weight:400;letter-spacing:.025em;line-height:1.1;text-shadow:0 2px 35px #03091280}
.home-contilemma .masthead .eyebrow{color:#c5d9d5;font-size:10px;letter-spacing:.23em}
.home-contilemma .author-ja{color:#c8d0d3;margin-top:26px;font-size:11px}
.home-contilemma .field-index{bottom:48px;color:#d0dcde;font-size:10px}
.home-contilemma .field-index:before{background:#c3d7df;width:30px}
.home-contilemma .output-section{position:relative;padding-top:50px;padding-bottom:45px}
.home-contilemma .output-section:before{content:"";position:absolute;z-index:-1;inset:-130px -5vw -85px;background:linear-gradient(transparent,#080e15ed 140px,#080e15 80%);pointer-events:none}
.home-contilemma .output-section .section-head{margin-bottom:28px}
.site-contilemma .motion-toggle{background:#081119b3;color:#d0dce0;border-color:#bdcfdf42}
.home-contilemma footer{border-color:#839eab26;max-width:none;background:#080e15}

@media(max-width:760px){.home-contilemma header{min-height:120px;padding-top:25px;padding-bottom:20px;gap:20px}.home-contilemma header nav{gap:19px}.home-contilemma .masthead{min-height:calc(100svh - 120px);align-items:flex-end;padding-bottom:130px}.home-contilemma .masthead h1{font-size:62px}.home-contilemma .masthead .eyebrow{font-size:8px;letter-spacing:.17em}.home-contilemma .masthead .author-ja{font-size:10px;margin-top:19px}.home-contilemma .field-index{bottom:40px;font-size:9px}.home-contilemma .output-section{padding-top:26px}}
/* Selected CONTILEMMA composition and artwork explanation. */
.home.home-contilemma{background:#03080e;--accent:#bfddd6;--muted:#a0b8b7}
.home-contilemma .atmosphere{background:radial-gradient(ellipse at 68% 45%,#16343880 0%,#081119 35%,#03080e 70%)}
.home-contilemma .masthead{align-items:flex-end;padding-bottom:165px}
.home-contilemma .masthead h1{font-size:clamp(64px,7.1vw,102px);line-height:.98;letter-spacing:-.015em;color:#dce7df;font-weight:400}
.home-contilemma .masthead .eyebrow{font-size:9px;letter-spacing:.25em;color:#92aca7;margin-bottom:26px}
.home-contilemma .author-ja{font-size:10px;color:#91a8a2;letter-spacing:.24em}
.home-contilemma .portrait-caption{position:absolute;right:0;bottom:70px;max-width:440px;text-align:right}
.portrait-caption p{margin:0}.portrait-name{font:12px monospace;letter-spacing:.2em;color:#d5e7df}
.portrait-name span{font-size:8px;letter-spacing:.13em;margin-left:13px;color:#98b5b5}
.portrait-actions{display:flex;gap:12px;align-items:center;justify-content:flex-end;margin-top:13px}
.portrait-actions label{font-size:9px;color:#95aeae}
.portrait-actions select,.portrait-actions button{font-family:inherit;font-size:11px;border:0;border-bottom:1px solid #75908e66;border-radius:0;color:#c6d9d4;background:#061015b3;padding:8px 2px;cursor:pointer}
.portrait-actions option{background:#0b1920;color:#d5e7df}
.portrait-actions button{background:transparent;padding-right:0}.portrait-actions button span{margin-left:7px}
.portrait-caption #portrait-stamp{font:9px monospace;letter-spacing:.08em;color:#8ca7a6;margin-top:8px}
.portrait-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.home-contilemma :is(button,select,summary,a):focus-visible{outline:2px solid #bce9dd;outline-offset:5px}
body:has(#artwork-note[open]){overflow:hidden}
#artwork-note{box-sizing:border-box;color:#c4d6d3;background:#071218f5;border:1px solid #648f914d;border-radius:2px;width:min(740px,calc(100% - 32px));max-height:calc(100svh - 48px);padding:0 42px 32px;overscroll-behavior:contain;scrollbar-color:#526c6d #071218}
#artwork-note::backdrop{background:#01060ba8;backdrop-filter:blur(7px)}
.artwork-note-head{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;background:#071218f5;padding:20px 0;margin-bottom:36px;border-bottom:1px solid #648f914d;font:9px monospace;letter-spacing:.14em}
.artwork-note-head button{font-family:inherit;font-size:11px;border:0;background:transparent;color:#d5e7df;cursor:pointer;padding:10px}
#artwork-note .eyebrow{font-size:9px;letter-spacing:.15em;color:#8ba9a7;margin-bottom:16px}
#artwork-note h2{font-size:clamp(26px,4vw,38px);line-height:1.6;font-weight:400;letter-spacing:.08em;margin:0 0 24px;color:#e1eae2}
#artwork-note p{font-size:13px;line-height:2.05;margin:16px 0}
#artwork-note .artwork-lead{font-size:15px;line-height:2.2;color:#d1e0d8;margin-bottom:22px}
#artwork-note section{border-top:1px solid #648f9133;margin-top:30px;padding-top:22px}
#artwork-note h3{font-size:14px;font-weight:500;letter-spacing:.06em;margin:0 0 16px;color:#dbe6df}
.portrait-ratios{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:20px 0}
.portrait-ratios div{display:flex;flex-direction:column;gap:10px;border-left:1px solid #96c7bc66;padding-left:15px}
.portrait-ratios div>span{font:10px monospace;letter-spacing:.1em;color:#99b4ae}
.portrait-ratios strong{font:16px monospace;color:#dce8e1}.portrait-ratios small{font:10px monospace;color:#9fb7b2}
#artwork-note details{margin-top:22px}#artwork-note summary{cursor:pointer;font-size:12px;padding:8px 0;color:#b8d2cd}
#portrait-records{list-style:none;margin:12px 0;padding:0}#portrait-records li{display:flex;gap:16px;font-size:11px;line-height:1.8;margin-top:8px}#portrait-records li>span:first-child{font-family:monospace;flex-shrink:0;color:#8fabaa}
.portrait-equations{font:12px/2 monospace;white-space:pre-wrap;background:#15282b66;color:#b6d4cd;border-left:2px solid #708f8c;padding:14px 18px;margin:22px 0}
#artwork-note .portrait-credit{font-size:10px;color:#94aaa7;border-top:1px solid #648f9133;padding-top:24px;margin-top:30px}.portrait-credit a{color:#b9d0ca}
@media(max-width:760px){
 .home-contilemma .masthead{padding-bottom:185px}.home-contilemma .masthead h1{font-size:56px}.home-contilemma .masthead .eyebrow{font-size:8px}.home-contilemma .author-ja{margin-top:20px}
 .home-contilemma .portrait-caption{bottom:76px;left:0;right:auto;text-align:left;max-width:100%}.portrait-actions{justify-content:flex-start;gap:10px}.portrait-actions select,.portrait-actions button{font-size:10px}.portrait-caption #portrait-stamp{font-size:8px}.portrait-name{font-size:10px}.portrait-name span{font-size:8px}
 #artwork-note{padding:0 20px 24px;max-height:calc(100svh - 24px);width:calc(100% - 20px)}.artwork-note-head{margin-bottom:24px}#artwork-note h2{font-size:25px}#artwork-note p{font-size:12px}.portrait-ratios{gap:8px}.portrait-ratios div{padding-left:8px}.portrait-ratios strong{font-size:12px}.portrait-ratios small{font-size:9px}
}

/* Mobile: ring above, identity below-left; preserve room for both in the first view. */
@media(max-width:760px){
 .home-contilemma header{min-height:100px;padding-top:12px;padding-bottom:12px;gap:4px}
 .home-contilemma header .brand{min-height:28px;display:flex;align-items:center}
 .home-contilemma header nav{gap:18px}
 .home-contilemma header nav a{min-height:44px;display:flex;align-items:center}
 .home-contilemma .masthead{min-height:max(530px,calc(100svh - 100px));align-items:flex-end;padding-top:20px;padding-bottom:172px}
 .home-contilemma .masthead h1{font-size:clamp(42px,12.8vw,56px)}
 .home-contilemma .masthead .eyebrow{margin-bottom:18px}
 .home-contilemma .masthead .author-ja{margin-top:16px}
 .home-contilemma .portrait-caption{bottom:66px}
 .home-contilemma .portrait-actions select,.home-contilemma .portrait-actions button{min-height:44px}
 .home-contilemma .field-index{bottom:14px;min-height:44px}
}

/* All portfolio pages inhabit the same work; content stays in its existing layout. */
.interior.site-contilemma{background:#03080e;--accent:#bfddd6;--muted:#a0b8b7;--line:#afc9d52b}
.interior.site-contilemma .atmosphere{background:radial-gradient(ellipse at 72% 45%,#16343880 0%,#081119 35%,#03080e 70%)}
.interior.site-contilemma .atmosphere canvas{opacity:.58}
.interior.site-contilemma .atmosphere:after{display:block;background:linear-gradient(90deg,#03080e88,transparent 65%)}
@media(max-width:760px){.interior.site-contilemma .atmosphere canvas{opacity:.42}}

/* Large viewport height stays stable when mobile browser bars collapse during scrolling. */
@media(max-width:760px){.site-contilemma .atmosphere{height:100lvh;bottom:auto}}

/* Selected mobile disclosure A; desktop artwork dialog is preserved. */
.portrait-region,.portrait-disclosure{display:none}
@media(max-width:760px){
 .home-contilemma.info-inline .masthead{display:flex;flex-direction:column;align-items:stretch;min-height:max(600px,calc(100svh - 100px));padding:0 0 68px}
 .info-inline .portrait-region{display:block;position:relative;flex:1 0 230px;min-height:230px}
 .info-inline .masthead>div:not(.portrait-region){flex:none}
 .home-contilemma.info-inline .portrait-caption{position:static;flex:none;max-width:none;width:100%;text-align:left;padding:12px 0 18px;margin:0 0 24px;border-bottom:1px solid #92bab54d}
 /* A reserves the same drawing area whether its explanation is open or closed. */
 .info-inline .portrait-region{flex:0 0 max(230px,calc(100svh - 420px))}
 .info-inline .portrait-caption>.portrait-name,.info-inline #about-artwork{display:none}
 .info-inline .portrait-disclosure{display:block}
 .info-inline .portrait-disclosure[open]{background:#071218f5;box-shadow:0 0 0 16px #071218f5}
 .info-inline .portrait-disclosure>summary{display:flex;align-items:center;gap:16px;min-height:44px;width:100%;cursor:pointer;list-style:none;font:12px monospace;letter-spacing:.18em;color:#d5e7df}
 .info-inline .portrait-disclosure>summary::-webkit-details-marker{display:none}
 .info-inline .portrait-disclosure>summary:focus-visible{outline:1px solid #c2e8dc;outline-offset:4px}
 .info-inline .portrait-disclosure>summary:hover{color:#fff}
 .info-inline .disclosure-mark{position:relative;width:20px;height:20px;flex:none}
 .info-inline .disclosure-mark::before,.info-inline .disclosure-mark::after{content:"";position:absolute;left:4px;top:9px;width:12px;height:1px;background:currentColor}
 .info-inline .disclosure-mark::after{transform:rotate(90deg)}
 .info-inline .portrait-disclosure[open]>summary .disclosure-mark::after{transform:rotate(0)}
 .info-inline #portrait-inline-content{padding:16px 0 10px}
 .info-inline .portrait-caption .inline-series{font:9px monospace;letter-spacing:.15em;color:#90ada8;margin:0 0 12px}
 .info-inline .portrait-actions{justify-content:flex-start}
 .info-inline .portrait-actions select{min-height:44px;font-size:11px;max-width:100%}
 .info-inline .inline-description{padding-top:24px;color:#b8ceca}
 .info-inline .inline-description .eyebrow{font-size:9px;letter-spacing:.15em;color:#8ba9a7;margin-bottom:16px}
 .info-inline .inline-description h2{font-size:25px;line-height:1.6;font-weight:400;letter-spacing:.08em;margin:0 0 24px;color:#e1eae2}
 .info-inline .inline-description p{font-size:12px;line-height:2.05;margin:16px 0}
 .info-inline .inline-description .artwork-lead{font-size:14px;line-height:2.2;color:#d1e0d8;margin-bottom:22px}
 .info-inline .inline-description section{border-top:1px solid #648f9133;margin-top:30px;padding-top:22px}
 .info-inline .inline-description h3{font-size:14px;font-weight:500;letter-spacing:.06em;margin:0 0 16px;color:#dbe6df}
 .info-inline .inline-description details{margin-top:22px}
 .info-inline .inline-description summary{cursor:pointer;font-size:12px;padding:8px 0;color:#b8d2cd}
 .info-inline .inline-description .portrait-credit{font-size:10px;color:#94aaa7;border-top:1px solid #648f9133;padding-top:24px;margin-top:30px}
 .info-inline .inline-close{min-height:44px;padding:8px 0;margin-top:16px;border:0;background:none;color:#bdd5ce;font:11px monospace;cursor:pointer}
 .info-inline .portrait-actions{margin-top:7px}
 .info-inline .portrait-caption #portrait-stamp{margin-top:3px}
}

/* Adopted interior A2. */
/* A2: match the reviewed overlap: content starts at 583px in an 848px viewport. */
.interior.site-contilemma header{max-width:none;border:0;min-height:92px}
.interior.site-contilemma #main{max-width:1440px;padding-top:0}
.interior.site-contilemma .atmosphere{background:radial-gradient(ellipse at 68% 45%,#16343880 0%,#081119 35%,#03080e 70%)}
.interior.site-contilemma .atmosphere canvas{opacity:1}
.interior.site-contilemma .atmosphere:after{display:none}
.interior.site-contilemma .surface-hero{display:flex;align-items:flex-end;position:relative;min-height:calc(68.75svh - 92px);padding:40px 0 165px}
.interior.site-contilemma .surface-heading{width:100%;position:relative}
.interior.site-contilemma .surface-heading .title-row{margin-bottom:0;align-items:center}
.interior.site-contilemma .surface-heading .crumbs{margin-bottom:28px}
.interior.site-contilemma .surface-heading h1{max-width:62%;text-shadow:0 2px 35px #03091280}
.interior.site-contilemma .surface-content{position:relative;isolation:isolate;padding:50px 0 45px}
.interior.site-contilemma .surface-content:before{content:"";position:absolute;z-index:-1;inset:-130px -5vw -85px;background:linear-gradient(transparent,#080e15ed 140px,#080e15 80%);pointer-events:none}
.interior.site-contilemma :is(.service-detail,.profile-history,.about-copy,.details,.section,.notes-source,.empty){background:transparent}
.interior.site-contilemma footer{background:#080e15;max-width:none}
@media(max-width:760px){
 .interior.site-contilemma header{min-height:100px;padding-top:12px;padding-bottom:12px;gap:4px}
 .interior.site-contilemma header .brand{min-height:28px;display:flex;align-items:center}
 .interior.site-contilemma header nav{gap:18px}
 .interior.site-contilemma header nav a{min-height:44px;display:flex;align-items:center}
 .interior.site-contilemma .surface-hero{flex-direction:column;align-items:stretch;min-height:calc(68.75svh - 100px);padding:0 0 68px}
 .interior.site-contilemma .surface-hero .portrait-region{display:block;flex:1 0 180px;min-height:180px}
 .interior.site-contilemma .surface-heading{flex:none}
 .interior.site-contilemma .surface-heading h1{max-width:100%;font-size:clamp(40px,10vw,54px);overflow-wrap:anywhere}
 .interior.site-contilemma .surface-heading .title-row{display:block}
 .interior.site-contilemma .surface-heading .tag{margin-top:18px}
 .interior.site-contilemma .surface-heading .crumbs{margin-bottom:22px;font-size:10px;gap:8px}
 .interior.site-contilemma .surface-content{padding-top:26px}
}


.interior.site-contilemma .surface-scroll-cue{bottom:24px;min-height:44px;z-index:1}
@media(max-width:760px){.interior.site-contilemma .surface-scroll-cue{bottom:8px}}
