/* Public Sakura theme. Kept separate from the site's layout and admin styles. */
:root {
  --background: #17151d;
  --foreground: #faf3f6;
  --card: #24212b;
  --primary: #f6a5be;
  --muted-foreground: #b7aab5;
  --border: #493d49;
}
body {
  background:
    radial-gradient(circle at 10% 7%, rgba(123, 59, 94, .18), transparent 31rem),
    radial-gradient(circle at 91% 22%, rgba(185, 94, 129, .12), transparent 36rem),
    #17151d;
  color: var(--foreground);
}
.site-shell { min-height: 100dvh; }
.site-header {
  background: linear-gradient(100deg, #211c28 0%, #1b1923 52%, #241d2a 100%);
  border-bottom: 1px solid #62445688;
}
.brand { color: #fff3f7; }
.brand-icon {
  background: linear-gradient(145deg, #ffe0e8, #f199b8);
  color: #5c3249;
  border: 1px solid #ffdbe683;
  box-shadow: 0 7px 20px #ef8aab2d;
  font-size: 0;
}
.brand-icon::after { content: '✿'; font-size: 24px; line-height: 1; }
.brand-divider { color: #a77991; }
.share-button {
  border-color: #695263;
  border-radius: 11px;
  background: #f8c6d20d;
  color: #f9e6ee;
}
.share-button:hover { border-color: #f5a6bf; background: #f5a6bf19; }
.category-nav {
  border-color: #6b4b60;
  background: #29232eeb;
  box-shadow: 0 12px 36px #100b1852, inset 0 1px #ffffff0c;
}
.category-tab { color: #e8d7e0; }
.category-tab:hover { color: #fff; background: #493345; }
.category-tab.active {
  background: linear-gradient(110deg, #ffb2bc, #f2a8cc 57%, #dcaee5);
  color: #3a2436;
  box-shadow: 0 6px 22px #ee8db04d, inset 0 1px #fff8;
}

/* A small Yae guide anchors the three equal sections without covering content. */
.gallery-intro, .resource-hero {
  position: relative;
  isolation: isolate;
  min-height: 248px;
  margin: 35px 0 26px;
  padding: 36px 340px 35px 40px;
  overflow: visible;
  border: 1px solid #765064;
  border-radius: 26px;
  background:
    radial-gradient(circle at 87% 14%, #a7557f54, transparent 35%),
    radial-gradient(circle at 7% 100%, #6f3a6557, transparent 49%),
    linear-gradient(125deg, #302431, #24212b 63%, #332637);
  box-shadow: 0 20px 48px #09070e43, inset 0 1px #ffffff13;
}
.gallery-intro::after, .resource-hero::after {
  content: '';
  position: absolute;
  z-index: 0;
  width: 275px;
  height: 210px;
  right: 28px;
  bottom: -1px;
  background: url('/assets/notice-yae-chibi.png') center bottom / contain no-repeat;
  filter: drop-shadow(0 12px 18px #10071482);
  pointer-events: none;
}
.gallery-intro::before, .resource-hero::before {
  content: '✿  ✧  ✿';
  position: absolute;
  top: 29px;
  right: 36px;
  color: #ffd1e18c;
  font-size: 19px;
  letter-spacing: 16px;
  pointer-events: none;
}
.gallery-intro > div:first-child, .resource-hero > * { position: relative; z-index: 1; }
.gallery-intro .collection-label { display: none; }
.gallery-intro .eyebrow, .resource-hero .eyebrow,
.resource-kicker, .eyebrow { color: #f6afc5; }
.eyebrow > span, .resource-hero .eyebrow span { background: #f6afc5; }
.gallery-intro h1, .resource-hero h1 { color: #fff5f8; letter-spacing: -.025em; }
.gallery-intro h1 { font-size: clamp(33px, 3.5vw, 50px); }
.resource-hero h1 { font-size: clamp(34px, 4.2vw, 55px); line-height: 1.18; }
.gallery-intro h1 em, .resource-hero h1 em { color: #f9b8cf; }
.gallery-intro p, .resource-hero p { color: #d7c5d0; }
.resource-hero { border-bottom: 1px solid #765064; }

.model-statement {
  border: 1px solid #885872;
  border-radius: 15px;
  background: linear-gradient(100deg, #372632, #2a222f);
  color: #f5d3de;
}
.model-statement b, .model-statement svg { color: #ffbad0; }
.model-statement > span { color: #d8a9bc; }
.collection-bar, .resource-heading { border-color: #6b4b5d; }
.collection-bar, .resource-heading > div { color: #fff0f5; }
.collection-bar i, .bar-marker, .resource-heading i { background: #f4a6bf; }
.count { background: #4a3243; color: #ffd6e5; }

.art-image {
  border: 1px solid #7654699c;
  background: #2c2330;
  box-shadow: 0 12px 28px #0b081248;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.art-card:hover .art-image, .art-card:focus-visible .art-image {
  border-color: #ffc0d4;
  box-shadow: 0 16px 35px #ad548a36;
  transform: translateY(-2px);
}
.image-category {
  border-color: #ffdfed70;
  border-radius: 9px;
  background: #372334c9;
  color: #fff1f6;
}
.card-open { background: #583348ba; }
.art-caption h2 { color: #f9eef2; }
.art-caption p, .art-number { color: #bba7b5; }
.gallery-footer { border-color: #6b4b5d; color: #b8a3b1; }
.gallery-footer a { color: #f4c1d0; }
.gallery-footer a:hover { color: #fff0f5; }

.resource-heading { border-color: #6b4b5d; }
.resource-card {
  border-color: #704e64;
  border-radius: 20px;
  background: linear-gradient(145deg, #2e2531, #211e29 75%);
  box-shadow: 0 18px 36px #0b081244, inset 0 1px #ffffff12;
}
.resource-card h2 { color: #fff0f5; }
.resource-description, .resource-hint, .tutorial-type { color: #cabac5; }
.resource-address {
  border-color: #6d5065;
  background: #19151f;
}
.resource-address code { color: #f3dce7; }
.resource-address button {
  background: #594052;
  color: #fff0f5;
}
.resource-address button:hover { background: #76506b; }
.resource-open, .tutorial-open {
  background: linear-gradient(110deg, #ffabbc, #eda9d2);
  color: #3c2334;
  box-shadow: 0 7px 22px #e58eb12c;
}
.tutorial-type span:first-child { background: #553648; color: #ffc3d7; }
.tutorial-preview { border-color: #705167; }
.tutorial-preview summary { color: #f9d9e6; }

/* Detail and sharing overlays take their colors from the notice. Keep geometry intact. */
.work-dialog, .share-dialog {
  border-color: #7a576c !important;
  background: #221e28 !important;
  color: #fff3f7 !important;
  box-shadow: 0 25px 80px #09060dd1, 0 0 36px #ea91b026;
}
.detail-image { background: #131117; }
.detail-content { background: #25212b; }
.detail-content .eyebrow { color: #f7a9c1; }
.detail-meta, .copy-status { color: #baaab6; }
.detail-model-statement { color: #f4b7cc; }
.prompt-label { color: #f6e3ec; }
.prompt-scroll {
  border-color: #6b4d62;
  background: #17141d;
  color: #eee1e9;
}
.work-dialog .close-button, .share-dialog .close-button {
  border: 1px solid #78586b;
  background: #433341;
  color: #ffe9f2;
}
.work-dialog .copy-button, #work-dialog .copy-button {
  background: linear-gradient(110deg, #ffa9b8, #f2a5c8) !important;
  color: #3b2434 !important;
  box-shadow: 0 6px 18px #e889af33 !important;
}
.share-dialog > p { color: #c9b6c3; }
.share-url { border-color: #6f5266; background: #18151d; color: #f1dfe9; }
.share-url button { background: #f5a8bf; color: #392336; }

@media (max-width: 900px) {
  .gallery-intro, .resource-hero { padding-right: 245px; }
  .gallery-intro::after, .resource-hero::after { width: 215px; height: 170px; right: 12px; }
}
@media (max-width: 680px) {
  .site-header { border-bottom-color: #62445688; }
  .brand-icon::after { font-size: 20px; }
  .category-nav { border-radius: 17px; }
  .gallery-intro, .resource-hero {
    display: block;
    min-height: 330px;
    margin: 20px 0 20px;
    padding: 25px 20px 135px;
    border-radius: 20px;
  }
  .gallery-intro::after, .resource-hero::after {
    width: 190px;
    height: 150px;
    right: 7px;
    bottom: -1px;
  }
  .gallery-intro::before, .resource-hero::before {
    top: auto;
    right: auto;
    left: 23px;
    bottom: 32px;
    font-size: 17px;
  }
  .gallery-intro h1, .resource-hero h1 { font-size: clamp(27px, 7vw, 36px); }
  .gallery-intro p, .resource-hero p { font-size: 14px; }
  .art-image { border-radius: 10px; }
  .resource-card { border-radius: 16px; }
  dialog#work-dialog[open] {
    border-color: #7a576c !important;
    background: #25212b !important;
  }
  dialog#work-dialog > .detail-image { background: #131117 !important; }
  dialog#work-dialog > .detail-content { background: #25212b !important; }
  #work-dialog .eyebrow { color: #f7a9c1 !important; }
  #work-dialog .detail-model-statement { color: #f4b7cc !important; }
  #work-dialog .prompt-scroll {
    border-color: #6b4d62 !important;
    background: #17141d !important;
    color: #eee1e9 !important;
  }
  #work-dialog .copy-button {
    background: linear-gradient(110deg, #ffa9b8, #f2a5c8) !important;
    color: #3b2434 !important;
  }
}
@media(max-width:680px){.gallery-intro,.resource-hero{min-height:0;padding:22px 18px 128px}.gallery-intro::after,.resource-hero::after{width:155px;height:120px}}
@media(max-width:680px){.gallery-intro{min-height:155px;margin:10px 0;padding:14px 15px 30px}.gallery-intro h1{font-size:24px;margin:8px 0 5px}.gallery-intro p{max-width:245px;font-size:12px;line-height:1.45}.gallery-intro .eyebrow{font-size:10px}.gallery-intro::after{width:94px;height:75px;right:6px}.gallery-intro::before{bottom:8px;font-size:12px}.category-nav{margin-top:10px;margin-bottom:4px}.category-tab{min-height:40px}.model-statement{margin-bottom:12px;padding:10px 12px}}
@media(max-width:680px){.gallery-intro{min-height:135px;margin:8px 0;padding:11px 15px 20px}.gallery-intro::after{width:80px;height:64px;right:6px}.category-nav{margin-top:8px;margin-bottom:2px}.category-tab{min-height:38px}.model-statement{margin-bottom:10px;padding:8px 12px}.collection-bar{padding:12px 0 14px}}
