/* Keep the raised edge visible after the theme and typography layers. */
:root[data-theme] body .hero-carousel .hero-pagination{background:transparent;border-color:transparent;box-shadow:none;backdrop-filter:none}
:root{
  --control-edge:#142e22;
  --control-shadow:#061c1466;
  --control-highlight:#ffffff45;
}
:root:is([data-theme="light"],[data-theme="white"]){
  --control-edge:#adb5bf;
  --control-shadow:#15233330;
  --control-highlight:#fff;
}
:root:is([data-theme="dark"],[data-theme="black"]){
  --control-edge:#34435a;
  --control-shadow:#000a;
  --control-highlight:#ffffff38;
}
/* A slightly stronger base edge and cast shadow on the pure white canvas. */
:root[data-theme="white"]{
  --control-edge:#929aa6;
  --control-shadow:#15233348;
  --theme-shadow:inset 0 1px 0 #fff,0 3px 0 #929aa6,0 6px 12px #1523333d;
}
:root[data-theme="white"] body :is(.chat-panel,.plan-panel,.personal-card,.profile-guest,.template-card,.library-card,.steps,.create-box,.checkin-entry,.guide-content,.guide-toc,.code-layout){
  box-shadow:0 2px 4px #15233318,0 7px 18px #15233328;
}
:root[data-theme] body :is(button,summary,[role="button"]):not(.hero-dot){
  box-shadow:inset 0 1px 0 var(--control-highlight),0 3px 0 var(--control-edge),0 6px 12px var(--control-shadow);
  transition:box-shadow .16s ease,background-color .16s ease,border-color .16s ease,translate .16s ease;
}
:root[data-theme] body :is(button,summary,[role="button"]):not(.hero-dot):not(:disabled):hover{
  box-shadow:inset 0 1px 0 var(--control-highlight),0 4px 0 var(--control-edge),0 9px 16px var(--control-shadow);
  translate:0 -1px;
}
:root[data-theme] body :is(button,summary,[role="button"]):not(.hero-dot):not(:disabled):active{
  box-shadow:inset 0 1px 3px var(--control-shadow),0 1px 0 var(--control-edge),0 2px 4px var(--control-shadow);
  translate:0 2px;
}
:root[data-theme] body :is(button,summary,[role="button"]):disabled{
  box-shadow:inset 0 1px 0 var(--control-highlight);
  translate:none;
}
:root[data-theme] .topbar :is(.search-button,.top-help,.menu-button){
  min-height:38px;padding:7px 10px;border:1px solid var(--theme-line,#729f83);border-radius:7px;
}
/* These compact actions need a complete button face around their raised edge. */
:root[data-theme] body :is(.upload-image-button,.section-title>button.text-button[data-nav="gallery"]){
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:38px;padding:8px 12px;border:1px solid var(--theme-line,#729f83);border-radius:7px;
  background:var(--theme-control,#203b2d);color:var(--theme-ink,#e5f3e9);white-space:nowrap;
  box-shadow:inset 0 1px 0 var(--control-highlight),0 2px 0 var(--control-edge),0 4px 8px var(--control-shadow);
}
:root[data-theme] body :is(.upload-image-button,.section-title>button.text-button[data-nav="gallery"]):not(:disabled):hover{
  background:var(--theme-hover,#355f49);border-color:var(--theme-accent,#a3e4bb);
  box-shadow:inset 0 1px 0 var(--control-highlight),0 3px 0 var(--control-edge),0 6px 10px var(--control-shadow);
}
:root[data-theme] body :is(.upload-image-button,.section-title>button.text-button[data-nav="gallery"]):not(:disabled):active{
  box-shadow:inset 0 1px 2px var(--control-shadow),0 1px 0 var(--control-edge);translate:0 1px;
}
@media(prefers-reduced-motion:reduce){
  :root[data-theme] body :is(button,summary,[role="button"]):not(.hero-dot){transition:none}
  :root[data-theme] body :is(button,summary,[role="button"]):not(.hero-dot):not(:disabled):hover{translate:none}
}

/* Move the prominent tour entry into the original full-width sidebar slot. */
:root[data-theme] body .sidebar .sidebar-guide{
  display:flex;justify-content:flex-start;gap:12px;width:100%;
  margin-top:3px;padding:12px 14px;min-height:50px;border-radius:6px;
  font-size:15px;font-weight:650;line-height:1.7;
  background:var(--theme-button,linear-gradient(180deg,#b6edc9,#8acba6));
  color:var(--theme-button-ink,#173b29);border:1px solid var(--theme-accent,#bdf4cf);
}
:root[data-theme] body .sidebar .sidebar-guide:hover{
  background:var(--theme-button,linear-gradient(180deg,#cbf8d9,#9eddb8));
  color:var(--theme-button-ink,#173b29);
}
:root[data-theme] body .sidebar .sidebar-guide svg{color:inherit;width:18px;height:18px}

/* A shadow needs a complete face. Text-sized shadows formerly appeared as
   black strips beneath unframed labels (footer, editor actions and FAQs). */
:root[data-theme] body button.text-button:not(.footer-help),
:root[data-theme] body button.icon-button,
:root[data-theme] body button.file-button,
:root[data-theme] body button.nav-item,
:root[data-theme] body button.profile-account,
:root[data-theme] body .time-notice button{
  border:1px solid var(--theme-line,#729f8366);
  background:var(--theme-control,#203b2d);color:var(--theme-ink,#e5f3e9);
  border-radius:6px;
}
:root[data-theme] body button.text-button:not(.footer-help){min-height:34px;padding:6px 10px;gap:7px;line-height:1.6}
:root[data-theme] body button.icon-button{align-items:center;justify-content:center;min-width:34px;min-height:34px;padding:7px}
:root[data-theme] body .time-notice button{min-width:28px;min-height:28px;padding:4px;flex-shrink:0}
:root[data-theme] body button.send-button,
:root[data-theme] body button.search-result{border:1px solid var(--theme-line,#729f8366)}
:root[data-theme] body .tour-card button{border:1px solid #a3e4bb66;padding-left:8px;padding-right:8px}
:root[data-theme] body button.file-button{margin-bottom:5px;overflow-wrap:anywhere}
:root[data-theme] body button.nav-item.active,
:root[data-theme] body button.file-button.active{border-color:var(--theme-accent,#a3e4bb);background:var(--theme-accent-bg,#345b43)}
:root[data-theme] body :is(button.text-button:not(.footer-help),button.icon-button,button.file-button,button.nav-item):not(:disabled):hover{background:var(--theme-hover,#355f49);border-color:var(--theme-accent,#a3e4bb)}
:root[data-theme] body :is(input:not([type="file"]):not([type="range"]):not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),textarea:not(#home-prompt):not(#chat-prompt),select){border:1px solid var(--theme-line,#729f8366);border-radius:var(--field-radius,5px)}
:root[data-theme] body .plan-panel{--field-radius:11px}
:root[data-theme] body .plan-fields>.primary{border-radius:12px}

/* Disclosure rows share the enclosing panel border; they are not separate
   raised rectangles around the text. Keep keyboard focus on the whole row. */
:root[data-theme] body details:not([hidden])>summary:not(.hero-dot),
:root[data-theme] body details:not([hidden])>summary:not(.hero-dot):not(:disabled):hover,
:root[data-theme] body details:not([hidden])>summary:not(.hero-dot):not(:disabled):active{box-shadow:none;translate:none}
:root[data-theme] body .faq{padding:0;overflow:hidden;border:1px solid var(--theme-line,#729f8366);border-radius:7px}
:root[data-theme] body .faq>summary{padding:16px 18px;min-height:52px;border-bottom:1px solid transparent;background:transparent}
:root[data-theme] body .faq>summary:hover{background:var(--theme-hover,#355f49)}
:root[data-theme] body .faq[open]>summary{border-bottom-color:var(--theme-line,#729f8366)}
:root[data-theme] body .faq>p{margin:0;padding:15px 18px 18px}
:root[data-theme] body .faq>summary:focus-visible{outline-offset:-4px}

/* Keep the inspiration heading inside the same edges as its cards and banner. */
:root[data-theme] body .creation-templates>.section-title{margin-inline:0}
