@charset "UTF-8";

/* El suro de l'aula: suro, cartolina, xinxetes i un fil de llana.
   Verd bosc i terracota venen de l'aplicació; la lletra és l'Andika del kit en paper. */

@font-face {
  font-family: "Andika";
  src: url("fonts/andika-regular.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Andika";
  src: url("fonts/andika-bold.woff2") format("woff2");
  font-weight: 700;
  font-display: swap;
}

:root {
  --felt: #174b40;
  --felt-deep: #103a31;
  --trim: #b95c37;
  --cork: #bf8e5e;
  --cork-shade: #ffffff;
  --paper: #fbf7ee;
  --paper-yellow: #fff1b0;
  --paper-green: #e2eddb;
  --paper-buff: #f4e3c6;
  --ink: #1f2622;
  --ink-soft: #46504a;
  --green: #174b40;
  --terra: #8f3d1d;
  --pin: #c4603a;
  --thread: #8a2710;
  --rule: #cfc4ae;
  --marker: #f4d24f;
  --lines: #bfd3e3;
  --margin: #e3a194;
  --shadow: 0 1px 1px rgb(58 34 12 / .28), 0 12px 22px -12px rgb(58 34 12 / .6);
  --shadow-lift: 0 2px 3px rgb(58 34 12 / .25), 0 26px 34px -18px rgb(58 34 12 / .65);

  --font: "Andika", "Segoe UI", system-ui, sans-serif;
  --step-0: clamp(17px, .35vw + 15.6px, 19px);
  --step-1: clamp(20px, .5vw + 18px, 24px);
  --step-2: clamp(24px, 1vw + 20px, 32px);
  --step-3: clamp(30px, 2.4vw + 20px, 52px);
  --step-4: clamp(38px, 3.2vw + 14px, 66px);

  --gap: clamp(16px, 2.4vw, 34px);
  --void: clamp(72px, 9vw, 140px);
  --ease: cubic-bezier(.16, 1, .3, 1);
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --felt: #0f332b;
    --felt-deep: #0a251f;
    --cork: #6f5135;
    --cork-shade: #6b6b6b;
    --paper: #e9e2d2;
    --paper-yellow: #e9dc9f;
    --paper-green: #cfdbc7;
    --paper-buff: #e0cfb2;
    --rule: #b9ad95;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --felt: #0f332b; --felt-deep: #0a251f; --cork: #6f5135; --cork-shade: #6b6b6b; --paper: #e9e2d2; --paper-yellow: #e9dc9f;
  --paper-green: #cfdbc7; --paper-buff: #e0cfb2; --rule: #b9ad95; color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 24px; scrollbar-color: var(--trim) var(--felt-deep); }
body {
  margin: 0;
  background: var(--felt);
  color: var(--ink);
  font: 400 var(--step-0)/1.6 var(--font);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  caret-color: var(--terra);
}
::selection { background: var(--marker); color: var(--ink); }
img { display: block; max-width: 100%; height: auto; }
h1, h2, h3 { margin: 0; color: var(--green); font-weight: 700; line-height: 1.1; text-wrap: balance; }
p, ul, ol, dl, dd, figure { margin: 0; padding: 0; }
a { color: var(--green); text-underline-offset: .18em; text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--terra); outline-offset: 3px; border-radius: 4px; }

.skip { position: fixed; left: 12px; top: -80px; z-index: 50; background: var(--paper); padding: 12px 16px; border-radius: 6px; }
.skip:focus { top: 12px; }

/* Marc de feltre i suro */
.frame {
  padding: clamp(8px, 1.6vw, 24px);
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.2' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .5 -.18'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E"),
    var(--felt);
}
.board {
  position: relative;
  border: 6px solid var(--trim);
  border-radius: 6px;
  background: var(--cork-shade) url("img/suro.webp") 0 0 / 384px 384px repeat;
  background-blend-mode: multiply;
  overflow: hidden;
  overflow: clip;
  padding: clamp(16px, 2.2vw, 32px) clamp(16px, 4vw, 64px) var(--void);
}
/* Sanefa festonejada de cartolina */
.board::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  background:
    radial-gradient(circle at 50% 0, var(--trim) 8px, transparent 8.5px) top left / 18px 10px repeat-x,
    radial-gradient(circle at 50% 100%, var(--trim) 8px, transparent 8.5px) bottom left / 18px 10px repeat-x,
    radial-gradient(circle at 0 50%, var(--trim) 8px, transparent 8.5px) top left / 10px 18px repeat-y,
    radial-gradient(circle at 100% 50%, var(--trim) 8px, transparent 8.5px) top right / 10px 18px repeat-y;
}

