/* Shadoo on dikenocracy.com — light design of the site (2026-10-14). Loaded after the bundle CSS.
   Only the web skin (.dikenocracy-web) and the shared navigation are restyled. */

/* ── Navigation (same as styles-20261014.css) ─────────────────────────────── */
.site-nav {
  position: sticky; top: 0; z-index: 100; width: 100%;
  background: rgba(255, 255, 255, .86);
  -webkit-backdrop-filter: saturate(1.4) blur(10px); backdrop-filter: saturate(1.4) blur(10px);
  border-bottom: 1px solid #e6e0d5;
  font-family: 'Segoe UI', system-ui, -apple-system, Roboto, 'Helvetica Neue', Arial, sans-serif; line-height: 1.65;
}
.site-nav__inner { max-width: 1180px; padding: 0 1.5rem; gap: 1rem; }
.site-nav__brand { display: inline-flex; align-items: center; gap: .55rem; font-family: Georgia, 'Times New Roman', serif; font-size: 1.15rem; letter-spacing: .02em; color: #141a28; text-decoration: none; }
.site-nav__brand::before {
  content: ""; width: 30px; height: 30px; border-radius: 9px; flex: none;
  background: #3d3489 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v17M7 20.5h10M4.5 6.5h15M12 4.5l-7.5 2M12 4.5l7.5 2'/%3E%3Cpath d='M4.5 6.5 2 13a3 3 0 0 0 5 0z'/%3E%3Cpath d='M19.5 6.5 17 13a3 3 0 0 0 5 0z'/%3E%3C/svg%3E") center / 20px no-repeat;
}
.site-nav__brand:hover, .site-nav__brand:focus { color: #141a28; text-decoration: none; }
.site-nav__links { gap: 1.6rem; }
.site-nav__links a { color: #4d5666; font-size: .95rem; font-weight: 500; letter-spacing: 0; text-transform: none; padding: 1.15rem 0; border-bottom: 2px solid transparent; }
.site-nav a:hover { color: #3d3489; text-decoration: none; }
.site-nav a[aria-current='page'] { color: #3d3489; }
.site-nav__links > li > a[aria-current='page'] { border-bottom-color: #3d3489; }
.site-nav a:focus-visible, .site-nav button:focus-visible { outline: 2px solid #3d3489; outline-offset: 2px; color: #3d3489; }
.site-nav__submenu-toggle { min-width: 36px; color: #4d5666; }
.site-nav__submenu { top: calc(100% - 6px); min-width: 16rem; padding: .45rem; background: #fff; border: 1px solid #e6e0d5; border-radius: 14px; box-shadow: 0 18px 40px rgba(31, 39, 51, .14); }
.site-nav__submenu a { padding: .6rem .85rem; font-size: .95rem; letter-spacing: 0; border-radius: 9px; border-bottom: 0; color: #1f2733; }
.site-nav__submenu a:hover, .site-nav__submenu a:focus-visible, .site-nav__submenu a[aria-current='page'] { background: #ece8fb; color: #3d3489; }
/* Phones: the three sections become large buttons (48px high), as on the rest of the site */
@media (max-width: 680px) {
  .site-nav__inner { position: relative; padding: .6rem 1rem .75rem; flex-wrap: wrap; gap: .55rem; min-height: 0; }
  .site-nav__brand { width: 100%; font-size: 1.25rem; }
  .site-nav__brand::before { width: 34px; height: 34px; background-size: 22px; }
  .site-nav__links { width: 100%; gap: .5rem; }
  .site-nav__links > li { flex: 1 1 auto; display: block; }
  .site-nav__has-menu { position: static; }
  .site-nav__links > li > a, .site-nav__parent {
    display: flex; align-items: center; justify-content: center; gap: .1rem;
    min-height: 48px; padding: 0 .6rem; border: 1px solid #e6e0d5; border-radius: 12px;
    background: #fff; color: #1f2733; font-size: 1.1rem; font-weight: 600; line-height: 1.2; letter-spacing: 0; text-align: center;
  }
  .site-nav__parent > a { padding: 0; border: 0; font-size: inherit; font-weight: inherit; color: inherit; }
  .site-nav__submenu-toggle { min-width: 28px; min-height: 46px; color: inherit; }
  .site-nav__caret { border-left-width: 6px; border-right-width: 6px; border-top-width: 7px; }
  /* Shadoo is one of the projects: the Projects button is the current section */
  .site-nav__has-menu:has(.site-nav__submenu a[aria-current='page']) .site-nav__parent { background: #3d3489; border-color: #3d3489; color: #fff; }
  .site-nav__has-menu:has(.site-nav__submenu a[aria-current='page']) .site-nav__parent > a:hover { color: #fff; }
  .site-nav__submenu { left: 1rem; right: 1rem; top: calc(100% - .25rem); min-width: 0; max-width: none; padding: .5rem; }
  .site-nav__submenu a { padding: .9rem 1rem; font-size: 1.1rem; white-space: normal; }
}

/* ── Shadoo web skin ────────────────────────────────────────────────────────── */
:root.dikenocracy-web,
:root.dikenocracy-web[data-theme] {
  --bg-primary: #faf8f4;
  --bg-secondary: #ffffff;
  --text-primary: #1f2733;
  --text-secondary: #4d5666;
  --border: #e6e0d5;
  --accent: #3d3489;
  --input-bg: #ffffff;
  --button-bg: #3d3489;
  --button-text: #ffffff;
  --danger: #b3261e;
  --success: #15803d;
  --danger-bg: #fdecea;
  --danger-fg: #8c1d18;
  --danger-border: #f2b8b5;
  --warn-bg: #f7edd3;
  --warn-fg: #6b5013;
  --warn-border: #e7cf8e;
  --bubble-in: #f3efe7;
  --bubble-out: #ece8fb;
  --app-scrim: #ffffff;
  --font-ui: 'Segoe UI', system-ui, -apple-system, Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-mono: Consolas, 'Courier New', Courier, monospace;
  --radius: 12px;
  --shadow: 0 1px 2px rgba(31, 39, 51, .05), 0 4px 14px rgba(31, 39, 51, .05);
  color-scheme: light;
}
.dikenocracy-web body {
  background:
    radial-gradient(1200px 500px at 85% -120px, #efe9fc 0%, rgba(239, 233, 252, 0) 70%),
    radial-gradient(900px 420px at -10% -80px, #f8eed6 0%, rgba(248, 238, 214, 0) 70%),
    #faf8f4;
  background-repeat: no-repeat;
  color: #1f2733;
}
.dikenocracy-web .app {
  margin: 2rem auto 3rem; padding: 0 1.75rem 1.75rem;
  background: #fff; border: 1px solid #e6e0d5; border-radius: 22px;
  box-shadow: 0 1px 2px rgba(31, 39, 51, .05), 0 18px 40px rgba(31, 39, 51, .08);
}
.dikenocracy-web .back-to-projects { font-size: .9rem; font-weight: 600; color: #3d3489; padding: 1.1rem 0 .4rem; }
.dikenocracy-web .back-to-projects:hover { color: #2f2870; text-decoration: underline; }
.dikenocracy-web .app-header { padding: .6rem 0 1.4rem; background: none; border-bottom: 1px solid #e6e0d5; }
.dikenocracy-web .app-title { color: #141a28; }
.dikenocracy-web .web-wordmark { display: inline-flex; align-items: center; gap: .6rem; font-size: 2.3rem; letter-spacing: .01em; color: #141a28; }
.dikenocracy-web .web-wordmark::before {
  content: ""; width: 44px; height: 44px; border-radius: 13px; flex: none;
  background: #ece8fb url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233d3489' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='11' width='16' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3Ccircle cx='12' cy='16' r='1.4'/%3E%3C/svg%3E") center / 26px no-repeat;
}
.dikenocracy-web .icon-btn { border: 1px solid #e6e0d5; border-radius: 12px; background: #fff; }
.dikenocracy-web .icon-btn:hover, .dikenocracy-web .icon-btn--active { background: #ece8fb; border-color: #ece8fb; }
.dikenocracy-web .home__tagline { font-size: 1.15rem; color: #4d5666; }
.dikenocracy-web .big-btn { border-radius: 14px; font-weight: 600; box-shadow: none; }
.dikenocracy-web .big-btn--primary { background: #3d3489; border-color: #3d3489; color: #fff; box-shadow: 0 1px 2px rgba(61, 52, 137, .2), 0 6px 16px rgba(61, 52, 137, .14); }
.dikenocracy-web .big-btn--primary:hover:not(:disabled) { background: #2f2870; border-color: #2f2870; }
.dikenocracy-web .big-btn:not(.big-btn--primary) { background: #fff; color: #3d3489; border: 1px solid #d6cfc2; }
.dikenocracy-web .big-btn:not(.big-btn--primary):hover:not(:disabled), .dikenocracy-web .preset-btn:hover { background: #ece8fb; border-color: #ece8fb; }
.dikenocracy-web .flow__title, .dikenocracy-web .screen h2 { font-size: 1.6rem; color: #141a28; }
.dikenocracy-web .flow__input { border-radius: 12px; border: 1px solid #d6cfc2; background: #fff; color: #1f2733; }
.dikenocracy-web .flow__input:focus { border-color: #3d3489; box-shadow: 0 0 0 3px #ece8fb; }
.dikenocracy-web .hint, .dikenocracy-web .help-steps, .dikenocracy-web .field { color: #4d5666; }
.dikenocracy-web .token-box { border-radius: 12px; background: #f3efe7; border: 1px solid #e6e0d5; }
.dikenocracy-web .settings-section h3 { color: #141a28; }
.dikenocracy-web :is(button, input, textarea, select, a):focus-visible { outline: 2px solid #3d3489; outline-offset: 3px; }
@media (max-width: 680px) {
  .dikenocracy-web .app { margin: 1rem .75rem 2rem; padding: 0 1.1rem 1.4rem; border-radius: 18px; width: auto; }
  .dikenocracy-web .web-wordmark { font-size: 1.9rem; }
  .dikenocracy-web .web-wordmark::before { width: 38px; height: 38px; background-size: 22px; }
}