/* A sheet on a desk, independent from the portfolio layout. */
body.nuance-page { margin:0; color:#35312e; background:#efe5d7; font-family:"Inter Variable",system-ui,sans-serif; font-size:16px; line-height:1.65; color-scheme:light; }
.nuance-page * { box-sizing:border-box; }
.nuance-page [hidden] { display:none !important; }
.nuance-page a { color:#625248; text-decoration-thickness:1px; text-underline-offset:4px; }
.nuance-desk { max-width:1050px; margin:auto; padding:0 24px 64px; }
.nuance-top { display:flex; justify-content:space-between; gap:20px; align-items:center; padding:24px 0; font-size:.82rem; }
.nuance-page button { font:inherit; cursor:pointer; color:inherit; background:transparent; border:1px solid #9f9488; border-radius:2px; padding:10px 16px; min-height:44px; transition:transform 130ms ease, background 130ms ease; }
.nuance-page button:hover:not(:disabled) { background:#eee6d8; }
.nuance-page button:active:not(:disabled) { transform:translateY(2px); }
.nuance-page button:disabled { opacity:.5; cursor:default; }
.nuance-page :is(button,a,input,textarea,summary):focus-visible { outline:3px solid #79644f; outline-offset:4px; }
#nuance-language { white-space:nowrap; }
#nuance-language button { border:0; padding:8px 3px; font-size:.82rem; }
#nuance-language button[aria-pressed=true] { text-decoration:underline; text-underline-offset:5px; }
.nuance-sheet { position:relative; background:#faf7ee; max-width:820px; margin:20px auto 0; padding:52px 64px 28px; border:1px solid #d6cbbb; box-shadow:2px 4px 0 #ddd0bf,0 12px 35px #5745370c; }
.nuance-sheet:before { content:''; position:absolute; top:0; right:0; width:26px; height:26px; border-left:1px solid #d8cdbe; border-bottom:1px solid #d8cdbe; background:#f0e8da; clip-path:polygon(0 0,100% 100%,0 100%); }
.nuance-masthead { border-bottom:1px solid #cec3b2; padding-bottom:25px; margin-bottom:32px; }
.nuance-page h1 { font-family:Georgia,serif; font-size:clamp(3.2rem,8vw,4.8rem); line-height:1.1; font-weight:400; letter-spacing:-.04em; margin:10px 0 14px; color:#35312e; }
.nuance-margin { margin:0; font-size:.76rem; letter-spacing:.06em; color:#756659; }
#nuance-tagline { margin:0; font-size:1rem; }
.nuance-page h2 { font-family:Georgia,serif; font-size:clamp(1.45rem,4vw,1.9rem); line-height:1.3; font-weight:400; margin:24px 0 12px; letter-spacing:-.01em; color:#35312e; }
.nuance-page h2:focus { outline:none; }
.nuance-page h3 { font-family:Georgia,serif; font-size:1.2rem; font-weight:400; margin:0; color:#35312e; }
.nuance-hint { color:#75695d; font-size:.85rem; margin:12px 0 22px; }
.nuance-intro { max-width:44ch; }
.nuance-page p { overflow-wrap:anywhere; }
.nuance-actions { display:flex; flex-wrap:wrap; gap:10px; margin:24px 0; align-items:center; }
.nuance-actions .nuance-primary { background:#4f5a52; color:#faf7ee; border-color:#4f5a52; }
.nuance-actions .nuance-primary:hover { background:#3d493f; }
.nuance-page input,.nuance-page textarea { width:100%; background:#fffdf74d; color:#35312e; font:inherit; border:0; border-bottom:1px solid #a99b88; border-radius:0; padding:12px 6px; }
.nuance-page textarea { font-size:1.05rem; line-height:1.9; resize:vertical; min-height:110px; }
.nuance-writing-label { display:block; font-size:.82rem; margin:24px 0 8px; color:#6a5d50; }
.nuance-page details { margin:20px 0; font-size:.85rem; color:#75695d; }
.nuance-page summary { cursor:pointer; min-height:44px; padding:8px 0; }
.nuance-crumbs { display:flex; flex-wrap:wrap; gap:3px 12px; margin:-12px 0 22px; }
.nuance-crumbs button { border:0; padding:0; min-height:36px; font-size:.7rem; color:#6c6156; }
.nuance-crumbs button[aria-current] { text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:6px; }
.nuance-fragments { list-style:none; padding:0; display:flex; gap:14px; flex-wrap:wrap; margin:30px 0; }
.nuance-fragment { display:flex; align-items:center; gap:14px; background:#eee4d3; border:1px solid #d5c7b3; padding:8px 10px 8px 18px; transform:rotate(-1deg); max-width:100%; overflow-wrap:anywhere; box-shadow:1px 2px 0 #d6c8b770; }
.nuance-fragment:nth-child(even) { transform:rotate(1deg); background:#f2eadd; }
.nuance-fragment .nuance-remove { padding:0; width:44px; flex-shrink:0; border:0; font-size:1.1rem; }
.nuance-add { display:grid; grid-template-columns:1fr auto; gap:10px; margin-top:26px; }
.nuance-add label { grid-column:1 / -1; font-size:.84rem; }
.nuance-pair { display:grid; grid-template-columns:1fr auto 1fr; gap:12px; align-items:center; margin:32px 0; }
.nuance-pair .nuance-choice { background:#f0e5d3; min-height:125px; padding:24px; font-family:Georgia,serif; font-size:1.35rem; border:1px solid #d1c1a9; box-shadow:2px 3px 0 #ded0bd; transform:rotate(-.6deg); overflow-wrap:anywhere; }
.nuance-pair .nuance-choice:last-child { transform:rotate(.6deg); background:#f4eddf; }
.nuance-pair .nuance-choice:active { transform:translateY(2px); }
.nuance-or { font-family:Georgia,serif; font-style:italic; color:#74685b; }
.nuance-question-echo { font-family:Georgia,serif; font-size:1.35rem; padding:10px 0 10px 18px; border-left:2px solid #a99577; margin:24px 0; overflow-wrap:anywhere; white-space:pre-wrap; }
.nuance-observations { margin:30px 0; }
.nuance-observations p { padding-left:18px; position:relative; }
.nuance-observations p:before { content:'—'; position:absolute; left:0; color:#89755f; }
.nuance-constellation { margin:36px -8px; }
.nuance-thread { position:relative; padding:22px 8px 24px; border-top:1px solid #d9cebd; }
.nuance-option-nodes { list-style:none; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin:26px 0 16px; }
.nuance-node { position:relative; border:1px solid #c7bca8; padding:12px; font-size:.9rem; overflow-wrap:anywhere; background:#faf7ee; }
.nuance-node:before { content:''; position:absolute; left:20px; top:-27px; height:26px; border-left:1px solid #c7bca8; transform:rotate(10deg); }
.nuance-node.expressed:before { border-left:2px solid #6b786a; }
.nuance-node.expressed { border-bottom:2px solid #6b786a; }
.nuance-node.uncertain { border-style:dashed; }
.nuance-node.uncertain:before { border-left-style:dashed; }
.nuance-node.open:before { height:10px; }
.nuance-node.equal { border-bottom-style:double; border-bottom-width:3px; }
.nuance-annotations { list-style:none; padding:0 0 0 12px; border-left:1px solid #cbbca6; font-size:.82rem; color:#6b6055; }
.nuance-annotations li { margin:8px 0; }
.nuance-prompts { margin:32px 0; padding:8px 0; font-family:Georgia,serif; font-style:italic; }
.nuance-foot { border-top:1px solid #d2c6b4; margin-top:36px; padding-top:16px; }
#nuance-privacy { font-size:.75rem; color:#75695d; max-width:60ch; }
#nuance-burn { border:0; padding-left:0; font-size:.82rem; color:#845e4a; text-decoration:underline; text-underline-offset:4px; }
#nuance-status { min-height:1.6em; font-size:.78rem; color:#75695d; }
.nuance-page dialog { color:#35312e; background:#faf7ee; border:1px solid #c5b8a3; padding:28px; max-width:calc(100vw - 32px); width:460px; }
.nuance-page dialog::backdrop { background:#30281b60; }
#nuance-destroy { background:#755344; color:#fffaf0; border-color:#755344; }
@media(max-width:600px) {
  .nuance-desk { padding:0 12px 24px; }.nuance-top { padding:12px 4px; gap:8px; }
  .nuance-sheet { margin:12px 0 0; padding:30px 22px 20px; }.nuance-masthead { margin-bottom:26px; }
  .nuance-pair { grid-template-columns:1fr; gap:8px; }.nuance-or { text-align:center; }.nuance-pair .nuance-choice { min-height:90px; padding:18px; }
  .nuance-add { grid-template-columns:1fr; }.nuance-option-nodes { grid-template-columns:1fr; gap:16px; }
  .nuance-node:before { height:16px; top:-17px; }.nuance-crumbs { gap:2px 10px; }
}
@media(prefers-reduced-motion:no-preference) {
  .nuance-masthead:after { content:''; display:block; width:64px; border-bottom:1px solid #9c866a; margin-top:22px; transform-origin:left; animation:pencil-arrives 280ms ease-out; }
  .nuance-sheet { animation:sheet-arrives 180ms ease-out; }
  .nuance-sheet.is-burning { pointer-events:none; animation:ink-disappears 650ms ease-in forwards; }
}
@keyframes pencil-arrives { from { transform:scaleX(0); } to { transform:scaleX(1); } }
@keyframes sheet-arrives { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:translateY(0); } }
@keyframes ink-disappears { 40% { opacity:.6; filter:blur(.5px); } 100% { opacity:0; filter:blur(3px); transform:translateY(4px); } }
@media(prefers-reduced-motion:reduce) {
  .nuance-page *, .nuance-page *:before,.nuance-page *:after { animation:none !important; transition:none !important; }
  .nuance-sheet.is-burning { opacity:0; }
}