/* The Lantern — Place 002: The Cup on the Windowsill v0.19 */

.lantern-cup-place{
  --cup-clay:#8e9aa0;
  --cup-clay-light:#b6c0c2;
  --cup-clay-dark:#505e66;
  background:
    radial-gradient(circle at 68% 24%,rgba(79,102,118,.09),transparent 30%),
    linear-gradient(180deg,#071018 0%,#08131c 54%,#060d13 100%);
}

.lantern-cup-hero{
  min-height:720px;
  display:flex;
  align-items:center;
  padding:110px 0 72px;
  position:relative;
  overflow:hidden;
}

.lantern-cup-hero:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(200,155,85,.05) 1px,transparent 1px),
    linear-gradient(rgba(200,155,85,.03) 1px,transparent 1px);
  background-size:118px 118px;
  mask-image:linear-gradient(90deg,transparent,rgba(0,0,0,.26) 48%,transparent);
  opacity:.35;
}

.lantern-cup-hero__grid{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);
  align-items:center;
  gap:9vw;
}

.lantern-cup-hero__copy{max-width:730px;position:relative;z-index:2}
.lantern-cup-hero__copy h1{
  margin:22px 0 30px;
  font-size:clamp(4.5rem,7.6vw,8rem);
  line-height:.91;
  font-weight:400;
  letter-spacing:.005em;
}
.lantern-cup-hero__copy p{
  max-width:560px;
  color:#bdb7ac;
  font-size:1.2rem;
  line-height:1.75;
  margin:0 0 34px;
}

