/* A drawing desk, a specimen wall, and a face-to-face conversation. */
:root{--pink:#f62999;--yellow:#fff064;--accent:#a51064;--ink:#242621;--line:#242621}
header{padding:22px 34px 0;gap:50px;align-items:center;min-height:160px}header .brand{font-size:80px;letter-spacing:-5px;line-height:.82;display:block;transform:rotate(-3deg);padding:0 8px 24px 0}header .brand span{display:block;color:var(--accent);padding-left:58px}header nav{align-self:stretch;align-items:flex-end;gap:20px;padding-top:25px}header nav a{border:0;border-radius:0;box-shadow:none!important;background:white;font-family:'Kalam',cursive!important;font-size:clamp(23px,2.2vw,33px)!important;flex:none;max-width:none;padding:18px 12px 22px;position:relative;gap:10px}header nav a b{color:#6a6d63;align-self:auto;font-family:'Patrick Hand',cursive;font-size:16px;margin:0}header nav a[aria-current=page]{background:white;text-decoration:underline;text-decoration-color:var(--pink);text-decoration-thickness:7px;text-underline-offset:11px}header nav a:hover{background:#fffad0;text-decoration-thickness:4px}main{padding:0 34px}.studio{grid-template-columns:minmax(0,1fr) 285px;border-top:1px solid var(--ink);gap:28px;padding-top:12px}.drawing{display:grid;grid-template-columns:90px minmax(0,1fr);grid-template-areas:'label label' 'build build' 'tools canvas' 'palette palette' 'templates templates';gap:12px 18px;padding:0;border:0}.drawing>.section-label{grid-area:label;padding:0 0 4px}.drawing>.section-label span:first-child{font-size:31px!important}.drawing>.section-label span:last-child{font-size:15px!important}.build-options{grid-area:build;padding:0 0 9px;border-bottom:0}.build-options p{margin-bottom:0}.tools{grid-area:tools;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;padding:14px 8px;background:var(--yellow);gap:13px;align-self:start;border:1px solid var(--ink);box-shadow:3px 3px 0 var(--ink)}.tools button{border:0;border-bottom:1px solid #8d8850;border-radius:0;text-align:left;background:transparent;padding:4px 0}.tools button[aria-pressed=true]{color:#8b0050;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}.tools label{flex-direction:column;align-items:stretch;gap:3px}.tools select{padding:3px 0;background:transparent;max-width:100%;font-size:17px!important}.tools input{max-width:100%}.canvas-wrap{grid-area:canvas;width:100%;margin:0;border:1px solid #899084;box-shadow:7px 7px 0 #eee;background-image:radial-gradient(#b3b9b0 .65px,transparent .65px);background-size:10px 10px;align-self:start}.canvas-wrap canvas{aspect-ratio:4/3}.canvas-note{right:16px;bottom:14px;box-shadow:2px 2px 0 var(--ink);padding:5px 12px;font-size:19px;transform:rotate(-4deg)}.palette{grid-area:palette;justify-content:flex-end;padding:10px 0 0;gap:11px}.swatch{width:29px;height:29px;border:1px solid #40443b;border-radius:50% 46% 42% 48%;box-shadow:1px 2px 0 #d8dcd3}.custom-color{margin-left:12px!important}.three-controls{grid-area:tools;flex-direction:column;align-items:stretch;gap:24px;background:var(--yellow);padding:14px 8px;border:1px solid var(--ink);box-shadow:3px 3px 0 var(--ink)}.three-controls label{font-size:17px!important}.three-controls input[type=range]{width:100%}.three-controls button{font-size:16px!important;padding:6px 2px;box-shadow:none}.template-picker{grid-area:templates;margin:12px 0 0;padding:12px 0;border-top:1px solid var(--ink)}.template-picker summary{font-size:28px}.template-picker summary span{font-size:16px}.template-card{border:0;border-bottom:1px solid #a2a79c;padding-bottom:12px}.template-card canvas{border:0}.template-card:hover,.template-card[aria-pressed=true]{border:0;border-bottom:2px solid var(--ink);background:#fffad0}
.personality{background:var(--yellow);margin:18px 0 0;padding:20px 18px;box-shadow:5px 5px 0 var(--ink);border:1px solid var(--ink);transform:rotate(.5deg)}.personality>.section-label{padding:0;letter-spacing:2px;color:var(--ink)}.personality>h2{font-size:38px;margin:12px 0 20px}.personality label{font-size:18px!important}.personality input:not([type=range]):not([type=color]):not([type=file]),.personality select,.personality textarea{background:transparent;border-color:#8b8448}.personality #name{font-size:31px!important}.personality .slider{padding:1px 0}.personality .slider output{background:#242621;color:#fff064;transform:rotate(-3deg)}.personality .slider small{font-size:14px!important;color:#535039}.personality .small{color:#535039}.personality>.primary{background:#fff;box-shadow:3px 3px 0 #242621}.personality .import{margin-top:24px}.site-publish{padding-top:18px;margin-top:18px}.site-publish h3{font-size:25px}.site-publish button{background:#fff}.site-publish>summary{font-size:25px;cursor:pointer}.site-publish p{font-size:16px!important}.personality .save-note{font-size:15px!important}
.market{padding-top:30px;border-top:1px solid var(--ink)}.market-heading{align-items:flex-end;gap:30px}.market-heading .eyebrow{letter-spacing:3px}.market h2{font-size:clamp(54px,7.5vw,108px);letter-spacing:-5px!important;line-height:.95;transform:rotate(-2deg);margin:10px 0 18px}.market-heading p{font-size:23px;max-width:320px}.catalog-head{padding:5px 0 18px;border-bottom:1px solid var(--ink)}.catalog-head h3{font-size:35px}.catalog-head p{max-width:680px}.starter-catalog{grid-template-columns:repeat(5,minmax(0,1fr));gap:32px 24px;padding:12px 6px}.catalog-card{padding:0;border:0}.catalog-card canvas{border:2px solid var(--ink);outline:0;box-shadow:4px 5px 0 #e1e5dd;background:#fff;transform:rotate(-1.4deg)}.catalog-card:nth-child(3n+2) canvas{transform:rotate(1.6deg)}.catalog-card:nth-child(4n) canvas{border-color:#a51064}.catalog-card .portrait-number{top:7px;left:8px;padding:0 8px;background:var(--yellow);transform:rotate(-4deg);border:0;box-shadow:1px 2px 0 #242621;font-size:18px}.catalog-card .card-copy{padding:15px 3px 0}.catalog-card h4{font-family:'Kalam',cursive!important;font-size:29px;line-height:1}.catalog-card button{margin-top:10px;padding:3px 0 6px;border-bottom:1px dashed #555;font-size:17px!important}.catalog-card small{color:#676b60;font-size:14px!important}.catalog-card p{font-size:16px!important}.wallet{box-shadow:4px 4px 0 var(--ink);margin:25px 4px 25px 0}.nft-market h2{font-size:54px!important;transform:none;letter-spacing:-2px!important}
.harness{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;border-top:1px solid var(--ink);padding-top:28px}.harness h2{font-size:clamp(45px,5vw,72px);letter-spacing:-2px!important}.harness>div:first-child{min-width:0}.harness>div>p{max-width:none}.agent-sitting{margin:20px 0 30px;border:0;box-shadow:none;max-width:none;position:relative}.agent-sitting canvas{width:100%;height:auto;aspect-ratio:4/3;background:#fff}.agent-sitting figcaption{border:0;background:var(--yellow);padding:10px 22px;width:fit-content;max-width:90%;margin:-10px auto 0;box-shadow:3px 3px 0 #242621;transform:rotate(-3deg);text-align:center}.agent-sitting #portraitName{font-family:'Kalam',cursive!important;font-size:35px}.agent-sitting small{font-size:18px}.harness .model-settings{border-top:1px solid var(--ink);padding:18px 0}.model-settings summary{font-size:26px;cursor:pointer}.model-settings label{max-width:none}.model-settings p{font-size:17px}.harness>div:first-child>p{font-size:18px}.harness .eyebrow{margin-bottom:15px}.chat{border-left:0;padding-left:0;min-height:750px}.chat .section-label{background:#fff;padding:12px 0 20px;border-bottom:2px solid var(--ink)}.chat-welcome{font-size:clamp(42px,5vw,76px);line-height:1;letter-spacing:-2px;margin-top:80px}.chat-welcome small{line-height:1.4;font-size:20px}.bubble{border-radius:4px 15px 15px 12px;box-shadow:3px 3px 0 #e2e5de;max-width:94%}.bubble.user{background:var(--yellow);border-radius:15px 4px 12px 15px}#chatForm textarea{border:1px solid var(--ink);border-radius:0}footer{margin-top:65px}footer .brand{font-size:38px}
@media(max-width:1100px){header{gap:24px}header .brand{font-size:65px}header nav{gap:10px}header nav a{font-size:24px!important;padding:12px 8px 20px}.studio{grid-template-columns:minmax(0,1fr) 260px;gap:22px}.drawing{grid-template-columns:76px minmax(0,1fr);gap:12px}.personality{padding:16px 14px}.tools{padding:10px 6px}.tools button{font-size:17px!important}.tools label{font-size:17px!important}.starter-catalog,.nft-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}.canvas-note{font-size:16px}.palette{gap:9px}.swatch{width:26px;height:26px}}
@media(max-width:850px){header{padding:24px 20px 0;min-height:0;gap:20px;flex-wrap:wrap}header .brand{font-size:64px;padding-bottom:10px}header .brand span{display:inline;padding-left:10px}header nav{padding:0;gap:12px;width:100%;justify-content:space-between}header nav a{flex:1;font-size:24px!important;min-height:60px;padding:8px 5px 18px}main{padding:0 20px}.studio{grid-template-columns:1fr;gap:30px}.personality{margin:0 5px 0 0;transform:none;padding:24px;grid-template-columns:1fr 1fr;gap:0 24px}.personality>.section-label,.personality>h2,.personality>#sliders,.personality>.site-publish,.personality>.small{grid-column:1/-1}.personality #sliders{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.starter-catalog,.nft-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}.market-heading p{font-size:20px}.harness{grid-template-columns:1fr;gap:30px}.harness>div:first-child{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}.harness>div:first-child>.eyebrow,.harness>div:first-child>h2{grid-column:1/-1}.agent-sitting{grid-column:1;grid-row:3/7;margin:24px 0;align-self:start}.harness>div:first-child>p,.model-settings{grid-column:2}.harness .button{width:100%;font-size:17px!important}.chat{border-top:1px solid var(--ink);min-height:550px}.chat-welcome{margin-top:40px}.chat #messages{height:350px}.agent-sitting #portraitName{font-size:28px}.agent-sitting small{font-size:16px}.harness .eyebrow{margin-bottom:10px}}
@media(max-width:520px){header{padding:20px 14px 0;gap:12px}header .brand{font-size:51px;letter-spacing:-3px}header .brand span{padding-left:5px}header nav{gap:4px}header nav a{font-size:19px!important;padding:8px 3px 18px;min-height:55px}header nav a[aria-current=page]{text-decoration-thickness:4px;text-underline-offset:8px}main{padding:0 14px}.drawing{display:flex;flex-direction:column;gap:0}.drawing>.section-label{order:0}.build-options{order:1;padding:12px 0}.tools{order:2;flex-direction:row;flex-wrap:wrap;padding:8px;gap:12px;margin:0 4px 14px 0}.tools label{flex-direction:row;align-items:center;gap:6px}.tools input{width:55px}.canvas-wrap{order:3}.canvas-note{font-size:15px;padding:3px 7px;bottom:10px}.three-controls{order:2;flex-direction:row;flex-wrap:wrap;gap:15px;margin:0 4px 14px 0}.three-controls input[type=range]{width:100px}.palette{order:4;justify-content:flex-start;padding-top:18px;margin-bottom:8px}.custom-color{margin-left:0!important}.template-picker{order:5}.personality{display:block;padding:20px}.personality #sliders{display:block}.market-heading{display:block}.market h2{font-size:59px;letter-spacing:-3px!important}.market-heading p{font-size:21px}.catalog-head h3{font-size:28px}.starter-catalog,.nft-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:28px 18px;padding:6px 2px}.catalog-card h4{font-size:25px}.harness>div:first-child{display:block}.agent-sitting{max-width:380px;margin:18px auto 30px}.harness h2{font-size:52px}.harness .button{width:100%}.chat-welcome{font-size:48px}.chat{min-height:500px}.personality>h2{font-size:40px}}

.build-options>.build-switch{display:flex;gap:14px;flex-wrap:wrap}.build-options>.build-switch button{margin:0;padding:9px 15px;border:1px solid var(--ink);box-shadow:2px 2px 0 var(--ink);border-radius:2px 9px 3px 5px;font-size:18px!important;background:#fff}.build-switch b{font-family:'Kalam',cursive;font-size:29px;margin-right:8px;line-height:1}.build-options>.build-switch button[aria-pressed=true]{background:var(--yellow);color:var(--ink)}.build-options>label{display:none}.build-options #restoreDraft{font-size:16px!important}.template-grid{grid-template-columns:repeat(10,minmax(80px,1fr));overflow-x:auto;overscroll-behavior-x:contain;padding-bottom:8px}.template-card{min-width:80px}.template-card span{line-height:1.2;font-size:16px!important}.template-picker #threeTemplates .template-card span{font-size:14px!important}.template-picker summary span{display:none}.template-picker summary{font-size:25px}.template-picker p{font-size:15px}.drawing>.section-label span:last-child{font-size:14px!important}
@media(max-width:1100px){.build-options>.build-switch{gap:10px}.build-options>.build-switch button{padding:7px 10px;font-size:17px!important}.build-switch b{font-size:25px}.build-options #restoreDraft{margin-left:0}}
@media(max-width:520px){.build-options>.build-switch{width:100%}.build-options>.build-switch button{flex:1;padding:9px 8px;font-size:17px!important}.build-options #restoreDraft{padding:4px 0}.template-grid{grid-template-columns:repeat(10,minmax(88px,1fr))}.build-switch b{font-size:25px}}