:root { color-scheme: light; --paper: #faf9f6; --ink: #292f38; --muted: #7a7d83; --line: #e5e3df; --accent: #7465b3; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 14px/1.6 'Segoe UI', Arial, sans-serif; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
:focus-visible { outline: 3px solid #8d78c7; outline-offset: 4px; }
.skip { position: fixed; top: -100px; left: 15px; background: white; padding: 12px; z-index: 9; }
.skip:focus { top: 15px; }
.sidebar { position: fixed; inset: 0 auto 0 0; width: 244px; padding: 32px 23px; border-right: 1px solid var(--line); background: #f2f1ed; display: flex; flex-direction: column; }
.brand { display: flex; align-items: center; gap: 12px; font-size: 18px; line-height: 1.2; letter-spacing: -.5px; }
.brand b { font-weight: 650; }
.brand-mark { display: grid; place-content: center; position: relative; background: #33323f; width: 45px; height: 49px; color: #faf9ed; border-radius: 13px 13px 13px 3px; font: bold 42px Georgia, serif; }
.brand-mark span { position: absolute; right: 4px; top: 3px; font-size: 29px; color: #c9bbf2; }
.workspace { display: flex; gap: 10px; align-items: center; margin: 42px 0 31px; padding: 13px 9px; border: 1px solid var(--line); background: #fbfaf7; border-radius: 8px; }
.avatar { background: #e9e4f2; width: 31px; height: 34px; border-radius: 6px; display: grid; place-items: center; font-size: 10px; font-weight: 700; color: #6b598e; }
.workspace strong { display: block; font-size: 11px; }.workspace small { display: block; font-size: 9px; color: var(--muted); }
.nav-label, .eyebrow { font-size: 9px; letter-spacing: 1.8px; font-weight: 600; }
.nav-label { color: var(--muted); padding: 0 8px; margin-bottom: 15px; }
nav { display: grid; gap: 7px; }nav a { display: flex; align-items: center; gap: 10px; font-size: 11px; color: #72737b; padding: 12px 10px; border-radius: 6px; }nav a.active { background: #e7e1f1; color: #67528d; font-weight: 600; }.count { margin-left: auto; background: #f7f5fb; border-radius: 4px; padding: 0 6px; font-size: 9px; }
.sidebar-note { margin-top: auto; padding: 25px 8px 0; }.sidebar-note>span { font-size: 36px; color: #8a7aac; }.sidebar-note p { font: 19px/1.55 Georgia, serif; color: #656070; }.sidebar-note small { font-size: 10px; color: var(--muted); }
.shell { margin-left: 244px; }.topbar { height: 83px; border-bottom: 1px solid var(--line); padding: 0 46px; display: flex; justify-content: space-between; align-items: center; font-size: 11px; color: var(--muted); }.topbar strong { font-weight: 500; color: #54545b; }.topbar i { font-style: normal; margin: 0 12px; color: #b5b2ba; }.top-badge { font-size: 8px; letter-spacing: 1.6px; display: flex; align-items: center; }.top-badge i { width: 5px; height: 5px; border-radius: 50%; background: #8c9f87; margin-right: 8px; }
main { max-width: 1280px; margin: auto; padding: 44px 46px 30px; }.intro { display: flex; justify-content: space-between; align-items: center; padding: 0 0 39px; }.eyebrow { color: #8c809f; margin: 0 0 13px; }h1 { font: normal clamp(39px, 3.8vw, 57px)/1.1 Georgia, serif; letter-spacing: -1.4px; margin: 0 0 18px; }h1 em { color: #82709d; font-weight: normal; }.lead { font-size: 13px; line-height: 1.9; color: var(--muted); margin: 0; }.intro-note { padding: 8px 27px; margin-right: 25px; }.orbit { display: grid; place-items: center; border: 1px solid #d8d0e5; border-radius: 50%; width: 68px; height: 68px; font-size: 35px; color: #8d7aa8; position: relative; }.orbit:after { content: ''; position: absolute; inset: -8px 7px; border: 1px solid #e3dced; border-radius: 50%; transform: rotate(35deg); }.intro-note p { font-size: 12px; color: var(--muted); line-height: 1.7; margin: 20px 0 10px; }.intro-note strong { font-weight: 500; color: #5d5867; }.edition { font-size: 7px; letter-spacing: 1.5px; color: #a29aa9; }
.delivery-grid { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(235px, 1fr); gap: 24px; scroll-margin-top: 20px; }.upload-panel { border: 1px solid var(--line); border-radius: 10px; padding: 28px; background: white; }.panel-title { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 25px; }h2 { font-size: 22px; font-weight: 550; letter-spacing: -.6px; margin: 0; }.panel-title .eyebrow { font-size: 8px; margin-bottom: 5px; }.pill { font-size: 7px; letter-spacing: 1px; white-space: nowrap; border: 1px solid var(--line); border-radius: 15px; padding: 5px 8px; color: #9b97a0; }.dropzone { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px dashed #c8c0d8; border-radius: 8px; background: #faf8fe; min-height: 230px; padding: 25px 18px; text-align: center; cursor: pointer; }.dropzone:hover, .dropzone.dragging, .dropzone.selected { border-color: #9c86c0; background: #f4effc; }.dropzone:focus-within { outline: 3px solid #9c86c0; outline-offset: 3px; }.upload-icon { background: white; border: 1px solid #ebe5f3; width: 54px; height: 60px; border-radius: 10px; display: grid; place-items: center; margin-bottom: 15px; color: #9a85b9; }.upload-icon svg { width: 31px; height: 34px; }.dropzone strong { font-size: 13px; font-weight: 600; overflow-wrap: anywhere; max-width: 100%; }.dropzone>span:not(.upload-icon) { font-size: 11px; color: #a49bad; margin-top: 4px; }.dropzone small { margin-top: 17px; font-size: 9px; color: #a69db3; }.dropzone input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }.submit-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 20px; }.submit-row p { color: #99959d; font-size: 9px; margin: 0; }button { border: 0; background: #756293; color: white; border-radius: 5px; padding: 12px 17px; font-size: 10px; font-weight: 600; white-space: nowrap; cursor: pointer; }button span { margin-left: 16px; }button:hover { background: #604c7e; }button:disabled { opacity: .65; cursor: wait; }
.brief { background: #f0ede6; border: 1px solid #e8e3da; border-radius: 10px; padding: 28px; display: flex; flex-direction: column; }.brief .eyebrow { color: #9c907d; font-size: 8px; }.brief h2 { font: normal 29px/1.2 Georgia, serif; color: #675f52; margin: 2px 0 22px; }.brief ol { padding: 0; margin: 0; list-style: none; }.brief li { display: flex; gap: 13px; margin-bottom: 15px; }.brief li>span { font: italic 12px Georgia, serif; color: #a99c86; padding-top: 2px; }.brief li strong { font-size: 11px; font-weight: 600; color: #6b6458; }.brief li p { font-size: 10px; line-height: 1.7; color: #9d9384; margin: 3px 0 0; }.brief-footer { border-top: 1px solid #dfd8cc; margin-top: auto; padding-top: 15px; font-size: 7px; letter-spacing: 1.4px; color: #a2947d; }
.file-section { padding-top: 38px; scroll-margin-top: 20px; }.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 15px; margin-bottom: 20px; }.section-heading .eyebrow { font-size: 8px; margin-bottom: 5px; }.section-heading h2 { font-size: 19px; }.section-heading h2 span { margin-left: 6px; padding: 2px 6px; background: #ebe7f1; color: #9b8daf; font: 10px 'Segoe UI',sans-serif; border-radius: 4px; }.section-heading>p { font-size: 10px; color: #a3a0a5; margin: 0; }.empty { border: 1px solid var(--line); border-radius: 8px; background: #f7f6f2; padding: 30px; text-align: center; }.empty>span { display: block; color: #bbb4c1; font-size: 28px; }.empty strong { display: block; font-size: 11px; font-weight: 500; color: #96909e; margin-top: 5px; }.empty p { margin: 4px 0 0; font-size: 10px; color: #b4adb9; }.file-list { border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }.file-row { display: flex; align-items: center; gap: 15px; background: white; padding: 16px 20px; border-bottom: 1px solid var(--line); }.file-row:last-child { border: 0; }.file-row:hover { background: #f5f1fb; }.file-icon { display: grid; place-items: center; width: 35px; height: 39px; border-radius: 6px; background: #f0ecf7; color: #9985b3; }.file-row>div { flex: 1; min-width: 0; }.file-row strong { display: block; font-size: 12px; overflow-wrap: anywhere; }.file-row small { display: block; font-size: 9px; color: #9f98a5; margin-top: 2px; }.file-size, .file-open { font-size: 10px; white-space: nowrap; color: #92819f; }.file-size { color: #a29ba8; }.notice { font-size: 12px; padding: 12px 15px; margin-bottom: 18px; border-radius: 6px; overflow-wrap: anywhere; }.notice.error { background: #fff0eb; color: #a45242; }.notice.success { background: #edf4ed; color: #487252; }.notice a { text-decoration: underline; }footer { max-width: 1280px; margin: auto; padding: 22px 46px 30px; display: flex; justify-content: space-between; color: #a5a1aa; font-size: 9px; }
@media (max-width: 1100px) { .sidebar { width: 210px; padding: 27px 17px; }.shell { margin-left: 210px; }main { padding: 35px 30px; }.topbar { padding: 0 30px; }.upload-panel, .brief { padding: 22px; }.delivery-grid { gap: 18px; }.intro-note { margin: 0; padding: 0 10px; }.submit-row { align-items: stretch; flex-direction: column; }.submit-row button { align-self: flex-end; }footer { padding: 20px 30px; } }
@media (max-width: 850px) { .sidebar { position: static; width: auto; padding: 18px 25px; flex-direction: row; align-items: center; justify-content: space-between; border-right: 0; border-bottom: 1px solid var(--line); }.workspace, .nav-label, .sidebar-note { display: none; }.brand { font-size: 14px; }.brand-mark { width: 35px; height: 38px; font-size: 34px; }.brand-mark span { font-size: 21px; }.sidebar nav { display: flex; }.sidebar nav a { font-size: 10px; padding: 8px; }.sidebar nav a:last-child { display: none; }.shell { margin: 0; }.topbar { height: 58px; }.delivery-grid { grid-template-columns: minmax(0, 1.6fr) minmax(215px, 1fr); } }
@media (max-width: 600px) { .sidebar { padding: 17px 20px; }nav a:not(.active) { display: none; }.topbar { padding: 0 20px; font-size: 10px; }.top-badge { display: none; }main { padding: 32px 20px 15px; }.intro { padding-bottom: 30px; }h1 { font-size: 43px; }.intro-note { display: none; }.lead { font-size: 12px; }.delivery-grid { grid-template-columns: minmax(0,1fr); }.upload-panel { padding: 22px 18px; }.brief { padding: 25px; }.brief h2 br { display: none; }.brief h2 { font-size: 27px; }.brief ol { margin-top: 3px; }.brief li p { font-size: 11px; }.section-heading>p { display: none; }.file-row { gap: 10px; padding: 14px 12px; }.file-open { display: none; }.file-row strong { font-size: 11px; }.file-section { padding-top: 32px; }.section-heading h2 { font-size: 18px; }footer { padding: 25px 20px; gap: 15px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }