@font-face{font-family:Poppins;src:url(/prototypes/writer-agents/assets/poppins-400-C1IsaolU.ttf) format("truetype");font-weight:400;font-display:swap}@font-face{font-family:Poppins;src:url(/prototypes/writer-agents/assets/poppins-500-BblA7dQf.ttf) format("truetype");font-weight:500;font-display:swap}@font-face{font-family:Poppins;src:url(/prototypes/writer-agents/assets/poppins-600-Gz22PxOe.ttf) format("truetype");font-weight:600;font-display:swap}:root{font-family:Poppins,Arial,sans-serif;color:#000;background:transparent;font-synthesis:none;--surface:#fbfbfd;--line:#e4e7ed;--muted:#828282;--blue:#f3f5ff;--shadow:0 3px 40px #acb9dc66 }*{box-sizing:border-box}html,body,#root{margin:0;width:100%;height:100%;overflow:hidden}button,input,textarea{font:inherit;color:inherit}button{cursor:pointer;border:0;background:transparent;padding:0}button:disabled{cursor:default;opacity:.35}button,input,textarea,[contenteditable]{outline:none}button:focus-visible,input:focus-visible,textarea:focus-visible,[contenteditable]:focus-visible{outline:2px solid #6985ff;outline-offset:3px}button{transition:background .15s,box-shadow .15s,opacity .15s}button:hover:not(:disabled){filter:brightness(.97)}input,textarea{min-width:0}textarea{resize:vertical}h1,h2,p{margin:0}a{color:#4b63d5}::selection{background:#e1d0fa}small{font-size:12px;color:var(--muted)}.muted{color:var(--muted)}.icon{display:block;flex-shrink:0;object-fit:contain}.icon-button{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:6px}.icon-button:hover{background:#f0f1f7}.primary{display:inline-flex;align-items:center;justify-content:center;gap:12px;background:#000;color:#fff;border-radius:8px;padding:12px 20px;font-size:14px}.primary .icon{filter:invert(1)}.desktop-viewport{width:100%;height:100%;position:relative}.desktop-canvas{position:absolute;left:50%;top:50%;width:1440px;height:900px;transform-origin:center;overflow:hidden;border-radius:12px;background:var(--surface)}.search{display:flex;gap:8px;align-items:center;border:1px solid var(--line);border-radius:10px;height:40px;padding:0 12px;background:#fff}.search input{width:100%;border:0;background:transparent;font-size:14px}.search input:focus-visible{outline:0}.search:focus-within{border-color:#6985ff}.search button{font-size:20px;color:var(--muted)}.library{display:flex;width:100%;height:100%;background:#fff}.main-nav{width:234px;flex-shrink:0;padding:24px 12px;border-right:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between}.writer-logo{width:48px;height:48px;display:grid;place-items:center;background:#000;border-radius:50%;margin:12px 12px 20px}.nav-group{background:var(--blue);border-radius:12px;padding:8px}.nav-group button,.nav-bottom>button:not(.avatar),.studio-link{display:flex;align-items:center;gap:16px;width:100%;height:40px;padding:8px 12px;font-size:15px;text-align:left;border-radius:8px;color:#333}.nav-group button.active{background:#e4e9ff;color:#000}.nav-group button:hover{background:#e9edff}.studio-link{margin-top:8px;padding:12px 20px;background:var(--blue);height:48px;border-radius:12px}.studio-link span{margin-left:auto;color:#828282}.nav-bottom{position:relative}.nav-bottom>button:not(.avatar){padding-left:24px}.nav-bottom>button:first-child{border-top:1px solid #f5f5f9;padding-top:12px;height:48px;border-radius:0}.style-guide{border-top:1px solid #f5f5f9;border-bottom:1px solid #f5f5f9;margin:12px 0;padding:16px 20px}.style-guide small{font-size:9px;letter-spacing:1px;display:block}.style-guide button{font-size:12px;display:flex;justify-content:space-between;width:100%;margin-top:6px}.avatar{height:48px;display:flex;align-items:center;gap:10px;padding:4px 8px;background:#f5f5f9;border-radius:12px}.avatar img{border-radius:50%;object-fit:cover}.profile-menu{position:absolute;bottom:60px;left:0;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:20px;width:265px;z-index:10;font-size:13px}.profile-menu p{margin:8px 0}.profile-menu button{text-decoration:underline}.library-main{width:1206px;overflow:auto;overflow-x:hidden}.library-header{display:flex;justify-content:space-between;align-items:center;height:112px;padding:32px 40px}.library-header small{font-size:9px;letter-spacing:1px}.library-header h1{font-size:24px;letter-spacing:3px;font-weight:600;margin-top:3px}.library-header .search{width:310px;background:#f5f5f9;border:0}.banner-window{position:relative;margin:26px 0 54px 232px}.banner-track{display:flex;gap:24px;transition:transform .5s ease}.collection-banner{position:relative;overflow:hidden;flex-shrink:0;isolation:isolate;width:741px;height:221px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border-radius:16px;box-shadow:0 2px 10px #bfcbff40}.collection-banner strong{font-size:24px;font-weight:500;margin-top:6px}.collection-banner>span:last-child{font-size:16px;color:#333}.banner-tag{position:absolute;top:18px;background:#000;color:#fff;font-size:13px;letter-spacing:1px;padding:3px 8px;border-radius:4px}.orb{position:absolute;z-index:-1;pointer-events:none}.orb-one{width:475px;height:475px;left:-47px;top:-115px;transform:rotate(135deg)}.orb-two{width:459px;height:458px;left:336px;top:-86px}.orb-three{width:489px;height:486px;left:392px;top:-92px;transform:rotate(120deg)}.banner-dots{position:absolute;bottom:-24px;left:345px;display:flex;gap:8px}.banner-dots button{width:6px;height:6px;border-radius:50%;background:#e4e7ed}.banner-dots button[aria-pressed=true]{background:#828282}.agent-sections{width:916px;margin:0 auto;padding-bottom:70px}.agent-sections section+section{margin-top:56px}.agent-sections h2{font-size:20px;font-weight:500;margin-bottom:24px}.agent-sections h2 button{display:flex;align-items:center;gap:10px}.agent-grid{display:grid;grid-template-columns:repeat(4,214px);gap:20px}.agent-card{height:225px;position:relative;border-radius:12px;box-shadow:0 1px 10px #bfcbff4d;background:#fff;transition:box-shadow .2s,transform .2s}.agent-card:hover{box-shadow:0 4px 18px #bfcbff88;transform:translateY(-2px)}.agent-open{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px 12px 12px;gap:8px;border-radius:12px}.agent-art{margin-bottom:4px}.agent-open strong{font-size:14px;line-height:1.6;font-weight:500;max-width:190px}.agent-open span{font-size:12px;color:#4f4f4f;line-height:1.6;max-width:190px;min-height:39px}.favorite{position:absolute;right:4px;top:4px}.filter-row{display:flex;justify-content:space-between;align-items:baseline;margin:36px 0}.filter-row>button{font-size:13px;text-decoration:underline}.empty-results{text-align:center;padding:80px 0}.empty-results button{margin-top:20px;text-decoration:underline}.modal-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#1112;display:grid;place-items:center;z-index:20;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.agent-detail{position:relative;background:#fff;box-shadow:var(--shadow);padding:48px;width:480px;border-radius:20px;text-align:center}.agent-detail>.icon-button{position:absolute;top:14px;right:14px}.agent-detail h2{font-size:24px;margin:20px 0 12px}.agent-detail p{font-size:14px;line-height:1.8;margin:12px 0 24px}.workspace{width:100%;height:100%;display:flex;background:var(--surface)}.writing-sidebar{position:relative;width:428px;flex-shrink:0;height:900px;display:flex;flex-direction:column}.agent-header{display:flex;align-items:center;gap:12px;padding:24px;height:96px;flex-shrink:0}.agent-header>.icon-button:first-child{width:16px}.agent-header>span{font-size:16px;font-weight:500;white-space:nowrap}.agent-header .new-output{margin-left:auto;background:#fff;border:1px solid var(--line);border-radius:50%;width:40px;height:40px}.output-list{padding:0 24px 24px;overflow:auto;display:flex;flex-direction:column;gap:12px}.output-list>.search{flex-shrink:0;margin-bottom:4px}.output-card{text-align:left;flex-shrink:0;border:1px solid var(--line);box-shadow:0 2px #f3f3f3;border-radius:8px;background:#fff;height:170px;padding:12px 16px;display:flex;flex-direction:column}.output-card strong{font-weight:500;font-size:14px;line-height:1.8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.output-card small{line-height:1.8}.output-card p{font-size:12px;line-height:1.8;color:var(--muted);margin-top:16px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.current-output{border-color:#bfcbff;background:#f7f8ff}.form-stage{position:relative;flex:1;overflow:hidden;padding:0;display:flex;align-items:flex-start;justify-content:center;background-image:radial-gradient(#d6d7e2 1px,transparent 1px);background-size:12px 12px;background-position:center 100px}.form-stage:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(var(--surface) 12%,transparent 60%,var(--surface));pointer-events:none}.inputs-form{position:relative;width:720px;padding:44px 52px;background:#fff;border-radius:12px;box-shadow:var(--shadow);flex-shrink:0}.form-intro{background:#f4f4ff;border-radius:6px;padding:10px;font-size:14px;margin-bottom:36px}.field{display:flex;flex-direction:column;margin-top:36px;gap:0}.field-label{font-size:14px;font-weight:600;display:flex;align-items:center;justify-content:space-between;line-height:1.8}.field-label button{font-size:12px;font-weight:400}.field-help{font-size:14px;color:var(--muted);line-height:1.8;margin-bottom:14px}.field input,.field textarea{border:1px solid var(--line);background:#fff;padding:14px 16px;border-radius:7px;font-size:14px;width:100%;line-height:1.4}.field input{height:48px}.form-actions{display:flex;align-items:center;justify-content:space-between;margin-top:32px;font-size:12px}.form-actions>button:first-child{color:#4f4f4f;text-decoration:underline}.chat-scroll{padding:0 24px 16px;overflow:auto;min-height:0;flex:1;z-index:1}.inputs-toggle{border:1px solid var(--line);border-radius:8px;padding:12px 16px;width:380px;display:flex;align-items:center;gap:8px;height:46px;background:#fff;font-size:12px;font-weight:500;margin-bottom:16px}.inputs-toggle>.icon:last-child{margin-left:auto;transform:rotate(180deg)}.inputs-toggle[aria-expanded=true]>.icon:last-child{transform:none}.inputs-summary{background:#fff;border:1px solid var(--line);border-radius:8px;margin:-9px 0 16px;padding:16px;font-size:12px;line-height:1.8}.inputs-summary p+p{margin-top:8px}.inputs-summary button{margin-top:12px;text-decoration:underline}.draft-bubble{display:inline-flex;align-items:center;gap:8px;padding:11px 12px;border:1px solid var(--line);border-radius:12px;box-shadow:0 2px #f3f3f3;background:#fff;font-size:12px;font-weight:500;line-height:18px}.chat-message{font-size:14px;line-height:1.8;margin-top:16px}.chat-message.user{padding:12px 16px;background:#e4e7ed;border-radius:12px}.chat-message.agent p{margin-top:16px}.chat-message blockquote{background:#fff;border:1px solid var(--line);border-radius:8px;font-size:12px;line-height:1.8;margin:0 0 10px;padding:8px 12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.co-create{position:absolute;top:380px;left:62px;width:304px;text-align:center;pointer-events:none}.co-create img{display:block;margin:auto auto 24px}.co-create h2{font-size:16px;font-weight:500;color:#333;line-height:1.6;margin-bottom:8px}.co-create p{font-size:14px;color:#4f4f4f;line-height:1.8}.chat-composer{position:relative;z-index:2;background:#fff;border:1px solid #d2d4d7;border-radius:12px;padding:12px 14px 10px;margin:16px 24px 24px;flex-shrink:0}.chat-composer textarea{width:100%;border:0;resize:none;min-height:32px;font-size:14px;line-height:1.8;background:transparent;padding:0}.chat-composer textarea:focus-visible{outline:0}.chat-composer:focus-within{border-color:#9695c2;box-shadow:0 0 0 2px #ede2ff80}.chat-composer textarea::placeholder{color:var(--muted)}.composer-controls{display:flex;justify-content:flex-end;align-items:center;margin-top:6px;gap:4px}.sample-prompt{margin-right:auto;font-size:10px;color:var(--muted);opacity:0;transition:opacity .15s}.chat-composer:hover .sample-prompt,.sample-prompt:focus-visible,.chat-composer:focus-within .sample-prompt{opacity:1}.selection-quote{margin:0 0 12px;padding:8px 12px;border-radius:8px;background:#f3f3f7;display:flex;gap:8px;font-size:12px;line-height:1.8}.selection-quote>span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.selection-quote button{align-self:flex-start}.generating{display:flex;gap:10px;align-items:center;padding:20px 0;font-size:13px;color:#696a7b}.spinner{width:16px;height:16px;border:2px solid #e4e7ed;border-top-color:#7b6dc0;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.editor-panel{position:relative;display:flex;flex-direction:column;margin:16px 16px 16px 0;width:996px;height:868px;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:var(--shadow)}.canvas-header{position:relative;display:flex;align-items:center;justify-content:space-between;min-height:72px;padding:12px 24px;border-bottom:1px solid var(--line);flex-shrink:0}.canvas-title{display:flex;flex-direction:column;min-width:0;flex:1}.canvas-title input{font-size:16px;line-height:1.6;font-weight:500;border:0;padding:0;background:transparent;max-width:810px}.canvas-title small{line-height:1.8}.canvas-actions{display:flex;gap:12px}.editor-toolbar{height:72px;border-bottom:1px solid var(--line);padding:20px 24px;display:flex;justify-content:space-between;align-items:center;flex-shrink:0}.editor-toolbar>div{display:flex;gap:4px}.version-controls{align-items:center;color:var(--muted)}.version-label{font-size:12px;min-width:32px}.document-scroll{overflow:auto;flex:1;min-height:0;scroll-behavior:smooth}.document{width:640px;margin:34px auto 64px;font-size:14px;line-height:1.8;overflow-wrap:break-word;min-height:500px}.document h1{font-size:24px;font-weight:500;line-height:1.6;margin-bottom:24px}.document p{margin-bottom:24px}.document h2{font-size:14px;line-height:1.8;font-weight:600;margin:24px 0 0}.document h2+p{margin-top:0}.document ol,.document ul{padding-left:22px}.document a{pointer-events:none}.document-menu{position:absolute;right:24px;top:60px;z-index:10;display:flex;flex-direction:column;width:200px;border:1px solid var(--line);border-radius:10px;background:#fff;box-shadow:var(--shadow);padding:8px}.document-menu button{padding:10px;text-align:left;font-size:13px;border-radius:6px}.document-menu button:hover{background:var(--blue)}.link-form{padding:12px 24px;background:#f4f4fc;display:flex;gap:12px;align-items:center;font-size:13px;flex-wrap:wrap}.link-form input{flex:1;padding:8px;border:1px solid var(--line);border-radius:6px}.link-form small{flex-basis:100%;color:#a42222}.selection-hint{display:flex;justify-content:space-between;gap:16px;background:#f4effd;border-top:1px solid #e6dbfa;font-size:12px;padding:12px 24px}.selection-hint button{text-decoration:underline}.is-writing .document{animation:writing 1.1s ease-in-out infinite}@keyframes writing{50%{opacity:.45}}.history-stage{flex:1;min-width:0;overflow:hidden;padding:20px 24px 0}.history-actions{display:flex;justify-content:flex-end;align-items:center;gap:16px;font-size:14px;height:48px;margin-bottom:30px}.history-actions>button:not(.primary){padding:10px;border-radius:6px}.history-actions>button:hover{background:#f0f1f7}.history-actions>.primary:hover{background:#111}.draft-stack{position:relative;width:720px;height:800px;margin:0 auto}.stack-sheet{position:absolute;top:0;right:0;bottom:0;left:0;background:#fff;box-shadow:var(--shadow);border-radius:12px;transform-origin:center top}.sheet-3{transform:translateY(54px) scaleX(.82)}.sheet-2{transform:translateY(36px) scaleX(.88)}.sheet-1{transform:translateY(18px) scaleX(.94)}.history-document{position:relative;border-radius:12px;background:#fff;box-shadow:var(--shadow);height:calc(100% - 72px);overflow:auto;padding:24px 40px}.history-document>header{display:flex;align-items:center;justify-content:space-between}.history-document>header>div{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}.history-copy{width:auto;min-height:0;margin:24px 0}.empty-work{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:30px}.empty-work h1{font-size:28px;font-weight:500}.toast{position:absolute;z-index:50;left:50%;bottom:24px;transform:translate(-50%);max-width:760px;background:#181821;color:#fff;border-radius:12px;padding:14px 18px;display:flex;gap:20px;align-items:center;box-shadow:0 6px 24px #0003;font-size:13px;line-height:1.7}.toast button{font-size:20px}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}.library-tools{display:flex;align-items:center;gap:20px}.library-tools>button{font-size:12px;color:#828282;opacity:0}.library-tools:hover>button,.library-tools>button:focus-visible,.library-tools>button[aria-pressed=true]{opacity:1}.document ol{margin:0 0 24px;padding-left:22px}.document li{margin:0}.form-scroll{position:relative;z-index:1;width:100%;height:100%;overflow:auto;padding:94px 0 40px;display:flex;align-items:flex-start;justify-content:center}.form-stage:before{z-index:0}.draft-stack{margin-top:44px;height:calc(100% + 160px)}.stack-sheet{transform-origin:center top}.sheet-3{transform:translateY(-36px) scaleX(.88);background:#f3f3fa}.sheet-2{transform:translateY(-24px) scaleX(.92);background:#f8f8fc}.sheet-1{transform:translateY(-12px) scaleX(.96)}.history-document{height:100%;padding-bottom:180px}.history-document>header{position:sticky;top:-24px;z-index:1;background:#fff;padding:16px 0}.history-copy{animation:page-arrive .25s ease-out}@keyframes page-arrive{0%{opacity:.4;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.document-scroll{position:relative}.passage-overlay{position:absolute;top:0;left:0;width:100%;pointer-events:none}.passage-overlay span{position:absolute;background:#beb7ff66;border-radius:2px}.passage-overlay.shimmer span{background:linear-gradient(105deg,#f8cff6,#dcd0fa,#bbcaff,#f8cff6);background-size:250% 100%;animation:passage-shimmer 1.5s linear infinite}.passage-overlay.revealing{opacity:0;transition:opacity .45s ease}@keyframes passage-shimmer{to{background-position:250% 0}}.editor-toolbar button[aria-pressed=true]{background:#e9e5fa;box-shadow:inset 0 0 0 1px #d1c9ed}.editor-toolbar button{transition:background .15s,box-shadow .15s}.editor-panel .canvas-header,.editor-panel .editor-toolbar{animation:chrome-arrive 1s both}@keyframes chrome-arrive{0%,45%{opacity:0}to{opacity:1}}.is-streaming .document:after{content:"";display:inline-block;width:2px;height:1em;background:#8d7fda;animation:cursor-blink .65s steps(2) infinite}@keyframes cursor-blink{50%{opacity:0}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.is-streaming .document li:empty{visibility:hidden}.history-stage{display:flex;flex-direction:column}.history-actions{flex-shrink:0;margin-bottom:0}.draft-stack{flex:1;min-height:0;height:auto;margin:44px auto 0}.history-document{height:calc(100% + 48px);overflow:hidden;padding-bottom:0}.history-document>header{position:static;padding:0}.history-copy{height:calc(100% - 118px);min-height:0;overflow:auto;padding-bottom:48px;scrollbar-width:thin}.is-streaming .document:after{display:none}.workspace:not(.workspace-history) .chat-scroll,.workspace:not(.workspace-history) .chat-composer{animation:chrome-arrive .7s both}.passage-overlay.shimmer span{border-radius:0}.history-stage{overflow:clip}.history-copy,.form-scroll,.document-scroll{overscroll-behavior:contain}.history-copy:focus-visible{outline:2px solid #ddd6f4;outline-offset:6px}.editor-panel .icon-button,.history-document .icon-button{border-radius:50%;overflow:hidden}.version-controls .icon-button,.history-document .icon-button{background:#f5f5f9}.editor-panel .icon-button:hover:not(:disabled),.history-document .icon-button:hover:not(:disabled){background:#e7e7ee;filter:none}.editor-panel .icon-button:disabled,.history-document .icon-button:disabled{pointer-events:none}.canvas-header{z-index:3}html:has(.component-highlight),body:has(.component-highlight),body:has(.component-highlight) #root{width:100%;height:100%;margin:0;background:#090909;overflow:hidden}.component-highlight{width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;color:#ddd;font-family:Arial,sans-serif}.component-highlight button:focus-visible{outline:2px solid #bfcaff;outline-offset:3px}.highlight-controls{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;font-size:11px}.highlight-controls button{border:1px solid #444;border-radius:20px;padding:6px 10px;background:#171717;color:#aaa;cursor:pointer}.highlight-controls button[aria-pressed=true]{background:#ddd;color:#111}.highlight-agent{position:relative;width:min(100%,280px);color:#252525}.highlight-agent .agent-card{background:#fff;min-height:180px}.highlight-agent .agent-open{min-height:180px;padding:18px}.highlight-agent .agent-art{width:48px;height:48px}.highlight-agent .agent-open strong{font-size:15px}.highlight-agent .agent-open span{font-size:12px}.highlight-note{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:#191919ed;color:#ddd;padding:30px;display:flex;align-items:center;border-radius:12px;font-size:13px}.highlight-agent .agent-card{height:180px;min-height:180px}.highlight-passage{width:min(100%,380px);padding:20px 22px;background:#fff;border-radius:10px;color:#252525;box-shadow:0 4px 24px #0003;font-size:12px;line-height:1.65}.highlight-passage .passage-context{font-size:11px;color:#888;margin:0 0 10px}.highlight-passage .passage-overlay{position:static;width:auto;margin:0}.highlight-passage .passage-overlay span{position:static;box-decoration-break:clone;-webkit-box-decoration-break:clone;padding:2px 0}.highlight-passage .passage-caption{margin:12px 0 0;font-size:10px}@media(prefers-reduced-motion:reduce){.highlight-passage .shimmer span{animation:none!important}}.highlight-passage .passage-overlay.shimmer span{color:#2525257f;background-image:linear-gradient(90deg,#f8cff6,#dcd0fa,#bbcaff,#dcd0fa,#f8cff6);background-size:240px 100%;background-repeat:repeat-x;animation:highlight-passage-flow 3s linear infinite}@keyframes highlight-passage-flow{0%{background-position:0 0}to{background-position:240px 0}}