.lantern-cup-hero__mark{
  position:relative;
  width:min(30vw,420px);
  aspect-ratio:1/1;
  margin:auto;
  opacity:.9;
}
.lantern-cup-hero__ring{
  position:absolute;
  width:62%;
  aspect-ratio:1.72/1;
  left:19%;
  bottom:17%;
  border:1px solid rgba(224,189,122,.28);
  border-radius:50%;
  box-shadow:0 0 65px rgba(200,155,85,.07),inset 0 0 24px rgba(200,155,85,.05);
}
.lantern-cup-hero__cup{
  position:absolute;
  left:31%;
  bottom:30%;
  width:38%;
  height:34%;
  border-radius:9% 9% 24% 24% / 10% 10% 18% 18%;
  background:linear-gradient(100deg,#4d5b63 0%,#98a4a8 44%,#64747b 76%,#435058 100%);
  box-shadow:0 34px 70px rgba(0,0,0,.5),inset 8px 0 16px rgba(255,255,255,.08);
}
.lantern-cup-hero__cup:before{
  content:"";
  position:absolute;
  width:44%;height:52%;right:-34%;top:20%;
  border:12px solid #5e6d74;border-left-width:7px;border-radius:50%;
  opacity:.88;
}
.lantern-cup-hero__cup:after{
  content:"";
  position:absolute;
  left:8%;right:8%;top:-5%;height:9%;
  border-radius:50%;
  background:#a7b0b2;
  box-shadow:inset 0 3px 7px rgba(0,0,0,.52);
}

.lantern-cup-section{padding:120px 0;position:relative}
.lantern-cup-section--window{border-top:1px solid rgba(200,155,85,.10);border-bottom:1px solid rgba(200,155,85,.10)}
.lantern-cup-window-grid{display:grid;grid-template-columns:minmax(280px,.72fr) minmax(520px,1.28fr);gap:7vw;align-items:center}
.lantern-cup-window-copy{max-width:490px}
.lantern-cup-window-copy h2{font-size:clamp(3rem,5vw,5.4rem);line-height:1.02;margin:24px 0 26px;font-weight:400}
.lantern-cup-window-copy p{color:#b9b3aa;font-size:1.13rem;line-height:1.76}
.lantern-cup-window-copy__hint{font-style:italic;color:#777e80!important;margin-top:30px}

.lantern-cup-scene{
  position:relative;
  min-height:610px;
  overflow:hidden;
  border:1px solid rgba(200,155,85,.13);
  border-radius:28px;
  background:linear-gradient(180deg,#0b151d 0 58%,#16130f 58% 100%);
  box-shadow:0 36px 90px rgba(0,0,0,.30),inset 0 0 60px rgba(0,0,0,.16);
}
.lantern-cup-scene:before{
  content:"";position:absolute;inset:18px;border:1px solid rgba(224,189,122,.09);border-radius:19px;pointer-events:none;z-index:10
}

.lantern-cup-scene__window{
  position:absolute;left:9%;right:9%;top:8%;height:55%;
  overflow:hidden;
  border:8px solid #1a2021;
  outline:1px solid rgba(200,155,85,.18);
  background:#14202a;
  box-shadow:inset 0 0 80px rgba(0,0,0,.58),0 16px 45px rgba(0,0,0,.24);
}
.lantern-cup-scene__sky{
  position:absolute;inset:0;
  background:
    radial-gradient(circle at 72% 35%,rgba(189,172,140,.20),transparent 19%),
    linear-gradient(180deg,#2a3c4a 0%,#1a2b36 55%,#0f1b23 100%);
}
.lantern-cup-scene__sky:after{
  content:"";position:absolute;left:-5%;right:-5%;bottom:-3%;height:42%;
  background:linear-gradient(160deg,transparent 0 18%,rgba(8,15,19,.72) 18% 36%,transparent 36% 43%,rgba(8,15,19,.82) 43% 60%,transparent 60% 68%,rgba(8,15,19,.9) 68%);
  opacity:.9;
}
.lantern-cup-scene__reflection{
  position:absolute;inset:-20% 56% -20% 16%;
  background:linear-gradient(110deg,transparent 0%,rgba(255,255,255,.045) 46%,transparent 70%);
  transform:skewX(-8deg);
}
.lantern-cup-scene__rain{position:absolute;top:-18%;width:1px;height:46%;background:linear-gradient(transparent,rgba(214,226,229,.34),transparent);transform:rotate(10deg);opacity:.5}
.lantern-cup-scene__rain--1{left:17%;height:58%}.lantern-cup-scene__rain--2{left:37%;top:-8%;height:44%}.lantern-cup-scene__rain--3{left:58%;height:64%}.lantern-cup-scene__rain--4{left:76%;top:-2%;height:47%}.lantern-cup-scene__rain--5{left:89%;top:-10%;height:60%}

.lantern-cup-scene__sill{
  position:absolute;left:4%;right:4%;top:61%;height:15%;
  background:
    linear-gradient(90deg,rgba(255,255,255,.035),transparent 30%,rgba(255,255,255,.02) 72%,transparent),
    linear-gradient(180deg,#49382a 0%,#34271f 48%,#211a16 100%);
  border-top:1px solid rgba(220,180,120,.20);
  border-bottom:1px solid rgba(0,0,0,.5);
  box-shadow:0 18px 34px rgba(0,0,0,.38);
  z-index:4;
}
.lantern-cup-scene__sill:after{
  content:"";position:absolute;left:0;right:0;top:37%;height:1px;background:rgba(231,191,132,.08);box-shadow:0 21px rgba(0,0,0,.14)
}

.lantern-cup-scene__ring{
  position:absolute;z-index:5;
  width:126px;height:38px;left:58%;top:64%;
  transform:translate(-50%,-50%);
  border:3px solid rgba(223,204,164,.17);
  border-radius:50%;
  box-shadow:0 0 18px rgba(236,217,175,.05),inset 0 0 9px rgba(236,217,175,.06);
  transition:opacity .65s ease,box-shadow .65s ease,border-color .65s ease;
}

.lantern-cup-object{
  appearance:none;border:0;background:none;padding:0;margin:0;
  position:absolute;z-index:8;left:58%;top:56%;
  width:150px;height:170px;
  transform:translate(-50%,0);
  cursor:pointer;
  transition:transform .9s cubic-bezier(.2,.75,.2,1),left .9s cubic-bezier(.2,.75,.2,1),filter .4s ease;
}
.lantern-cup-object:hover{filter:brightness(1.06)}
.lantern-cup-object:focus-visible{outline:2px solid #e0bd7a;outline-offset:8px;border-radius:22px}
.lantern-cup-object:disabled{cursor:default;filter:none}
.lantern-cup-object__body{
  position:absolute;left:17px;top:24px;width:101px;height:118px;
  border-radius:10px 10px 30px 30px / 8px 8px 20px 20px;
  background:linear-gradient(100deg,#526169 0%,#8f9da2 38%,#b0b9ba 53%,#64757b 77%,#46545b 100%);
  box-shadow:0 26px 35px rgba(0,0,0,.42),inset 8px 0 18px rgba(255,255,255,.07),inset -10px 0 16px rgba(0,0,0,.16);
}
.lantern-cup-object__rim{
  position:absolute;left:16px;top:17px;width:104px;height:22px;border-radius:50%;
  background:linear-gradient(180deg,#abb5b7,#738187 54%,#47545b 55%,#859196 100%);
  box-shadow:inset 0 5px 8px rgba(0,0,0,.45),0 3px 5px rgba(0,0,0,.23)
}
.lantern-cup-object__handle{
  position:absolute;right:0;top:50px;width:56px;height:70px;
  border:14px solid #65767c;border-left-width:9px;border-radius:50%;
  box-shadow:4px 8px 18px rgba(0,0,0,.3),inset -3px 0 4px rgba(255,255,255,.04)
}
.lantern-cup-object__chip{
  position:absolute;left:20px;top:18px;width:15px;height:12px;
  background:#152029;clip-path:polygon(0 0,100% 0,61% 47%,81% 100%,17% 81%);
  opacity:.85
}

.lantern-cup-scene[data-state="lifted"] .lantern-cup-object{
  transform:translate(-50%,-102px) rotate(-2deg);
}
.lantern-cup-scene[data-state="lifted"] .lantern-cup-scene__ring,
.lantern-cup-scene[data-state="aside"] .lantern-cup-scene__ring{
  border-color:rgba(235,219,177,.48);
  box-shadow:0 0 28px rgba(225,205,159,.12),inset 0 0 12px rgba(255,239,195,.10);
}
.lantern-cup-scene[data-state="aside"] .lantern-cup-object{
  left:72%;
  transform:translate(-50%,0) rotate(1.2deg);
}

.lantern-cup-scene__memory{
  position:absolute;inset:8% 9% 39%;z-index:3;pointer-events:none;
  opacity:0;transition:opacity 1.1s ease;
}
.lantern-cup-scene__memory span{
  position:absolute;color:rgba(239,230,210,.0);font-family:Iowan Old Style,Palatino,Georgia,serif;font-style:italic;font-size:.94rem;letter-spacing:.03em;
  text-shadow:0 0 18px rgba(224,189,122,.22);
  transition:color 1.1s ease;
}
.lantern-cup-scene__memory span:nth-child(1){left:8%;top:16%}.lantern-cup-scene__memory span:nth-child(2){right:11%;top:25%}.lantern-cup-scene__memory span:nth-child(3){left:31%;top:47%}.lantern-cup-scene__memory span:nth-child(4){right:7%;top:64%}.lantern-cup-scene__memory span:nth-child(5){left:10%;top:76%}
.lantern-cup-scene[data-state="lifted"] .lantern-cup-scene__memory,
.lantern-cup-scene[data-state="aside"] .lantern-cup-scene__memory{opacity:1}
.lantern-cup-scene[data-state="lifted"] .lantern-cup-scene__memory span,
.lantern-cup-scene[data-state="aside"] .lantern-cup-scene__memory span{color:rgba(239,230,210,.50)}

.lantern-cup-scene__chair{
  position:absolute;z-index:2;right:6%;bottom:4%;width:90px;height:146px;opacity:0;transition:opacity 1.4s ease;
}
.lantern-cup-scene__chair:before{content:"";position:absolute;left:12px;right:12px;top:0;height:78px;border:7px solid #211b17;border-bottom:0;border-radius:4px 4px 0 0}
.lantern-cup-scene__chair:after{content:"";position:absolute;left:4px;right:4px;top:72px;height:13px;background:#211b17;box-shadow:10px 64px 0 -5px #211b17,66px 64px 0 -5px #211b17}
.lantern-cup-scene[data-state="aside"] .lantern-cup-scene__chair{opacity:.72}

.lantern-cup-scene__message{
  position:absolute;z-index:9;left:8%;bottom:5%;max-width:55%;
}
.lantern-cup-scene__message p{margin:8px 0 0;color:#c2baac;font-size:1.02rem;line-height:1.6}

.lantern-cup-section--after{
  border-bottom:1px solid rgba(200,155,85,.10);
  background:radial-gradient(circle at 50% 0,rgba(200,155,85,.045),transparent 36%);
}
.lantern-cup-after{max-width:860px;text-align:center}
.lantern-cup-after h2{font-size:clamp(3rem,5.4vw,5.7rem);line-height:1.02;font-weight:400;margin:24px 0 28px}
.lantern-cup-after>p{max-width:720px;margin:0 auto;color:#bdb5a9;font-size:1.16rem;line-height:1.8}
.lantern-cup-after__practice{max-width:720px;margin:46px auto;padding:34px 38px;border:1px solid rgba(200,155,85,.14);border-radius:22px;background:rgba(255,255,255,.012);display:grid;grid-template-columns:28px 1fr;gap:18px;text-align:left}
.lantern-cup-after__practice span{color:#d7af6d;font-size:1.1rem;padding-top:4px}.lantern-cup-after__practice p{margin:0;color:#d1c7b5;line-height:1.75;font-size:1.06rem}
.lantern-cup-after__closing{font-style:italic;color:#8f918e!important}

.lantern-cup-section--return{padding:110px 0 130px}
.lantern-cup-return{max-width:900px;text-align:center}
.lantern-cup-return blockquote{margin:26px auto 34px;max-width:780px;font-size:clamp(2.3rem,4vw,4.4rem);line-height:1.22;color:#e8dcc4}
.lantern-cup-return__actions{display:flex;gap:18px;align-items:center;justify-content:center;flex-wrap:wrap}
.lantern-cup-edge{height:110px;display:flex;justify-content:center;align-items:flex-start}.lantern-cup-edge span{display:block;width:1px;height:54px;background:linear-gradient(#c89b55,transparent);opacity:.24}

/* Hall continuation: appears only after the three panes have been tried. */
.lantern-hall-next{margin:44px auto 0;max-width:620px;padding-top:28px;border-top:1px solid rgba(200,155,85,.12);text-align:center}
.lantern-hall-next p{margin:0 0 12px;color:#8f918d;font-style:italic}
.lantern-hall-next a{color:#d8bd8b;text-decoration:none;font:600 .67rem/1.5 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase}
.lantern-hall-next a:hover{color:#fff}

@media(max-width:980px){
  .lantern-cup-hero{min-height:auto;padding:120px 0 90px}
  .lantern-cup-hero__grid{grid-template-columns:1fr;gap:60px}
  .lantern-cup-hero__mark{width:min(62vw,360px)}
  .lantern-cup-window-grid{grid-template-columns:1fr;gap:54px}
  .lantern-cup-window-copy{max-width:660px}
  .lantern-cup-scene{min-height:590px}
}

@media(max-width:620px){
  .lantern-cup-hero{padding:104px 18px 72px}
  .lantern-cup-hero__copy h1{font-size:clamp(3.3rem,16vw,4.9rem)}
  .lantern-cup-hero__copy p{font-size:1.02rem}
  .lantern-cup-hero__mark{width:min(74vw,300px)}
  .lantern-cup-section{padding:78px 0}
  .lantern-cup-window-copy h2{font-size:clamp(2.6rem,13vw,4rem)}
  .lantern-cup-scene{min-height:540px;border-radius:18px}
  .lantern-cup-scene__window{left:6%;right:6%;top:6%;height:53%;border-width:6px}
  .lantern-cup-scene__sill{left:2%;right:2%;top:59%;height:15%}
  .lantern-cup-object{left:55%;top:54%;transform:translate(-50%,0) scale(.84);transform-origin:center bottom}
  .lantern-cup-scene[data-state="lifted"] .lantern-cup-object{transform:translate(-50%,-92px) rotate(-2deg) scale(.84)}
  .lantern-cup-scene[data-state="aside"] .lantern-cup-object{left:70%;transform:translate(-50%,0) rotate(1.2deg) scale(.84)}
  .lantern-cup-scene__ring{left:55%;top:62%;width:102px;height:30px}
  .lantern-cup-scene__message{left:7%;right:7%;bottom:5%;max-width:none}
  .lantern-cup-scene__message p{font-size:.94rem}
  .lantern-cup-scene__memory span{font-size:.72rem}
  .lantern-cup-scene__chair{right:2%;transform:scale(.78);transform-origin:bottom right}
  .lantern-cup-after__practice{padding:28px 24px;grid-template-columns:22px 1fr}
  .lantern-cup-section--return{padding:82px 0 96px}
}

@media(prefers-reduced-motion:reduce){
  .lantern-cup-object,.lantern-cup-scene__ring,.lantern-cup-scene__memory,.lantern-cup-scene__memory span,.lantern-cup-scene__chair{transition:none!important}
}