/* Fil de llana */
.thread { position: absolute; left: 0; top: 0; z-index: 2; pointer-events: none; overflow: visible; }
.thread path { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.thread-shade { stroke: rgb(40 20 6 / .28); stroke-width: 4; transform: translate(2px, 4px); }
.thread-line { stroke: var(--thread); stroke-width: 3; }

/* Fulls i xinxetes */
.sheet {
  position: relative;
  z-index: 3;
  background: var(--paper);
  box-shadow: var(--shadow);
  transform: rotate(var(--r, 0deg));
  padding: clamp(22px, 2.6vw, 38px);
  border-radius: 2px;
}
.sheet.yellow { background: var(--paper-yellow); }
.sheet.green { background: var(--paper-green); }
.pin {
  position: absolute;
  z-index: 5;
  left: 50%;
  top: -9px;
  width: 22px;
  height: 22px;
  margin-left: -11px;
  border-radius: 50%;
  background: radial-gradient(circle at 34% 30%, #f1a17c 0 18%, var(--pin) 46%, #7c3216 100%);
  box-shadow: 2px 7px 6px rgb(0 0 0 / .42);
  transition: transform .45s var(--ease), box-shadow .45s var(--ease);
}
/* Xinxeta encara no clavada: més alta, ombra més llarga */
.js .pin[data-thread]:not(.in) { transform: translate(-2px, -6px) scale(1.12); box-shadow: 6px 16px 10px rgb(0 0 0 / .3); }

/* Botons i enllaços */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 12px 24px;
  background: var(--green); color: var(--paper);
  font: 700 var(--step-0)/1 var(--font); text-decoration: none;
  border-radius: 8px; box-shadow: 0 2px 0 var(--felt-deep);
  transition: transform .2s var(--ease), box-shadow .2s var(--ease);
}
.btn:hover { transform: translateY(-2px); box-shadow: 0 4px 0 var(--felt-deep); }
.btn:active { transform: translateY(1px); box-shadow: 0 1px 0 var(--felt-deep); }
.btn-small { min-height: 44px; padding: 10px 18px; font-size: 17px; }
.btn-line {
  min-height: 44px; padding: 9px 16px; cursor: pointer;
  font: 700 16px/1 var(--font); color: var(--green);
  background: transparent; border: 2px solid var(--green); border-radius: 8px;
  transition: background .2s, color .2s;
}
.btn-line:hover { background: var(--green); color: var(--paper); }
.link { font-weight: 700; color: var(--green); }
.small { font-size: 15px; color: var(--ink-soft); }

/* Tira de navegació */
.strip {
  position: relative; z-index: 4;
  display: flex; align-items: center; gap: clamp(14px, 2.4vw, 34px);
  max-width: 1240px; margin: 0 auto clamp(20px, 2.4vw, 34px);
  padding: 12px clamp(16px, 2.4vw, 30px);
  background: var(--paper);
  box-shadow: var(--shadow);
  transform: rotate(-.3deg);
}
.strip > .pin { left: 14px; margin-left: 0; top: 50%; margin-top: -11px; }
.strip > .pin-end { left: auto; right: 14px; }
.brand { display: flex; align-items: center; gap: 10px; margin-left: 22px; font-weight: 700; font-size: var(--step-1); color: var(--green); text-decoration: none; }
.brand img { border-radius: 9px; }
.nav { display: flex; gap: clamp(14px, 2vw, 28px); margin-left: auto; }
.nav a { color: var(--ink); text-decoration: none; font-weight: 700; padding: 10px 2px; background: linear-gradient(var(--trim), var(--trim)) 0 85% / 0 3px no-repeat; transition: background-size .3s var(--ease); }
.nav a:hover { background-size: 100% 3px; }
.tape {
  font-size: 14px; font-weight: 700; color: var(--ink);
  background: rgb(244 210 79 / .85); padding: 4px 12px; transform: rotate(2deg);
}
.strip .btn { margin-right: 26px; }

/* Obertura */
main { position: relative; max-width: 1240px; margin: 0 auto; }
.opening {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-areas:
    "h h h h h h h h p p p p"
    "s s s s t t t t m m m m";
  gap: var(--gap);
  align-items: start;
}
.hero { grid-area: h; padding: clamp(24px, 3vw, 44px) clamp(24px, 3.6vw, 52px); }
.hero h1 { font-size: var(--step-4); letter-spacing: -.02em; line-height: 1.02; }
.wave { position: relative; white-space: nowrap; color: var(--terra); }
.wave svg { position: absolute; left: 0; bottom: -.14em; width: 100%; height: .24em; overflow: visible; }
.wave path { fill: none; stroke: var(--trim); stroke-width: 4; stroke-linecap: round; }
.hero .lead { font-size: clamp(18px, .4vw + 15px, 21px); line-height: 1.5; margin-top: clamp(16px, 2vw, 24px); max-width: 32em; color: var(--ink-soft); }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 26px; margin-top: clamp(18px, 2.4vw, 28px); }
.poster { grid-area: p; justify-self: end; width: 86%; padding: 10px 10px 34px; margin-top: 10px; }
.poster img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.skills { grid-area: s; margin-top: 6px; }
.skills h2, .teaser h2, .mailcard h2 { font-size: var(--step-2); }
.skills dl { margin-top: 14px; display: grid; gap: 8px; }
.skills dl div { display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px dashed var(--rule); padding-bottom: 6px; }
.skills dt { font-weight: 700; }
.skills dd { color: var(--ink-soft); text-align: right; }
.teaser { grid-area: t; margin-top: 8px; }
.teaser .small { margin: 8px 0 14px; }
.mailcard { grid-area: m; background: var(--paper-buff); margin-top: 0; }
.mail-small { display: inline-block; margin-top: 12px; font-size: var(--step-1); font-weight: 700; color: var(--terra); overflow-wrap: anywhere; }

