/* The living desk: window light, moving pieces, captions and controls.
   Load after desk.css, desk-watch.css. Every layer below the controls is
   registered to .desk-scene, so it scales and pans with the photograph. */

/* ——— Light ——— */
.desk-art{filter:var(--desk-grade,brightness(1));transition:filter 2.4s ease}
.desk-watch-face,.desk-transition-art,.desk-flight-face{filter:var(--desk-grade,brightness(1))}
.desk-invitation-face{filter:var(--desk-grade,brightness(1))}
.desk-invitation.is-inviting .desk-invitation-face{filter:var(--desk-grade,brightness(1)) brightness(1.055)}
.desk-light-beams,.desk-light-motes{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;opacity:0;transition:opacity 1.8s ease}
.desk-light-beams{mix-blend-mode:soft-light}
.desk-light-motes{mix-blend-mode:screen}
.desk-scene.desk-light-on .desk-light-beams,.desk-scene.desk-light-on .desk-light-motes{opacity:1}

/* ——— Objects ——— */
.desk-curios{position:absolute;inset:0;z-index:7;pointer-events:none}
.desk-curio{position:absolute;display:block;margin:0;padding:0;border:0;background:transparent;pointer-events:auto;cursor:pointer;appearance:none;-webkit-appearance:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:background-color .2s ease}
.desk-curio:focus{outline:none}
.desk-curio:focus-visible{background:#ffe2a02e}
.desk-stage.is-dragging .desk-curio{cursor:grabbing}

.desk-pieces{position:absolute;inset:0;z-index:8;pointer-events:none}
.desk-piece{position:absolute;opacity:0;visibility:hidden}
.desk-piece.is-live{opacity:1;visibility:visible}
.desk-piece-under{position:absolute;inset:0;opacity:0;filter:blur(3px)}
.desk-piece-hole{position:absolute;inset:0;background:radial-gradient(ellipse at 52% 56%,#160d06e6,#160d0699 68%,#160d0600 100%)}
.desk-piece-body{position:absolute;inset:0;will-change:transform;transition:transform .32s cubic-bezier(.2,.8,.2,1),filter .32s ease}
.desk-piece-grade{position:absolute;inset:0;filter:var(--desk-grade,brightness(1))}
.desk-piece-face,.desk-piece-inner{position:absolute;inset:0;overflow:hidden;background-image:var(--desk-art);background-repeat:no-repeat}
.desk-piece-inner{opacity:0;filter:var(--desk-grade,brightness(1))}
.desk-piece-inner.is-live{opacity:1}
.desk-piece-shine{position:absolute;inset:-30%;opacity:0;pointer-events:none;background:linear-gradient(110deg,transparent 36%,#fff4d45e 49%,transparent 63%)}
.desk-piece.is-hovered .desk-piece-body{transform:translateY(-1.6%) scale(1.012);filter:drop-shadow(1px 4px 4px #120a0438)}
.desk-piece.is-lifted{visibility:visible}

.desk-fx{position:absolute;inset:0;width:100%;height:100%;z-index:9;pointer-events:none;overflow:visible}
.desk-fx-ink{font-family:'Snell Roundhand','Apple Chancery','Segoe Script','Lucida Handwriting','Brush Script MT',cursive;font-style:italic;letter-spacing:.2px}

/* ——— Labels and captions ——— */
.desk-curio-tip{position:absolute;z-index:20;transform:translate(-50%,calc(-100% - 6px));padding:6px 11px;background:#f1e7d5f2;border:1px solid #bba27a99;border-radius:3px;box-shadow:0 6px 18px #180f0d40;font:14px/1.3 Georgia,serif;color:#1b3235;white-space:nowrap;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .16s ease,transform .16s ease}
.desk-curio-tip.is-visible{opacity:1;visibility:visible;transform:translate(-50%,calc(-100% - 10px))}
.desk-stage.is-dragging~.desk-curio-tip,.desk-stage.is-dragging .desk-curio-tip,.desk-is-opening .desk-curio-tip{opacity:0;visibility:hidden}

.desk-curio-card{position:absolute;z-index:15;max-width:300px;padding:13px 16px 12px;background:#f4edddf7;border:1px solid #cdb88d;border-radius:3px;box-shadow:0 14px 36px #140c0670;color:#1b3235;pointer-events:none}
.desk-curio-card[hidden]{display:none}
.desk-curio-card strong{display:block;font:17px/1.3 Georgia,serif;font-weight:400}
.desk-curio-card span{display:block;margin-top:5px;font:13px/1.45 system-ui,sans-serif;color:#5e625a}
.desk-curio-card em{display:block;margin-top:9px;padding-top:8px;border-top:1px solid #cdb88d66;font:italic 12px/1.3 Georgia,serif;color:#7b6744}
.desk-curio-card.is-docked{left:50%;top:14px;transform:translateX(-50%);width:min(320px,calc(100% - 32px));text-align:center}
.desk-is-opening .desk-curio-card{display:none}

/* ——— The loupe ——— */
.desk-loupe{position:absolute;left:0;top:0;z-index:16;width:180px;height:180px;border-radius:50%;pointer-events:none;background-repeat:no-repeat;background-color:#24221d;filter:var(--desk-grade,brightness(1));box-shadow:0 0 0 6px #a8863f,0 0 0 7px #5e4419,0 0 0 9px #d8bd7a66,0 22px 44px #0a050273,inset 0 0 22px #00000059}
.desk-loupe[hidden]{display:none}
.desk-loupe-glass{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 32% 26%,#ffffff47,#ffffff0d 32%,transparent 55%),radial-gradient(circle at 70% 78%,#fff4d41f,transparent 40%)}
.desk-stage.is-looking,.desk-stage.is-looking .desk-object,.desk-stage.is-looking .desk-curio{cursor:none}
.desk-stage.is-looking .desk-label{display:none}

/* ——— Controls ——— */
.desk-ambience{position:absolute;top:18px;right:24px;z-index:13;display:flex;gap:2px;padding:4px;background:#122b30ed;border:1px solid #dac59a66;border-radius:4px;box-shadow:0 4px 24px #0a080744;backdrop-filter:blur(12px)}
.desk-ambience button{appearance:none;display:inline-grid;place-items:center;min-width:42px;min-height:42px;padding:6px;border:0;border-radius:2px;background:none;color:#f4e7cf;cursor:pointer;touch-action:manipulation}
.desk-ambience button:hover{background:#d9bb8022}
.desk-ambience button:focus-visible{outline:2px solid #e4c992;outline-offset:-2px}
.desk-is-opening .desk-ambience,body:not([data-archive-view="desk"]) .desk-ambience{visibility:hidden}
.desk-tool-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.desk-tool-icon[aria-pressed="false"]{color:#b8ab93}
.desk-tool-light[data-mode="golden"]{color:#f0c27a}
.desk-tool-light[data-mode="night"]{color:#b7c6f4}
.desk-tool-light[data-mode="morning"]{color:#f7e6c4}
.desk-tool-light[data-mode="midday"]{color:#fff6de}

.desk-found{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:6px 12px;margin:14px 0 2px;font:13px/1.4 system-ui,sans-serif;color:#c4b69e}
.desk-found strong{font:15px/1.2 Georgia,serif;font-weight:400;color:#f4e7cf;font-variant-numeric:tabular-nums}
.desk-found-bar{grid-column:1/-1;position:relative;height:2px;background:#e9d1a31f;border-radius:2px;overflow:hidden}
.desk-found-bar::after{content:"";position:absolute;inset:0 auto 0 0;width:calc(var(--found,0)*100%);background:#e4c992;transition:width .6s ease}

@media(max-width:1000px){
 .desk-ambience{top:12px;right:12px}
 .desk-stage.is-touring~.desk-ambience{visibility:hidden}
 .desk-curio-card.is-docked{top:70px}
 .desk-loupe{width:132px;height:132px}
 .desk-curio-tip{display:none}
}
@media(max-width:370px){.desk-tool-icon svg{width:18px;height:18px}}

@media(prefers-reduced-motion:reduce){
 .desk-art,.desk-light-beams,.desk-light-motes,.desk-piece-body,.desk-curio-tip,.desk-curio,.desk-found-bar::after{transition:none}
 .desk-piece.is-hovered .desk-piece-body{transform:none}
}
@media(forced-colors:active){.desk-light-beams,.desk-light-motes,.desk-pieces,.desk-fx{display:none}}
