/* O'Phys V15.4.8 — additive ceramic intro & private book styling.
   The original content, routing and private-data functionality remain unchanged. */

/* Hero uses existing layout & copy. Video is a background, not a new hero page. */
#main .atelier-hero.ophys-video-ready{
  position:relative;isolation:isolate;overflow:hidden;border:1px solid #9f8a6540;
  border-radius:8px;padding:clamp(52px,5.4vw,78px) clamp(20px,4.6vw,64px);
  min-height:clamp(530px,70vh,780px);background:#071c2c;
}
#main .atelier-hero.ophys-video-ready > .ophys-hero-bg{
  position:absolute;inset:0;z-index:-2;overflow:hidden;pointer-events:none;
}
.ophys-hero-bg video{position:absolute;width:100%;height:100%;inset:0;object-fit:cover;object-position:center center;filter:saturate(.8) brightness(.73)}
#main .atelier-hero.ophys-video-ready::before{
  content:'';position:absolute;z-index:-1;inset:0;pointer-events:none;
  background:linear-gradient(92deg,#071923ed 0%,#071923da 35%,#0719239c 58%,#07192355 100%),linear-gradient(0deg,#0719234d,transparent 48%);
}
#main .atelier-hero.ophys-video-ready .atelier-intro{position:relative;z-index:1}
#main .atelier-hero.ophys-video-ready .atelier-art{position:relative;z-index:1}
#main .atelier-hero.ophys-video-ready .atelier-art .art-frame{background:#0b2838bf;backdrop-filter:blur(4px)}
.ophys-video-retry{position:absolute;z-index:4;bottom:16px;left:16px;min-height:44px;padding:10px 15px;border:1px solid #e6c786;background:#e8d0a1;color:#092336;font:600 12px AtelierSans,Arial,sans-serif}
.ophys-video-retry[hidden]{display:none!important}
@media(max-width:760px){
 #main .atelier-hero.ophys-video-ready{min-height:665px;padding:45px 22px 58px;gap:25px}
 #main .atelier-hero.ophys-video-ready::before{background:linear-gradient(0deg,#071923f7 0%,#071923e8 40%,#07192370 100%)}
 #main .atelier-hero.ophys-video-ready .atelier-intro{align-self:end}
 #main .atelier-hero.ophys-video-ready .atelier-art{max-width:180px;justify-self:center}
 #main .atelier-hero.ophys-video-ready .atelier-art .art-frame{padding:5px}
}

/* Private book collections: preserve actual section buttons & all their click handlers. */
.classroom .class-section-grid{gap:clamp(22px,3vw,36px);padding:10px 12px 28px;overflow:visible}
.classroom .class-section-wrap{perspective:1050px;padding:8px 6px 16px;overflow:visible}
.classroom button.class-section-tile{
  --px:0deg;--py:0deg;position:relative;transform-style:preserve-3d;overflow:visible;
  min-height:238px;padding:28px!important;
  border:1px solid #b69c69!important;border-radius:4px 13px 13px 4px!important;
  background:linear-gradient(91deg,#030f1fca 0 11%,#0a2941b8 14% 16%,#0b2b3a99 38%,#081e30a0 100%),
    url('/assets/iznik-ceramic-tile-03.webp') center / 235px!important;
  box-shadow:8px 9px 0 -2px #f1ebda,9px 11px 0 -1px #b9ab92,14px 20px 30px #092d3050!important;
  transform:perspective(1000px) rotateY(calc(-5deg + var(--py))) rotateX(var(--px));
  transition:transform .35s cubic-bezier(.2,.75,.2,1),filter .25s,box-shadow .35s;
  will-change:transform;isolation:isolate;
}
.classroom button.class-section-tile::before{
 content:'';position:absolute;z-index:-1;inset:15px 15px 15px 20px;
 background:linear-gradient(150deg,#092535f0,#0b2a3cf3 60%,#102f3bf0);
 border:1px solid #d7bb80a8;border-radius:2px 9px 9px 2px;
 box-shadow:inset 0 0 0 4px #0925359c,0 0 18px #07182380;
}
.classroom button.class-section-tile::after{
 content:'';position:absolute;left:5px;top:0;bottom:0;width:13px;
 border-right:1px solid #c9a97170;
 background:linear-gradient(90deg,#041522,#092d46 45%,#e0c59068 50%,#0c2c41 63%,#061b2b);
 border-radius:3px 0 0 3px;transform:translateZ(3px);
}
.classroom .class-section-tile>span,.classroom .class-section-tile>small{position:relative;z-index:1;transform:translateZ(10px);display:block;overflow-wrap:anywhere}
.classroom .class-section-tile>span{font-size:clamp(27px,2.7vw,37px)!important;color:#fff7e6}
.classroom .class-section-tile small{font-size:11px;color:#e4cc9c;letter-spacing:.06em}
@media(hover:hover) and (pointer:fine){
 .classroom button.class-section-tile:hover{transform:perspective(1000px) translateY(-8px) rotateY(calc(-6deg + var(--py))) rotateX(var(--px));filter:brightness(1.1);box-shadow:8px 9px 0 -2px #f1ebda,9px 11px 0 -1px #b9ab92,21px 28px 39px #092d3080!important}
}
.classroom .class-section-tile:active{transform:perspective(900px) scale(.98)!important}
.classroom .class-section-wrap .class-section-edit{position:relative;z-index:2;margin-top:16px!important}
.classroom .class-section-heading{margin-top:24px}
.classroom .class-section-content .class-toolbar nav button{white-space:normal;text-align:center}
@media(max-width:850px){.classroom .class-section-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}}
@media(max-width:530px){
 .classroom .class-section-grid{grid-template-columns:minmax(0,1fr);padding:10px 12px 25px;gap:19px}
 .classroom button.class-section-tile{min-height:196px;padding:20px!important}
 .classroom .class-section-tile>span{font-size:30px!important}
 .classroom .class-stats{gap:0}
 .classroom .class-toolbar nav{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 .classroom .class-toolbar nav button{min-width:0;padding:12px 8px!important}
 .classroom .class-search-small{width:100%}
}

/* Existing PDF.js + PageFlip: enhanced material and clear controls; no engine swap. */
.reader .book-area{
 position:relative;overflow:auto;box-shadow:inset 0 2px 30px #0009,0 0 0 1px #dab98633;
 background:radial-gradient(ellipse at 50% 40%,#244050 0%,#0b202e 67%,#03121b 100%);
 border:1px solid #bdab8750;scrollbar-width:thin;
}
.reader .book-area::after{content:'';position:absolute;pointer-events:none;inset:0;background:radial-gradient(ellipse at center,transparent 55%,#0005 100%)}
.reader .pdfpage{background:#fffdf8;box-shadow:0 4px 12px #07141c3c}
.reader .book-area .stf__parent{filter:drop-shadow(0 20px 24px #0008)}
.reader .book-area .stf__item{backface-visibility:hidden}
.reader .toolbar button{border-radius:5px;min-height:44px}
.reader #pdf-prev,.reader #pdf-next{font-weight:700;font-size:18px;min-width:48px}
.reader #pdf-mode[aria-pressed="true"]{border-color:#d3b77c;background:#edddbc;color:#09283d}
.reader.full .toolbar{gap:8px}
@media(max-width:700px){.reader .toolbar{gap:7px}.reader .toolbar button{font-size:12px;min-width:43px;min-height:44px}}
@media(prefers-reduced-motion:reduce){
 .classroom button.class-section-tile,.classroom button.class-section-tile:hover{transition:none!important;transform:none!important}
}

/* Ceramic entrance — independent overlay, shown only when the homepage is visited. */
.ophys-gate{--p:0;position:fixed;inset:0;z-index:25000;overflow:hidden;isolation:isolate;color:#fff7e9;background:#061c2d;font-family:AtelierSans,Arial,sans-serif;--gold:#e1c18c}
.ophys-gate[hidden]{display:none!important}
.ophys-gate .og-behind{position:absolute;inset:0;background:#061d2c}
.ophys-gate .og-behind video{width:100%;height:100%;object-fit:cover;filter:brightness(.66) saturate(.85)}
.ophys-gate .og-wall{position:absolute;inset:-8%;z-index:1;background:#062a41 url('/assets/iznik-cobalt-wall.webp') center/575px repeat;transform:scale(1.035);will-change:transform,opacity;filter:brightness(.82) saturate(.96)}
.ophys-gate canvas{position:absolute;inset:0;z-index:2;width:100%;height:100%;pointer-events:none;will-change:opacity}
.ophys-gate .og-shade{position:absolute;inset:0;z-index:3;background:linear-gradient(0deg,#031522ed 0%,#041c2b8a 34%,#04162452 70%,#03152480 100%);pointer-events:none}
.ophys-gate .og-top{position:absolute;z-index:7;top:0;left:0;right:0;display:flex;justify-content:flex-end;align-items:center;gap:15px;padding:26px clamp(20px,4.5vw,60px);font-size:10px;font-weight:600;letter-spacing:.18em}
.ophys-gate .og-top strong{font-family:AtelierSerif,Georgia,serif;font-size:19px;letter-spacing:.1em}
.ophys-gate .og-skip{color:#fff5e1;background:#071f30a8;border:1px solid #f1daaa75;min-height:43px;padding:10px 14px;border-radius:3px;cursor:pointer;font-size:11px;letter-spacing:.06em}
.ophys-gate .og-stage{position:absolute;inset:10% 7% 12%;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;pointer-events:none;perspective:1000px}
.ophys-gate .og-logo-wrap{position:relative;width:clamp(175px,20vw,270px);aspect-ratio:1;display:grid;place-items:center;filter:drop-shadow(0 22px 40px #0008);transform-style:preserve-3d;will-change:transform,opacity}
.ophys-gate .og-logo-wrap::before{content:'';position:absolute;inset:-20px;border-radius:50%;border:1px solid #ebc68b66;box-shadow:0 0 0 18px #081b2a1c,0 0 80px 20px #d5b36b31}
.ophys-gate .og-logo-wrap img{display:block;position:relative;width:100%;height:100%;object-fit:contain;border:2px solid #dfc595;background:#082337;box-shadow:0 2px 0 #b49666,0 13px 0 -5px #092131,0 20px 60px #0008}
.ophys-gate .og-copy{margin-top:clamp(22px,3.2vh,38px);pointer-events:auto;will-change:opacity}
.ophys-gate .og-kicker{font-size:10px;color:#e5c688;letter-spacing:.19em;font-weight:600}
.ophys-gate h2{font:600 clamp(40px,5.4vw,76px)/.96 AtelierSerif,Georgia,serif!important;letter-spacing:-.02em!important;color:#fff7e9!important;margin:15px 0}
.ophys-gate h2 em{color:#e6c58c}
.ophys-gate .og-description{font-size:13px;line-height:1.7;color:#d9ded9;margin:0 auto 22px;max-width:420px}
.ophys-gate .og-enter{display:inline-flex;justify-content:center;align-items:center;gap:23px;min-height:48px;border:1px solid #e8ce9a;background:#e6c993;color:#102432;font:600 11px AtelierSans,Arial,sans-serif;letter-spacing:.1em;padding:14px 25px;border-radius:2px;cursor:pointer;transition:background .2s}
.ophys-gate .og-enter:hover{background:#f8e3b7}
.ophys-gate .og-bottom{position:absolute;z-index:6;bottom:21px;left:clamp(20px,4.5vw,60px);right:clamp(20px,4.5vw,60px);display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:.14em;color:#ebd0a5}
.ophys-gate .og-bar{position:absolute;z-index:10;left:0;bottom:0;width:100%;height:3px;transform-origin:left;transform:scaleX(var(--p));background:#edd09a}
.ophys-gate.og-playing .og-enter{opacity:0;pointer-events:none}
.ophys-gate.og-playing .og-skip{opacity:0;pointer-events:none}
@media(max-width:700px){
 .ophys-gate .og-wall{background-size:360px}
 .ophys-gate .og-top{padding:17px 16px;font-size:8px}
 .ophys-gate .og-top strong{font-size:16px}
 .ophys-gate .og-skip{font-size:9px;padding:8px 9px}
 .ophys-gate .og-stage{inset:11% 5% 15%}
 .ophys-gate .og-logo-wrap{width:min(48vw,196px)}
 .ophys-gate .og-copy{margin-top:30px}
 .ophys-gate h2{font-size:clamp(34px,10.1vw,53px)!important}
 .ophys-gate .og-description{max-width:330px;padding:0 9px}
 .ophys-gate .og-bottom{font-size:8px;left:18px;right:18px}
}
@media(max-height:700px){.ophys-gate .og-stage{inset:11% 5% 14%}.ophys-gate .og-logo-wrap{width:clamp(110px,21vh,160px)}.ophys-gate .og-copy{margin-top:16px}.ophys-gate h2{font-size:clamp(32px,7vh,54px)!important;margin:9px 0}.ophys-gate .og-description{margin-bottom:10px}}
@media(prefers-reduced-motion:reduce){.ophys-gate *{animation:none!important;transition:none!important}}

/* Private navigation: meaningful prominent tabs, no routing change. */
.classroom .ev-tabs{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:22px 0 8px;padding:11px;background:#f0e9dc;border:1px solid #decfac;border-radius:8px}
.classroom .ev-tabs>.button{flex:1 1 190px;display:flex;align-items:center;justify-content:center;text-align:center;min-height:49px;padding:11px 15px!important;font-size:13px!important;line-height:1.3}
.classroom .ev-tabs>.button[aria-current=page]{background:#193f52!important;color:#fff8e9!important;border-color:#193f52!important}
@media(max-width:530px){.classroom .ev-tabs{flex-direction:column;align-items:stretch;padding:7px}.classroom .ev-tabs>.button{flex:none;width:100%}}