/* Seccions: buits decidits de suro entre una i altra */
.method, .demo, .kit, .school, .status, .contact { margin-top: var(--void); }
.banner { max-width: 760px; }
.banner h2 { font-size: var(--step-3); letter-spacing: -.015em; }
.banner p { margin-top: 14px; color: var(--ink-soft); font-size: var(--step-1); line-height: 1.5; max-width: 36em; }

/* Parades del mètode */
.stations { list-style: none; display: grid; align-items: start; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--gap); margin-top: clamp(40px, 5vw, 70px); }
.station h3 { font-size: var(--step-2); margin-bottom: 10px; }
.station p { color: var(--ink-soft); }
.station .small { margin-top: 10px; }
.station:nth-child(1) { grid-column: 1 / span 5; }
.station:nth-child(2) { grid-column: 7 / span 5; margin-top: 90px; }
.station:nth-child(3) { grid-column: 2 / span 5; margin-top: -10px; }
.station:nth-child(4) { grid-column: 8 / span 5; margin-top: 80px; }
.finish { width: fit-content; margin: clamp(40px, 5vw, 60px) auto 0; padding: 20px 34px; font-size: var(--step-2); background: var(--paper-yellow); }
.finish strong { color: var(--green); }

/* Demostració */
.demo { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--gap); align-items: start; }
.demo .banner { grid-column: 1 / -1; }
.lined {
  grid-column: 1 / span 7; margin-top: 20px;
  --lh: 38px;
  padding: 34px clamp(22px, 3vw, 44px) 38px clamp(54px, 6vw, 84px);
  background:
    linear-gradient(90deg, transparent calc(clamp(54px, 6vw, 84px) - 16px), var(--margin) 0 calc(clamp(54px, 6vw, 84px) - 14px), transparent 0),
    repeating-linear-gradient(to bottom, transparent 0 calc(var(--lh) - 1px), var(--lines) calc(var(--lh) - 1px) var(--lh)) 0 25px,
    var(--paper);
}
.lined h3 { font-size: var(--step-2); line-height: var(--lh); margin-bottom: var(--lh); }
.lined p { font-size: 20px; line-height: var(--lh); margin-bottom: var(--lh); max-width: 34em; }
.lined p:last-child { margin-bottom: 0; }
mark.evidence {
  color: inherit;
  background: linear-gradient(transparent 52%, var(--marker) 52% 90%, transparent 90%) 0 0 / 0 100% no-repeat;
  transition: background-size 1.1s var(--ease);
}
mark.evidence.lit { background-size: 100% 100%; }
.question { grid-column: 8 / -1; margin-top: 60px; }
fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
legend { padding: 0; font-size: var(--step-1); font-weight: 700; line-height: 1.35; color: var(--green); margin-bottom: 18px; }
.options { display: grid; gap: 10px; }
.option {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 52px;
  padding: 10px 14px; text-align: left; cursor: pointer;
  font: 400 17px/1.4 var(--font); color: var(--ink);
  background: #fff; border: 2px solid var(--rule); border-radius: 8px;
  transition: border-color .2s, transform .25s var(--ease), opacity .3s;
}
.option:hover:not(:disabled) { border-color: var(--green); transform: translateX(3px); }
.option:disabled { cursor: default; }
.letter {
  flex: 0 0 30px; height: 30px; display: grid; place-items: center;
  font-weight: 700; font-size: 15px; color: var(--paper); background: var(--green); border-radius: 6px;
}
.option.wrong { opacity: .6; border-style: dashed; border-color: var(--terra); }
.option.wrong .letter { background: var(--terra); }
.option.right { border-color: var(--green); background: var(--paper-green); }
.option.shake { animation: shake .38s; }
@keyframes shake { 30% { transform: translateX(-5px); } 70% { transform: translateX(5px); } }
.feedback:empty { display: none; }
.feedback { margin-top: 16px; padding: 14px 16px; background: var(--paper-yellow); font-size: 17px; line-height: 1.5; transform: rotate(-.6deg); box-shadow: 0 6px 12px -8px rgb(58 34 12 / .5); }
.feedback strong { display: block; color: var(--green); }
.row-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }

