:root { --ink:#202b27; --muted:#67716d; --line:#d7ded9; --green:#285c45; --paper:#fff; --cacti-navy:#1a1a2e; }
* { box-sizing:border-box; }
body { display:flex; flex-direction:column; min-height:100vh; margin:0; color:var(--ink); background:#f6f8f6; font:14px/1.5 system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; }
a { color:var(--green); text-decoration:none; }
a:hover { text-decoration:underline; }
button,input,textarea { font:inherit; }
button { cursor:pointer; }
button:disabled { cursor:wait; opacity:.6; }
[hidden] { display:none!important; }
:focus-visible { outline:3px solid #75a187; outline-offset:3px; }
h1 { font-size:25px; font-weight:650; margin:0 0 22px; }
h2 { font-size:20px; font-weight:600; margin:0; }
h3 { font-size:15px; font-weight:600; margin:0; }
p { margin:0 0 12px; }
.site-header { background:var(--cacti-navy); color:#fff; }
.site-header-inner { width:100%; max-width:1200px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:18px 30px; padding:22px 24px; }
.brand { display:inline-flex; align-items:center; gap:12px; color:#fff; font-size:23px; font-weight:700; line-height:1.2; white-space:nowrap; }
.brand:hover { color:#fff; text-decoration:none; }
.brand img { flex-shrink:0; object-fit:contain; }
.brand small { display:block; margin-top:5px; color:#d6d6df; font-size:11px; font-weight:450; letter-spacing:.06em; }
.site-header nav { display:flex; flex-wrap:wrap; gap:6px; }
.site-header nav a { color:#d6d6df; padding:8px 12px; border-radius:4px; }
.site-header nav a:hover { color:#fff; background:#ffffff12; text-decoration:none; }
.site-header nav a[aria-current] { color:#fff; background:#ffffff1f; font-weight:600; }
.site-header :focus-visible,.site-footer :focus-visible { outline-color:#b1d6be; }
.site-main { flex:1; width:100%; }
.site-footer { background:var(--cacti-navy); color:#aaa; padding:30px 24px; text-align:center; font-size:13px; }
.site-footer-inner { max-width:1200px; margin:0 auto; }
.site-footer a { color:#d6d6df; }
.site-footer a:hover { color:#fff; text-decoration:underline; }
.footer-contact { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:0 7px; margin-bottom:10px; }
.site-footer nav { display:flex; justify-content:center; flex-wrap:wrap; gap:5px 0; }
.site-footer nav a + a::before { content:'•'; display:inline-block; margin:0 10px; color:#888899; }
.container { max-width:1200px; padding:28px 24px 60px; }
.tool-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.tool-card { display:block; padding:23px; background:var(--paper); border:1px solid var(--line); border-radius:6px; }
.tool-card:hover { background:#f0f5f1; text-decoration:none; }
.tool-card h2 { font-size:18px; margin-bottom:8px; }
.tool-card p { margin:0; color:var(--muted); }
.product-intro { max-width:850px; padding:18px 0 8px; }
.product-intro h1 { font-size:clamp(28px,4vw,42px); line-height:1.18; }
.product-intro > p { max-width:730px; }
.product-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px 18px; margin-top:22px; }
.product-section { margin-top:32px; }
.product-section h2 { margin-bottom:14px; }
.product-section h3 { margin:22px 0 10px; }
.product-section li + li { margin-top:8px; }
.product-copy { max-width:900px; }
.sample-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin:24px 0 12px; }
.sample-grid label { display:block; margin-bottom:8px; font-weight:600; }
.sample-grid textarea { width:100%; padding:14px; border:1px solid var(--line); border-radius:4px; background:var(--paper); color:var(--ink); font:14px/1.6 system-ui,sans-serif; }
@media(max-width:760px) { .sample-grid { grid-template-columns:1fr; } }
.upload-panel,.source-panel { background:var(--paper); border:1px solid var(--line); border-radius:6px; padding:20px; }
.drop-zone { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:16px; padding:27px 20px; border:1px dashed #aabbb0; border-radius:4px; background:#fafcfb; }
.drop-zone.drag-over { background:#e4f1e8; border-color:var(--green); }
.drop-zone.is-processing { opacity:.6; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:8px; border:1px solid transparent; border-radius:4px; padding:8px 14px; font-size:13px; font-weight:550; white-space:nowrap; cursor:pointer; }
.button.primary { background:var(--green); border-color:var(--green); color:white; }
.button.primary:hover { background:#204b38; }
.button.subtle { background:white; color:var(--ink); border-color:#cbd4cd; }
.button.subtle:hover { background:#eef3ef; }
.file-button { position:relative; overflow:hidden; }
.file-input { position:absolute; inset:0; opacity:0; width:100%; height:100%; cursor:pointer; }
.file-button:focus-within { outline:3px solid #75a187; outline-offset:3px; }
.check-option { display:flex; align-items:center; gap:8px; margin:14px 0 0; font-size:13px; }
.small-note { font-size:12px; line-height:1.5; color:var(--muted); }
.upload-panel>.small-note { margin:12px 0 0; }
.tool-status { color:var(--green); margin:14px 0; font-size:13px; }
.tool-status:empty { display:none; }
.tool-error { padding:12px; margin:14px 0; border:1px solid #e1b4ad; border-radius:4px; background:#fff2ef; color:#8a3025; }
.result-heading { display:flex; justify-content:space-between; align-items:start; gap:20px; margin:20px 0 14px; }
.result-heading h2 { overflow-wrap:anywhere; }
.result-heading p { margin:4px 0 0; font-size:12px; color:var(--muted); }
.extraction-notes { background:#fffdf2; border:1px solid #e1ddbf; border-radius:4px; padding:10px 14px; margin-bottom:14px; font-size:12px; }
.extraction-notes summary { cursor:pointer; font-weight:600; }
.extraction-notes ul { padding-left:20px; margin:10px 0 0; }
.extraction-notes li+li { margin-top:5px; }
.output-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; border-bottom:1px solid var(--line); margin:20px 0 16px; }
.output-actions>.button { margin-left:auto; }
.result-tabs { display:flex; gap:18px; }
.result-tabs button { border:0; border-bottom:2px solid transparent; background:none; padding:10px 3px; color:var(--muted); }
.result-tabs button[aria-selected=true] { color:var(--green); border-bottom-color:var(--green); }
.result-tabs span { font-size:11px; background:#e8ede9; padding:1px 6px; border-radius:3px; margin-left:4px; }
.editor-bar { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; margin-bottom:12px; }
.editor-bar h2 { font-size:16px; }
.action-group { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.format-bar { display:flex; align-items:center; flex-wrap:wrap; gap:6px; padding:9px; background:#eef2ef; border:1px solid var(--line); border-radius:4px 4px 0 0; }
.format-bar button { border:1px solid #cdd6cf; border-radius:3px; background:white; color:var(--ink); font-size:12px; padding:5px 9px; min-width:30px; }
.format-bar button:hover { background:#e4ece6; }
#reset-text { margin-left:auto; }
#manuscript,.rich-editor { display:block; width:100%; min-height:240px; padding:18px; color:var(--ink); background:var(--paper); border:1px solid var(--line); border-top:0; font:15px/1.65 system-ui,sans-serif; overflow-wrap:anywhere; }
#manuscript { height:390px; resize:vertical; overflow:auto; tab-size:2; white-space:pre-wrap; line-height:1.65; }
.rich-editor { min-height:220px; max-height:440px; overflow:auto; white-space:pre-wrap; }
.rich-editor:empty::before { content:attr(data-placeholder); color:#849189; pointer-events:none; }
.rich-editor p,.rich-editor div { margin:0 0 10px; }
.rich-editor h1,.rich-editor h2,.rich-editor h3 { margin:0 0 10px; }
.rich-editor img { max-width:180px; max-height:140px; display:inline-block; margin:6px; object-fit:contain; }
.rich-editor table { border-collapse:collapse; }
.rich-editor td,.rich-editor th { border:1px solid var(--line); padding:5px; }
.source-panel .small-note { margin:10px 0 0; }
.editor-footer { display:flex; justify-content:space-between; gap:14px; padding:8px 12px; border:1px solid var(--line); border-top:0; background:#f0f4f1; color:var(--muted); font-size:12px; }
.image-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.image-card { background:var(--paper); border:1px solid var(--line); border-radius:5px; overflow:hidden; }
.image-preview { display:flex; align-items:center; justify-content:center; padding:12px; height:190px; background:#eaf0ec; }
.image-preview img { max-width:100%; max-height:100%; object-fit:contain; image-orientation:from-image; }
.image-preview p { text-align:center; white-space:pre-line; color:var(--muted); font-size:12px; }
.image-details { padding:14px; }
.image-details>p { font-size:12px; margin:0 0 7px; }
.image-details .original-name { font-size:11px; color:var(--muted); overflow-wrap:anywhere; }
.image-details label { display:block; font-size:12px; margin:10px 0 5px; }
.filename-field { display:flex; align-items:center; border:1px solid var(--line); border-radius:3px; margin-bottom:10px; }
.filename-field input { min-width:0; width:100%; border:0; background:none; padding:8px; font-size:12px; }
.filename-field span { padding-right:8px; color:var(--muted); font-size:12px; }
.image-details .button { width:100%; }
.empty-state { padding:24px; background:#edf2ee; color:var(--muted); text-align:center; border-radius:4px; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
dialog { width:calc(100% - 32px); max-width:430px; border:1px solid var(--line); border-radius:6px; padding:24px; color:var(--ink); }
dialog::backdrop { background:#182c2266; }
dialog h2 { margin:0 0 16px; }
dialog label { display:block; font-size:13px; margin-bottom:6px; }
dialog input { width:100%; border:1px solid #bfcac2; border-radius:3px; padding:9px; }
dialog .small-note { margin:12px 0 18px; }
@media(max-width:760px) {
  .site-header-inner { padding:18px 16px; gap:16px; }
  .brand { font-size:21px; }
  .site-footer { padding:26px 16px; }
  .site-header nav { width:100%; gap:2px; }
  .site-header nav a { padding:5px 8px; font-size:12px; }
  .container { padding:22px 16px 40px; }
  .tool-list,.image-grid { grid-template-columns:1fr; }
  .upload-panel,.source-panel { padding:14px; }
  .drop-zone { flex-direction:column; padding:22px; gap:12px; }
  .format-bar { gap:5px; }
  .format-bar button { padding:5px 7px; }
  #reset-text { margin-left:0; }
  #manuscript,.rich-editor { padding:12px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; } }

.document-list { list-style: none; padding: 0; }
.document-list button { overflow-wrap: anywhere; max-width: 100%; }

.newscalc-page input[aria-invalid="true"] { border: 2px solid #a12727; }

#formatter-dialog { max-width:850px; max-height:90vh; overflow:auto; padding:0; }
#formatter-dialog .source-panel { border:0; }


#story-save-status { align-self:center; font-size:12px; color:var(--muted); }

.story-name { border:0; background:none; padding:8px 0; color:var(--green); font-weight:550; text-align:left; overflow-wrap:anywhere; }
.story-name:hover { text-decoration:underline; }
.story-state { font-size:12px; color:var(--muted); overflow-wrap:anywhere; }
.story-trash { min-width:38px; min-height:38px; color:#8a3025; }
#story-dialog { width:calc(100% - 32px); max-width:1280px; height:94vh; max-height:94vh; overflow:hidden; padding:0; }
#story-dialog[open] { display:flex; flex-direction:column; }
.story-dialog-header { display:flex; align-items:center; justify-content:space-between; flex-shrink:0; gap:12px 20px; padding:14px 24px; border-bottom:1px solid var(--line); }
.story-dialog-title { min-width:0; }
.story-dialog-title h2 { margin:0; overflow-wrap:anywhere; }
.story-dialog-title p { margin:4px 0 0; font-size:12px; color:var(--muted); overflow-wrap:anywhere; }
.story-dialog-header > .action-group { flex-shrink:0; }
#story-dialog #results { overflow:auto; min-height:0; padding:0 24px 24px; }
#manuscript > div,#manuscript p { margin:0 0 .825em; }
#manuscript > :last-child { margin-bottom:0; }
#story-output > .extraction-notes { margin:20px 0 0; }
#story-dialog #manuscript { height:45vh; }
#story-dialog .filename-field input { border:0; }
@media(max-width:600px) {
  .story-dialog-header { padding:12px 14px; flex-wrap:wrap; }
  #story-dialog #results { padding:0 14px 14px; }
  .story-trash { padding:8px; white-space:normal; }
}

#organization-form { display:grid; gap:1rem; min-width:min(24rem,70vw); }

.pt-toasts { position:fixed; inset:auto 1rem 1rem auto; margin:0; padding:0; border:0; background:transparent; color:inherit; overflow:visible; width:min(26rem,calc(100vw - 2rem)); max-height:75vh; overflow-y:auto; display:flex; flex-direction:column; gap:.6rem; z-index:10000; pointer-events:none; }
.pt-toasts[popover]:not(:popover-open) { display:none; }
.pt-toast { display:flex; align-items:start; gap:1rem; padding:1rem; background:#173d55; color:#fff; border-radius:.5rem; box-shadow:0 4px 20px #0003; pointer-events:auto; overflow-wrap:anywhere; }
.pt-toast-error { background:#842029; }
.pt-toast span { flex:1; }
.pt-toast button { border:0; background:transparent; color:inherit; font-size:1.5rem; line-height:1; padding:.1rem .3rem; }
.pt-toast button:focus-visible { outline:2px solid white; outline-offset:2px; }




/* Marketing and app zones. */
.header-account { display:flex; align-items:center; gap:16px; }
.header-account > a { color:#fff; }
.app .site-header-inner { max-width:none; min-height:48px; padding:4px 20px; gap:4px 20px; }
.app .brand { font-size:18px; gap:8px; }
.app .brand img { width:30px; height:30px; }
.app .site-header nav { margin-right:auto; }
.app .site-header nav a { padding:6px 10px; }
.app .site-main { padding:24px; }
.app .app-help { display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border:1px solid #ffffff70; border-radius:50%; }
.app .account-menu { position:relative; }
.app .account-menu summary { cursor:pointer; padding:6px 0; }
.app .account-menu-items { position:absolute; right:0; top:100%; z-index:100; min-width:210px; padding:8px; border:1px solid var(--line); border-radius:6px; background:#fff; box-shadow:0 6px 18px #0002; }
.app .account-menu-items a,.app .account-menu-items button { display:block; width:100%; padding:10px; color:var(--ink); text-align:left; border:0; background:transparent; }
.app .account-menu-items a:hover,.app .account-menu-items button:hover { background:#eef3ef; }
.app .app-footer { padding:12px 24px; border-top:1px solid var(--line); font-size:12px; }
.app .app-footer nav { display:flex; justify-content:center; gap:20px; }
.app .app-launcher { max-width:1000px; margin:32px auto; }
.app .launcher-tools { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-top:24px; }
.app .launcher-tools .button { margin-top:20px; }
.app .newscalc-page { padding-top:0; }
.app .newscalc-titlebar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-bottom:20px; }
.app .newscalc-titlebar h1 { margin:0; }
.app .newscalc-page > .container { max-width:none!important; padding:0; }
@media(max-width:760px) {
  .app .site-header-inner { padding:8px 12px; }
  .app .header-account { margin-left:auto; }
  .app .site-main { padding:16px 12px; }
  .app .launcher-tools { grid-template-columns:1fr; }
}

:root { --accent:#f4c66a; --surface-2:#eef2ef; --radius-lg:16px; --shadow-card:0 12px 36px #192c2110; }
.marketing .site-main { max-width:1200px; }
.marketing.marketing-landing { background:#fff; }
.marketing.marketing-landing .site-main { padding:0; max-width:none; }
.marketing .marketing-page { overflow:hidden; }
.marketing .marketing-wrap { width:100%; max-width:1200px; padding-left:24px; padding-right:24px; margin:0 auto; }
.marketing .marketing-section { padding-top:80px; padding-bottom:80px; }
.marketing .alternate { background:var(--surface-2); }
.marketing .eyebrow { text-transform:uppercase; letter-spacing:.12em; font-size:11px; font-weight:700; color:var(--green); margin-bottom:16px; }
.marketing .marketing-page h2 { font-size:clamp(26px,3vw,38px); line-height:1.18; letter-spacing:-.035em; max-width:760px; margin:0 0 24px; }
.marketing .marketing-page h3 { font-size:19px; line-height:1.3; margin:0 0 12px; }
.marketing .marketing-page p { font-size:16px; line-height:1.7; }
.marketing .marketing-page .eyebrow { font-size:11px; }
.marketing .marketing-hero { background:var(--cacti-navy); color:#fff; padding:70px 0 80px; }
.marketing .hero-grid { display:grid; grid-template-columns:1fr 1.1fr; gap:48px; align-items:center; }
.marketing .marketing-hero .eyebrow { color:var(--accent); }
.marketing .marketing-hero h1 { font-size:clamp(38px,4.3vw,60px); line-height:1.08; letter-spacing:-.045em; margin-bottom:24px; }
.marketing .marketing-hero h1 span { color:var(--accent); }
.marketing .hero-description { max-width:560px; font-size:19px!important; color:#dcdce5; }
.marketing .marketing-hero .product-actions { margin-top:28px; }
.marketing .marketing-hero .button { padding:12px 18px; font-size:14px; }
.marketing .marketing-hero .button.primary,.marketing .signup-band .button.primary { background:var(--accent); color:var(--cacti-navy); border-color:var(--accent); }
.marketing .marketing-hero .button.primary:hover,.marketing .signup-band .button.primary:hover { background:#ffda8c; }
.marketing .marketing-hero .button.subtle,.marketing .signup-band .button.subtle { background:transparent; border-color:#777787; color:#fff; }
.marketing .marketing-hero .button.subtle:hover,.marketing .signup-band .button.subtle:hover { background:#ffffff12; }
.marketing .hero-note { color:#bebecd; font-size:12px!important; margin-top:12px; }
.marketing .transform-visual { display:grid; grid-template-columns:.85fr 1fr; gap:24px; position:relative; align-items:center; padding:24px 0; }
.marketing .source-document,.marketing .result-document { background:#fff; color:var(--ink); border-radius:10px; padding:22px 18px; box-shadow:0 16px 32px #0002; min-width:0; }
.marketing .source-document { transform:rotate(-4deg); opacity:.9; }
.marketing .result-document { transform:rotate(2deg); }
.marketing .document-label { display:flex; align-items:center; gap:6px; font:600 8px/1.5 system-ui,sans-serif; letter-spacing:.07em; color:var(--muted); border-bottom:1px solid var(--line); padding-bottom:12px; margin-bottom:16px; }
.marketing .word-badge { display:inline-grid; place-items:center; width:20px; height:23px; background:#315d9b; color:#fff; font-size:12px; }
.marketing .source-document > strong { font:700 21px/1.15 Georgia,serif; }
.marketing .result-document > strong { font-size:15px; line-height:1.3; display:block; }
.marketing .source-document p,.marketing .result-document > p { font-size:11px; line-height:1.6; margin-top:14px; }
.marketing .embedded-photos { display:flex; gap:8px; margin-top:18px; }
.marketing .mini-photo { display:block; min-height:54px; aspect-ratio:1.4; border-radius:4px; background:radial-gradient(ellipse at 70% 30%,#f4dc97 0 10%,transparent 11%),linear-gradient(145deg,transparent 46%,#69836b 47% 65%,#415a48 66%),linear-gradient(#d8e6dc 60%,#afbf9a 60%); }
.marketing .landscape-two { background:radial-gradient(ellipse at 25% 25%,#f4dc97 0 9%,transparent 10%),linear-gradient(35deg,transparent 42%,#69836b 43% 63%,#99ad86 64%),#d8e6dc; }
.marketing .embedded-photos .mini-photo { flex:1; }
.marketing .document-footnote { display:block; margin-top:16px; font-size:9px; color:var(--muted); }
.marketing .transform-arrow { position:absolute; top:45%; left:42%; width:44px; height:44px; z-index:1; border-radius:50%; background:var(--accent); color:var(--cacti-navy); display:grid; place-items:center; font-size:28px; box-shadow:0 0 0 6px var(--cacti-navy); }
.marketing .ready-dot { width:7px; height:7px; border-radius:50%; background:var(--green); }
.marketing .result-photo { display:grid; grid-template-columns:48px 1fr; gap:8px; align-items:center; margin-top:12px; padding-top:12px; border-top:1px solid var(--line); }
.marketing .result-photo .mini-photo { min-height:44px; }
.marketing .result-photo strong,.marketing .result-photo span,.marketing .result-photo small { display:block; font-size:8px; line-height:1.5; overflow-wrap:anywhere; }
.marketing .result-photo small { color:var(--muted); }
.marketing .format-strip { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:12px; padding:28px 0; border-bottom:1px solid var(--line); }
.marketing .format-strip > div { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.marketing .format-strip > div > span:not(.format-label) { background:var(--surface-2); border-radius:5px; padding:5px 9px; font-size:12px; }
.marketing .format-label { color:var(--muted); font-size:9px; font-weight:700; letter-spacing:.08em; margin-right:4px; }
.marketing .format-arrow { color:var(--green); font-size:24px; }
.marketing .steps-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; margin-top:36px; }
.marketing .step-heading { display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.marketing .step-heading h3 { margin:0; }
.marketing .step-number { display:grid; place-items:center; width:32px; height:32px; background:var(--cacti-navy); color:var(--accent); border-radius:50%; font-weight:700; }
.marketing .step > p { font-size:14px; min-height:48px; }
.marketing .review-note { margin-top:24px; color:var(--muted); font-size:12px!important; }
.marketing .features-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:36px 40px; margin-top:40px; }
.marketing .feature-tile > svg { color:var(--green); margin-bottom:16px; }
.marketing .feature-tile p { font-size:14px; color:#526058; margin:0; }
.marketing .feature-row { display:grid; grid-template-columns:.85fr 1.15fr; gap:64px; align-items:center; }
.marketing .feature-row > div:first-child > p:not(.eyebrow) { color:#526058; }
.marketing .feature-row.reverse > div:first-child { order:2; }
.marketing .feature-row.reverse { grid-template-columns:1.15fr .85fr; }
.marketing .marketing-tools { display:grid; grid-template-columns:2fr 1fr; gap:28px; margin-top:36px; }
.marketing .marketing-tool-card { min-width:0; background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden; }
.marketing .marketing-tool-card > div:last-child { padding:28px; }
.marketing .marketing-tool-card p { font-size:14px; color:#526058; }
.marketing .marketing-tool-card .preview-frame { border-radius:0; border:0; border-bottom:1px solid var(--line); box-shadow:none; min-height:258px; }
.marketing .free-label { font:600 11px/1 system-ui,sans-serif; background:#e5eee6; color:var(--green); padding:5px 8px; border-radius:4px; vertical-align:middle; }
.marketing .text-action { display:inline-flex; gap:12px; font-weight:650; }
.marketing .audience-section { text-align:center; }
.marketing .audience-section h2 { margin-left:auto; margin-right:auto; }
.marketing .audience-labels { display:flex; justify-content:center; flex-wrap:wrap; gap:12px; list-style:none; padding:0; margin:28px 0 0; }
.marketing .audience-labels li { border:1px solid var(--line); border-radius:24px; padding:9px 16px; font-size:13px; }
.marketing .signup-band { background:var(--cacti-navy); color:#fff; text-align:center; padding-left:24px; padding-right:24px; }
.marketing .signup-band h2 { margin-left:auto; margin-right:auto; }
.marketing .signup-band .eyebrow { color:var(--accent); }
.marketing .signup-band > p:not(.eyebrow) { color:#dcdce5; max-width:560px; margin-left:auto; margin-right:auto; }
.marketing .signup-band .product-actions { justify-content:center; }
.marketing .hosting-band { background:var(--surface-2); padding-top:48px; padding-bottom:48px; }
.marketing .hosting-band > div { display:flex; align-items:center; justify-content:space-between; gap:28px; }
.marketing .hosting-band h2 { font-size:23px; margin-bottom:10px; }
.marketing .hosting-band p { font-size:14px; margin:0; }
.marketing .product-hero { padding-bottom:0; }
.marketing .product-hero-copy { text-align:center; max-width:720px; margin:0 auto 48px; }
.marketing .product-hero-copy .hero-description { margin-left:auto; margin-right:auto; }
.marketing .product-hero-copy .product-actions { justify-content:center; }
.marketing .product-hero .preview-frame { max-width:880px; margin:0 auto; border-radius:var(--radius-lg) var(--radius-lg) 0 0; }
.marketing .product-hero .preview-workspace { min-height:260px; }
.marketing .limits-section { display:grid; grid-template-columns:1fr 1fr; gap:24px 64px; align-items:start; }
.marketing .limits-section .review-note { grid-column:1/-1; margin:0; }
.marketing .marketing-limits { width:100%; font-size:14px; }
.marketing .marketing-limits td,.marketing .marketing-limits th { padding:13px 0; border-bottom:1px solid #ccd6cf; }
.marketing .marketing-limits th { font-weight:550; }
.marketing .marketing-limits thead { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.05em; }
.marketing .newscalc-storyextract-band { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; border-top:1px solid var(--line); }
.marketing .newscalc-storyextract-band h2 { font-size:30px; margin-bottom:16px; }
.marketing .newscalc-storyextract-band p { font-size:16px; }
/* Static preview illustrations, replaced with real screenshots in Phase 4. */
.marketing .preview-frame { background:#fff; color:var(--ink); border:1px solid #d1dbd4; border-radius:12px; box-shadow:var(--shadow-card); min-width:0; overflow:hidden; font:11px/1.5 system-ui,sans-serif; text-align:left; }
.marketing .preview-topbar { display:flex; align-items:center; gap:12px; padding:12px 16px; background:var(--cacti-navy); color:#fff; font-size:11px; }
.marketing .preview-dots { font-size:7px; color:#9292a4; letter-spacing:2px; }
.marketing .preview-state { margin-left:auto; color:#d6d6df; font-size:10px; }
.marketing .preview-breadcrumb { padding:12px 16px; border-bottom:1px solid var(--line); font-size:10px; }
.marketing .preview-breadcrumb > span { color:#9aa59d; padding:0 6px; }
.marketing .preview-workspace { display:grid; grid-template-columns:140px 1fr; min-height:230px; }
.marketing .preview-tree { display:flex; flex-direction:column; gap:10px; padding:18px 12px; background:#f4f7f4; border-right:1px solid var(--line); font-size:10px; }
.marketing .preview-tree > span { padding-left:12px; }
.marketing .preview-selected { background:#e1eae2; border-radius:4px; color:var(--green); font-weight:600; }
.marketing .preview-files { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding:18px; }
.marketing .preview-file { display:flex; align-items:start; flex-direction:column; gap:6px; padding:12px; border:1px solid var(--line); border-radius:6px; min-width:0; }
.marketing .preview-file strong { font-size:10px; overflow-wrap:anywhere; }
.marketing .preview-file small { font-size:9px; color:var(--muted); }
.marketing .preview-file .mini-photo { width:60px; min-height:36px; }
.marketing .preview-file-icon { color:var(--green); background:#eaf0e9; border-radius:5px; padding:8px 10px; font-size:20px; font-weight:550; }
.marketing .preview-add { display:grid; place-items:center; border:1px dashed #a8b9ac; border-radius:6px; color:var(--muted); font-size:10px; text-align:center; padding:8px; }
.marketing .preview-caption { padding:7px 12px; background:#f5f7f5; border-top:1px solid var(--line); color:var(--muted); font-size:9px; text-align:right; }
.marketing .preview-editor { display:grid; grid-template-columns:1.1fr 1fr; gap:16px; padding:20px; min-height:222px; }
.marketing .preview-editor small { display:block; font-size:8px; color:var(--muted); letter-spacing:.04em; margin-bottom:8px; }
.marketing .preview-editor strong { display:block; font-size:11px; line-height:1.4; }
.marketing .preview-editor p { font-size:10px; line-height:1.6; margin:10px 0; }
.marketing .preview-lines { height:28px; background:repeating-linear-gradient(#e4eae5 0 2px,transparent 2px 8px); width:90%; }
.marketing .preview-photo-details { border-left:1px solid var(--line); padding-left:16px; min-width:0; }
.marketing .preview-photo-details .mini-photo { max-height:85px; width:100%; margin-bottom:10px; }
.marketing .preview-photo-details strong { overflow-wrap:anywhere; font-size:9px; }
.marketing .preview-photo-details small { margin:8px 0 2px; }
.marketing .preview-photo-details > span:not(.mini-photo) { font-size:9px; }
.marketing .preview-download { display:flex; align-items:center; flex-direction:column; gap:10px; padding:26px 18px; }
.marketing .preview-download > strong { font-size:12px; }
.marketing .preview-download > span:not(.preview-file-icon) { font-size:10px; }
.marketing .preview-download-files { display:flex; flex-direction:column; gap:6px; border-top:1px solid var(--line); padding-top:12px; width:100%; max-width:260px; font:10px/1.5 ui-monospace,monospace; }
.marketing .preview-success { color:var(--green); }
.marketing .preview-upload { display:flex; flex-direction:column; align-items:center; gap:10px; margin:18px; padding:24px 8px; border:1px dashed #adbbaf; border-radius:8px; }
.marketing .preview-upload > span:last-child { font-size:9px; }
.marketing .preview-upload-row { display:flex; justify-content:space-between; gap:8px; padding:10px 18px; font-size:9px; border-top:1px solid var(--line); }
.marketing .preview-calculator { padding:30px 24px; }
.marketing .preview-calculator > small { font-size:9px; color:var(--muted); letter-spacing:.04em; }
.marketing .preview-calculator > strong { display:block; color:var(--cacti-navy); font-size:60px; line-height:1.2; margin:8px 0 14px; }
.marketing .preview-calculator > strong > span { font-size:32px; }
.marketing .preview-calculator > div { display:flex; justify-content:space-between; border-top:1px solid var(--line); padding:7px 0; }
@media(max-width:1000px) {
  .marketing .hero-grid { grid-template-columns:1fr; gap:30px; }
  .marketing .hero-copy { max-width:660px; }
  .marketing .transform-visual { max-width:620px; width:100%; margin:auto; }
  .marketing .feature-row,.marketing .feature-row.reverse { gap:32px; grid-template-columns:1fr 1fr; }
  .marketing .steps-grid { gap:18px; }
  .marketing .step .preview-editor { grid-template-columns:1fr; }
  .marketing .step .preview-photo-details { display:none; }
}
@media(max-width:760px) {
  .marketing .marketing-section { padding-top:48px; padding-bottom:48px; }
  .marketing .marketing-wrap { padding-left:20px; padding-right:20px; }
  .marketing .marketing-hero { padding-top:36px; padding-bottom:40px; }
  .marketing .marketing-hero h1 { font-size:42px; }
  .marketing .steps-grid,.marketing .features-grid,.marketing .marketing-tools,.marketing .feature-row,.marketing .feature-row.reverse,.marketing .limits-section,.marketing .newscalc-storyextract-band { grid-template-columns:1fr; }
  .marketing .steps-grid { gap:32px; }
  .marketing .step > p { min-height:0; }
  .marketing .step .preview-editor { grid-template-columns:1.1fr 1fr; }
  .marketing .step .preview-photo-details { display:block; }
  .marketing .features-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 20px; }
  .marketing .feature-row.reverse > div:first-child { order:0; }
  .marketing .hosting-band > div { align-items:start; flex-direction:column; }
  .marketing .source-document,.marketing .result-document { padding:16px 12px; }
  .marketing .transform-visual { gap:16px; }
  .marketing .source-document > strong { font-size:18px; }
  .marketing .result-document > strong { font-size:13px; }
  .marketing .source-document p,.marketing .result-document > p { font-size:9px; }
  .marketing .transform-arrow { width:30px; height:30px; font-size:22px; left:41%; }
  .marketing .result-photo { grid-template-columns:1fr; }
  .marketing .result-photo .mini-photo { display:none; }
  .marketing .product-hero { padding-bottom:0; }
  .marketing .preview-workspace { grid-template-columns:110px 1fr; }
  .marketing .preview-files { padding:10px; gap:8px; }
  .marketing .preview-file { padding:8px; }
  .marketing .format-strip { justify-content:start; }
  .marketing .format-arrow { display:none; }
}

/* StoryExtract folder view (UI plan 4.2). */
#organization-form label,.photo-fields label { display:flex; flex-direction:column; gap:.25rem; }
#move-story-issue,.photo-fields select,.workspace-bar select { font:inherit; padding:.4rem; border:1px solid var(--line); border-radius:4px; max-width:100%; }
.button.danger { background:#a12727; border-color:#a12727; color:#fff; }
.button.danger:hover { background:#861f1f; }
.danger-text { color:#a12727!important; }
.storyextract-app .site-main { padding:0; display:flex; flex-direction:column; }
.storyextract-app main { flex:1; display:flex; flex-direction:column; }
.storyextract-app .app-footer { display:none; }
.storyextract { flex:1; display:flex; flex-direction:column; min-height:0; }
.workspace-bar { display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:8px 20px; border-bottom:1px solid var(--line); background:#fff; }
.workspace-bar label { display:flex; align-items:center; gap:8px; }
.se-layout { flex:1; display:grid; grid-template-columns:minmax(220px,280px) minmax(0,1fr); min-height:calc(100vh - 56px); }
.browser-only .se-layout { grid-template-columns:minmax(0,1fr); }
.folder-pane { border-right:1px solid var(--line); background:#fff; position:sticky; top:0; align-self:stretch; max-height:calc(100vh - 56px); overflow:auto; padding:12px 8px; }
.folder-pane-header { display:none; }
.folder-tree ul { list-style:none; margin:0; padding:0; }
.folder-tree ul[role="group"] { padding-left:14px; }
.tree-item { outline:none; }
.tree-row { display:flex; align-items:center; gap:6px; padding:6px 8px; border-radius:4px; cursor:pointer; color:var(--ink); }
.tree-row:hover { background:#eef3ef; }
.tree-item:focus-visible > .tree-row { outline:3px solid #75a187; outline-offset:-1px; }
.tree-item[aria-current="page"] > .tree-row { background:#dfece3; font-weight:600; }
.tree-twisty { width:14px; flex-shrink:0; color:#525c58; text-align:center; }
.tree-label { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tree-count { font-size:11px; color:#525c58; background:#eef2ef; border-radius:9px; padding:0 7px; }
.tree-badge,.tile-badge,.folder-tile.is-archived .folder-meta:first-of-type { font-size:11px; color:#6b5413; background:#fbf1d8; border-radius:9px; padding:0 7px; }
.is-archived > .tree-row .tree-label { color:#525c58; }
.tree-unassigned > .tree-row .tree-label { font-style:italic; }
.se-main { display:flex; flex-direction:column; min-width:0; }
.se-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; padding:10px 20px; border-bottom:1px solid var(--line); background:#fff; position:sticky; top:0; z-index:5; }
.folders-toggle { display:none; }
.breadcrumb { flex:1; min-width:200px; }
.breadcrumb ol { display:flex; flex-wrap:wrap; align-items:center; list-style:none; margin:0; padding:0; font-size:15px; }
.breadcrumb li + li::before { content:'›'; margin:0 8px; color:var(--muted); }
.breadcrumb [aria-current] { font-weight:600; }
.toolbar-actions .action-group { align-items:center; }
.split-button { position:relative; display:inline-flex; }
.split-button > .file-button { border-top-right-radius:0; border-bottom-right-radius:0; }
.split-toggle { border-top-left-radius:0; border-bottom-left-radius:0; border-left:1px solid #ffffff55!important; padding:8px 9px; }
.menu-wrap { position:relative; display:inline-flex; }
.menu-panel { position:absolute; top:calc(100% + 4px); left:0; z-index:50; display:flex; flex-direction:column; min-width:220px; padding:6px; border:1px solid var(--line); border-radius:6px; background:#fff; box-shadow:0 8px 24px #0002; }
.menu-panel.menu-right { left:auto; right:0; }
.menu-panel > button { display:block; width:100%; padding:9px 10px; border:0; border-radius:4px; background:transparent; text-align:left; color:var(--ink); }
.menu-panel > button:hover,.menu-panel > button:focus-visible { background:#eef3ef; }
#add-menu { flex-direction:row; align-items:center; gap:8px; padding:10px 12px; }
#add-menu .check-option { margin:0; }
.info-button { width:22px; height:22px; flex-shrink:0; border:1px solid #9aa8a0; border-radius:50%; background:#fff; color:var(--muted); font:italic 600 12px/1 Georgia,serif; padding:0; }
.pt-popover { max-width:300px; margin:0; padding:12px 14px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); box-shadow:0 8px 24px #0002; font-size:13px; }
.pt-note { display:flex; align-items:center; gap:10px; padding:9px 14px; font-size:13px; border-left:4px solid #6d8bb0; background:#eef2f7; color:#26364a; }
.pt-note::before { content:'i'; flex-shrink:0; display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; border-radius:50%; background:#6d8bb0; color:#fff; font:italic 600 11px/1 Georgia,serif; }
.pt-note > span { flex:1; }
.pt-note-warning { border-left-color:#c58b12; background:#fdf6e3; color:#5b4310; }
.pt-note-warning::before { content:'!'; background:#c58b12; font-style:normal; }
.pt-note-close { border:0; background:transparent; color:inherit; font-size:18px; line-height:1; padding:0 4px; }
.info-line { margin:12px 20px 0; border-radius:4px; }
.content-pane { position:relative; flex:1; padding:16px 20px 24px; }
.tile-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); align-items:start; gap:14px; list-style:none; margin:0; padding:0; }
.folder-tile { display:flex; flex-direction:column; align-items:flex-start; gap:3px; min-height:120px; padding:16px; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink); text-align:left; }
.folder-tile:hover { border-color:#9fb8a7; box-shadow:var(--shadow-card); text-decoration:none; }
.folder-icon { width:34px; height:26px; margin-bottom:8px; border-radius:3px 6px 4px 4px; background:linear-gradient(#e7c873,#e7c873) 0 0/45% 6px no-repeat,#f2d88f; }
.unassigned-tile .folder-icon { background:linear-gradient(#b9c4bd,#b9c4bd) 0 0/45% 6px no-repeat,#d4ddd7; }
.new-tile { justify-content:center; align-items:center; border-style:dashed; color:var(--green); font-weight:600; }
.new-tile .folder-icon { background:none; width:auto; height:auto; margin:0; }
.new-tile .folder-icon::before { content:'+'; font-size:26px; line-height:1; }
.folder-name { font-weight:600; font-size:15px; overflow-wrap:anywhere; }
.folder-meta { font-size:12px; color:var(--muted); }
.folder-tile.expires-soon { border-color:#d9a43a; background:#fffaf0; }
.folder-tile.expires-soon .folder-meta:last-child { color:#8a5a00; font-weight:600; }
.tile { position:relative; display:grid; grid-template-columns:auto minmax(0,1fr) auto; grid-template-areas:"check source trash" "name name name" "preview preview preview" "thumbs thumbs thumbs" "state state badge"; align-content:start; gap:4px 8px; padding:12px; border:1px solid var(--line); border-radius:8px; background:#fff; }
.tile.is-active { border-color:var(--green); }
.tile.has-error { border-color:#d48b8b; background:#fff8f8; }
.tile-check { grid-area:check; margin:0; width:16px; height:16px; align-self:center; }
.tile-source { grid-area:source; justify-self:start; align-self:center; font-size:10px; font-weight:700; letter-spacing:.05em; color:#3a5a4a; background:#e6efe9; border-radius:3px; padding:1px 6px; }
.tile-source-pdf { color:#8a2f25; background:#f8e7e4; }
.tile-source-paste { color:#4b4a8a; background:#ecebf8; }
.tile .story-name { grid-area:name; padding:2px 0; font-size:14px; }
.tile .story-trash { grid-area:trash; min-width:30px; min-height:30px; padding:4px; border-color:transparent; }
.tile-preview { grid-area:preview; font-size:12px; color:var(--muted); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.tile-thumbs { grid-area:thumbs; display:flex; gap:6px; }
.tile-thumbs img { width:56px; height:42px; object-fit:cover; border-radius:3px; background:#eef1ee; }
.photo-tile .tile-thumbs img { width:100%; height:120px; object-fit:contain; }
.tile .story-state { grid-area:state; }
.story-state.is-failed { color:#a12727; font-weight:600; }
.story-state.expires-soon { color:#8a5a00; }
.tile-badge { grid-area:badge; justify-self:end; align-self:center; }
.selection-bar { display:flex; align-items:center; gap:10px; margin-bottom:14px; padding:8px 12px; border-radius:6px; background:#e6efe9; }
.selection-bar > span { margin-right:auto; font-weight:600; }
.empty-state-large { max-width:560px; margin:40px auto; padding:36px 28px; border:2px dashed #b9c8be; border-radius:10px; background:#fff; text-align:center; }
.empty-state-large h2 { margin-bottom:8px; }
.empty-state-large .action-group { justify-content:center; margin:16px 0; }
.drop-overlay { position:absolute; inset:8px; z-index:20; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; border:3px dashed var(--green); border-radius:10px; background:#eef6f0ee; font-size:15px; pointer-events:none; }
.drop-overlay strong { font-size:20px; }
.status-bar { position:sticky; bottom:0; display:flex; flex-wrap:wrap; align-items:center; gap:6px 20px; padding:7px 20px; border-top:1px solid var(--line); background:#fff; font-size:12px; color:var(--muted); }
.status-bar #job-status:empty { display:none; }
.status-notify { display:inline-flex; align-items:center; gap:6px; margin-left:auto; }
.status-notify .button { padding:4px 10px; font-size:12px; }
.dialog-path { font-weight:600; }
#story-output > .extraction-notes { margin:16px 0 0; }
#photo-dialog { max-width:900px; padding:0; }
.photo-dialog-body { display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,320px); gap:20px; padding:20px 24px 24px; }
#photo-preview { width:100%; max-height:60vh; object-fit:contain; background:#eef1ee; border-radius:4px; }
.photo-fields { display:flex; flex-direction:column; gap:12px; }
.photo-fields textarea { width:100%; border:1px solid #bfcac2; border-radius:3px; padding:9px; font:inherit; }
.photo-fields .action-group { justify-content:flex-start; align-items:end; }
.pt-confirm { max-width:460px; }
.pt-confirm ul { margin:0 0 16px; padding-left:20px; }
.pt-confirm-actions { display:flex; justify-content:flex-end; gap:10px; }
.help-drawer { position:fixed; top:56px; right:0; bottom:0; z-index:40; width:min(380px,100vw); display:flex; flex-direction:column; border-left:1px solid var(--line); background:#fff; box-shadow:-8px 0 24px #0001; }
.help-drawer-header { display:flex; align-items:center; justify-content:space-between; padding:14px 18px; border-bottom:1px solid var(--line); }
.help-drawer-header button { border:0; background:transparent; font-size:22px; line-height:1; }
.help-drawer-body { flex:1; overflow:auto; padding:16px 18px; }
.help-drawer-body h3 { font-size:16px; margin-bottom:10px; }
.help-drawer-body ol { padding-left:20px; }
.help-drawer-body li { margin-bottom:8px; }
.help-drawer-footer { margin:0; padding:12px 18px; border-top:1px solid var(--line); }
@media(min-width:1200px) { body.help-open .site-main { padding-right:380px; } }
.help-topic { margin-bottom:20px; }
.app .account-menu-items .menu-tool,.menu-panel > .narrow-only { display:none; }
.launcher-continue { margin-bottom:28px; }
.launcher-continue h2,.launcher-tools-title { font-size:16px; margin:0 0 12px; }
.launcher-tools .tool-card h3 { font-size:18px; margin-bottom:8px; }
.free-label { font-size:11px; color:#1d5c3c; background:#dff0e5; border-radius:9px; padding:1px 8px; vertical-align:middle; }
.launcher-storage { margin-top:24px; color:var(--muted); font-size:13px; }
.launcher-billing { margin-top:28px; }
.launcher-billing h2 { font-size:16px; margin:0 0 12px; }
.billing-list { list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.billing-list li { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 16px; padding:10px 14px; border:1px solid var(--line, #d9dee5); border-radius:6px; }
.billing-list li span { display:flex; flex-direction:column; gap:2px; color:var(--muted); font-size:13px; }
.billing-list li strong { color:var(--ink); font-size:14px; }
@media(max-width:767px) {
  .se-layout { grid-template-columns:minmax(0,1fr); }
  .folder-pane { position:fixed; top:0; bottom:0; left:0; z-index:60; width:min(320px,86vw); max-height:none; transform:translateX(-105%); transition:transform .2s; box-shadow:8px 0 24px #0002; }
  .folder-pane.is-open { transform:none; }
  .folder-pane-header { display:flex; align-items:center; justify-content:space-between; padding:0 6px 8px; font-weight:600; }
  .folders-toggle { display:inline-flex; }
  .se-toolbar { padding:8px 12px; }
  .breadcrumb { flex-basis:100%; order:2; }
  .breadcrumb li:not(:nth-last-child(-n+2)) { display:none; }
  .breadcrumb li:nth-last-child(2):not(:first-child)::before { content:'… ›'; margin:0 8px 0 0; }
  .toolbar-actions { order:1; margin-left:auto; }
  .content-pane { padding:12px; }
  .info-line { margin:10px 12px 0; }
  .tile-grid { grid-template-columns:minmax(0,1fr); }
  .photo-dialog-body { grid-template-columns:1fr; padding:14px; }
  .status-bar { padding:6px 12px; }
  .app .site-header nav { display:none; }
  .app .account-menu-items .menu-tool,.menu-panel > .narrow-only { display:block; }
  .wide-only { display:none!important; }
  .breadcrumb { order:3; }
  .toolbar-actions { order:2; }
}

/* Phase 5: menus, pickers, drag and drop, undo. */
.menu-popup { position:fixed; z-index:1000; top:0; left:0; max-height:70vh; overflow:auto; }
.menu-popup > button:disabled { color:#9aa39e; cursor:default; background:transparent; }
.menu-separator { height:1px; margin:4px 2px; background:var(--line); }
.more-button { min-width:28px; height:28px; padding:0 6px; border:1px solid transparent; border-radius:4px; background:transparent; color:var(--muted); font-size:16px; line-height:1; }
.more-button:hover,.more-button[aria-expanded="true"] { background:#eef3ef; border-color:#cbd4cd; color:var(--ink); }
.tree-row .more-button { min-width:24px; height:22px; margin-left:2px; visibility:hidden; }
.tree-row:hover .more-button,.tree-item:focus-within > .tree-row .more-button,.tree-row .more-button[aria-expanded="true"] { visibility:visible; }
.tile .more-button { position:absolute; top:8px; right:42px; }
.photo-tile .more-button { right:8px; }
.folder-tile-wrap { position:relative; }
.folder-tile-wrap > .folder-tile { width:100%; }
.folder-tile-wrap > .more-button { position:absolute; top:10px; right:10px; }
.drop-target { outline:3px solid var(--green)!important; outline-offset:-2px; background:#e4f1e8!important; }
.tile[draggable="true"] { cursor:grab; }
.tile.is-dragging { opacity:.5; }
.pt-toast-action { border:1px solid #ffffff99!important; border-radius:4px; font-size:13px!important; font-weight:600; padding:4px 10px!important; }
.pt-picker { max-width:480px; }
.pt-picker-list { max-height:50vh; overflow:auto; margin-bottom:16px; }
.pt-picker fieldset { border:0; margin:0 0 12px; padding:0; }
.pt-picker legend { float:none; font-size:13px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); margin-bottom:6px; }
.pt-picker-option { display:flex!important; align-items:center; gap:10px; padding:8px 10px; border-radius:4px; cursor:pointer; }
.pt-picker-option:hover { background:#eef3ef; }
.pt-picker-option input { width:auto; }
.pt-picker-option small { margin-left:auto; color:var(--muted); }
.pt-picker-option.is-disabled { color:var(--muted); cursor:default; }

/* Phase 6: story navigation, grid and list views, status bar. */
.story-nav { display:inline-flex; align-items:center; gap:4px; margin-right:6px; }
.story-nav .button { padding:6px 11px; font-size:16px; line-height:1; }
.story-position { min-width:52px; text-align:center; font-size:12px; color:var(--muted); }
.view-bar { display:flex; justify-content:flex-end; margin-bottom:10px; }
.view-switch { display:inline-flex; border:1px solid #cbd4cd; border-radius:4px; overflow:hidden; }
.view-switch button { border:0; background:#fff; padding:5px 12px; font-size:12px; color:var(--ink); }
.view-switch button + button { border-left:1px solid #cbd4cd; }
.view-switch button[aria-pressed="true"] { background:#dfece3; font-weight:600; }
.tile-photos { display:none; }
.list-header,.document-list.is-list .tile { grid-template-columns:28px minmax(0,1fr) 70px 70px minmax(150px,220px) 72px; grid-template-areas:"check name source photos state actions"; }
.list-header { display:grid; gap:8px; padding:0 12px 6px; font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); border-bottom:1px solid var(--line); }
.document-list.is-list { grid-template-columns:minmax(0,1fr); gap:0; }
.document-list.is-list .tile { display:grid; align-items:center; gap:8px; padding:6px 12px; border-width:0 0 1px; border-radius:0; }
.document-list.is-list .tile-preview,.document-list.is-list .tile-thumbs,.document-list.is-list .tile-badge { display:none; }
.document-list.is-list .tile-photos { display:block; grid-area:photos; font-size:12px; color:var(--muted); }
.document-list.is-list .tile .story-state { grid-area:state; }
.document-list.is-list .tile .more-button { position:static; grid-area:actions; justify-self:end; }
.document-list.is-list .tile .story-trash { grid-area:actions; justify-self:start; }
.document-list.is-list .photo-tile .more-button { grid-area:actions; }
.storage-usage { display:inline-flex; flex-wrap:wrap; align-items:center; gap:6px 16px; }
.usage-item { display:inline-flex; align-items:center; gap:6px; }
.usage-item meter { width:70px; height:8px; }
.save-state:empty,.status-jobs:has(#job-status[hidden]) { display:none; }
.status-button { border:0; background:transparent; color:var(--green); font-size:12px; font-weight:600; padding:2px 4px; text-decoration:underline; }
.job-panel { position:fixed; inset:auto auto 44px 20px; width:min(380px,calc(100vw - 32px)); }
.job-panel h2 { font-size:14px; margin-bottom:8px; }
.job-panel ul { list-style:none; margin:0 0 10px; padding:0; max-height:40vh; overflow:auto; }
.job-panel li { display:flex; justify-content:space-between; gap:12px; padding:6px 0; border-bottom:1px solid var(--line); }
.job-panel li button { border:0; background:none; padding:0; color:var(--green); text-align:left; overflow-wrap:anywhere; }
.job-panel li span { flex-shrink:0; font-size:12px; color:var(--muted); }
.bell-button { display:inline-flex; align-items:center; justify-content:center; width:30px; height:28px; border:1px solid #cbd4cd; border-radius:4px; background:#fff; color:var(--muted); }
.bell-button[aria-pressed="true"] { color:#fff; background:var(--green); border-color:var(--green); }
@media(max-width:767px) {
  .list-header { display:none!important; }
  .document-list.is-list .tile { grid-template-columns:28px minmax(0,1fr) auto; grid-template-areas:"check name actions" "check state state"; }
  .document-list.is-list .tile-source,.document-list.is-list .tile-photos { display:none; }
  .story-position { display:none; }
}

/* Real screenshots in marketing frames (replace the Phase 2 illustrations). */
.marketing .preview-shot { margin:0; padding:0; background:#fff; }
.marketing .preview-shot picture,.marketing .preview-shot img { display:block; width:100%; height:auto; }
.marketing .marketing-tool-card .preview-shot { aspect-ratio:16/9; overflow:hidden; }
.marketing .marketing-tool-card .preview-shot img,.marketing .step .preview-shot img { height:100%; object-fit:cover; object-position:left top; }
.marketing .step .preview-shot img { object-position:62% top; }
.marketing .step .preview-shot { aspect-ratio:4/3; overflow:hidden; }
.marketing .marketing-hero .shot-hero { border:0; box-shadow:0 24px 60px #0006; }