/* The Paper Studio theme. Shared components keep every workflow consistent. */
:root {
  --navy:#233d35; --teal:#315c4c; --teal-dark:#244638;
  --teal-light:#e8eee5; --coral:#c98569; --coral-light:#f8e9de;
  --lavender:#e9e3f1; --background:#f7f5ef; --surface:#fffefa;
  --muted:#62665d; --line:#dedfd4; --danger:#a12e2e;
  --radius:16px; --shadow:0 3px 10px rgb(43 51 39 / 3%);
  --shadow-hover:0 10px 24px rgb(43 51 39 / 8%);
}
body {font-family:"Segoe UI",system-ui,sans-serif; line-height:1.65;}
.workspace-layout {background:var(--background) url("images/paper-grain.85e9ab6cd412.svg");}
h1 {font-weight:650; letter-spacing:-.045em; font-size:clamp(30px,3vw,42px);}
h2,h3 {font-weight:650; letter-spacing:-.025em;}
.workspace-sidebar {width:250px; background:#f0f1e9; border-color:#d9ddcf; padding:28px 18px 20px;}
.sidebar-brand {font-size:17px; margin-bottom:36px; gap:10px;}
.sidebar-brand .brand-mark {background:var(--teal-dark); border-radius:13px 13px 3px 13px; border:1px solid #193f2e; box-shadow:3px 3px 0 #c6d0be; font-family:Georgia,serif; font-size:25px;}
.brand-caption {color:#606b5c; font-size:11px;}
.sidebar-label {font-size:11px; color:#626b5c;}
.sidebar-navigation a {border:1px solid transparent; border-radius:9px; font-weight:550; color:#4a594d;}
.sidebar-navigation a:hover {background:#e4e9dc;}
.sidebar-navigation a[aria-current="page"] {background:var(--teal-dark); color:#fffefa; border-color:#244638; box-shadow:0 2px 3px #243c3510;}
.sidebar-icon {font-size:19px; font-weight:400;}
.sidebar-tip {background:#e6e1ee; border-color:#d7cfe2; border-radius:12px;}
.sidebar-tip p {color:#5f576b; font-size:13px;}
.sidebar-account {border-color:#d6dacd;}
.account-avatar {background:#eed7c9; color:#633b2a; border:1px solid #d4b19d;}
.sidebar-logout {font-size:13px; padding:8px 12px; border:1px solid #c5cebe; border-radius:8px; margin-top:14px;}
.workspace-content {margin-left:250px; min-width:0;}
.workspace-topbar {min-height:68px; background:#fffefa; border-color:var(--line); font-size:13px; padding:16px 36px;}
.topbar-label {padding:5px 11px; border:1px solid #d9ddcf; border-radius:30px; font-size:12px; background:#f0f1e9;}
.workspace-content main {max-width:1380px; padding:36px 40px 24px;}
.dashboard-welcome {position:relative; grid-template-columns:1.35fr 1fr; padding:38px; gap:32px; border:1px solid #d8d5c8; border-radius:18px; background:#eae6dc url("images/paper-landscape.44900c86a8ea.svg") right center / cover no-repeat; min-height:300px;}
.welcome-copy {position:relative; max-width:530px;}
.welcome-copy .eyebrow {color:#475c4f; font-size:11px;}
.welcome-copy h1 {color:#233d35; font-family:Georgia,"Times New Roman",serif; font-weight:400; letter-spacing:-.045em; font-size:clamp(34px,3.5vw,52px); line-height:1.08; max-width:440px;}
.welcome-copy > p:not(.eyebrow) {color:#475247; font-size:15px; max-width:370px;}
.welcome-note {background:#fffefa; border:1px solid #d5d0bf; border-radius:12px; box-shadow:6px 6px 0 #293c3420; transform:none; padding:22px; max-width:290px; width:100%;}
.note-label {font-size:10px; color:#6a6255;}
.welcome-note h2 {color:var(--navy); font-size:20px; margin:10px 0 15px;}
.welcome-note p {color:#62665d; font-size:13px;}
.note-bottom {border-color:var(--line); color:#596251; font-size:11px;}
.start-steps {list-style:none; padding:0; margin:0; counter-reset:steps; display:grid; gap:12px;}
.start-steps li {counter-increment:steps; display:flex; gap:10px; align-items:center; font-size:13px; color:#4d574d;}
.start-steps li::before {content:counter(steps); flex-shrink:0; width:25px; height:25px; display:grid; place-items:center; border:1px solid #cbd3c0; border-radius:50%; background:#eef1e6; font-size:11px; color:#315c4c;}
.button,.welcome-button {min-height:46px; border:1px solid #244638; border-bottom-width:3px; border-radius:9px; background:var(--teal); color:#fffefa; padding:10px 18px; font-weight:600; font-size:14px; box-shadow:0 1px 1px #203c3510;}
.button:hover,.welcome-button:hover {background:var(--teal-dark); color:#fff; box-shadow:0 4px 10px #203c3515;}
.button.secondary {border-color:#a7b3a2; background:#fffefa; color:var(--teal-dark);}
.button.secondary:hover {background:#edf1e8; border-color:var(--teal);}
.button.danger {border-color:#bd7c77; color:#8f2929; background:#fff3ef;}
.book-open-link {border:1px solid #bec9b7; border-radius:8px; padding:7px 12px; background:#f4f6ef; font-size:13px;}
.book-open-link:hover {background:#e8eee2; text-decoration:none;}
.dashboard-summary {background:transparent; border:0; border-radius:0; padding:0; gap:16px; margin:22px 0 36px;}
.summary-item,.summary-description {background:#fffefa; border:1px solid var(--line); padding:20px; border-radius:12px; margin:0; align-self:stretch;}
.summary-item:nth-child(1) {background:#edf1e6; border-color:#d4ddc6;}
.summary-item:nth-child(2) {background:#f8ece3; border-color:#e5d4c6;}
.summary-description {background:#eee9f3; border-color:#ddd3e7; display:flex; flex-direction:column; justify-content:center;}
.summary-item strong {font-size:30px; font-weight:600;}
.summary-item div > span,.summary-description span {font-size:12px;}
.summary-marker {background:#dce6cf; color:#3d5935;}
.summary-marker.peach {background:#efd8c5; color:#805033;}
.library-heading h2 {font-size:25px;}
.library-search input {background:#fffefa; font-size:14px; border-color:#b8c1af; border-radius:9px;}
.library-book {border-radius:13px; padding:25px; border-color:#d7ddce; border-top:4px solid #9aaa8d;}
.library-book:nth-child(3n+2) {border-top-color:#c98569;}
.library-book:nth-child(3n+3) {border-top-color:#a595b8;}
.library-book h3 {font-size:22px; line-height:1.3;}
.library-book .avatar {background:#e5ecd9; color:#365332; border:1px solid #cbd7bd; border-radius:9px;}
.library-book:nth-child(3n+2) .avatar {background:#f2e0d2; color:#78432c; border-color:#e0bfaa;}
.library-book:nth-child(3n+3) .avatar {background:#e9e1f0; color:#665377; border-color:#d2c4de;}
.book-company {background:#f1f1ea; color:#5b6257; border:1px solid #e0e2d7; font-size:11px;}
.book-client {font-size:13px;}
.library-book-count {font-size:13px;}
.library-book .timestamp {font-size:11px;}
.book-actions {gap:12px; border-color:var(--line);}
.badge {border:1px solid #d1dcc7; background:#eef2e8; color:#3a5533; border-radius:6px;}
.page-heading {border-bottom:1px solid var(--line); padding-bottom:24px;}
.card {border-color:var(--line);}
.guide {border-left:3px solid #a4b697;}
.instructions {max-width:76ch; font-size:16px;}
.instructions ol,.instructions ul {padding-left:24px;}
.instructions li {padding-left:5px; margin:8px 0;}
.instructions pre {white-space:pre-wrap; overflow-wrap:anywhere;}
.screenshot {background:#f3f4ec; border-color:#d2d9c8; padding:6px; border-radius:12px;}
.auth-intro {padding:32px; border:1px solid #ddd7c8; border-radius:16px; min-height:340px; background:#eae6dc url("images/paper-landscape.44900c86a8ea.svg") right bottom / cover;}
.auth-intro::before {background:var(--coral);}
.auth-intro h1 {font-family:Georgia,serif; font-weight:400; font-size:44px; max-width:350px;}
.auth-intro .muted {font-size:16px; color:#3f5144; max-width:310px; background:#eae6dc; padding:8px; border-radius:4px;}
.auth-layout {gap:28px; align-items:stretch;}
.auth-card {border-top:3px solid #9aaa8d;}
.form-field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),.form-field select,.form-field textarea {border:1px solid #aebba7; border-radius:9px; background:#fffefa; color:#233d35; font-size:16px; min-height:48px; padding:12px 14px; max-width:100%; width:100%;}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus {border-color:#315c4c;}
.form-field.has-errors input,.form-field.has-errors textarea,.form-field.has-errors select {border-color:var(--danger);}
.form-field label {font-size:14px;}
.form-field input[type="checkbox"],.form-field input[type="radio"] {accent-color:var(--teal); width:20px; height:20px; vertical-align:middle;}
.form-field input[type="file"] {width:100%; font-size:14px;}
.editor-form-intro {background:#f3f3eb; padding:16px 18px; border:1px solid #e0e3d5; border-radius:9px;}
.editor-form-intro h2 {font-size:17px;}
.editor-form {border-top:3px solid #a4b697;}
.help-text {font-size:13px;}
.image-upload-panel {background:#f5f6ef; border:1px dashed #aebba7;}
.settings-grid {display:grid; grid-template-columns:1fr 1fr; gap:24px;}
.settings-grid .card > h2:first-child {margin-top:0;}
.settings-divider {border:0; border-top:1px solid var(--line); margin:24px 0;}
.company-identity {display:flex; gap:16px; align-items:center; margin-bottom:20px;}
.company-identity h3 {margin:0 0 6px;}
.company-logo {width:56px; height:56px; object-fit:contain; border:1px solid var(--line); border-radius:10px; background:#fff; padding:4px;}
.notice {border-radius:9px; font-size:14px;}
summary {cursor:pointer; padding:12px 0; font-weight:600;}
.empty {background:#fffefa url("images/paper-grain.85e9ab6cd412.svg"); border-style:dashed;}
.empty p {max-width:460px; margin-left:auto; margin-right:auto;}
.empty .actions {justify-content:center;}
.mobile-menu-toggle {display:none;}
.sidebar-heading {display:block;}
@media(min-width:1500px) {.library-grid {grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:1150px) {
  .workspace-content main {padding:28px 24px;}
  .dashboard-welcome {gap:20px; padding:28px; grid-template-columns:1fr; background-position:left center;}
  .welcome-note {display:none;}
  .welcome-copy {background:#eae6dceF; padding:12px; border-radius:10px;}
  .dashboard-summary {grid-template-columns:1fr 1fr;}
  .summary-description {display:none;}
  .settings-grid {grid-template-columns:1fr;}
}
@media(max-width:900px) {.auth-layout {grid-template-columns:1fr; max-width:600px;} .auth-intro {min-height:0;} .auth-intro h1 {font-size:36px;}}
@media(max-width:760px) {
  .workspace-sidebar {position:static; width:100%; padding:16px;}
  .sidebar-heading {display:flex; align-items:center; justify-content:space-between; gap:12px;}
  .sidebar-brand {margin:0;}
  .sidebar-navigation {margin-top:18px; display:grid; grid-template-columns:1fr 1fr;}
  .sidebar-navigation a {font-size:13px; min-height:46px; padding:10px;}
  .sidebar-bottom {margin-top:14px; padding-top:14px;}
  .sidebar-logout {margin:0;}
  .workspace-content {margin-left:0;}
  .workspace-content main {padding:24px 16px;}
  .js-menu .mobile-menu-toggle {display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:8px 12px; border:1px solid #acb9a4; border-radius:8px; background:#fffefa; color:#244638; font-size:14px; cursor:pointer;}
  .js-menu .workspace-sidebar:not(.menu-open) .sidebar-navigation,.js-menu .workspace-sidebar:not(.menu-open) .sidebar-bottom {display:none;}
  .dashboard-welcome {padding:22px; background-position:center; min-height:0;}
  .welcome-copy {padding:0; background:transparent;}
  .welcome-copy h1 {font-size:37px; max-width:290px;}
  .welcome-copy > p:not(.eyebrow) {background:#eae6dc; padding:5px; border-radius:4px;}
  .dashboard-summary {gap:10px; margin:16px 0 30px;}
  .summary-item {padding:16px 12px;}
  .summary-item div > span {font-size:12px;}
  .library-search input {min-width:0; width:100%; flex:1 1 150px;}
  .library-heading {gap:18px;}
  .library-book {padding:22px;}
  .page-heading {padding-bottom:20px;}
  .editor-form {padding:20px;}
  .auth-intro {padding:24px;}
  .auth-intro h1 {font-size:36px;}
  .settings-grid {gap:16px;}
}
@media(max-width:380px) {.brand-caption {display:none;} .sidebar-brand {font-size:15px;} .sidebar-brand .brand-mark {width:36px;height:36px;} .mobile-menu-toggle {padding:8px;} .book-open-link {width:100%; justify-content:center;} }
@media(prefers-reduced-motion:reduce) {.book-card:hover,.button:active {transform:none;} }

/* Landscape edition: the login artwork now extends across every app page. */
@font-face {
  font-family:"Manrope"; font-style:normal; font-weight:400; font-display:swap;
  src:url("fonts/manrope-latin-400-normal.1589a53d0b0e.woff2") format("woff2");
}
@font-face {
  font-family:"Manrope"; font-style:normal; font-weight:600; font-display:swap;
  src:url("fonts/manrope-latin-600-normal.58d382c3e448.woff2") format("woff2");
}
@font-face {
  font-family:"Manrope"; font-style:normal; font-weight:700; font-display:swap;
  src:url("fonts/manrope-latin-700-normal.ed9e261b92db.woff2") format("woff2");
}
body {font-family:"Manrope","Segoe UI",sans-serif; font-weight:400;}
.workspace-layout {background:#eeeae2;}
.workspace-content {position:relative; isolation:isolate; min-height:100vh;}
.workspace-content::before {
  content:""; position:fixed; inset:0 0 0 250px; z-index:-1; pointer-events:none;
  background:#f3efe6 url("images/workspace-landscape.b3e4b96b50f0.svg") center / cover no-repeat;
}
.workspace-sidebar {
  background:linear-gradient(160deg,#f3f0e9 15%,#e7e4ee 62%,#dce7d6);
  border-color:#c9d1c2;
}
.workspace-topbar {background:#fffefaeb; border-color:#c9d1c2;}
.workspace-content main {min-height:calc(100vh - 68px);}
h1,h2,h3,.welcome-copy h1,.auth-intro h1 {
  font-family:"Manrope","Segoe UI",sans-serif; font-weight:700;
  letter-spacing:-.045em;
}
h1 {font-size:clamp(29px,3vw,42px); line-height:1.2;}
.welcome-copy h1 {font-size:clamp(32px,3.3vw,46px); line-height:1.15;}
.auth-intro h1 {font-size:clamp(32px,3.2vw,44px); line-height:1.16;}
h2 {letter-spacing:-.03em;}
h3 {letter-spacing:-.02em;}
.sidebar-brand {font-weight:700; letter-spacing:-.045em; font-size:16px;}
.brand-caption {font-size:10px; letter-spacing:0;}
.sidebar-navigation a {font-size:13px; font-weight:600; border-radius:13px;}
.sidebar-navigation a[aria-current="page"] {background:#2d5143; box-shadow:inset 0 1px 0 #ffffff25,0 3px 7px #27453515;}
.sidebar-tip {background:#f8f5fbe6; border-color:#cfc4db;}
.page-heading {background:#fffdf3e8; border:1px solid #d2d4c5; border-radius:18px; padding:24px 26px; box-shadow:0 3px 12px #35473206;}
.page-heading h1 {margin-top:4px;}
.card {background:#fffefa; border-color:#cdd5c4; border-radius:18px; box-shadow:0 5px 20px #283f3208;}
.library-heading {background:#fffef4e8; border:1px solid #d1d6c7; padding:20px; border-radius:16px;}
.dashboard-welcome,.auth-intro {border-color:#c8cdbb; box-shadow:0 8px 24px #2f44370a;}
.dashboard-welcome {background-image:linear-gradient(90deg,#f4efe5d9,transparent),url("images/paper-landscape.44900c86a8ea.svg");}
.welcome-copy > p:not(.eyebrow) {font-size:15px;}
.welcome-note {background:#fffefa; border-radius:16px; box-shadow:4px 5px 0 #43573a20;}
.summary-item,.summary-description {box-shadow:0 3px 12px #2c433608;}
.summary-item:nth-child(1) {background:#e9f0df;}
.summary-item:nth-child(2) {background:#f6e5d9;}
.summary-description {background:#e9e1f1;}
.button,.welcome-button {
  border:1px solid #234938; border-radius:14px; padding:11px 20px;
  background:linear-gradient(145deg,#3d6957,#2a4f40); color:white;
  font-family:inherit; font-size:14px; font-weight:700; letter-spacing:-.015em;
  min-height:48px; box-shadow:inset 0 1px 0 #ffffff2b,0 3px 7px #23493818;
}
.button:hover,.welcome-button:hover {background:linear-gradient(145deg,#315c49,#204132); box-shadow:0 5px 12px #23493828;}
.button.secondary {
  background:linear-gradient(145deg,#fffefa,#f2f2e9); border:1px solid #93a68a;
  color:#294c3b; box-shadow:inset 0 1px 0 #fff,0 2px 4px #2349380a;
}
.button.secondary:hover {background:#e6eddc; border-color:#607e54;}
.button.danger {background:linear-gradient(135deg,#fff7f4,#f6e0da); border:1px solid #c27b70; color:#902d28; box-shadow:inset 0 1px 0 #fff;}
.button.danger:hover {background:#f2d5cf; color:#7e231f;}
.book-open-link {background:#f3f5ec; border-radius:12px; border-color:#a6b69a; font-weight:700;}
.book-open-link:hover {background:#e3ecd8;}
.back-link {background:#fffef3e8; border:1px solid #ccd4c1; border-radius:30px; padding:8px 16px; font-size:13px;}
.mobile-menu-toggle {font-family:inherit; font-weight:600;}
.sidebar-logout {border-radius:12px; background:#ffffff70;}
.form-field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),.form-field select,.form-field textarea,.library-search input {
  border-radius:12px; background:#fffffc; border-color:#aebca4; font-family:inherit;
}
.form-field input:focus,.form-field textarea:focus,.form-field select:focus {box-shadow:0 0 0 3px #d8e5cf;}
.form-field label {font-weight:700;}
.form-actions {gap:12px;}
.notice {box-shadow:0 3px 9px #31433308;}
.app-footer {background:#fffef3e8; border:1px solid #d0d6c6; padding:16px 20px; border-radius:12px; color:#4e5f49;}
.auth-intro .muted {background:#f3efe5e8; border:1px solid #ffffff66; border-radius:10px; padding:12px;}
.company-branding {display:flex; align-items:center; gap:14px; background:#fffef3e8; padding:16px; border:1px solid #d1d6c7; border-radius:12px; margin-bottom:20px;}
.company-branding a {display:block; font-size:13px;}
@media(max-width:1150px) {.welcome-copy {background:#f3efe5ef;}}
@media(max-width:760px) {
  .workspace-content::before {inset:0; background-position:62% center;}
  .workspace-content main {min-height:calc(100vh - 80px);}
  .page-heading {padding:20px; border-radius:16px;}
  .library-heading {padding:17px;}
  .welcome-copy {background:#f3efe5dd; padding:12px; border-radius:12px;}
  .welcome-copy h1 {font-size:34px;}
  .welcome-copy > p:not(.eyebrow) {background:none; padding:0;}
  .auth-intro h1 {font-size:34px;}
  .button {padding:10px 16px;}
  .sidebar-navigation a {font-size:12px;}
  .sidebar-brand {font-size:16px;}
}
@media(prefers-reduced-motion:reduce) {.button,.book-open-link {transition:none;}}
@media print {.workspace-content::before {display:none;} .workspace-layout {background:white;} }
/* Keep the mobile navigation above the full-window artwork. */
@media(max-width:760px) {.workspace-sidebar {position:relative; z-index:20;}}