/* Què inclou */
.kit { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--gap); align-items: start; }
.kit .banner { grid-column: 1 / -1; }
.inventory { grid-column: 1 / span 7; grid-row: 2 / span 2; margin-top: 16px; }
.inventory ul { list-style: none; }
.inventory li { padding: 18px 0; border-bottom: 1px dashed var(--rule); }
.inventory li:first-child { padding-top: 0; }
.inventory li:last-child { border-bottom: 0; padding-bottom: 0; }
.inventory h3 { font-size: var(--step-1); margin-bottom: 6px; }
.inventory p { color: var(--ink-soft); }
.tag { display: inline-block; vertical-align: middle; margin-left: 8px; padding: 2px 10px; font-size: 14px; color: var(--ink); background: var(--marker); transform: rotate(-2deg); }
.photo { grid-column: 9 / -1; padding: 10px 10px 16px; background: #fff; margin-top: 40px; }
.photo figcaption { margin-top: 10px; text-align: center; font-size: 16px; color: var(--ink-soft); }
.facts { grid-column: 8 / span 4; margin-top: 10px; }
.facts table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.facts caption { text-align: left; font-weight: 700; color: var(--green); font-size: var(--step-1); margin-bottom: 10px; }
.facts th, .facts td { padding: 6px 0; border-bottom: 1px dashed var(--rule); text-align: left; font-weight: 400; }
.facts td { text-align: right; font-weight: 700; }
.facts thead th { font-size: 15px; color: var(--ink-soft); }
.facts thead th:last-child { text-align: right; }
.facts tfoot th, .facts tfoot td { border-bottom: 0; border-top: 2px solid var(--green); font-weight: 700; color: var(--green); }

/* Nota a l'equip directiu */
.circular { max-width: 760px; margin: 0 auto; padding: clamp(28px, 4vw, 56px); }
.letterhead { display: flex; align-items: center; gap: 10px; font-size: 15px; color: var(--ink-soft); border-bottom: 2px solid var(--green); padding-bottom: 12px; margin-bottom: 24px; }
.letterhead img { border-radius: 7px; }
.circular h2 { font-size: var(--step-3); margin-bottom: 20px; }
.circular p + p { margin-top: 14px; }
.circular strong { color: var(--green); }
.sign { margin-top: 26px; text-align: right; font-style: italic; color: var(--ink-soft); }

/* Estat */
.status .banner { max-width: 640px; }
.stops { list-style: none; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--gap); align-items: start; margin-top: clamp(36px, 4vw, 56px); }
.stop h3 { font-size: var(--step-2); margin: 0 0 8px; }
.stop p { color: var(--ink-soft); }
.stop-done { grid-column: 1 / span 3; margin-top: 70px; }
.stop-now { grid-column: 4 / span 5; padding: clamp(28px, 3.4vw, 48px); }
.stop-now h3 { font-size: var(--step-3); margin-bottom: 14px; }
.stop-now p { font-size: var(--step-1); line-height: 1.5; }
/* Encara no clavat: només l'aguanta un tros de cinta */
.stop-later { grid-column: 10 / span 3; margin-top: 150px; }
.tape-top { position: absolute; left: 50%; top: -12px; width: 96px; height: 26px; margin-left: -48px; background: rgb(244 210 79 / .82); transform: rotate(-5deg); box-shadow: 0 1px 2px rgb(0 0 0 / .15); }
.pinned-note { width: fit-content; max-width: 40em; margin: clamp(30px, 4vw, 48px) 0 0 auto; padding: 16px 22px; font-size: 17px; background: var(--paper-yellow); }

