/* Korean reading system: titles / reading text / controls / supporting text. */
:root{
  --font-reading:'IBM Plex Sans KR','Apple SD Gothic Neo','Malgun Gothic',sans-serif;
  --font-title:'Noto Serif KR','AppleMyungjo','Batang',serif;
  --ink:#253e40;--muted:#506561;--deep:#285f64;--accent:#98513d;
  --text-body:1rem;--text-small:.875rem;--text-label:.8125rem;
}
html{font-size:16px;scroll-padding-top:130px}
body{font-family:var(--font-reading);font-size:var(--text-body);line-height:1.8;letter-spacing:0}
button,input,textarea,select{font-family:var(--font-reading);line-height:1.55;letter-spacing:0}
p{line-height:1.8;word-break:keep-all;overflow-wrap:anywhere}
h1,h2,h3{word-break:keep-all;overflow-wrap:anywhere;text-wrap:balance}
em{font-style:normal}
small{font-size:var(--text-small);line-height:1.65}
.mono,.eyebrow{font-family:var(--font-reading)}
.eyebrow{font-size:var(--text-label);font-weight:600;line-height:1.6;letter-spacing:.06em;color:var(--muted);margin-bottom:16px}
button{min-height:44px}
input::placeholder,textarea::placeholder{color:#5a6b64;opacity:1}
:focus-visible{outline:3px solid #98513d;outline-offset:4px}
[hidden]{display:none!important}

/* Scene labels are integrated into the illustration; final transparent treatment below. */
.scene-copy{top:48px;left:clamp(24px,5vw,80px);width:min(470px,calc(100% - 48px));max-width:none;padding:28px 32px 30px;background:#fffdf4;color:var(--ink);border:1px solid #d8cdb5;border-top:4px solid var(--deep);box-shadow:0 8px 28px #29414817;text-shadow:none}
.scene-copy .eyebrow{color:#506561;font-size:13px;letter-spacing:.025em;margin:0 0 16px}
.scene-copy h1{font-family:var(--font-title);font-size:clamp(32px,3.15vw,46px);font-weight:600;line-height:1.48;letter-spacing:-.02em;margin:0 0 18px;max-width:none}
.scene-copy h1 em{color:var(--deep);font-style:normal}
.scene-copy p:last-child{font-size:16px;line-height:1.85;letter-spacing:0;color:var(--ink);margin:0;max-width:26em}
.scene-hotspot{background:#fffdf4;border-color:#c4cfc4;padding:12px 16px;gap:4px;max-width:220px;box-shadow:3px 3px 0 #29414838}
.scene-hotspot span{font-size:16px;line-height:1.5;letter-spacing:0;font-weight:600}
.scene-hotspot small{font-size:14px;line-height:1.6;letter-spacing:0;color:var(--muted)}
.scene-caption{font-size:13px;line-height:1.6;background:#253e40;gap:12px;padding:10px 14px;color:#fffdf4}
.scene-caption .mono{font-size:12px;color:#fff0ba}
.scene-caption span:last-child{color:#fffdf4}

.site-header{gap:24px;padding-inline:clamp(20px,4vw,64px)}
.brand{font:600 clamp(20px,1.8vw,25px)/1.5 var(--font-title);letter-spacing:-.015em}
.brand span{font:600 13px/1.5 var(--font-reading);color:var(--deep);letter-spacing:.04em}
nav{gap:22px}nav a{font-size:14px;line-height:1.5;padding:12px 0;color:var(--muted)}
nav b,.cart-button b{font:600 12px/1.4 var(--font-reading)}
.cart-button{font-size:14px;padding:9px 12px}.cart-button b{background:var(--deep)}
.status{font:400 13px/1.5 var(--font-reading)}

.hero{grid-template-columns:minmax(0,1fr) minmax(350px,.9fr);gap:48px;padding-block:88px}
.hero h2{font:600 clamp(30px,3.1vw,44px)/1.5 var(--font-title);letter-spacing:-.02em;margin:0 0 24px}
.hero h2 em{color:var(--deep);font-style:normal}
.hero-lede{font-size:17px;line-height:1.9;letter-spacing:0;color:var(--ink);max-width:32em}
.guardrail{margin-top:32px;gap:7px;padding-left:18px;border-color:var(--deep)}
.guardrail span{font:600 13px/1.6 var(--font-reading);color:var(--deep)}
.guardrail strong{font-size:17px;line-height:1.6}.guardrail small{font-size:14px;line-height:1.75}
.darak-chat{width:min(460px,calc(100vw - 24px));max-height:calc(100dvh - 32px);padding:22px;border:1px solid #9cbbb3;border-radius:18px;background:rgb(255 253 246 / 10%);color:#193b3d;text-shadow:0 1px 2px #fffdf4,0 0 6px #fffdf4;overflow:auto;font-family:var(--font-reading)}
.darak-chat::backdrop{background:rgb(28 48 46 / 8%)}
.darak-chat-head{display:flex;justify-content:space-between;align-items:start;gap:12px}.darak-chat-head h2{font-size:23px;margin:0}.darak-chat-head p{font-size:14px;margin:6px 0}.darak-chat button{min-height:44px;background:rgb(255 253 246 / 10%);border:1px solid #779e96;color:#193b3d;border-radius:8px;padding:8px 12px;font:inherit;text-shadow:inherit}.darak-chat-head button{font-size:24px}
.darak-chat-notice{font-size:13px;line-height:1.7;border-bottom:1px solid #aac9bd;padding-bottom:12px}.darak-chat-log{height:280px;max-height:38dvh;overflow:auto;overscroll-behavior:contain}.darak-message{white-space:pre-wrap;overflow-wrap:anywhere;font-size:16px;line-height:1.8;margin:12px 0 20px}.darak-message strong{display:block;font-size:13px;margin-bottom:3px}.darak-message.user{padding-left:22px}.darak-chat-action{display:block;width:100%;text-align:left;margin:8px 0}.darak-chat-prompts{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.darak-chat-prompts button{font-size:14px}.darak-chat-form label{display:block;font-size:14px;margin-bottom:8px}.darak-chat-form>div{display:flex;gap:8px}.darak-chat-form input{min-width:0;width:100%;padding:10px;border:1px solid #779e96;border-radius:8px;background:rgb(255 253 246 / 10%);color:#193b3d;font-size:16px}.darak-chat-form button{flex-shrink:0}.darak-chat :focus-visible{outline:2px solid #235f64;outline-offset:3px}
.request-card{padding:28px;background:rgb(255 253 246 / 10%);box-shadow:none;backdrop-filter:none;text-shadow:0 1px 2px #fffdf4,0 0 6px #fffdf499}
.request-card textarea,.request-card .suggestions button{background:rgb(255 253 246 / 10%)}
.request-card .primary,.request-card .primary:hover{background:rgb(41 94 100 / 10%);color:var(--deep);border:1px solid var(--line);text-shadow:inherit}
.request-card.is-dragging{box-shadow:none}
.card-kicker{font-size:16px;line-height:1.6;gap:16px;flex-wrap:wrap}
.card-kicker .mono,.drag-hint{font:400 13px/1.6 var(--font-reading);color:var(--muted)}
.request-card label{font-size:17px;line-height:1.6;margin-bottom:12px}
.request-card textarea{font-size:16px;line-height:1.8;min-height:180px;padding:16px}
.suggestions{gap:8px}.suggestions button{font-size:14px;line-height:1.65;padding:9px 12px}
.primary,.secondary,.panel-cta{font-size:16px;line-height:1.6;min-height:48px;padding:12px 16px}
.primary,.panel-cta{background:var(--deep);color:#fff}.secondary{background:var(--deep)}
.privacy{font-size:14px;line-height:1.75;margin-top:16px}

.section-heading{gap:28px;align-items:center;padding-bottom:24px}
.section-heading h2,.principles h2,.scene-panel h2,.cart-head h2{font-family:var(--font-title);font-size:clamp(28px,2.6vw,38px);font-weight:600;line-height:1.5;letter-spacing:-.02em}
.section-heading>p{font-size:16px;line-height:1.8;max-width:30em}
.section-heading .eyebrow{margin-bottom:12px}
.store-search{width:min(100%,370px);padding:10px 0}.store-search input{font-size:16px;line-height:1.65;min-height:30px}
.store-search:focus-within{outline:2px solid var(--deep);outline-offset:4px}
.category-tabs{gap:8px}.category-tabs button{font-size:14px;line-height:1.5;padding:9px 13px}
.shop-grid{gap:32px 24px}.shop-cover span{font:600 23px/1.6 var(--font-title);max-width:100%;letter-spacing:-.01em}
.shop-card:nth-child(4n+2) .shop-cover{color:var(--ink)}
.shop-meta{padding-top:18px}.shop-meta small,.candidate small{font:400 14px/1.65 var(--font-reading);color:var(--muted)}
.shop-meta h3,.candidate h3{font-size:19px;line-height:1.6;letter-spacing:-.01em;margin:8px 0}
.shop-meta p{font-size:14px;line-height:1.75;margin:0 0 18px}
.shop-price{font:600 16px/1.6 var(--font-reading);white-space:nowrap;font-variant-numeric:tabular-nums}
.shop-buy{flex-wrap:wrap;gap:12px}.add-cart{font-size:14px;line-height:1.6;padding:10px 12px}
.shop-empty,.search-state,.candidate .reason{font-size:16px;line-height:1.8}
.search-state{margin:24px 0}.state-dot{flex-shrink:0}
.candidate{padding:22px}.candidate-cover{height:170px;font:600 24px/1.6 var(--font-title);letter-spacing:-.01em;color:var(--ink)}
.candidate .author{font-size:15px;line-height:1.6}.candidate .reason{margin:12px 0 auto;color:var(--ink)}
.source{font-size:14px;line-height:1.65;flex-wrap:wrap;gap:8px}
.candidate-actions button{font-size:15px;line-height:1.6;padding:11px 14px}
.shelf-empty{font-size:16px;line-height:1.8;padding-block:32px}.shelf-empty strong{font-size:18px}.shelf-empty p{margin-top:10px}
.count-pill{font:500 15px/1.6 var(--font-reading)}
.shelf-item h3{font-size:18px;line-height:1.6}.shelf-item small{font-size:14px;line-height:1.75}
.shelf-item .remove{font-size:14px;min-width:44px}.approval-bar strong{font-size:17px;line-height:1.65}
.approval-bar .eyebrow{font-size:13px;line-height:1.6}.approval-bar{gap:24px}
.principles h2{font-size:clamp(28px,3vw,42px);line-height:1.6;margin-bottom:40px}.principles h2 em{color:var(--accent);font-style:normal}
.principle-grid{gap:32px}.principle-grid span{font:500 14px/1.6 var(--font-reading);color:var(--accent)}
.principle-grid h3{font-size:19px;line-height:1.6;margin:16px 0 12px}
.principle-grid p{font-size:16px;line-height:1.85;max-width:34em}

.scene-panel{width:min(520px,100%);padding:64px 32px 32px}.scene-panel p{font-size:16px;line-height:1.85}
.scene-panel .eyebrow{font-size:13px;line-height:1.6}.scene-panel h2{margin:0 0 20px}
.scene-close,.cart-head button{min-width:44px;min-height:44px}
.panel-book{grid-template-columns:84px minmax(0,1fr);gap:16px;padding:16px}
.panel-book-cover{height:114px;font:500 14px/1.6 var(--font-title);color:var(--ink)}
.panel-book h3{font-size:18px;line-height:1.6;letter-spacing:0}.panel-book small{font-size:14px;line-height:1.6}
.panel-book button{font-size:14px;line-height:1.6;padding:9px 12px}
.preview-box{font:500 17px/1.9 var(--font-title);padding:22px;color:var(--ink);margin:24px 0}
.panel-detail h3,#scenePanelContent>h3{font-size:19px;line-height:1.6}
.cart-drawer{width:min(480px,100%)}.cart-head h2{font-size:30px}
.cart-item{grid-template-columns:72px minmax(0,1fr) auto;gap:12px}.cart-thumb{font:500 13px/1.6 var(--font-title);height:102px}
.cart-item h3{font-size:17px;line-height:1.6}.cart-item p{font-size:14px;line-height:1.75}
.cart-qty button{width:40px;height:44px}.cart-qty span{font:500 15px/1.6 var(--font-reading)}
.cart-item .remove{font-size:14px;min-width:44px}.cart-foot>div,.cart-foot strong{font:600 17px/1.6 var(--font-reading)}
.cart-foot p{font-size:14px;line-height:1.75}.cart-empty{font-size:16px;line-height:1.85}
footer strong{font:600 22px/1.6 var(--font-title)}footer span,footer .mono{font:400 14px/1.75 var(--font-reading);color:#e2ece7}
.pet-controls{font-size:15px}.pet-controls summary{font-size:15px;line-height:1.6}
.pet-controls p{font-size:14px;line-height:1.75}.pet-options button{font-size:13px;line-height:1.6}
.shop-cover span,.candidate-cover,.panel-book-cover,.cart-thumb,.preview-box{word-break:keep-all;overflow-wrap:anywhere;text-wrap:pretty}
@media(min-width:1101px){.scene-copy{left:calc(50% - 60px);top:28px;width:440px;padding:24px 28px}.scene-copy h1{font-size:40px;line-height:1.45}}

@media(max-width:1100px){.status{display:none}.site-header{gap:16px}nav{gap:16px}.hero{gap:32px;padding-inline:32px}.shop-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.hero h2{font-size:32px}}
@media(max-width:850px){.hero{grid-template-columns:1fr}.hero-copy{max-width:620px}.hero h2{font-size:36px}.storefront-art{display:none}.request-card{max-width:none}.shop-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.section-heading{align-items:start;flex-direction:column;gap:14px}.section-heading>p{max-width:36em}.scene-copy{top:28px;left:24px;width:410px}.scene-copy h1{font-size:36px}.approval-bar{flex-wrap:wrap}}
@media(max-width:600px){
  .site-header{padding:12px 16px;gap:8px 14px}.brand{font-size:20px}.brand span{font-size:12px}nav{gap:18px}nav a{font-size:14px;padding-block:10px}
  .scene-copy{top:20px;left:16px;width:calc(100% - 32px);padding:20px 22px 22px}.scene-copy .eyebrow{font-size:13px;margin-bottom:12px}
  .scene-copy h1{font-size:30px;line-height:1.5;letter-spacing:-.02em;margin-bottom:12px}.scene-copy p:last-child{font-size:15px;line-height:1.8}
  .explore-stage{min-height:790px}.shelf-hotspot{top:43%;right:16px}.scene-hotspot{padding:10px 12px;max-width:170px;min-width:0}.scene-hotspot span{font-size:15px}.scene-hotspot small{font-size:13px}
  .window-hotspot{left:16px;bottom:23%}.counter-hotspot{left:auto;right:16px;bottom:23%}
  .scene-caption{font-size:13px;left:16px;bottom:18px;padding:10px}.scene-caption .mono{display:none}
  .hero,.store-section,.results-section,.shelf-section,.principles{padding:56px 20px}.hero{gap:32px}.hero h2{font-size:29px;line-height:1.6}.hero-lede{font-size:16px;line-height:1.85}
  .section-heading h2{font-size:28px}.section-heading>p{font-size:16px;margin:0}.request-card{padding:20px}.card-kicker{gap:8px}.card-kicker .mono{font-size:13px}
  .shop-grid{gap:28px 16px}.shop-cover span{font-size:20px}.shop-meta h3{font-size:18px}.shop-buy{display:flex}.add-cart{margin:0}
  .candidate-grid{grid-template-columns:1fr}.candidate{padding:20px}.principles h2{font-size:28px;line-height:1.65}
  .scene-panel{padding:64px 20px 28px}.scene-panel h2{font-size:28px}.cart-drawer{padding:24px 20px}.cart-item{grid-template-columns:56px minmax(0,1fr) 44px;gap:10px}.cart-thumb{font-size:13px;padding:5px}
  .pet-controls[open]{bottom:200px}.pet-controls summary{font-size:14px}.pet-actions{gap:8px}.pet-options{flex-wrap:wrap}.pet-options button{flex-basis:100%}
  footer{padding:32px 20px}footer span{margin-top:12px}
}
@media(max-width:380px){nav{display:grid;grid-template-columns:1fr 1fr;gap:0 16px;overflow:visible}nav a{padding:8px 0}.scene-copy{padding-inline:18px}.scene-copy h1{font-size:27px}.hero h2{font-size:26px}.brand{font-size:18px}.cart-button{font-size:13px}.shop-grid{grid-template-columns:1fr}.shop-cover{height:250px}.shop-cover span{font-size:25px}.shop-buy .add-cart{width:auto}.pet-controls[open]{bottom:195px}}

/* Keep the storefront visible. A soft halo follows glyphs, never a rectangular panel. */
.scene-copy,.scene-hotspot,.scene-hotspot:hover,.scene-hotspot:focus-visible{
  background:transparent;border-color:transparent;box-shadow:none;backdrop-filter:none;
}
.scene-copy{border:0;text-shadow:0 1px 2px #fffdf4,0 0 7px #fffdf4,0 0 16px #fffdf4b3}
.scene-copy .eyebrow,.scene-copy p:last-child{color:#203c3c;font-weight:500}
.scene-copy h1,.scene-copy h1 em{color:#193b3d;font-weight:700}
.scene-hotspot{border:0;color:#193b3d;text-shadow:0 1px 2px #fffdf4,0 0 5px #fffdf4,0 0 10px #fffdf4;transition:transform .2s}
.scene-hotspot span{font-weight:700}
.scene-hotspot small{color:#203c3c;font-weight:500}
.scene-hotspot:hover{transform:translateY(-2px)}
.scene-hotspot:hover span{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}
.scene-hotspot:focus-visible{outline:2px solid #193b3d;outline-offset:4px;border-radius:8px}
.scene-caption{background:transparent;box-shadow:none;border:0;color:#193b3d;text-shadow:0 1px 2px #fffdf4,0 0 6px #fffdf4,0 0 12px #fffdf4b3}
.scene-caption .mono,.scene-caption span:last-child{color:#203c3c}
.pet-controls:not([open]){background:transparent;border-color:transparent;box-shadow:none;color:#193b3d;text-shadow:0 1px 2px #fffdf4,0 0 6px #fffdf4}
