[hidden]{display:none!important}#workspace{min-height:100vh;background:#f4f7fb;color:#14233a;font-size:16px}#workspace header{height:auto;min-height:74px;padding:16px 24px;display:flex;align-items:center;justify-content:space-between;gap:12px}#workspace nav{display:flex;gap:8px;padding:12px 24px;background:white;overflow:auto;border-bottom:1px solid #e2e8f0}#workspace main{max-width:1180px;margin:auto;padding:30px 24px}#workspace h1{font:36px Georgia,serif;margin:0 0 12px}#workspace h2{font:26px Georgia,serif}#workspace h3{font-size:20px}#workspace p{line-height:1.6}#workspace button,dialog button{font:600 14px system-ui;padding:11px 16px;border:1px solid #cbd5e1;border-radius:9px;background:white;color:#14233a;cursor:pointer;white-space:nowrap}#workspace button.primary,dialog .primary{background:#1769e0;color:white;border-color:#1769e0}button:disabled{opacity:.5;cursor:wait}#workspace label,dialog label{display:grid;gap:7px;margin:0 0 16px;font:600 14px system-ui}#workspace input,#workspace select,#workspace textarea,dialog input{font:16px/1.5 system-ui;width:100%;padding:11px 12px;border:1px solid #cbd5e1;border-radius:8px;background:white;color:#14233a}#workspace textarea{min-height:85px;resize:vertical}#workspace .panel{background:white;border:1px solid #dfe6ef;border-radius:14px;padding:24px;margin-bottom:18px}#workspace .muted,dialog .muted{font-size:14px;color:#667085}#workspace .row,dialog .row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}#workspace .between{justify-content:space-between}#workspace .cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}#workspace .template{text-align:left;display:grid;gap:14px;padding:24px;min-height:130px;white-space:normal;background:white}#workspace .template:hover{border-color:#1769e0;background:#f5f9ff}#workspace .template small{font-size:13px;color:#667085}#workspace .columns{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:24px}#workspace .formgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}#workspace .wide{grid-column:1/-1}#workspace .editor{min-height:650px;line-height:1.8;border:0;font:15px/1.8 Arial,sans-serif;padding:24px;box-shadow:0 4px 24px #1028490c}#workspace .stat{background:white;border:1px solid #e2e8f0;border-radius:12px;padding:20px}#workspace .stat strong{display:block;font-size:30px;margin-top:10px}#workspace .docrow{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;border-bottom:1px solid #e2e8f0}#workspace .signature{width:100%;height:180px;border:1px solid #cbd5e1;background:white;touch-action:none;margin:0}#workspace .tag{background:#edf4ff;color:#1769e0;padding:6px 10px;border-radius:25px;font-size:13px}#workspace .drop{padding:32px;border:2px dashed #aac6eb;background:#f5f9ff;border-radius:12px;text-align:center;margin:18px 0}#workspace .drop.over{border-color:#1769e0}#workspace pre{white-space:pre-wrap;overflow-wrap:anywhere;font:15px/1.7 system-ui}dialog{border:0;border-radius:16px;padding:28px;width:min(480px,calc(100% - 32px));max-height:90vh;overflow:auto;box-shadow:0 20px 80px #071b3340}dialog::backdrop{background:#071b3380}dialog h2{font:28px Georgia,serif}.error{color:#ab3027;font-size:14px}#notice{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:999;padding:14px 20px;border-radius:10px;background:#071b33;color:white;max-width:90vw;font-size:14px;display:none}#notice.on{display:block}#publicHome .doclabel{font-size:12px!important;white-space:normal}#publicHome .chip{cursor:pointer}#publicHome .plist,#publicHome .plan p{font-size:14px}.status-note{padding:12px 20px;background:#edf4ff;color:#23466d;font-size:14px;text-align:center}button:focus-visible,a:focus-visible,[role=button]:focus-visible{outline:3px solid #3985ef;outline-offset:4px}
@media(max-width:760px){#workspace header{padding:14px 16px}#workspace header .muted{display:none}#workspace nav{padding:10px 16px}#workspace main{padding:24px 16px}#workspace .cards,#workspace .columns,#workspace .formgrid{grid-template-columns:1fr}#workspace h1{font-size:30px}#workspace .panel{padding:18px}#workspace .docrow{align-items:flex-start;flex-direction:column}#workspace .editor{font-size:14px;padding:10px}}
html:has(#workspace:not([hidden])){scroll-behavior:auto}#publicHome[hidden] .doccard::after{display:none!important}

/* Tulislah account dialog */
#modal:has(#authForm){width:min(440px,calc(100% - 32px));max-height:min(92dvh,820px);padding:0;border:1px solid #e6e9f6;border-radius:24px;background:#fff;box-shadow:0 28px 90px #0c17374d;overflow:auto}
#modal:has(#authForm)::backdrop{background:#101c39a8;backdrop-filter:blur(5px)}
#modal:has(#authForm) #modalBody{padding:34px 34px 30px;position:relative}
#modal:has(#authForm) .auth-logo{display:block;width:180px;height:auto;margin:-4px 0 20px}
#modal:has(#authForm) .auth-heading{margin:0;font:700 29px/1.22 Georgia,serif;letter-spacing:-.025em;color:#111c38}
#modal:has(#authForm) .auth-subtitle{margin:9px 0 23px;color:#64708a;font:400 14px/1.55 system-ui}
#modal:has(#authForm) .auth-google{width:100%;min-height:48px;border:1px solid #d7deef;border-radius:12px;background:white;color:#17213b;font-weight:700;display:flex;align-items:center;justify-content:center;gap:12px}
#modal:has(#authForm) .auth-google:hover{background:#f7f8ff;border-color:#7a86df}
#modal:has(#authForm) .auth-google svg{flex:none}
#modal:has(#authForm) .auth-divider{display:flex;align-items:center;gap:14px;margin:21px 0;color:#8b94a7;font:500 12px system-ui}
#modal:has(#authForm) .auth-divider:before,#modal:has(#authForm) .auth-divider:after{content:"";height:1px;flex:1;background:#e3e7f0}
#modal:has(#authForm) #authForm label{margin:0 0 16px;color:#24314d;font-weight:650}
#modal:has(#authForm) #authForm input{min-height:47px;border-radius:11px;border-color:#d8deeb;box-shadow:none}
#modal:has(#authForm) #authForm input:focus{outline:3px solid #5a50e92e;border-color:#6445e9}
#modal:has(#authForm) .auth-forgot{display:block;margin:-4px 0 19px auto;padding:0;border:0;background:none;color:#4e41cb;font-weight:700}
#modal:has(#authForm) .auth-forgot:hover,#modal:has(#authForm) .auth-signup button:hover{text-decoration:underline}
#modal:has(#authForm) #authForm .auth-submit{width:100%;min-height:49px;border-radius:12px;font-size:15px;box-shadow:0 8px 18px #533fe12b}
#modal:has(#authForm) .auth-signup{margin:20px 0 0;text-align:center;color:#68738b;font:14px system-ui}
#modal:has(#authForm) .auth-signup button{padding:0;border:0;background:none;color:#4e41cb;font-weight:750}
#modal:has(#authForm) #authMessage:empty{display:none}
#modal:has(#authForm) #authMessage:not(:empty){margin:16px 0 0;padding:11px 13px;border-radius:10px;background:#fff1ef}
#modal:has(#authForm) .modal-dismiss{position:absolute;top:20px;right:20px;margin:0}
#modal:has(#authForm) .modal-dismiss button{padding:8px 11px;border:0;border-radius:9px;background:#f2f4fa;color:#4d5872;font-size:13px}
#modal:has(#authForm) .modal-dismiss button:hover{background:#e8eaf6}
@media(max-width:500px){#modal:has(#authForm) #modalBody{padding:27px 22px 25px}#modal:has(#authForm) .auth-heading{font-size:26px}#modal:has(#authForm) .auth-logo{width:160px;margin-bottom:17px}}

#publicHome .tulislah-wordmark{display:block;width:205px;height:auto;max-height:62px;object-fit:contain;flex:none}
#publicHome .brand{letter-spacing:normal}
#publicHome .hero h1 span{background:linear-gradient(105deg,#2664f3,#7239f2);-webkit-background-clip:text;background-clip:text;color:transparent}
#publicHome .btn.primary,#publicHome .publicTrialBar button{background:linear-gradient(115deg,#236bf4,#6136ed);border-color:#563bed}
#publicHome .footlogo{font-size:22px;letter-spacing:-.045em;text-transform:lowercase}
#publicHome .footlogo{width:200px;padding:4px;background:#fff;border-radius:10px}
#publicHome .footlogo img{display:block;width:100%;height:auto}
#publicHome .legal{font-size:13px;flex-wrap:wrap}
#publicHome .legal .credit{display:block;margin-top:8px;color:#e0dfff;font-weight:700}
#publicHome .miniLogo{padding:0;width:86px}
#publicHome .miniLogo img{display:block;width:100%;height:auto}
#workspace header .brand{border:0;background:none;color:#17203f;font-size:22px;font-weight:850;letter-spacing:-.045em;padding:4px 0;text-transform:lowercase}
#workspace header .brand img{display:block;width:175px;height:auto;max-height:56px;object-fit:contain}
#workspace button.primary,dialog button.primary{background:linear-gradient(115deg,#236bf4,#6136ed);border-color:#563bed;color:white}
#workspace .tag{background:#f0ecff;color:#5138cf}

/* Meta Pixel is loaded only after the visitor opts in. */
#pixelBanner{position:fixed;bottom:20px;left:20px;right:20px;z-index:1000;max-width:620px;padding:20px;background:#111b39;color:#fff;border:1px solid #4d5c85;border-radius:16px;box-shadow:0 16px 44px #0c1c3b61;display:flex;gap:18px;align-items:center;justify-content:space-between;font:14px/1.5 system-ui}#pixelBanner p{margin:5px 0;color:#dce5f7}#pixelBanner a{color:#cbdcff;text-decoration:underline}#pixelBanner .pixelButtons{display:flex;gap:8px;flex:none}#pixelBanner button{padding:9px 13px;border-radius:9px;cursor:pointer;border:1px solid #bfc9ea;background:transparent;color:#fff;font:700 13px system-ui}#pixelBanner button[data-choice=yes]{background:linear-gradient(115deg,#236bf4,#6136ed);border-color:#6c75fb}#publicHome #pixelSettings{border:0;padding:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}#publicHome #pixelSettings:hover{text-decoration:underline}@media(max-width:620px){#pixelBanner{bottom:12px;left:12px;right:12px;display:block;padding:16px}#pixelBanner .pixelButtons{margin-top:12px;justify-content:flex-end}}
.signup-nudge{margin:13px 0 0;color:#39476a;font-size:15px;line-height:1.5}.signup-nudge button{border:0;background:transparent;color:#4338ca;font:inherit;font-weight:700;text-decoration:underline;cursor:pointer;padding:0}
.credit-hint{padding:12px 16px;background:#eef2ff;border:1px solid #d8dbff;border-radius:12px;color:#283568;display:flex;align-items:center;gap:12px;flex-wrap:wrap}.credit-hint strong{color:#4338ca}.generated-image{display:block;width:100%;height:auto;max-width:580px;border-radius:14px;border:1px solid #d8deeb;margin:12px 0}#copyResult textarea{width:100%;min-height:210px;resize:vertical;white-space:pre-wrap}#imageStatus{min-height:28px}
.studio-switch{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0 24px}.studio-switch button{min-width:180px}.studio-switch button.selected{background:linear-gradient(110deg,#1769e0,#663bea)!important;color:white!important;border-color:#513ce3!important;box-shadow:0 6px 18px #3054c62b}.credit-packs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:18px 0}.credit-pack{display:flex;flex-direction:column;gap:9px}.credit-pack strong{font-size:28px;color:#162451}.credit-pack span:not(.credit-pack-label){font-size:21px;font-weight:700}.credit-pack small{color:#667085;min-height:42px}.credit-pack button{margin-top:auto}.credit-pack.featured{border:2px solid #4c44e5!important;background:linear-gradient(150deg,#fff,#f4f2ff)!important}.credit-pack-label{font-size:13px;color:#4338ca;font-weight:700}@media(max-width:760px){.credit-packs{grid-template-columns:1fr}.studio-switch{display:grid;grid-template-columns:1fr 1fr}.studio-switch button{min-width:0;white-space:normal!important}}
#workspace .studio-step{font:700 18px/1.35 system-ui;color:#192e57;margin:22px 0 14px}#workspace form .studio-step:first-child{margin-top:0}#workspace .studio-cost{padding:10px 14px;background:#f1f5ff;border-radius:10px;color:#30426b;font-size:14px}#workspace .studio-low{color:#a3372b;font-weight:700}#studioReady{margin:0 0 20px}#studioCopy .columns,#studioImage .columns{align-items:start}#studioCopy form,#studioImage form{box-shadow:0 8px 28px #1028490b}

/* Studio AI on the public landing page */
#publicHome .ai-showcase{background:linear-gradient(165deg,#f4f7ff 0%,#fff 70%);padding:72px 0 76px}
#publicHome .ai-intro{display:flex;align-items:end;justify-content:space-between;gap:28px;margin-bottom:28px}
#publicHome .ai-intro>div{max-width:710px}
#publicHome .ai-intro h2{font:700 clamp(30px,3.2vw,43px)/1.15 Georgia,serif;color:#121e3e;letter-spacing:-.035em;margin:0 0 12px}
#publicHome .ai-intro p{font:16px/1.65 system-ui;color:#53627b;margin:0}
#publicHome .ai-intro>.btn{flex:none}
#publicHome .ai-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
#publicHome .ai-card{overflow:hidden;border:1px solid #dbe3f4;border-radius:22px;background:#fff;box-shadow:0 16px 40px #203b8a12}
#publicHome .ai-card img{display:block;width:100%;height:auto;aspect-ratio:1.25;object-fit:cover}
#publicHome .ai-card>div{padding:20px 22px 22px}
#publicHome .ai-card span{display:inline-block;color:#5140d5;background:#f1edff;border-radius:100px;padding:6px 10px;font:700 12px system-ui}
#publicHome .ai-card h3{font:700 20px/1.3 system-ui;color:#142344;margin:13px 0 7px}
#publicHome .ai-card p{font:14px/1.5 system-ui;color:#59667c;margin:0}
#publicHome .ai-disclaimer{font:13px/1.5 system-ui;color:#66758b;margin:18px 0 0}
@media(max-width:900px){#publicHome .ai-grid{gap:12px}#publicHome .ai-card>div{padding:16px}#publicHome .ai-card h3{font-size:17px}}
@media(max-width:700px){#publicHome .ai-showcase{padding:48px 0}#publicHome .ai-intro{display:block}#publicHome .ai-intro>.btn{margin-top:19px;width:100%}#publicHome .ai-grid{grid-template-columns:1fr 1fr}#publicHome .ai-card:first-child{grid-column:1/-1}#publicHome .ai-card:first-child img{aspect-ratio:1.55}#publicHome .ai-card img{aspect-ratio:1}#publicHome .ai-card h3{font-size:16px}}
@media(max-width:440px){#publicHome .ai-grid{grid-template-columns:1fr}#publicHome .ai-card:first-child{grid-column:auto}#publicHome .ai-card img,#publicHome .ai-card:first-child img{aspect-ratio:1.55}}