/* Contacte */
.envelope {
  max-width: 900px; margin: 0 auto; padding: clamp(96px, 11vw, 150px) clamp(24px, 5vw, 70px) clamp(36px, 5vw, 70px);
  background: var(--paper-buff);
}
.envelope::before {
  content: ""; position: absolute; inset: 0 0 auto; height: clamp(76px, 9vw, 124px);
  background: linear-gradient(to bottom right, transparent 49.6%, rgb(120 80 40 / .14) 50%) left / 50% 100% no-repeat,
              linear-gradient(to bottom left, transparent 49.6%, rgb(120 80 40 / .14) 50%) right / 50% 100% no-repeat;
  pointer-events: none;
}
.envelope h2 { position: relative; font-size: var(--step-3); max-width: 14em; }
.envelope p { position: relative; margin-top: 16px; font-size: var(--step-1); line-height: 1.5; color: var(--ink-soft); max-width: 32em; }
.mail { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin-top: 30px; }
.mail-link { font-size: clamp(26px, 3.6vw, 46px); font-weight: 700; color: var(--terra); overflow-wrap: anywhere; text-decoration-thickness: 3px; }

/* Peu sobre el feltre */
.foot { background: var(--felt); display: flex; flex-wrap: wrap; align-items: center; gap: 8px 28px; padding: 22px 8px 6px; color: #e8efe6; font-size: 15px; }
.foot .brand { margin: 0; font-size: 17px; color: #fff; }
.foot p:last-child { margin-left: auto; }

/* Interaccions dels fulls amb enllaços */
.teaser, .mailcard, .poster { transition: transform .35s var(--ease), box-shadow .35s var(--ease); }
.teaser:hover, .mailcard:hover, .poster:hover { transform: rotate(0deg) translateY(-3px); box-shadow: var(--shadow-lift); }

/* Tauleta */
@media (max-width: 1080px) {
  .nav { display: none; }
  .tape { margin-left: auto; }
  .opening { grid-template-columns: repeat(6, minmax(0, 1fr)); grid-template-areas: "h h h h h h" "p p p t t t" "p p p m m m" "s s s s s s"; }
  .poster { margin: 0; }
  .stop-done { grid-column: 1 / span 4; }
  .stop-now { grid-column: 5 / span 8; }
  .stop-later { grid-column: 3 / span 6; margin-top: 30px; }
  .teaser { margin-top: 0; }
  .stations .station:nth-child(n) { grid-column: span 6; margin-top: 0; }
  .stations .station:nth-child(even) { margin-top: 40px; }
  .lined, .question { grid-column: 1 / -1; margin-top: 10px; }
  .inventory { grid-column: 1 / -1; grid-row: auto; }
  .photo { grid-column: 1 / span 6; margin-top: 10px; }
  .facts { grid-column: 7 / -1; }
}

/* Mòbil */
@media (max-width: 680px) {
  .board { border-width: 4px; padding-inline: 14px; }
  .strip { gap: 10px; margin-bottom: 30px; padding: 10px 12px; }
  .strip > .pin { display: none; }
  .brand { margin-left: 0; font-size: 19px; }
  .brand img { width: 34px; height: 34px; }
  .tape { display: none; }
  .strip .btn { margin: 0 0 0 auto; }
  .sheet { --r: 0deg; }
  .opening, .demo, .kit { grid-template-columns: minmax(0, 1fr); grid-template-areas: none; }
  .opening > *, .demo > *, .kit > * { grid-column: 1 / -1 !important; grid-area: auto !important; grid-row: auto !important; margin-top: 8px; }
  .opening .sheet:nth-child(even), .stations .station:nth-child(even), .stop:nth-child(even) { transform: rotate(.7deg); }
  .opening .sheet:nth-child(odd), .stations .station:nth-child(odd), .stop:nth-child(odd) { transform: rotate(-.7deg); }
  .poster { width: auto; max-width: 420px; justify-self: start; }
  .stations { grid-template-columns: minmax(0, 1fr); }
  .stations .station:nth-child(n) { grid-column: 1 / -1; margin-top: 0; }
  .stops { grid-template-columns: minmax(0, 1fr); }
  .stops .stop:nth-child(n) { grid-column: 1 / -1; margin-top: 8px; }
  .lined { --lh: 34px; padding-left: 42px; background:
    linear-gradient(90deg, transparent 26px, var(--margin) 0 28px, transparent 0),
    repeating-linear-gradient(to bottom, transparent 0 33px, var(--lines) 33px 34px) 0 23px,
    var(--paper); }
  .lined p { font-size: 18px; }
  .foot p:last-child { margin-left: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation: none !important; }
  .js .pin[data-thread]:not(.in) { transform: none; box-shadow: 2px 7px 6px rgb(0 0 0 / .42); }
}
@media print {
  .frame, .board { background: #fff; padding: 0; border: 0; box-shadow: none; }
  .thread, .pin, .strip .btn, .row-actions { display: none; }
  .sheet { transform: none; box-shadow: none; border: 1px solid #ccc; }
}