/* Alpha 28 · Paper desk
 * Paper is presentation chrome, never an overlay on authored media or a drawing canvas.
 * Native controls retain their geometry. Natural edges replace bevels on paper surfaces;
 * the existing border settings still control conventional panels, dialogs and buttons.
 */
:root {
  --paper-desk:#e9e8e1; --paper-sheet:#fdfbf4; --paper-ink:#313d3a;
  --paper-muted:#616e66; --paper-accent:#416e62; --paper-rule:#91b2c137;
  --nav-background:var(--background); --nav-surface:var(--surface);
  --nav-surface-alt:var(--surface-alt); --nav-text:var(--text);
  --nav-muted:var(--muted); --nav-primary:var(--primary); --nav-border:var(--border);
  --nav-button-ink:var(--ui-button-ink);
}
:is(html[data-theme="classic"], [data-palette="classic"]) { --paper-desk:#dce2e9; --paper-sheet:#fcfcf8; --paper-ink:#30394b; --paper-muted:#626d80; --paper-accent:#565f9a; }
:is(html[data-theme="paper"], [data-palette="paper"]) { --paper-desk:#d9cbb6; --paper-sheet:#fffaf0; --paper-ink:#473d31; --paper-muted:#766653; --paper-accent:#7c5839; }
:is(html[data-theme="ocean"], [data-palette="ocean"]) { --paper-desk:#c9dcd9; --paper-sheet:#f6fcf5; --paper-ink:#2c484a; --paper-muted:#577779; --paper-accent:#216c70; }
:is(html[data-theme="lavender"], [data-palette="lavender"]) { --paper-desk:#dfd7e8; --paper-sheet:#fdf9fb; --paper-ink:#493b55; --paper-muted:#77667d; --paper-accent:#796090; }
:is(html[data-theme="forest"], [data-palette="forest"]) { --paper-desk:#cdd5c5; --paper-sheet:#f8fbee; --paper-ink:#374532; --paper-muted:#67745c; --paper-accent:#526e3f; }
:is(html[data-theme="rain"], [data-palette="rain"]) { --paper-desk:#cdd5dd; --paper-sheet:#f7f9f9; --paper-ink:#364654; --paper-muted:#637484; --paper-accent:#4d708f; }
:is(html[data-theme="autumn"], [data-palette="autumn"]) { --paper-desk:#e1ccbb; --paper-sheet:#fff8ed; --paper-ink:#553e33; --paper-muted:#7f6656; --paper-accent:#996044; }
:is(html[data-theme="rose"], [data-palette="rose"]) { --paper-desk:#e7d3d6; --paper-sheet:#fff9f5; --paper-ink:#503e46; --paper-muted:#816873; --paper-accent:#955a74; }
:is(html[data-theme="arctic"], [data-palette="arctic"]) { --paper-desk:#d0e0e4; --paper-sheet:#fcfdf9; --paper-ink:#354d56; --paper-muted:#607984; --paper-accent:#3b7384; }
:is(html[data-theme="cotton_candy"], [data-palette="cotton_candy"]) { --paper-desk:#d5e5f2; --paper-sheet:#fffafd; --paper-ink:#453f55; --paper-muted:#726982; --paper-accent:#a34d7e; }
[data-palette="midnight"] { --paper-desk:#e9e8e1; --paper-sheet:#fdfbf4; --paper-ink:#313d3a; --paper-accent:#416e62; }

body {
  --background:var(--paper-desk); --surface:var(--paper-sheet);
  --surface-alt:color-mix(in srgb,var(--paper-desk) 56%,var(--paper-sheet));
  --text:var(--paper-ink); --muted:var(--paper-muted); --primary:var(--paper-accent);
  --border:color-mix(in srgb,var(--paper-ink) 24%,var(--paper-sheet));
  --panel:var(--surface); --panel-2:var(--surface-alt); --accent:var(--primary); --line:var(--border);
  --danger:#a23e3c; --success:#39745a; --warning:#8a642b;
  --ui-accent:var(--primary); --ui-accent-ink:var(--primary);
  --ui-blue:#4b758a; --ui-teal:#437a69; --ui-amber:#8d7242; --ui-rose:#955875;
  --ui-button-fill:var(--primary); --ui-button-top:color-mix(in srgb,var(--primary) 87%,white); --ui-button-ink:#fffef8;
  --ui-ground:var(--paper-desk); --ui-panel:var(--paper-sheet);
  --ui-panel-top:color-mix(in srgb,var(--paper-sheet) 65%,white);
  --ui-raised:var(--ui-panel-top); --ui-field:color-mix(in srgb,var(--paper-sheet) 79%,var(--paper-desk));
  --ui-field-line:var(--ui-border-color); --ui-rim:var(--ui-border-color); --ui-highlight:#ffffffc9;
  --ui-shadow-rgb:49 47 37; --ui-shadow-base:.20; --ui-shadow-contact-base:.09;
  --ui-shadow-opacity:min(.7,calc(var(--ui-shadow-base) * var(--ui-shadow-strength)));
  --ui-shadow-close:min(.45,calc(var(--ui-shadow-contact-base) * var(--ui-shadow-strength)));
  --shadow-sm:0 2px 3px rgb(var(--ui-shadow-rgb) / var(--ui-shadow-close)),0 9px 13px -8px rgb(var(--ui-shadow-rgb) / var(--ui-shadow-opacity));
  --shadow-md:0 3px 5px -2px rgb(var(--ui-shadow-rgb) / var(--ui-shadow-close)),0 16px 26px -14px rgb(var(--ui-shadow-rgb) / var(--ui-shadow-opacity));
  --shadow-lg:0 8px 20px -8px rgb(var(--ui-shadow-rgb) / var(--ui-shadow-opacity)),0 30px 65px -18px rgb(var(--ui-shadow-rgb) / var(--ui-shadow-opacity));
  --paper-contact:rgb(65 61 44 / min(.45,calc(.13 * var(--ui-shadow-strength))));
  --paper-cast:rgb(65 61 44 / min(.65,calc(.26 * var(--ui-shadow-strength))));
  --paper-grain:url('./assets/paper-grain.svg');
  --workspace-grain:var(--wall-grain,url('./assets/wall-grain.svg?v=0.7.0-alpha.51'));
  --workspace-base:var(--wall-base-color,var(--paper-desk));
  color:var(--text); background:var(--workspace-base); color-scheme:light;
}
.app-layout, .landing-page, .study-layout, .practice-test-layout, .notebook-studio {
  background-color:var(--workspace-base);
  background-image:var(--workspace-grain),radial-gradient(ellipse at 42% 0%,color-mix(in srgb,var(--workspace-base) 40%,#fffef6),var(--workspace-base) 76%);
}
.wall-texture-settings { margin:22px 0; padding-top:20px; border-top:1px solid var(--ui-rim); }
.wall-texture-preview { --preview-wall-color:var(--wall-base-color,#e9e8e1); height:120px; margin:16px 0; border:1px solid var(--border); border-radius:8px; background-color:var(--preview-wall-color); background-image:var(--wall-grain,url('./assets/wall-grain.svg?v=0.7.0-alpha.51')),radial-gradient(ellipse at 42% 0%,color-mix(in srgb,var(--preview-wall-color) 40%,#fffef6),var(--preview-wall-color) 76%); }
.wall-background-controls { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr)); gap:16px; }
.wall-background-controls > .field { min-width:0; }
.app-sidebar {
  --background:var(--nav-background); --surface:var(--nav-surface); --surface-alt:var(--nav-surface-alt);
  --text:var(--nav-text); --muted:var(--nav-muted); --primary:var(--nav-primary); --border:var(--nav-border);
  --ui-panel:var(--surface); --ui-panel-top:color-mix(in srgb,var(--surface) 86%,var(--surface-alt));
  --ui-button-fill:var(--primary); --ui-button-top:color-mix(in srgb,var(--primary) 90%,white); --ui-button-ink:var(--nav-button-ink);
  color:var(--text); border-right:1px solid var(--border);
  box-shadow:4px 0 16px -9px var(--paper-cast);
}
.app-ad-rail, .landing-ad-rail { background:color-mix(in srgb,var(--paper-desk) 85%,var(--paper-accent) 15%); border-color:var(--border); box-shadow:none; }
.ad-slot { background:color-mix(in srgb,var(--paper-sheet) 47%,transparent); }
.view-heading-copy h1, .view-header h1 { letter-spacing:-.035em; }
.eyebrow { color:var(--paper-accent); }
.app-sidebar .eyebrow { color:var(--primary); }
.view-heading-copy p { line-height:1.65; }

/* Conventional chrome: a quiet cream instrument panel with the user's edge controls. */
.panel, .surface-panel, .metric-card, .modal { border-radius:10px; }
.settings-section, .aig-section, .lecture-stage-panel, .practice-question-shell { background-image:linear-gradient(145deg,var(--ui-panel-top),var(--ui-panel)); }
.modal-header, .study-header, .practice-test-header, .notebook-topbar, .study-card-toolbar {
  background:linear-gradient(180deg,var(--ui-panel-top),var(--surface-alt));
  border-color:var(--border);
}
.modal-header { border-bottom:1px solid var(--border); }
.global-create-modal .modal-body { background:var(--paper-grain),var(--surface-alt); }
.button.primary, .button.secondary { border-radius:7px; }
.button:focus-visible, .icon-button:focus-visible, a:focus-visible, button:focus-visible { outline:2px solid var(--primary); outline-offset:3px; }
.study-control.primary, .study-control.primary small { color:#fffef8; }
.study-workspace { border-color:var(--border); border-radius:9px; box-shadow:0 2px 3px var(--paper-contact),0 15px 24px -13px var(--paper-cast); }
.study-card-stage { background:var(--surface); }
.notebook-workspace { background:transparent; }
.study-card-notes > header { background:color-mix(in srgb,var(--paper-sheet) 85%,var(--paper-desk)); }
/* Media stages keep their dark viewing backdrop and use light instructional copy. */
.lecture-stage-empty, .capture-placeholder, .capture-countdown {
  --text:#f0f4f8; --muted:#b3becd; color:var(--muted);
}
.capture-countdown { --primary:#a9d6c2; }
.theme-choice .theme-preview { background:var(--paper-desk); color:var(--paper-ink); }
.theme-choice .theme-preview i { background:var(--paper-ink); }
.theme-choice .theme-preview b { background:var(--paper-sheet); }
.theme-choice .theme-preview em { background:var(--paper-accent); }

/* Working documents: flat alignment for dense lists, a second leaf beneath the edge,
 * and faint ruling. No pseudo-elements are inserted into editing or selection layers. */
:is(.folder-dashboard .dashboard-panel:not(.notebook-sheet),
  .plan-card, .today-hero, .today-plan-pacing-panel, .how-today-panel,
  .active-session-card, .session-history-row, .community-section, .group-feed,
  .online-deck-card, .online-collection-card, .online-collection-detail,
  .published-deck-hero, .published-deck-details, .lecture-notes-rail, .trash-list,
  .notebook-card, .study-completion, .practice-result-item) {
  border:1px solid color-mix(in srgb,var(--paper-ink) 23%,var(--paper-sheet));
  border-radius:3px 4px 9px 3px;
  background-color:var(--paper-sheet);
  background-image:var(--paper-grain),linear-gradient(180deg,var(--paper-sheet) 0 75px,transparent 75px),repeating-linear-gradient(180deg,transparent 0 31px,var(--paper-rule) 31px 32px);
  box-shadow:0 1px 2px var(--paper-contact),2px 3px 0 -1px var(--paper-sheet),2px 4px 0 -1px var(--border),0 13px 22px -12px var(--paper-cast);
}
.panel.plan-card:hover, .panel.active-session-card:hover, .panel.online-deck-card:hover { border-color:var(--primary); }
.panel:is(.plan-card,.active-session-card).selected { border-color:var(--primary); outline:2px solid var(--primary); outline-offset:2px; }
.plan-card.is-paused, .plan-card.is-past { background-color:var(--surface-alt); }
.session-history-row { background-image:var(--paper-grain); }
.lecture-notes-rail textarea { background-color:color-mix(in srgb,var(--paper-sheet) 85%,white); }
.group-post { background:var(--paper-grain),var(--paper-sheet); border-radius:3px; box-shadow:0 2px 3px var(--paper-contact); }
.community-group-card, .community-deck-card, .community-friend-card, .community-member-card {
  background:var(--paper-grain),linear-gradient(120deg,var(--paper-sheet),var(--surface-alt));
  border-color:var(--border); border-radius:5px; box-shadow:var(--shadow-sm);
}

/* Library: upright folder cards, with a tab at their top edge. Dashed ghosts and the
 * selected outline remain distinguishable without relying on paper color alone. */
.library-browser-column {
  background:color-mix(in srgb,var(--paper-desk) 72%,var(--paper-ink) 7%);
  border:1px solid var(--border); border-radius:9px;
  box-shadow:inset 0 2px 4px var(--paper-contact),0 1px 0 #fff8;
}
.library-browser-column > header { border-bottom:1px solid var(--border); padding-bottom:16px; }
.column-folder, .folder-child-card {
  position:relative; overflow:visible; margin-top:8px; border:1px solid #b5a680; border-radius:2px 6px 5px 5px;
  background:var(--paper-grain),linear-gradient(135deg,#f9edce,#e9d7ad); color:#524a35;
  box-shadow:inset 0 1px 0 #fff9,0 2px 3px var(--paper-contact),0 8px 12px -8px var(--paper-cast);
}
.column-folder::before, .folder-child-card::before {
  content:""; position:absolute; top:-7px; left:-1px; width:36%; height:6px; pointer-events:none;
  border:1px solid #b5a680; border-bottom:0; border-radius:5px 8px 0 0; background:#ecddb7;
}
.column-folder .column-folder-title, .folder-child-card a { color:inherit; }
.column-folder small, .folder-child-card > small { color:#746647; }
.column-folder.is-selected { background:var(--paper-grain),linear-gradient(135deg,#fff4d5,#f0dcaa); border-color:var(--primary); outline:2px solid var(--primary); outline-offset:1px; box-shadow:var(--shadow-sm); }
.column-folder.is-selected::before { border-color:var(--primary); }
.column-folder.is-ghost, .folder-child-card.is-ghost {
  border:1.5px dashed var(--muted); background:color-mix(in srgb,var(--paper-sheet) 52%,transparent); color:var(--muted); box-shadow:none;
}
.column-folder.is-ghost::before, .folder-child-card.is-ghost::before { border-style:dashed; background:var(--surface-alt); }
.column-folder.is-ghost.is-selected { outline-color:var(--primary); }
.column-folder .text-button, .folder-child-card .text-button { color:var(--primary); }
.workspace-tabs { border-color:var(--border); gap:5px; padding-top:5px; }
.workspace-tabs > :is(button,a) { border-radius:6px 6px 0 0; }
.workspace-tabs > .active { background:var(--paper-grain),var(--paper-sheet); box-shadow:0 -1px 2px var(--paper-contact); }

/* Smaller reminders and summary cards: unruled index paper, without rotating tables
 * or changing the size/position of a control used in a study session. */
.metric-card, .today-plan-pacing-card, .plan-purpose-card, .games-tile {
  background:var(--paper-grain),linear-gradient(140deg,var(--paper-sheet),var(--surface-alt));
  border:1px solid var(--border); border-top:4px solid var(--ui-accent,var(--primary)); border-radius:3px 5px 7px 3px;
  box-shadow:0 2px 3px var(--paper-contact),0 10px 16px -10px var(--paper-cast);
}
.plan-purpose-card { background:var(--paper-grain),linear-gradient(140deg,#f9edbb,#eddea6); color:#4e4c38; --muted:#6e694d; --primary:#6b7041; }
.plan-purpose-card.personal-purpose { background:var(--paper-grain),linear-gradient(140deg,#dbeadc,#c9ddcc); color:#3f5748; --muted:#5f7868; --primary:#496f57; }
.games-tile { border-top-color:var(--game-accent); }
.games-tile:hover { box-shadow:0 3px 5px var(--paper-contact),0 14px 20px -10px var(--paper-cast); }
.inline-notice { border-radius:4px; }
.toast { background:var(--paper-sheet); border-color:var(--border); box-shadow:var(--shadow-md); }

/* The intro uses the same materials with its fixed preset, independent of saved settings. */
.landing-page .hero-product-frame { border:1px solid var(--border); border-radius:10px; transform:rotate(1deg); }
.landing-page .workflow-grid { gap:23px; padding:6px; }
.landing-page .workflow-grid > article { background:var(--paper-grain),linear-gradient(150deg,#fff0ae,#efdd91); color:#514c37; border:0; border-radius:2px 3px 9px 2px; box-shadow:0 2px 3px var(--paper-contact),0 13px 20px -10px var(--paper-cast); transform:rotate(-.6deg); }
.landing-page .workflow-grid > article:nth-child(2n) { background:var(--paper-grain),linear-gradient(150deg,#dae9ee,#bed6de); transform:rotate(.7deg); }
.landing-page .workflow-grid > article:nth-child(3) { background:var(--paper-grain),linear-gradient(150deg,#e7dcef,#cfbddd); }
.landing-page .workflow-grid > article p { color:#5d625b; }
.landing-page .workflow-grid > article svg { color:#536b63; }
.landing-page .showcase-card, .landing-page .faq-grid details { border:1px solid var(--border); border-radius:3px 4px 9px 3px; background:var(--paper-grain),var(--paper-sheet); box-shadow:0 2px 3px var(--paper-contact),0 12px 20px -12px var(--paper-cast); }
.landing-page .mock-deck { background:var(--paper-grain),var(--paper-sheet); border-radius:3px; }
.landing-page .mock-content, .landing-page .mock-window-bar { background:var(--surface-alt); }
.landing-page .final-cta { background:var(--paper-grain),var(--paper-sheet); border-color:var(--border); box-shadow:var(--shadow-md); }


.home-dashboard { gap:26px; padding-bottom:90px; container-type:inline-size; container-name:paper-home; }
.home-dashboard .eyebrow { color:#6e8070; }
.home-dashboard .view-header { padding:1px 2px 0; }
.home-dashboard .view-heading-copy h1 { letter-spacing:-.035em; color:var(--paper-ink); }
.home-dashboard .view-heading-copy p { font-size:14px; color:var(--paper-muted); }
.home-dashboard .dashboard-search { border:1px solid #bec7bb; box-shadow:inset 0 1px 3px #2a362812,0 1px 0 #fff9; border-radius:9px; }
.home-dashboard .dashboard-search .button { border:1px solid #c1c9bb; border-radius:5px; box-shadow:0 1px 2px #3b4c2424; background:#eef2e8; color:#53604c; }
.home-dashboard .home-study-row .text-button { color:#627960; }
.home-dashboard .home-study-row { gap:22px; }
.home-dashboard .home-study-row .dashboard-panel {
  background:linear-gradient(135deg,#ffffffa6,#fafbf3c4);
}
.home-dashboard .home-study-row .button {
  border:1px solid #3f5f53; box-shadow:inset 0 1px 0 #ffffff24,0 2px 2px #20332a25; border-radius:7px;
}
.home-dashboard .home-study-row h2 { font-size:15px; }
.home-dashboard .home-study-row h3 { font-size:21px; }
.home-dashboard .home-study-row p,
.home-dashboard .home-study-row .dashboard-day-line { font-size:13px; }
.home-dashboard .home-study-row progress { height:6px; }

/* Sticky notes: the top adhesive strip sits closer to the desk; the lower edge lifts.
   Small rotations and different curl directions keep four notes from looking stamped. */
.home-dashboard .home-launchpad { gap:27px; padding:8px 3px 14px; }
.paper-sticky {
  --note-top:#fff0a7; --note-bottom:#f3dd7b; --note-ink:#575132; --note-angle:-1.15deg;
  position:relative; isolation:isolate; display:flex; padding:0; gap:0; border:0; border-radius:0;
  overflow:visible; background:none; box-shadow:none; color:var(--note-ink); min-width:0;
  transform:rotate(var(--note-angle)); transform-origin:50% 13%;
  transition:transform .24s cubic-bezier(.2,.7,.2,1);
}
.paper-sticky:nth-child(4n + 2) {
  --note-top:#f7c7bb; --note-bottom:#eca69a; --note-ink:#754b46; --note-angle:.85deg;
}
.paper-sticky:nth-child(4n + 3) {
  --note-top:#e2d7f1; --note-bottom:#c9b5df; --note-ink:#615471; --note-angle:-.7deg;
}
.paper-sticky:nth-child(4n + 4) {
  --note-top:#d2e9f1; --note-bottom:#aaccdd; --note-ink:#3e6072; --note-angle:1.05deg;
}
/* Task colors follow their action, independent of the new/returning-user order. */
.paper-sticky[data-paper-color="yellow"] { --note-top:#fff0a7; --note-bottom:#f3dd7b; --note-ink:#575132; }
.paper-sticky[data-paper-color="rose"] { --note-top:#f7c7bb; --note-bottom:#eca69a; --note-ink:#754b46; }
.paper-sticky[data-paper-color="purple"] { --note-top:#e2d7f1; --note-bottom:#c9b5df; --note-ink:#615471; }
.paper-sticky[data-paper-color="blue"] { --note-top:#d2e9f1; --note-bottom:#aaccdd; --note-ink:#3e6072; }
.paper-sticky[data-paper-color="green"] { --note-top:#deebc2; --note-bottom:#bfd398; --note-ink:#4b603d; }
.paper-sticky::before,
.paper-sticky::after {
  content:""; position:absolute; z-index:-1; pointer-events:none;
  transition:transform .24s ease,opacity .24s ease;
}
.paper-sticky::before {
  inset:5px 4px 9px 3px; background:var(--paper-contact); border-radius:2px 2px 48% 5% / 2px 2px 7% 2%;
  box-shadow:0 3px 4px var(--paper-contact);
}
.paper-sticky::after {
  left:11px; right:8px; bottom:2px; height:38%; border-radius:50%; background:var(--paper-cast);
  filter:blur(7px); transform:rotate(-3deg) skewX(-7deg) translateY(6px);
}
.paper-sticky:nth-child(even)::after { transform:rotate(3deg) skewX(5deg) translateY(8px); right:15px; left:5px; }
.sticky-note-face {
  position:relative; display:flex; flex:1; flex-direction:column; align-items:flex-start; gap:16px;
  box-sizing:border-box; width:100%; max-width:none; padding:31px 27px 24px; min-height:240px;
  color:var(--note-ink); text-align:left;
  background-image:var(--paper-grain),linear-gradient(170deg, #ffffff36 0%,transparent 24%,#a98a5612 77%,#ffffff5c 99%),linear-gradient(135deg,var(--note-top),var(--note-bottom));
  border-radius:1px 2px 42% 3% / 1px 2px 4% 1%;
  box-shadow:inset 0 1px 0 #fff9,inset 1px 0 0 #ffffff38,inset -1px 0 0 #886a431c,inset 0 -1px 0 #70532a38;
}
.sticky-note-face::before {
  content:""; position:absolute; inset:0 0 auto; height:31px; pointer-events:none;
  background:linear-gradient(180deg,#6b563c0c,#6b563c04 78%,#ffffff15); border-bottom:1px solid #ffffff15;
}
.sticky-note-face::after {
  content:""; position:absolute; right:0; bottom:0; width:52%; height:31px; pointer-events:none;
  background:radial-gradient(ellipse at 90% 110%, #ffffff69, #ffffff0a 65%,transparent 72%);
  border-radius:0 0 90% 0 / 0 0 30% 0;
}
.sticky-note-face > svg:first-child { color:var(--note-ink); filter:none; opacity:.86; stroke-width:1.7; }
.sticky-note-face > strong { color:color-mix(in srgb,var(--note-ink) 75%,#1d2826); font-size:23px; font-weight:720; letter-spacing:-.025em; line-height:1.25; }
.sticky-note-face > span { color:var(--note-ink); opacity:.94; font-size:14px; line-height:1.6; max-width:33ch; }
.sticky-note-face > svg:last-child { color:var(--note-ink); align-self:flex-end; margin-top:auto; opacity:.78; }
.home-dashboard .home-launchpad.compact .sticky-note-face { min-height:220px; padding:28px 21px 19px; gap:13px; }
.home-dashboard .home-launchpad.compact .sticky-note-face > strong { font-size:18px; }
.home-dashboard .home-launchpad.compact .sticky-note-face > span { font-size:13px; }
.paper-sticky:focus-visible { outline:2px solid #3e635a; outline-offset:7px; }
@media (hover:hover) {
  .paper-sticky:hover { transform:translateY(-5px) rotate(calc(var(--note-angle) * .55)); background:none; box-shadow:none; border:0; }
  .paper-sticky:hover::after { opacity:.82; transform:translateY(12px) rotate(-2deg); }
}
.paper-sticky:active { transform:translateY(1px) rotate(calc(var(--note-angle) * .7)); transition-duration:.08s; }

/* Loose-leaf sheets: warm cellulose, fine blue ruling, double red margin,
   punched holes and a second leaf visible under one edge. No UI bevels. */
.home-dashboard > .dashboard-two-column:not(.home-study-row):not(.home-overview) { gap:28px; margin-top:5px; padding:0 3px; align-items:stretch; }
.notebook-sheet {
  position:relative; isolation:isolate; padding:0; border:0; border-radius:0; background:none; box-shadow:none;
  transform:rotate(-.35deg); min-height:358px;
}
.notebook-sheet[data-paper="progress"] { transform:rotate(.45deg); }
.notebook-sheet::before {
  content:""; position:absolute; z-index:-2; inset:8px 3px -3px 5px; background:color-mix(in srgb,var(--paper-sheet) 91%,var(--paper-ink));
  border:1px solid #b6b3a465; border-radius:2px 1px 5px 2px;
  transform:rotate(.65deg); box-shadow:0 3px 4px var(--paper-contact);
}
.notebook-sheet::after {
  content:""; position:absolute; z-index:-3; height:38%; left:8px; right:8px; bottom:-3px;
  border-radius:0 0 55% 20%; background:var(--paper-cast); filter:blur(10px);
  transform:rotate(-1deg) translateY(6px);
}
.notebook-sheet[data-paper="progress"]::after { transform:rotate(1deg) translateY(8px); left:16px; right:4px; }
.notebook-sheet-face {
  --paper-rule:#91b2c137;
  position:relative; height:100%; min-height:358px; box-sizing:border-box;
  padding:31px 27px 35px 57px; color:var(--paper-ink);
  border-radius:2px 3px 33% 1% / 2px 2px 1.5% 1%;
  background-color:var(--paper-sheet);
  background-image:var(--paper-grain),
    linear-gradient(90deg,transparent 37px,#dca2a580 37px 38px,transparent 38px 41px,#dca2a54f 41px 42px,transparent 42px),
    linear-gradient(180deg,var(--paper-sheet) 0 77px,transparent 77px),
    repeating-linear-gradient(180deg,transparent 0 31px,var(--paper-rule) 31px 32px),
    linear-gradient(112deg,#ffffff63,transparent 65%,#d5cbae17);
  box-shadow:inset 0 1px 0 #fff,inset 1px 0 0 #fff9,inset -1px 0 0 #8d83613b,inset 0 -1px 0 #9585645c,0 1px 2px var(--paper-contact);
}
.notebook-sheet-face::after {
  content:""; position:absolute; right:0; bottom:1px; width:42%; height:35px; pointer-events:none;
  background:radial-gradient(ellipse at 96% 103%,#fff 0%,#ffffff26 45%,transparent 73%); border-radius:0 0 70% 0 / 0 0 12% 0;
}
.notebook-holes { position:absolute; top:43px; bottom:38px; left:12px; width:13px; display:flex; flex-direction:column; justify-content:space-between; pointer-events:none; }
.notebook-holes i {
  display:block; width:11px; height:11px; border-radius:50%; background:var(--paper-desk);
  box-shadow:inset 0 1px 2px #56543b58,0 1px 0 #fff,inset 0 0 0 1px #c9c4b954;
}
.notebook-sheet h2 { font-size:19px; font-weight:720; letter-spacing:-.028em; color:var(--paper-ink); line-height:24px; margin:0 0 24px; }
.notebook-sheet .dashboard-panel-head { gap:8px; margin:0 0 24px; min-height:24px; }
.notebook-sheet .dashboard-panel-head h2 { margin:0; }
.notebook-sheet .text-button { color:#516d74; font-size:11px; text-decoration:underline; text-decoration-color:#65817d69; text-underline-offset:3px; }
.notebook-sheet .dashboard-material-row {
  min-height:64px; padding:10px 0; border:0; gap:12px; color:#394c54;
}
.notebook-sheet .dashboard-material-row > svg { color:#69807b; width:19px; filter:none; stroke-width:1.7; }
.notebook-sheet .dashboard-material-row strong { font-size:13px; line-height:19px; font-weight:650; }
.notebook-sheet .dashboard-material-row small { font-size:11px; line-height:16px; color:#7a827e; }
.notebook-sheet .dashboard-material-row > span { gap:3px; }
.notebook-sheet .dashboard-material-row:hover strong { color:#1d646b; text-decoration:underline; text-underline-offset:3px; }
.notebook-sheet progress { height:7px; border:0; background:#d2d7ca7d; border-radius:2px; box-shadow:inset 0 1px 1px #52604a18; }
.notebook-sheet progress::-webkit-progress-bar { background:#d2d7ca7d; border-radius:2px; }
.notebook-sheet progress::-webkit-progress-value { background:linear-gradient(180deg,#8ea899d9,#729486d9); border-radius:2px 3px 2px 1px; box-shadow:inset 0 1px 0 #fff3; }
.notebook-sheet progress::-moz-progress-bar { background:#809f91; border-radius:2px; }
.notebook-sheet .dashboard-empty { color:#73807d; font-size:13px; }

/* Faces occupy the complete control. These selectors also override the legacy compact
 * button padding; otherwise its cast-shadow layer would show as a rectangular frame. */
:is(.home-launchpad,.create-menu) .paper-sticky.paper-sticky { padding:0; gap:0; border:0; background:none; box-shadow:none; min-width:0; }
:is(.home-launchpad,.create-menu) .paper-sticky > .sticky-note-face { max-width:none; width:100%; color:var(--note-ink); }
.study-hub { container-type:inline-size; container-name:paper-study; }
.study-launchpad { gap:30px; padding:9px 5px 20px; }
.create-menu-grid { gap:23px; padding:9px 5px 18px; }
.create-menu .create-choice.paper-sticky { min-height:170px; --note-angle:-.45deg; }
.create-menu .create-choice.paper-sticky:nth-child(even) { --note-angle:.5deg; }
.create-menu .sticky-note-face { min-height:170px; padding:23px 19px 21px; gap:10px; }
.create-menu .sticky-note-face > strong { font-size:16px; }
.create-menu .sticky-note-face > small { font-size:12px; line-height:1.55; color:var(--note-ink); }
.paper-sticky:disabled { cursor:not-allowed; transform:none; }
.paper-sticky:disabled .sticky-note-face { filter:saturate(.4); opacity:.7; }
@media (hover:hover) {
  .paper-sticky:disabled:hover { transform:none; }
}
.home-dashboard .home-study-row .dashboard-panel { background:linear-gradient(135deg,var(--ui-panel-top),var(--ui-panel)); }
.folder-dashboard .notebook-sheet { min-height:360px; }
.folder-dashboard .notebook-sheet-face { padding-bottom:35px; }
.folder-dashboard .notebook-sheet .dashboard-progress { padding-top:3px; }
.folder-dashboard .notebook-sheet .dashboard-progress > div { min-height:28px; margin-bottom:10px; }
@container paper-study (max-width:540px) { .study-launchpad { grid-template-columns:minmax(0,1fr); } }
html.reduce-motion .paper-sticky { transform:none; }
html.reduce-motion .paper-sticky:hover { transform:none; }
@media (prefers-reduced-motion:reduce) { .paper-sticky, .paper-sticky:hover { transform:none; } }

@media (max-width:1250px) and (min-width:761px) {
  .home-dashboard .home-launchpad.compact { grid-template-columns:repeat(2,minmax(0,1fr)); gap:25px; }
  .home-dashboard .home-launchpad.compact .sticky-note-face { min-height:215px; }
}
@container paper-home (max-width: 840px) {
  .home-dashboard .home-launchpad.compact { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .home-dashboard .home-launchpad.compact .sticky-note-face { min-height:220px; padding:28px 27px 21px; }
  .home-dashboard .home-launchpad.compact .sticky-note-face > span { max-width:30ch; }
}
@container paper-home (max-width: 700px) {
  .home-dashboard > .dashboard-two-column:not(.home-study-row):not(.home-overview) { grid-template-columns:minmax(0,1fr); gap:32px; }
}
@container paper-home (max-width: 440px) {
  .home-dashboard .home-launchpad.compact { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding-inline:2px; }
  .home-dashboard .home-launchpad.compact .sticky-note-face { padding:16px 12px 12px; gap:9px; }
  .home-dashboard .home-launchpad.compact .sticky-note-face > strong { font-size:16px; }
  .home-dashboard .home-launchpad.compact .sticky-note-face > span { font-size:12px; line-height:1.4; }
}
@media (max-width:760px) {
  .home-dashboard { gap:23px; }
  .home-dashboard .home-launchpad,
  .home-dashboard .home-launchpad.compact { gap:24px; padding-inline:5px; }
  .home-dashboard .home-launchpad.compact .sticky-note-face { min-height:205px; }
  .notebook-sheet-face { padding:28px 20px 32px 48px; }
  .notebook-sheet .dashboard-panel-head { flex-wrap:wrap; }
}
@media (prefers-reduced-motion:reduce) {
  .paper-sticky,
  .paper-sticky::after { transition:none; }
}
html.reduce-motion .paper-sticky { transition:none; }
@media (forced-colors:active) {
  .panel, .surface-panel, .metric-card, .modal, .column-folder, .folder-child-card, .library-browser-column, .button, .games-tile { box-shadow:none; background-image:none; }
  .paper-sticky,
  .notebook-sheet { transform:none; outline:1px solid CanvasText; }
  .sticky-note-face,
  .notebook-sheet-face { background:Canvas; color:CanvasText; box-shadow:none; }
  .notebook-holes { display:none; }
  .paper-sticky::before, .paper-sticky::after, .notebook-sheet::before, .notebook-sheet::after { display:none; }
}
@media print {
  .paper-sticky,
  .notebook-sheet { transform:none; break-inside:avoid; }
  .paper-sticky::before, .paper-sticky::after, .notebook-sheet::before, .notebook-sheet::after { display:none; }
}

/* Action notes keep paper-note proportions, including two-choice dialogs. */
:is(.home-launchpad,.create-menu) .paper-sticky.paper-sticky { aspect-ratio:1; min-height:0; }
:is(.home-launchpad,.create-menu) .paper-sticky.paper-sticky > .sticky-note-face { min-height:0; aspect-ratio:1; flex:1; }

/* An opened folder exposes a paper edge behind its tilted front cover. Text and controls stay level. */
.column-folder.is-selected:not(.is-ghost) {
  isolation:isolate; outline:none; margin-top:12px;
  background:linear-gradient(to bottom,#ead6aa 0 6px,#fffdf4 6px 12px,#e6d1a2 12px);
  box-shadow:inset 0 1px 0 #fff9,0 3px 6px var(--paper-contact);
}
.column-folder.is-selected:not(.is-ghost)::after {
  content:""; position:absolute; pointer-events:none; z-index:0;
  inset:15px -1px -1px; border:1px solid var(--primary); border-radius:3px 5px 5px 5px;
  background:var(--paper-grain),linear-gradient(135deg,#fff2ce,#e8cf97);
  transform:perspective(650px) rotateX(-12deg); transform-origin:center bottom;
  box-shadow:inset 0 1px 0 #fff9,0 -2px 4px #67502a1a,0 3px 4px var(--paper-contact);
}
.column-folder.is-selected:not(.is-ghost) > * { position:relative; z-index:1; }
.column-folder.is-selected:not(.is-ghost) > .column-folder-select { padding-top:24px; }

/* Keep the two-across phone shortcuts readable without text escaping the paper. */
@container paper-home (max-width:440px) {
  .home-dashboard .home-launchpad.compact { gap:12px; padding-inline:2px; }
  .home-dashboard .home-launchpad.compact .paper-sticky.paper-sticky,
  .home-dashboard .home-launchpad.compact .paper-sticky.paper-sticky > .sticky-note-face { min-height:180px; aspect-ratio:auto; }
  .home-dashboard .home-launchpad.compact .sticky-note-face { padding:16px 12px 12px; gap:7px; }
  .home-dashboard .home-launchpad.compact .sticky-note-face > svg { flex-shrink:0; }
}
