/* RATTLE's shared desk identity. The legacy data and component contracts stay intact. */
.rattle-workspace {--electric:var(--lime);--glow:#d9c9ff22;background:radial-gradient(ellipse at 80% 0,#a782e00d,transparent 600px),var(--paper)}
[data-theme="dark"] .rattle-workspace {background:radial-gradient(ellipse at 80% 0,#a782e016,transparent 600px),var(--paper)}
.rattle-workspace .app-shell {display:block}
.rattle-workspace main {margin:0;width:100%;min-width:0}
.rattle-workspace .desk-header {position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:36px;min-height:84px;padding:16px max(28px,calc((100vw - 1320px)/2));background:var(--paper);border-bottom:1px solid var(--line)}
.desk-header .brand {display:inline-flex;align-items:center;gap:11px;font-size:27px;font-weight:800;letter-spacing:-1.2px;flex-shrink:0;margin:0;color:var(--ink);text-decoration:none}
.desk-header .brand-mark {display:inline-block;font-size:0;background:var(--accent-ink);color:var(--accent-ink);width:24px;height:24px;border-radius:0;box-shadow:none;clip-path:polygon(50% 0,63% 37%,100% 50%,63% 63%,50% 100%,37% 63%,0 50%,37% 37%)}
.desk-menu {display:flex;align-items:center;justify-content:space-between;flex:1;gap:24px;min-width:0}
.desk-menu nav,.desk-account {display:flex;align-items:center;gap:6px}
.desk-header :is(.rail-link,.desk-home) {display:flex;align-items:center;justify-content:center;min-height:44px;padding:10px 12px;border-radius:99px;font-size:14px;font-weight:500;text-decoration:none;white-space:nowrap;color:var(--muted);transition:background 140ms ease,color 140ms ease;transform:none;box-shadow:none}
.desk-header .rail-link.active {background:var(--soft-lime);color:var(--accent-ink);font-weight:700;box-shadow:none}
.desk-header .rail-link::before,.desk-header .rail-link::after,.page-section+.page-section::before {display:none;content:none}
.desk-header .quiet-button {padding:10px 14px;font-size:13px;border-radius:99px;background:var(--soft-lime);color:var(--ink);border:0;white-space:nowrap}
.desk-header .profile {display:flex;align-items:center;gap:8px;margin:0;padding:7px 10px;min-height:44px;max-width:185px;background:var(--card);border:1px solid var(--line);border-radius:99px;color:var(--ink)}
.desk-header .profile span {background:var(--soft-lime);color:var(--accent-ink);flex-shrink:0;width:28px;height:28px;border-radius:50%}
.desk-header .profile b {font-size:13px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100px}
.desk-header .profile i {margin:0;color:var(--muted)}
.rattle-workspace #mobile-menu-button {display:none}
.rattle-workspace .location-bar {top:84px;z-index:20;padding:10px max(32px,calc((100vw - 1240px)/2));min-height:64px;background:var(--paper);font-size:13px}
.location-bar>span {display:flex;align-items:center;flex-wrap:wrap;gap:6px}
.location-bar b {margin:0}
.location-bar nav {display:flex;gap:8px;align-items:center}
.location-bar nav :is(a,button) {display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:9px 14px;border:0;border-radius:99px;background:var(--soft-lime);color:var(--ink);font-size:13px;font-weight:600;text-decoration:none}
.location-bar nav button {background:var(--lime);color:#211a2c}
.rattle-workspace .page-top {width:min(1240px,calc(100% - 64px));margin:0 auto;padding-top:32px}
.rattle-workspace :is(.page-section,#charts,#calendar) {scroll-margin-top:168px}
.rattle-workspace .topbar h1 {font-size:28px;font-weight:500;letter-spacing:-1px}
.rattle-workspace .topbar {padding-bottom:24px;border-bottom:1px solid var(--line)}
.rattle-workspace .chain-status i {box-shadow:none;background:var(--accent-ink)}
.rattle-workspace .chain-status {display:flex;align-items:center;gap:14px}
.rattle-workspace .chain-status b {font-weight:400;color:var(--muted)}
.rattle-workspace .desk-hero {gap:64px;grid-template-columns:1.15fr 1fr;margin:32px 0;min-height:400px;padding-bottom:32px}
.rattle-workspace .hero-copy h2 {font-size:clamp(42px,4.6vw,68px);font-weight:500;letter-spacing:-.055em;line-height:1.06;margin:20px 0}
.rattle-workspace .hero-copy h2 em {letter-spacing:inherit;color:var(--accent-ink)}
.rattle-workspace .hero-copy>p:not(.eyebrow) {max-width:48ch;font-size:16px;line-height:1.7}
.rattle-workspace .hero-visual {border-radius:24px;min-height:400px;background:#17131e}
.rattle-workspace .hero-visual::after {background:linear-gradient(transparent,#08080bf2)}
.rattle-workspace :is(.action-button,.topbar .action-button,.proof-card .action-button) {background:var(--lime);color:#211a2c;border:0;border-radius:99px;padding:13px 20px;min-height:46px;font-size:14px;font-weight:600;text-decoration:none;box-shadow:none}
.rattle-workspace .action-button span {color:inherit}
.rattle-workspace .top-actions .quiet-button {background:var(--soft-lime);color:var(--ink);padding:10px 16px;border-radius:99px;font-size:13px}
.rattle-workspace .quiet-button span {font-size:13px}
.rattle-workspace .quiet-button span::after {content:none}
.rattle-workspace :is(.text-action,.secondary-action,#full-chart-link,.source-link) {display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 16px;border:0;border-radius:99px;background:var(--soft-lime);color:var(--accent-ink);font-size:14px;font-weight:600;line-height:1.5;text-decoration:none;width:fit-content;max-width:100%}
.rattle-workspace :is(.coach-card .text-action,.proof-card .text-action) {color:var(--accent-ink)}
.rattle-workspace .hero-actions {gap:12px;flex-wrap:wrap}
.rattle-workspace .hero-actions a {font-size:14px}
.rattle-workspace :is(.practice-path,.balance-card,.coach-card,.journal-card,.calendar-panel,.equity-card,.watchdesk,.trader-glossary,.perspective-card) {background:var(--card);border:1px solid var(--line);border-radius:20px}
.rattle-workspace .practice-path {padding:28px}
.rattle-workspace .path-steps {gap:28px}
.rattle-workspace .path-steps li {display:block}
.rattle-workspace .path-steps .complete h4::after {content:'Saved';display:inline-block;margin-left:8px;color:var(--muted);font-size:12px;font-weight:400}
.rattle-workspace .path-steps .text-action {font-size:13px;margin-top:12px;padding:8px 12px}
.rattle-workspace .traction-grid {gap:20px}
.rattle-workspace .traction-grid>article {background:var(--card)!important;border:1px solid var(--line);border-radius:20px;padding:24px;display:flex;flex-direction:column;align-items:flex-start}
.rattle-workspace .traction-grid>article :is(.text-action,.action-button) {margin-top:auto}
.rattle-workspace .traction-grid>article>p:last-of-type {margin-bottom:24px}
.rattle-workspace :is(.coach-card h2,.traction-grid h2) {font-weight:500}
.rattle-workspace .section-heading h2 {font-size:clamp(30px,3.6vw,46px);font-weight:500;letter-spacing:-.045em;line-height:1.12}
.rattle-workspace .page-section+.page-section {padding-top:56px}
.rattle-workspace :is(.kicker,.card-label,.eyebrow) {letter-spacing:1.1px;color:var(--muted)}
.rattle-workspace .market-photo {border-radius:20px;background:#17131e}
.rattle-workspace .market-photo figcaption {background:#17131ef2}
.rattle-workspace .market-photo figcaption span {color:#d0cbd8}
.rattle-workspace .watch-chip {border-radius:12px;border-color:var(--line);background:var(--paper)}
.rattle-workspace .watch-chip button {background:var(--paper);color:var(--ink)}
.rattle-workspace .watch-chip.active button {background:var(--soft-lime);color:var(--accent-ink)}
.rattle-workspace .research-photo {border-radius:18px;background:#17131e}
.rattle-workspace .research-photo::after {background:linear-gradient(transparent,#08080baa)}
.rattle-workspace .photo-code {background:#17131e;color:#faf9fc;border-radius:99px;padding:5px 12px}
.rattle-workspace .research-copy h3 {font-weight:500;font-size:29px}
.rattle-workspace .pulse-card {background:var(--card);border:1px solid var(--line);border-radius:18px;padding:24px}
.rattle-workspace .pulse-card strong {font-size:24px}
.rattle-workspace .metric-grid {gap:16px;border:0}
.rattle-workspace .metric-grid article {padding:24px;background:var(--card);border:1px solid var(--line);border-radius:18px}
.rattle-workspace .chart-fill {fill:var(--soft-lime)}
.rattle-workspace .chart-line {stroke:var(--accent-ink)}
.rattle-workspace :is(.curve-periods,.segmented) {padding:4px;border:0;border-radius:99px;background:var(--soft-lime);gap:3px}
.rattle-workspace :is(.curve-period,.period-button) {background:var(--soft-lime);color:var(--muted);border-radius:99px;min-height:40px}
.rattle-workspace :is(.curve-period.active,.period-button.active) {background:var(--lime);color:#211a2c}
.rattle-workspace :is(.calendar-controls button,.news-filters button) {background:var(--soft-lime);color:var(--ink);border:0;border-radius:99px}
.rattle-workspace .news-filters button.active {background:var(--lime);color:#211a2c}
.rattle-workspace .calendar-day {border-radius:10px}
.rattle-workspace .trade-row {grid-template-columns:minmax(0,1fr) auto 64px}
.rattle-workspace .trade-entry summary {padding-right:62px}
.rattle-workspace .trade-entry summary::after {content:'Details';font-size:12px;color:var(--muted)}
.rattle-workspace .trade-entry[open] summary::after {content:'Hide'}
.rattle-workspace .trade-row .grade {font-size:12px;background:none;color:var(--muted)}
.rattle-workspace .calendar-day.selected {outline:2px solid var(--accent-ink)}
.rattle-workspace .news-grid article {background:var(--card);border:1px solid var(--line);border-radius:20px;padding:24px}
.rattle-workspace .news-grid article:hover {padding:24px}
.rattle-workspace .news-grid h3 {font-size:21px;line-height:1.4;font-weight:500}
.rattle-workspace .source-link {margin-top:auto;font-size:13px}
.rattle-workspace .news-category {color:var(--accent-ink)}
.rattle-workspace :is(.impact-toggle input,input) {accent-color:var(--accent-ink)}
.rattle-workspace .perspective-card {gap:32px}
.rattle-workspace .legal-page {padding:64px 0;max-width:780px;min-height:75vh}
.rattle-workspace .legal-page h1 {font-size:clamp(38px,5vw,62px);font-weight:500;letter-spacing:-.055em}
.rattle-workspace .legal-page p {font-size:16px;line-height:1.85;margin:24px 0}
.rattle-workspace .product-footer {margin:0;padding:24px max(32px,calc((100vw - 1240px)/2));width:100%;background:var(--paper);border-top:1px solid var(--line);font-size:12px}
.rattle-workspace .product-footer a {display:inline-flex;align-items:center;min-height:44px}
.rattle-workspace dialog {background:var(--card);color:var(--ink);border:1px solid var(--control);border-radius:24px}
.rattle-workspace dialog .close {display:grid;place-items:center;background:var(--soft-lime);color:var(--ink);border:0;border-radius:50%;width:44px;height:44px;flex-shrink:0}
.rattle-workspace :is(input,select,textarea) {border-radius:10px}
.rattle-workspace :is(.research-dialog-inner ul,.legal-page ul) {padding-left:22px;list-style:disc}
.rattle-workspace :is(.research-dialog-inner li,.legal-page li)+li {margin-top:12px}
.rattle-workspace .share-card {background:#241b32;color:#faf9fc;border:1px solid #84738f;border-radius:18px}
.rattle-workspace .share-card>p {color:#d0cbd8}
.rattle-workspace #file-notice {background:#d9c9ff;color:#211a2c}
.rattle-workspace #toast {z-index:50;background:var(--card);color:var(--ink);border:1px solid var(--control);border-radius:14px}
/* Controls respond to the pointer; navigation rows and numbers stay still. */
.rattle-workspace :is(.action-button,.text-action,.secondary-action,.quiet-button,#full-chart-link,.source-link,.calendar-controls button,.news-filters button,.curve-period,.period-button,.watch-chip button,dialog .close) {
  transition:transform 170ms var(--ease-out),box-shadow 170ms var(--ease-out),background 170ms ease,color 170ms ease;
  will-change:transform;
}
@media(hover:hover) and (pointer:fine) {
  .rattle-workspace :is(.action-button,.topbar .action-button,.proof-card .action-button):hover {
    background:#e7ddff;transform:translateY(-2px);
    box-shadow:0 8px 22px -8px rgba(217,201,255,.62),0 2px 6px -3px rgba(0,0,0,.4);
  }
  .rattle-workspace :is(.text-action,.secondary-action,#full-chart-link,.source-link,.desk-home,.rail-link):hover {background:var(--soft-lime);color:var(--ink)}
  .rattle-workspace :is(.text-action,.secondary-action,#full-chart-link,.source-link):hover {transform:translateY(-1px)}
  .rattle-workspace :is(.calendar-controls button,.news-filters button,.curve-period,.period-button,.watch-chip button):hover {transform:translateY(-1px);background:var(--soft-lime)}
  .rattle-workspace dialog .close:hover {transform:rotate(90deg);background:var(--lime);color:#211a2c}
  .rattle-workspace .quiet-button:hover {transform:translateY(-1px);background:var(--lime);color:#211a2c}
}
/* The press is the important part: it must feel immediate, so it is quicker. */
.rattle-workspace :is(.action-button,.text-action,.secondary-action,.quiet-button,#full-chart-link,.source-link,.calendar-controls button,.news-filters button,.curve-period,.period-button,.watch-chip button):active {
  transform:translateY(0) scale(.96);
  transition-duration:80ms;
  box-shadow:none;
}
.rattle-workspace .calendar-day {transition:transform 150ms var(--ease-out),outline-color 150ms ease}
.rattle-workspace .calendar-day:active {transform:scale(.97);transition-duration:70ms}
@media(prefers-reduced-motion:reduce) {
  .rattle-workspace *,.rattle-workspace *::before,.rattle-workspace *::after {transform:none!important}
}
@media(max-width:1250px) and (min-width:1101px) {
  .rattle-workspace .desk-header {gap:20px;padding:16px 24px}
  .desk-menu {gap:12px}.desk-header :is(.rail-link,.desk-home) {padding:10px}
  .desk-header .profile b {max-width:65px}
}
@media(max-width:1100px) {
  .rattle-workspace .desk-header {justify-content:space-between;min-height:80px;padding:16px 28px}
  .rattle-workspace #mobile-menu-button {display:grid;place-items:center;min-width:64px;min-height:44px;padding:10px 14px;background:var(--soft-lime);color:var(--ink);border:0;border-radius:99px;font-size:14px}
  .desk-menu {position:absolute;right:28px;top:calc(100% + 8px);display:block;width:min(360px,calc(100vw - 40px));max-height:calc(100dvh - 110px);overflow:auto;padding:12px;border:1px solid var(--control);border-radius:22px;background:var(--card);box-shadow:0 24px 60px #0005;transform-origin:top right}
  .desk-menu nav {display:flex;flex-direction:column;align-items:stretch;gap:4px}
  .desk-header :is(.rail-link,.desk-home) {justify-content:flex-start;padding:12px 16px;min-height:48px}
  .desk-account {justify-content:space-between;border-top:1px solid var(--line);margin-top:12px;padding-top:12px}
  .desk-menu:not([hidden]) {animation:desk-menu-enter 180ms var(--ease-out)}
  .rattle-workspace .location-bar {top:80px}
  .rattle-workspace .desk-hero {gap:32px}
}
@media(max-width:850px) {
  .rattle-workspace .desk-hero {grid-template-columns:1fr}
  .rattle-workspace .hero-copy {padding:0}
  .rattle-workspace .hero-copy h2 {max-width:none;font-size:56px}
  .rattle-workspace .hero-visual {grid-row:auto;min-height:280px;max-height:320px}
  .rattle-workspace .traction-grid {grid-template-columns:1fr}
}
@media(max-width:610px) {
  .rattle-workspace .desk-header {min-height:76px;padding:14px 20px}
  .desk-header .brand {font-size:24px}
  .desk-menu {right:20px}
  .rattle-workspace .location-bar {top:76px;padding:8px 20px;gap:8px;align-items:flex-start;flex-direction:column}
  .rattle-workspace .location-bar>span {font-size:12px}
  .rattle-workspace .location-bar b {display:inline;margin:0}
  .location-bar nav {width:100%;gap:6px}
  .location-bar nav :is(a,button) {font-size:12px;padding:8px 12px;min-height:40px;flex:1}
  .rattle-workspace .page-top {width:calc(100% - 40px);padding-top:24px}
  .rattle-workspace .chain-status {gap:5px}
  .rattle-workspace .chain-status b::before {content:none}
  .rattle-workspace .chain-status b {font-size:11px;letter-spacing:0}
  .rattle-workspace :is(.page-section,#charts,#calendar) {scroll-margin-top:186px}
  .rattle-workspace .topbar h1 {font-size:24px;letter-spacing:-.6px}
  .rattle-workspace .top-actions .quiet-button span {display:inline;font-size:13px}
  .rattle-workspace .top-actions .quiet-button::after {content:none}
  /* Opening the desk should show the desk. The marketing hero repeats the home
     page to someone who has just clicked through it, so on phones it collapses
     to a heading and its actions and the photo and pitch are dropped. */
  .rattle-workspace .desk-hero {margin:14px 0 0;min-height:0;padding-bottom:18px;gap:0}
  .rattle-workspace .desk-hero .hero-visual {display:none}
  .rattle-workspace .hero-copy > p:not(.eyebrow):not(.hero-footnote) {display:none}
  .rattle-workspace .hero-copy h2 {font-size:clamp(30px,8.4vw,40px);margin:10px 0 16px}
  .rattle-workspace .hero-copy {padding:0}
  .rattle-workspace .hero-actions {align-items:stretch;gap:10px;margin:0 0 12px}
  .rattle-workspace .practice-path {padding:22px}
  .rattle-workspace .path-heading {align-items:flex-start;flex-direction:column;gap:6px}
  .rattle-workspace .path-steps {grid-template-columns:1fr;gap:24px}
  .rattle-workspace .section-heading {flex-wrap:wrap}
  .rattle-workspace .section-heading h2 {font-size:34px}
  .rattle-workspace .section-heading>.action-button {margin-top:0}
  .rattle-workspace .market-photo {height:240px}
  .rattle-workspace .market-photo figcaption {flex-direction:column;gap:5px;padding:14px 16px}
  .rattle-workspace .journal-card {padding:18px}
  .rattle-workspace .calendar-panel {padding:14px}
  .rattle-workspace .calendar-day {border-radius:6px;min-height:76px}
  .rattle-workspace .calendar-day small {font-size:10px}
  .rattle-workspace .trade-row {grid-template-columns:minmax(0,1fr) auto;row-gap:5px}
  .rattle-workspace .trade-row .grade {grid-column:1;padding:0;text-align:left}
  .rattle-workspace .metric-grid {gap:12px}
  .rattle-workspace .metric-grid article {padding:18px 14px}
  .rattle-workspace .metric-grid strong {font-size:25px}
  .rattle-workspace .curve-periods {width:100%;justify-content:space-between}
  .rattle-workspace .curve-period {font-size:12px;padding:8px 10px}
  .rattle-workspace .perspective-card {grid-template-columns:1fr;gap:10px}
  .rattle-workspace .legal-page {padding:32px 0}
  .rattle-workspace .product-footer {padding:20px;flex-direction:column;align-items:flex-start;gap:6px}
}
@keyframes desk-menu-enter {from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce) {.rattle-workspace *{animation:none!important;transition:none!important}}
html[data-input="keyboard"] .desk-menu {animation:none!important}
