/* Koi Pond design. Presentation only, like Classic web: every rule is scoped to
   html[data-design="koi"] except the picker swatch and the three-choice picker grid, which the
   picker shows whatever the current design is. Layout, hit areas and stored note colours never
   change. Home, card studying and practice tests are a pond whenever they are mounted (first paint included); the pond controller adds:
     .koi-pond-page  Koi design on a page with the pond: Home, card studying, a practice test
     .koi-home       Koi design with Home mounted
     .koi-pond-live  the WebGL pond is drawing (its canvas fades in over the CSS still water)
     .koi-feeding    feeding mode: open water shows a pinch-of-food cursor
     .koi-reduced    reduced motion: still pond; Feed stays available
   Widgets float on the water as calm, pale panels; sticky notes keep their own look. Decoration never uses will-change, blend modes, backdrop filters or
   animated filters, so nothing extra is composited over the moving canvas. */

/* ------------------------------------------------------------------ design picker (unscoped) */
.appearance-options { grid-template-columns:repeat(2,minmax(0,1fr)); }
@media (max-width:500px) { .appearance-options { grid-template-columns:minmax(0,1fr); } }
.sample-koi {
  align-items:center; justify-content:center;
  background:
    radial-gradient(ellipse 11% 6% at 72% 30%,#f08a4b 0 62%,transparent 70%),
    radial-gradient(ellipse 5% 4% at 64% 33%,#f7f1e6 0 60%,transparent 70%),
    radial-gradient(ellipse 10% 5.5% at 24% 76%,#f6f0e4 0 60%,transparent 70%),
    radial-gradient(ellipse 4% 3.4% at 27% 75%,#e2672d 0 60%,transparent 70%),
    linear-gradient(160deg,#4a938a,#276560 55%,#1d4f50);
}
.sample-koi i {
  flex:0 0 34px; height:34px; border-radius:50%; box-shadow:none; background:none;
  border:1.5px solid rgb(236 250 243 / .55);
}
.sample-koi i + i { flex-basis:22px; height:22px; margin-top:22px; border-color:rgb(236 250 243 / .38); }

/* ------------------------------------------------------------------ tokens: a misty pond palette */
html[data-design="koi"] {
  --koi-page:#dde8e3; --koi-sheet:#fbfdfb; --koi-ink:#1c3633; --koi-muted:#4b6863; --koi-accent:#19645e;
  --koi-shore-ink:#f4f9f5; --koi-shore-muted:#e0eee8; --koi-ring-water:#eef9f3;
  --koi-shore-shadow:0 1px 2px rgb(2 24 22 / .62),0 0 16px rgb(2 24 22 / .4);
  --koi-img-floor:url("/assets/koi/floor-albedo.webp?v=2");
}
html[data-design="koi"] body {
  --paper-grain:none; --workspace-grain:none;
  --paper-desk:var(--koi-page); --paper-sheet:var(--koi-sheet); --paper-ink:var(--koi-ink);
  --paper-muted:var(--koi-muted); --paper-accent:var(--koi-accent);
  --paper-rule:color-mix(in srgb,var(--koi-accent) 16%,transparent);
  --paper-contact:rgb(16 52 50 / .12); --paper-cast:rgb(16 52 50 / .2);
  --workspace-base:var(--koi-page);
  --surface-alt:color-mix(in srgb,var(--koi-accent) 6%,#eef4f1);
  --border:color-mix(in srgb,var(--koi-accent) 22%,#c8d7d2);
  --ui-shadow-rgb:16 52 50;
  background:var(--workspace-base);
}
html[data-design="koi"] :is(.app-layout,.study-layout,.practice-test-layout,.notebook-studio) {
  background-color:var(--workspace-base);
  background-image:radial-gradient(ellipse 75% 50% at 28% 0%,rgb(246 251 248 / .85),transparent 70%),radial-gradient(ellipse 60% 55% at 90% 100%,rgb(190 216 208 / .55),transparent 70%),linear-gradient(172deg,#e4eeea,#d4e3dd);
}
html[data-design="koi"] :is(.app-ad-rail,.landing-ad-rail) { background:color-mix(in srgb,var(--koi-accent) 7%,#e3ece8); }

/* ------------------------------------------------------------------ Home: still water */
/* Static water (no WebGL, and before the canvas fades in): the same pebble bed as the live pond,
   seen through clear teal water. Every page layer above it is transparent. */
html[data-design="koi"]:where(.koi-pond-page,:has(#app-content > .home-dashboard),:has(#app > .study-layout),:has(#app > .practice-test-layout)) {
  background-color:#1d3f3a;
  background-image:
    radial-gradient(ellipse 90% 60% at 50% 0%,rgb(150 200 186 / .14),transparent 70%),
    linear-gradient(180deg,rgb(12 48 44 / .5),rgb(9 40 39 / .58) 55%,rgb(7 33 34 / .66)),
    var(--koi-img-floor);
  background-size:100% 100%,100% 100%,1080px 1080px;
}
html[data-design="koi"].koi-home { scroll-padding-bottom:88px; }
html[data-design="koi"]:where(.koi-pond-page,:has(#app-content > .home-dashboard),:has(#app > .study-layout),:has(#app > .practice-test-layout)) body,
html[data-design="koi"]:where(.koi-pond-page,:has(#app-content > .home-dashboard),:has(#app > .study-layout),:has(#app > .practice-test-layout)) :is(.app-layout,.app-center,#app-content,#app-content > .view,.study-layout,.study-center,.practice-test-layout,.practice-test-center) { background:transparent; }
/* The pond runs on under the side rail beside Home (the controller widens its canvas). */
html[data-design="koi"]:where(.koi-pond-page,:has(#app-content > .home-dashboard),:has(#app > .study-layout),:has(#app > .practice-test-layout)) :is(.app-layout,.study-layout,.practice-test-layout) > .app-ad-rail { background:transparent; border-left-color:transparent; }
/* Ad frames there float like Home's panels (their contents are untouched). */
html[data-design="koi"]:where(.koi-pond-page,:has(#app-content > .home-dashboard),:has(#app > .study-layout),:has(#app > .practice-test-layout)) :is(.app-layout,.study-layout,.practice-test-layout) > .app-ad-rail .ad-slot {
  border:1px solid rgb(255 255 255 / .72); border-radius:18px; color:#4a5f5a;
  background:linear-gradient(180deg,rgb(255 255 255 / .6),rgb(255 255 255 / 0) 36%),linear-gradient(168deg,#fafcfb,#eef4f1);
  box-shadow:inset 0 1px 0 rgb(255 255 255 / .95),0 0 0 1px rgb(214 240 232 / .12),0 2px 4px rgb(2 20 18 / .24),0 26px 44px -18px rgb(2 20 18 / .66);
}
/* Decoration never reaches past the right edge of the page: on phones and tablets any
   horizontal overflow would widen the layout viewport. Home decoration is sized to stay inside
   the column; bulletin pads can reach past it, so the note layer clips (clip, not hidden: no
   scroll container, fixed notes unaffected). */
html[data-design="koi"] .sticky-board { overflow-x:clip; }
html[data-design="koi"]:where(.koi-home,:has(#app-content > .home-dashboard)) .app-center { overflow-x:clip; }
html[data-design="koi"]:where(.koi-home,:has(#app-content > .home-dashboard)) .mobile-app-header { -webkit-backdrop-filter:none; backdrop-filter:none; background:rgb(250 252 250 / .97); }
html[data-design="koi"] .koi-pond-canvas {
  position:fixed; top:0; height:100vh; height:100lvh; z-index:-1; display:block; pointer-events:none;
  opacity:0; transition:opacity 1.4s ease;
}
html[data-design="koi"].koi-pond-live .koi-pond-canvas { opacity:1; }
html[data-design="koi"]:not(.koi-pond-page) .koi-pond-canvas { display:none; }

/* Text on open water sits in soft, static oval shade (like an overhanging tree). Its solid core
   (76% of the oval) contains the whole text box, so light type keeps at least 4.5:1 even over a
   white koi; the feathered rim lies outside the text. */
html[data-design="koi"]:where(.koi-home,:has(#app-content > .home-dashboard)) :is(.home-dashboard > .view-header .view-heading-copy,.page-bulletin-heading > div) { position:relative; isolation:isolate; }
html[data-design="koi"]:where(.koi-home,:has(#app-content > .home-dashboard)) .home-dashboard > .view-header .view-heading-copy::before,
html[data-design="koi"]:where(.koi-home,:has(#app-content > .home-dashboard)) .page-bulletin-heading > div::before {
  content:""; position:absolute; z-index:-1; pointer-events:none; inset:-80% -30%;
  background:radial-gradient(closest-side,rgb(3 24 22 / .7) 76%,rgb(3 24 22 / .38) 88%,rgb(3 24 22 / 0) 100%);
}
/* Where the text can span the column, the shade is a band that ends 12px past the text on the
   right (never past the page edge) and feathers out to the left, above and below. */
@container paper-home (max-width:840px) {
  html[data-design="koi"]:where(.koi-home,:has(#app-content > .home-dashboard)) .home-dashboard > .view-header .view-heading-copy::before {
    inset:-34px -12px -34px -40px; background:rgb(3 24 22 / .7);
    -webkit-mask:linear-gradient(90deg,transparent,#000 28px,#000 calc(100% - 12px),transparent),linear-gradient(180deg,transparent,#000 28px,#000 calc(100% - 28px),transparent);
    -webkit-mask-composite:source-in;
    mask:linear-gradient(90deg,transparent,#000 28px,#000 calc(100% - 12px),transparent),linear-gradient(180deg,transparent,#000 28px,#000 calc(100% - 28px),transparent);
    mask-composite:intersect;
  }
}
@media (max-width:1180px) {
  html[data-design="koi"]:where(.koi-home,:has(#app-content > .home-dashboard)) .page-bulletin-heading > div::before {
    inset:-30px -10px -30px -40px; background:rgb(3 24 22 / .7);
    -webkit-mask:linear-gradient(90deg,transparent,#000 28px,#000 calc(100% - 10px),transparent),linear-gradient(180deg,transparent,#000 24px,#000 calc(100% - 24px),transparent);
    -webkit-mask-composite:source-in;
    mask:linear-gradient(90deg,transparent,#000 28px,#000 calc(100% - 10px),transparent),linear-gradient(180deg,transparent,#000 24px,#000 calc(100% - 24px),transparent);
    mask-composite:intersect;
  }
}
html[data-design="koi"]:where(.koi-home,:has(#app-content > .home-dashboard)) .home-dashboard > .view-header { color:var(--koi-shore-ink); }
html[data-design="koi"]:where(.koi-home,:has(#app-content > .home-dashboard)) .home-dashboard > .view-header :is(h1,p,.eyebrow) { text-shadow:var(--koi-shore-shadow); }
html[data-design="koi"]:where(.koi-home,:has(#app-content > .home-dashboard)) .home-dashboard > .view-header h1 { color:var(--koi-shore-ink); }
html[data-design="koi"]:where(.koi-home,:has(#app-content > .home-dashboard)) .home-dashboard > .view-header p { color:var(--koi-shore-muted); }
html[data-design="koi"]:where(.koi-home,:has(#app-content > .home-dashboard)) .home-dashboard > .view-header .eyebrow { color:#d2f0de; }

/* ------------------------------------------------------------------ panels */
/* Home's widgets float on the pond as calm, pale panels: opaque, so text never competes with
   the moving water; a soft sheen from the sky above; a faint meniscus where they meet the
   water; and a shadow cast down through the water onto the pebbles. The koi swim around them. */
html[data-design="koi"] .home-dashboard .home-widget {
  --text:#1b2f2b; --muted:#4a5f5a; --primary:#17564e; --border:rgb(23 77 70 / .14);
  --surface:#f8fbf9; --surface-alt:#eef4f1; --ui-accent:#17564e; --ui-accent-ink:#17564e;
  --home-widget-radius:22px;
  --home-widget-border-color:rgb(255 255 255 / .72);
  --home-widget-shadow:inset 0 1px 0 rgb(255 255 255 / .95),0 1px 2px rgb(2 22 20 / .16),0 18px 34px -16px rgb(2 22 20 / .5);
  position:relative; isolation:isolate; color:var(--text);
  background:
    linear-gradient(180deg,rgb(255 255 255 / .6),rgb(255 255 255 / 0) 36%),
    linear-gradient(168deg,#fafcfb,#eef4f1);
}
html[data-design="koi"]:where(.koi-home,:has(#app-content > .home-dashboard)) .home-dashboard .home-widget {
  --home-widget-shadow:
    inset 0 1px 0 rgb(255 255 255 / .95),
    0 0 0 1px rgb(214 240 232 / .12),
    0 0 18px 2px rgb(214 240 232 / .06),
    0 2px 4px rgb(2 20 18 / .24),
    0 26px 44px -18px rgb(2 20 18 / .66);
}
/* Overview panels clip their content; the rounded corners follow the panel. */
html[data-design="koi"] .home-dashboard .home-overview-panel { overflow:clip; }
html[data-design="koi"] .home-dashboard .home-workspace-section[open] > summary,
html[data-design="koi"] .home-dashboard .home-overview-panel.is-open .home-overview-header { border-bottom-color:rgb(23 77 70 / .1); }
html[data-design="koi"] .home-dashboard :is(.home-workspace-section > summary,.home-overview-header) { color:var(--text); }
/* The embedded Library keeps its own surfaces; only its page tokens are restored. */
html[data-design="koi"] .home-dashboard .home-library-content {
  --text:var(--koi-ink); --muted:var(--koi-muted); --primary:var(--koi-accent); --surface:var(--koi-sheet);
  --surface-alt:color-mix(in srgb,var(--koi-accent) 6%,#eef4f1); --border:color-mix(in srgb,var(--koi-accent) 22%,#c8d7d2);
  --ui-accent:var(--koi-accent); --ui-accent-ink:var(--koi-accent);
}
/* Focus rings: 3px, dark on the panels, light on water. */
html[data-design="koi"] .home-dashboard :is(.home-study-row,.home-overview-panel) :is(button,a,select,input,[tabindex]):focus-visible { outline:3px solid var(--primary); outline-offset:3px; }
html[data-design="koi"] .home-dashboard .home-library > summary:focus-visible { outline:3px solid var(--primary); outline-offset:-5px; border-radius:18px; }
html[data-design="koi"] .home-dashboard .home-widget .icon-button:hover:not(:disabled) { background:rgb(23 77 70 / .07); }
html[data-design="koi"] .home-dashboard .home-intro-paper-detail { display:none; }

/* ------------------------------------------------------------------ studying and tests on the water */
/* The header, the card and the test float as they are; the progress line and the keyboard hints,
   which sit on open water, float as a pale strip and read in light type. */
html[data-design="koi"]:where(.koi-pond-page,:has(#app-content > .home-dashboard),:has(#app > .study-layout),:has(#app > .practice-test-layout)) .study-progress-row {
  border:1px solid rgb(255 255 255 / .72); border-radius:14px; padding:8px 14px;
  background:linear-gradient(180deg,rgb(255 255 255 / .6),rgb(255 255 255 / 0) 60%),linear-gradient(168deg,#fafcfb,#eef4f1);
  box-shadow:inset 0 1px 0 rgb(255 255 255 / .95),0 2px 4px rgb(2 20 18 / .2),0 14px 26px -14px rgb(2 20 18 / .55);
}
html[data-design="koi"]:where(.koi-pond-page,:has(#app-content > .home-dashboard),:has(#app > .study-layout),:has(#app > .practice-test-layout)) .study-hints { color:var(--koi-shore-muted); text-shadow:var(--koi-shore-shadow); }
html[data-design="koi"]:where(.koi-pond-page,:has(#app-content > .home-dashboard),:has(#app > .study-layout),:has(#app > .practice-test-layout)) .study-hints :is(kbd,strong,b) { color:var(--koi-shore-ink); }
html[data-design="koi"]:where(.koi-pond-page,:has(#app-content > .home-dashboard),:has(#app > .study-layout),:has(#app > .practice-test-layout)) :is(.study-workspace,.practice-test-main) { box-shadow:0 0 0 1px rgb(214 240 232 / .12),0 2px 4px rgb(2 20 18 / .22),0 26px 44px -18px rgb(2 20 18 / .62); }

/* ------------------------------------------------------------------ bulletin: open water */
/* Frame and cork keep their padding and border widths (notes are placed from the cork's box). */
html[data-design="koi"] .page-bulletin-frame { background:none; box-shadow:none; border-radius:40px; }
html[data-design="koi"] .page-bulletin-frame::before { display:none; }
html[data-design="koi"] .page-bulletin-cork {
  background:none; border-color:color-mix(in srgb,var(--koi-accent) 18%,transparent); border-radius:34px;
  box-shadow:inset 0 0 40px color-mix(in srgb,var(--koi-accent) 6%,transparent);
}
html[data-design="koi"]:where(.koi-home,:has(#app-content > .home-dashboard)) .page-bulletin-cork {
  border-color:rgb(220 244 236 / .11);
  box-shadow:inset 0 0 46px rgb(220 244 236 / .045),0 0 0 1px rgb(2 26 24 / .05);
}
html[data-design="koi"]:where(.koi-home,:has(#app-content > .home-dashboard)) .page-bulletin-heading h2 { color:var(--koi-shore-ink); text-shadow:var(--koi-shore-shadow); }
html[data-design="koi"]:where(.koi-home,:has(#app-content > .home-dashboard)) .page-bulletin-heading p { color:var(--koi-shore-muted); text-shadow:var(--koi-shore-shadow); }
html[data-design="koi"] .page-bulletin-heading [data-add-sticky] {
  color:#17453f; border:1px solid rgb(255 255 255 / .6); border-radius:999px; padding-inline:18px 20px;
  background:linear-gradient(180deg,#f3fbf6,#d3e9df);
  box-shadow:inset 0 1px 0 #fff,inset 0 -2px 3px rgb(20 80 70 / .12),0 2px 4px rgb(2 26 24 / .22),0 10px 22px -10px rgb(2 26 24 / .55);
}
html[data-design="koi"] .page-bulletin-heading [data-add-sticky]:hover:not(:disabled) {
  background:linear-gradient(180deg,#ffffff,#dff0e7); border-color:rgb(255 255 255 / .85);
  box-shadow:inset 0 1px 0 #fff,inset 0 -2px 3px rgb(20 80 70 / .1),0 3px 5px rgb(2 26 24 / .22),0 14px 26px -10px rgb(2 26 24 / .55);
}
html[data-design="koi"] .page-bulletin-heading [data-add-sticky] svg { color:#2c7a6d; }
html[data-design="koi"] .page-bulletin-heading [data-add-sticky]:focus-visible { outline:3px solid var(--koi-accent); outline-offset:3px; }
html[data-design="koi"]:where(.koi-home,:has(#app-content > .home-dashboard)) .page-bulletin-heading [data-add-sticky]:focus-visible { outline-color:var(--koi-ring-water); }
html[data-design="koi"] .page-bulletin-resize {
  color:#3b382f; border-radius:48% 52% 44% 56% / 56% 45% 55% 44%;
  background:radial-gradient(circle at 34% 28%,#f2efe8,#cbc5b7 58%,#9e9788);
  box-shadow:inset 0 1px 1px rgb(255 255 255 / .8),inset 0 -2px 3px rgb(60 50 35 / .22),0 2px 3px rgb(2 22 20 / .35),0 0 0 1.5px rgb(214 240 232 / .12);
}
html[data-design="koi"] .page-bulletin-resize:hover,
html[data-design="koi"] .page-bulletin-resize:focus-visible {
  background:radial-gradient(circle at 34% 28%,#fbf9f4,#d8d2c5 58%,#aaa394); outline:3px solid var(--koi-accent); outline-offset:3px;
}
html[data-design="koi"]:where(.koi-home,:has(#app-content > .home-dashboard)) .page-bulletin-resize:is(:hover,:focus-visible) { outline-color:var(--koi-ring-water); }

/* ------------------------------------------------------------------ feeding the koi */
/* Bottom-left of the Home column, above the bulletin notes (80), below the message dock (850)
   and dialogs. Hidden while a note is dragged or resized and while the phone menu is open. */
html[data-design="koi"] .koi-feed-dock {
  position:fixed; z-index:85; margin:0;
  left:calc(var(--koi-dock-left,0px) + 16px);
  bottom:calc(16px + env(safe-area-inset-bottom,0px));
  max-width:calc(100vw - var(--koi-dock-left,0px) - var(--koi-dock-right,0px) - 32px);
  display:grid; grid-template-columns:auto auto; justify-content:start; justify-items:start; align-items:center; gap:9px 10px;
  pointer-events:none;
}
html[data-design="koi"] .koi-feed-dock > * { pointer-events:auto; }
html[data-design="koi"]:not(.koi-pond-page) .koi-feed-dock { display:none; }
/* A practice test keeps its full attention (and its hint panel clear): no feeding there. On phones a
   study session keeps its bottom controls clear too. */
html[data-design="koi"]:has(#app > .practice-test-layout) .koi-feed-dock { display:none; }
@media (max-width:760px) { html[data-design="koi"].koi-pond-page:not(.koi-home) .koi-feed-dock { display:none; } }
html[data-design="koi"]:has(.board-note.is-dragging,.board-note.is-resizing,.app-layout.mobile-nav-open) .koi-feed-dock { visibility:hidden; }
html[data-design="koi"] .koi-feed-hint {
  grid-column:1 / -1; grid-row:1;
  margin:0; max-width:min(300px,100%); padding:7px 12px; border-radius:12px;
  background:rgb(7 36 34 / .88); color:#eef8f3; font:500 13px/1.4 var(--font-body,system-ui,sans-serif);
  box-shadow:0 8px 20px -10px rgb(0 0 0 / .6);
}
html[data-design="koi"] .koi-feed-hint:empty { display:none; }
html[data-design="koi"] .koi-feed-button {
  grid-row:2; position:relative; display:inline-flex; align-items:center; margin:0;
  border:1px solid rgb(255 255 255 / .6); border-radius:999px;
  color:#1f423c; font:650 14px/1.2 var(--font-body,system-ui,sans-serif); letter-spacing:.005em; white-space:nowrap;
  cursor:pointer; transition:transform .25s ease,box-shadow .25s ease;
}
html[data-design="koi"] .koi-feed-button {
  gap:10px; min-height:46px; padding:6px 19px 6px 6px;
  background:linear-gradient(180deg,#fffaf0,#efe4cd);
  box-shadow:inset 0 1px 0 #fff,inset 0 -2px 3px rgb(120 90 40 / .12),0 2px 4px rgb(0 24 22 / .28),0 14px 28px -12px rgb(0 24 22 / .66);
}
html[data-design="koi"] .koi-feed-icon {
  display:grid; place-items:center; flex:none; width:34px; height:34px; border-radius:50%;
  color:#fff8ec; background:radial-gradient(circle at 34% 28%,#ffb983,#e2692f 58%,#b44a1c);
  box-shadow:inset 0 1px 1px rgb(255 255 255 / .45),0 1px 2px rgb(90 34 6 / .35);
}
html[data-design="koi"] .koi-feed-icon svg { display:block; width:20px; height:20px; }
@media (hover:hover) {
  html[data-design="koi"] .koi-feed-button:hover { transform:translateY(-2px); }
}
html[data-design="koi"] .koi-feed-button:active { transform:translateY(1px); transition-duration:.1s; }
html[data-design="koi"] .koi-feed-button:focus-visible { outline:3px solid var(--koi-ring-water); outline-offset:3px; box-shadow:0 0 0 7px #174d47,0 14px 28px -12px rgb(0 24 22 / .66); }
html[data-design="koi"] .koi-feed-button[data-feeding="true"] {
  color:#f4fbf7; border-color:rgb(255 255 255 / .38);
  background:linear-gradient(180deg,#2b7468,#1b554d);
  box-shadow:inset 0 1px 0 rgb(255 255 255 / .28),inset 0 -2px 3px rgb(0 0 0 / .16),0 2px 4px rgb(0 24 22 / .3),0 14px 28px -12px rgb(0 24 22 / .7);
}
html[data-design="koi"] .koi-feed-button[data-feeding="true"]::after {
  content:""; position:absolute; inset:-5px; border-radius:inherit; pointer-events:none;
  border:2px solid rgb(236 250 243 / .5); animation:koi-feed-halo 2.6s ease-out infinite;
}
@keyframes koi-feed-halo { 0% { opacity:.9; transform:scale(1); } 70%,100% { opacity:0; transform:scale(1.12,1.4); } }
/* Phones: Pause is a round icon button and Feed reads just "Feed"; full labels stay available to assistive technology. */
@media (max-width:760px) {
  html[data-design="koi"] .koi-feed-label-more { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0; }
}
/* Dragging a fingertip through the water never selects the page's text. */
html[data-design="koi"].koi-stirring, html[data-design="koi"].koi-stirring * { -webkit-user-select:none !important; user-select:none !important; }
html[data-design="koi"].koi-pond-page.koi-feeding :is(.app-center,.study-center,.practice-test-center,.page-bulletin-frame,.page-bulletin-cork) { cursor:url("/assets/koi/feed-cursor.svg?v=1") 16 16,crosshair; }
html[data-design="koi"].koi-pond-page.koi-feeding :is(.home-widget,.home-launchpad .paper-sticky,.home-dashboard > .view-header,.page-bulletin-heading,.page-bulletin-resize,.mobile-app-header,.koi-feed-dock,.study-header,.study-progress-row,.study-workspace,.study-controls,.practice-test-header,.practice-test-main) { cursor:auto; }
html[data-design="koi"].koi-pond-page.koi-feeding :is(.home-launchpad .paper-sticky,.koi-feed-button,.page-bulletin-heading .button) { cursor:pointer; }

/* ------------------------------------------------------------------ motion, contrast, print */
html[data-design="koi"].reduce-motion :is(.koi-feed-button,.koi-feed-button:hover) { transform:none; transition:none; }
html[data-design="koi"].reduce-motion .koi-pond-canvas { transition:none; }
html[data-design="koi"]:is(.reduce-motion,.koi-reduced) .koi-feed-button[data-feeding="true"]::after { animation:none; opacity:.6; }
@media (prefers-reduced-motion:reduce) {
  html[data-design="koi"] :is(.koi-feed-button,.koi-feed-button:hover) { transform:none; transition:none; }
  html[data-design="koi"] .koi-pond-canvas { transition:none; }
  html[data-design="koi"] .koi-feed-button[data-feeding="true"]::after { animation:none; opacity:.6; }
}
@media (forced-colors:active) {
  html[data-design="koi"] :is(.koi-pond-canvas,.koi-feed-dock) { display:none; }
  html[data-design="koi"]:where(.koi-pond-page,:has(#app-content > .home-dashboard),:has(#app > .study-layout),:has(#app > .practice-test-layout)) { background:Canvas; }
  html[data-design="koi"] .home-dashboard .home-widget { background:Canvas; border:2px solid CanvasText; box-shadow:none; }
  html[data-design="koi"] :is(.view-heading-copy,.page-bulletin-heading > div)::before { display:none; }
  html[data-design="koi"] :is(.home-dashboard > .view-header,.page-bulletin-heading) :is(h1,h2,p,.eyebrow) { text-shadow:none; }
  html[data-design="koi"] .page-bulletin-cork { border-color:CanvasText; }
}
@media print {
  html[data-design="koi"], html[data-design="koi"] body { background:#fff !important; }
  html[data-design="koi"] :is(.koi-pond-canvas,.koi-feed-dock) { display:none !important; }
  html[data-design="koi"] .home-dashboard > .view-header :is(h1,p,.eyebrow) { color:#000; text-shadow:none; }
  html[data-design="koi"] .home-dashboard .home-widget { background:#fff; border:1px solid #999; border-radius:10px; box-shadow:none; color:#000; }
  html[data-design="koi"] :is(.view-heading-copy,.page-bulletin-heading > div)::before { display:none; }
}