:root{--ink:#fff0d3;--orange:#ff812b;--lavender:#251735;--paper:#110d1d;--muted:#d2bfdc;--line:#53325a;background:#110d1d;color:#fff0d3}body{background:radial-gradient(ellipse at 15% 15%,#341740 0,transparent 48%),radial-gradient(ellipse at 90% 70%,#241635 0,transparent 45%),#110d1d}.header{background:#160e22;border-bottom:1px solid #a34d20}.brand-mark{color:#170d22;background:#ff812b}.header nav a:hover,.header nav a[aria-current=page]{color:#ffb45e}.season,.hero .eyebrow,.eyebrow{color:#ffc46a}.seasonal-banner{max-width:1300px;margin:24px auto 0;padding:18px 28px;border:1px solid #693958;border-radius:24px;display:flex;align-items:center;justify-content:space-between;gap:24px;background:radial-gradient(circle at 90% 30%,#503066 0,transparent 58%),#21132f;overflow:hidden}.seasonal-banner p{font-size:1.35rem;font-weight:800;line-height:1.4;margin:0;color:#ffda93}.seasonal-banner small{display:block;font-size:.85rem;letter-spacing:2px;text-transform:uppercase;color:#daabed;margin-bottom:8px}.seasonal-banner img{width:360px;height:175px;object-fit:contain;flex-shrink:0}.home-heading{padding-top:28px}.home-heading h1{color:#fff3d7}.home-heading p{color:#d7bfde}.home-note{background:#271535;border:1px solid #66375b}.activity-card{background:#281630;border:1px solid #613257;box-shadow:0 10px 26px #0003}.activity-card .picture{background:#fff6e6}.activity-card .body p{color:#d9c5dd}.button.primary{background:#ff812b;color:#211026}.button.primary:hover{background:#ffad55}.button.secondary{background:#442549;color:#fff1db;border-color:#a16b94}.choose-panel,.settings-panel,.tools,.info-card,.catalog-card{background:#271735;border:1px solid #623454}.preview-panel,.canvas-wrap{background:#1b1126;border:1px solid #4d304f}.template-option{color:#311638;background:#fff6e7;border:2px solid transparent}.template-option[aria-pressed=true]{border-color:#ff812b;box-shadow:0 0 0 2px #ff812b40}.segmented{background:#3a2248}.segmented button{color:#fff2dc}.segmented button[aria-pressed=true]{color:#211026;background:#ff812b}.settings-panel label,.tools .tool-label{color:#ffeacb}.settings-panel select,.settings-panel input:not([type=color]),.feedback-form input,.feedback-form select,.feedback-form textarea{background:#fff6e8;color:#2d1739;border-color:#94617f}.settings-panel .small,.print-help,.editor-help{color:#d7c0dd}.style-choices button,.preview-controls button,.history-tools button,.tools>.button{background:#442549;color:#fff2dc;border:1px solid #865177}.style-choices button[aria-pressed=true]{background:#ff812b;color:#211026}.style-choices button:hover,.preview-controls button:hover{border-color:#ffb45e}.collection-bar .pill{color:#fff2dc;border:1px solid #81547e}.collection-bar .pill.selected{background:#ff812b;color:#241026}.pill,.tags span{background:#442549}.featured{background:#281630;border:1px solid #633653}.card{background:#271735;border:1px solid #613257}.card-content p{color:#d9c5dd}.card-image-button{background:#fff9ed}.filters button{background:#442549;color:#fff1db}.filters button.active{background:#ff812b;color:#211026}.search,input[type=search]{background:#fff6e8;color:#2d1739}.catalog-card img,.detail-art{background:#fff9ed;border-radius:12px}.faq{border-color:#68415f}.guide p,.guide li{color:#d9c5dd}.guide a{color:#ffd292}.info-card dt{color:#ffc176}.feedback-form fieldset{border-color:#936286}.feedback-form legend{color:#ffdda2}#feedback-notice{color:#ead9ed}.download-feedback,#mask-paint-tools{background:#362139;color:#fff0d5;border:1px solid #87507d}.download-feedback a{color:#ffbf69}dialog{background:#180f23;color:#fff0d3;border:1px solid #855079}dialog::backdrop{background:#080511d9}.icon-button{background:#492754;color:#fff0dc}.tool-modes button{background:#492754;color:#fff0dc}.tool-modes button.active{background:#ff812b;color:#211026}.hero .featured-info,.hero .feature-panel{background:#2a1737}.document{background:#21132f;color:#fff0d3}.making-steps{color:#fff0d3}.making-steps p{color:#d9c5dd}footer{border-color:#613554;background:#160e22;color:#d9c5dd}footer .brand{color:#ffdda0}footer a:hover{color:#ffc16f}.no-scripts{background:#362139;color:#fff0dc}.colour-plus{border-color:#f3b577}.error-panel{background:#46202b;color:#ffe4e4;border-color:#e78c8c}#site-toast,#toast{background:#ffe0a0;color:#211026}.seasonal-banner img{filter:drop-shadow(0 8px 12px #08051180)}@media(max-width:900px){.seasonal-banner{margin:18px 24px 0}.seasonal-banner img{width:290px;height:150px}.seasonal-banner p{font-size:1.15rem}}@media(max-width:650px){.seasonal-banner{margin:16px 20px 0;padding:16px;flex-direction:column;gap:12px;text-align:center}.seasonal-banner img{width:100%;max-width:380px;height:155px}.seasonal-banner p{font-size:1.1rem}.seasonal-banner small{font-size:.75rem}.home-heading h1{font-size:2.6rem}}
.brand-edition{display:block;font-size:.65rem;text-transform:uppercase;letter-spacing:1.7px;color:#ffc176;margin-top:3px}.breadcrumbs{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:8px;font-size:.85rem;color:#d3adcf;padding-top:22px}.breadcrumbs a{color:#ffd18d}.breadcrumbs span[aria-current=page]{font-weight:400}

.making-steps article,.instructions article,.pack-panel{background:#271735;border-color:#633653}.feature-panel p,.pack-panel p{color:#d9c5dd}

/* ColourNCreate approved Halloween brand. Makers and white print sheets are retained. */
body{background:linear-gradient(180deg,transparent 650px,#190c25 1000px),url('assets/halloween-night.png') top center/1600px auto no-repeat,#190c25}
.header{background:transparent;border-bottom:0;min-height:136px;padding-top:20px;padding-bottom:12px}
.logo-brand{display:block;max-width:100%;line-height:0;flex-shrink:0}
.logo-brand img{display:block;width:390px;max-width:100%;height:auto;filter:drop-shadow(0 4px 8px #09031480)}
.header nav{padding:14px 20px;border-radius:14px;background:#190c2566}
.header nav a{min-height:44px;display:inline-flex;align-items:center}
.header nav a[aria-current=page]{color:#fff0d3;text-decoration-color:#ff812b}
.button.primary{background:linear-gradient(#ff9428,#ff5b0a);border:2px solid #ffbc56;color:#211026;box-shadow:0 4px 12px #08031140}
.button.secondary{border:2px solid #eeb960;background:#1d102bbb}
.button:focus-visible,.header a:focus-visible{outline:3px solid #ffda93;outline-offset:5px}
.home-hero{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:center;padding:24px 0 32px;min-height:470px}
.home-hero-copy{z-index:1;padding:20px 0;text-shadow:0 3px 12px #10051e}
.home-hero h1{font-size:clamp(2.6rem,4.5vw,4.4rem);line-height:1.08;margin:18px 0;letter-spacing:-1.8px}
.home-hero h1 span{color:#ffb025}
.home-hero p{max-width:530px;color:#fff0d3;font-size:1.18rem;line-height:1.6;margin:20px 0}
.hero-friends{width:100%;height:auto;max-width:none;transform:scale(1.06);filter:drop-shadow(0 8px 18px #07020d70)}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px;text-shadow:none}
.hero-actions .button{min-width:175px;gap:12px;border-radius:28px}
.activity-grid{padding-bottom:30px}.activity-card{border-color:#834a79;background:linear-gradient(#2c143b,#211027)}
.activity-card .picture{background:#fff4db;height:285px;padding:18px}
.activity-card h2{font-size:1.65rem}.activity-card .button{border-radius:28px}
.create-strip{display:flex;align-items:center;gap:30px;justify-content:center;background:radial-gradient(ellipse at center,#432447,#1d102b);border-color:#774665;padding:24px;margin-bottom:30px}
.create-strip>img{width:200px;height:120px;object-fit:contain;flex-shrink:0}
.create-strip h2{font-size:2rem;margin:0 0 10px}.create-strip p{margin:8px 0;color:#fff0d3}
.seasonal-banner{background:linear-gradient(90deg,#21102ce6,#3b1d45b3);margin-top:0}
footer{background:linear-gradient(#190c2590,#13091be6),url('assets/halloween-night.png') center bottom/cover;border:1px solid #65365c;border-radius:20px 20px 0 0;text-align:center}
footer .logo-brand{width:270px;margin:0 auto 12px}footer p{margin:12px 0 24px}footer div{justify-content:center}
@media(min-width:1601px){body{background-size:auto,100% auto}}
@media(max-width:1100px){.logo-brand img{width:330px}.header{gap:10px}.header nav{gap:16px;padding:10px}.home-hero{min-height:400px}.activity-card .picture{height:230px}}
@media(max-width:900px){.header{justify-content:center}.header nav{justify-content:center}.logo-brand img{width:340px}.home-hero{grid-template-columns:1.1fr 1fr;min-height:340px}.home-hero h1{font-size:2.9rem}.home-hero p{font-size:1rem}.hero-friends{transform:none}.hero-actions .button{min-width:150px;padding:12px}.create-strip h2{font-size:1.7rem}}
@media(max-width:650px){body{background-size:auto,1100px auto;background-position:top center,top center}.header{display:flex;flex-direction:column;align-items:center;padding:16px 18px 8px}.logo-brand img{width:310px}.header nav{width:100%;margin-top:0;justify-content:space-around;gap:8px;padding:4px}.header nav a{font-size:.9rem}.home-hero{display:flex;flex-direction:column;text-align:center;padding-top:8px;min-height:0;gap:0}.home-hero-copy{padding:16px 0 0}.home-hero h1{font-size:2.9rem;letter-spacing:-1px}.home-hero p{max-width:500px;margin:18px auto;font-size:1rem}.hero-actions{justify-content:center;margin-top:20px}.hero-actions .button{min-width:0}.hero-friends{max-width:500px;width:100%;margin-top:20px}.activity-card{display:flex}.activity-card .picture{height:220px;padding:14px}.activity-card .body{padding:22px}.activity-card h2{font-size:1.7rem}.activity-card p{font-size:1rem}.create-strip{flex-direction:column;gap:12px;text-align:center}.create-strip>img{width:180px;height:90px}.create-strip h2{font-size:1.7rem}.seasonal-banner{margin-top:10px}.seasonal-banner img{height:130px}footer{margin-left:18px;margin-right:18px}footer div{gap:14px}}

/* Approved mockup corrections: self-hosted type, illustrated cards and character/footer treatment. */
@font-face{font-family:Chewy;src:url('assets/fonts/Chewy-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Nunito;src:url('assets/fonts/Nunito-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Nunito;src:url('assets/fonts/Nunito-Semibold.ttf') format('truetype');font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:Nunito;src:url('assets/fonts/Nunito-Bold.ttf') format('truetype');font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:Nunito;src:url('assets/fonts/Nunito-ExtraBold.ttf') format('truetype');font-style:normal;font-weight:800;font-display:swap}
:root{font-family:Nunito,'Trebuchet MS',sans-serif}
h1,h2,h3{font-family:Chewy,'Trebuchet MS',sans-serif;font-weight:400;letter-spacing:0;line-height:1.16}
.home-hero h1{font-family:Chewy,'Trebuchet MS',sans-serif;font-weight:400;font-size:clamp(3.2rem,5.3vw,5.2rem);letter-spacing:0;line-height:1.1}
.logo-brand img{width:480px}.header{min-height:170px}.header nav{font-weight:700}
.home-hero{grid-template-columns:1fr 1fr;gap:12px;min-height:470px;padding-top:0}
.home-hero-copy{padding-top:0}.home-hero .hero-friends{transform:none;max-height:540px;object-fit:contain}
.home-hero p{font-size:1.2rem}.home-hero h1 span{color:#ffac12}
.activity-card .picture{padding:0;height:auto;aspect-ratio:4/3;overflow:hidden}
.activity-card .picture img{width:100%;height:100%;object-fit:cover;display:block}
.activity-card .body{text-align:center;padding:24px 20px}.activity-card h2{font-size:2.15rem;font-weight:400;margin:0 0 14px;letter-spacing:0}
.activity-card p{font-size:1.1rem;line-height:1.5;margin:0 0 20px}.activity-card .button{font-family:Chewy,'Trebuchet MS',sans-serif;font-weight:400;font-size:1.4rem}
.button.primary,.tools>.button.primary{color:#fff;background:linear-gradient(#f56709,#df4600);border-color:#ffba43;font-weight:800;text-shadow:0 1px 2px #7d2100;font-size:1.2rem}
.activity-card .button.primary{font-weight:400;font-size:1.4rem}.hero-actions .button{font-family:Chewy,'Trebuchet MS',sans-serif;font-weight:400;font-size:1.4rem}
.button.primary:hover{background:#ca3c00;color:#fff}.button.secondary{color:#fff0d3}
.filter-row .filter{background:#442549;color:#fff0d3;border:1px solid #986582;min-height:44px;padding:9px 18px}
.filter-row .filter.active,.filter-row .filter[aria-pressed=true]{background:#ffb849;color:#271033;border-color:#ffb849}
.paper-control select,.search input{background:#fff5e3;color:#2c1038;border:1px solid #97657d}.paper-control select{min-height:44px;padding:8px 12px}.search{background:transparent}
.card-links button{color:#ffe1a2;background:#3b204a;border:1px solid #946081;border-radius:8px;min-height:44px;padding:8px 12px}.card-content{text-align:center}.card h3{font-size:1.5rem}
.featured-image{border:0;cursor:pointer;min-width:0}.featured-image:hover{box-shadow:0 0 0 3px #ffb849}.featured-image:focus-visible{outline:3px solid #ffb849;outline-offset:4px}
.featured-pick{display:inline;text-align:left;font:inherit;line-height:inherit;color:inherit;background:transparent;border:0;padding:0;cursor:pointer}.featured-pick:hover{text-decoration:underline;text-decoration-color:#ffb849;text-underline-offset:6px}
.feature-panel h2{font-size:2.5rem}.feature-panel p{color:#e6d3e9}.tags span{background:#472449;color:#fff0d3}
.create-strip{display:grid;grid-template-columns:180px minmax(0,1fr) 180px;text-align:center;border:0;background:linear-gradient(90deg,#311633b3,#381c3ed9,#311633b3);gap:14px;padding:20px 14px;border-radius:35% 12% 30% 12% / 12% 25% 15% 18%;margin:28px 0 15px}
.create-strip>img.strip-character{width:100%;height:170px;object-fit:contain}.create-strip h2{font-size:2.7rem}.strip-benefits{display:flex;gap:25px;align-items:center;justify-content:center;flex-wrap:wrap;font-size:1rem}.strip-benefits>span+span{border-left:1px solid #926080;padding-left:25px}.strip-benefits span[aria-hidden]{font-size:1.5rem;margin-right:8px}
footer{background:url('assets/approved-footer.png') center bottom/cover no-repeat,#1b0928;border:0;border-radius:0;min-height:290px;padding:40px 25px 65px;max-width:100%;margin-top:0}footer .logo-brand{width:320px;margin-bottom:35px}footer div{gap:28px}footer a{color:#fff0d3}
.home-sky{position:absolute;top:0;left:0;width:100%;height:950px;overflow:hidden;pointer-events:none;color:#ffb526;z-index:0}.home-sky span{position:absolute;font-size:1.3rem;filter:drop-shadow(0 0 7px #ff8500)}
.home-sky span:nth-child(1){top:7%;left:5%}.home-sky span:nth-child(2){top:24%;left:48%}.home-sky span:nth-child(3){top:19%;left:95%}.home-sky span:nth-child(4){top:46%;left:2%}.home-sky span:nth-child(5){top:54%;left:96%}.home-sky span:nth-child(6){top:64%;left:48%}.home-sky span:nth-child(7){top:10%;left:78%}.home-sky span:nth-child(8){top:65%;left:5%}
.header,main,[data-footer],.seasonal-banner{position:relative;z-index:1}
@media(max-width:1100px){.logo-brand img{width:410px}.home-hero h1{font-size:4.2rem}.activity-card h2{font-size:1.8rem}.activity-card p{font-size:1rem}.create-strip{grid-template-columns:150px minmax(0,1fr) 150px}.create-strip h2{font-size:2.2rem}}
@media(max-width:900px){.header{min-height:0}.logo-brand img{width:380px}.home-hero h1{font-size:3.3rem}.home-hero{min-height:380px}.create-strip{grid-template-columns:120px minmax(0,1fr) 120px}.create-strip h2{font-size:1.85rem}.strip-benefits{gap:10px}.strip-benefits>span+span{padding-left:10px}}
@media(max-width:650px){.logo-brand img{width:min(360px,90vw)}.home-hero h1{font-size:3.6rem}.home-hero .hero-friends{max-height:380px;margin-top:12px}.activity-card .picture{height:auto;padding:0}.activity-card .body{padding:24px}.activity-card h2{font-size:2.2rem}.activity-card p{font-size:1.1rem}.create-strip{grid-template-columns:70px minmax(0,1fr) 70px;gap:4px;padding:22px 5px}.create-strip>img.strip-character{height:110px}.create-strip h2{font-size:1.65rem}.strip-benefits{display:block;font-size:.85rem}.strip-benefits>span{display:block;margin-top:8px}.strip-benefits>span+span{border:0;padding:0}.strip-benefits span[aria-hidden]{font-size:1.1rem}footer{margin:0;min-height:300px;padding:40px 18px 70px;background-size:auto 100%}footer .logo-brand{width:280px}.home-sky{height:1050px}.featured-pick{text-align:left}}

/* Colouring editor fixes: contain palette, explicit custom colour and zoom/pan. */
:is(#editor,.art-editor) .editor-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:20px;align-items:start}
:is(#editor,.art-editor) .tools{display:block;width:auto;min-width:0;padding:18px}
:is(#editor,.art-editor) .palette{display:flex;flex-wrap:wrap;gap:8px;max-width:100%;padding:4px}
:is(#editor,.art-editor) .palette .swatch{flex:0 0 44px;width:44px;height:44px;min-width:44px;min-height:44px}
:is(#editor,.art-editor) .tool-modes{display:flex;flex-wrap:wrap;gap:6px}:is(#editor,.art-editor) .tool-modes button{min-height:44px;flex:1 1 44px}
.selected-colour{display:flex;align-items:center;gap:8px;font-size:.85rem;margin:0 0 10px;color:#fff0d3}.selected-colour>span:first-child{width:25px;height:25px;border:2px solid #fff;border-radius:50%;flex-shrink:0}
.custom-colour-entry{display:flex;gap:6px;margin-bottom:16px}.custom-colour-entry input{width:95px;min-width:0;background:#fff5e3;color:#2c1038;border:1px solid #a178a0;border-radius:8px;padding:8px;font:16px Nunito,sans-serif}.custom-colour-entry button,.zoom-controls button{background:#442549;color:#fff0d3;border:1px solid #ad80a4;border-radius:9px;min-height:44px;padding:8px 12px;font-weight:700}
:is(#editor,.art-editor) .canvas-wrap{min-width:0;width:100%;padding:12px}.zoom-controls{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin-bottom:10px}.zoom-controls output{min-width:60px;text-align:center;font-weight:700}.zoom-controls button{min-width:44px}
.canvas-viewport{width:100%;min-width:0;max-height:72vh;overflow:auto;padding:12px;overscroll-behavior:contain;background:#21132d;border-radius:12px;scrollbar-color:#a478a9 #21132d}.canvas-stage{margin-left:auto;margin-right:auto;flex-shrink:0}
:is(#editor,.art-editor) canvas{display:block;max-width:none!important;margin:0;border-radius:0;touch-action:none}
@media(min-width:651px) and (max-width:900px){:is(#editor,.art-editor) .editor-layout{grid-template-columns:200px minmax(0,1fr)}:is(#editor,.art-editor) .tools{padding:12px}.custom-colour-entry{flex-wrap:wrap}.custom-colour-entry input{flex:1}.custom-colour-entry button{flex:1}}
@media(max-width:650px){:is(#editor,.art-editor) .editor-layout{display:flex;flex-direction:column}:is(#editor,.art-editor) .tools{display:block;width:100%;padding:14px}:is(#editor,.art-editor) .canvas-wrap{width:100%}.canvas-viewport{max-height:65vh}:is(#editor,.art-editor) .palette{justify-content:flex-start}.custom-colour-entry input{width:110px}:is(#editor,.art-editor) .save-tools{grid-template-columns:1fr 1fr}:is(#editor,.art-editor) .canvas-wrap>.small{display:block}}

:is(#editor,.art-editor) .canvas-viewport{height:min(72vh,850px)}@media(max-width:650px){:is(#editor,.art-editor) .canvas-viewport{height:65vh}}

/* Breathing room for the three instruction cards and a playful collection heading. */
.instructions article{padding:24px 26px;border-radius:18px}
.instructions article h3{margin:18px 0 12px}
.instructions article p{margin:0;line-height:1.7}
.seasonal-banner small{font-family:Chewy,ui-rounded,sans-serif;font-size:clamp(1.35rem,2vw,1.85rem);line-height:1.2;letter-spacing:.2px;text-transform:none;color:#ffc46a;margin-bottom:12px}
@media(max-width:650px){.instructions article{padding:22px}.seasonal-banner small{font-size:1.5rem}}

/* Collection branding uses the same Chewy lettering as Give feedback. */
.seasonal-banner .collection-brand-title{font-family:Chewy,ui-rounded,sans-serif;font-weight:400;font-size:clamp(2rem,3.2vw,3rem);line-height:1.08;letter-spacing:0;text-transform:none;color:#fff0d3;margin:0 0 16px}
.seasonal-banner .collection-brand-title span{display:block;color:#ffb526;font-size:.72em;margin-top:8px}
@media(max-width:650px){.seasonal-banner .collection-brand-title{font-size:2.2rem}}
/* Match the email field to the other feedback controls, including autofill. */
.feedback-form input[type=email],.feedback-form textarea,.feedback-form select{background:#fff6e8;color:#2d1739;border-color:#94617f}
.feedback-form input[type=email]:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px #fff6e8 inset;-webkit-text-fill-color:#2d1739;caret-color:#2d1739}

/* White paper mats keep outline previews consistent, including transparent SVGs. */
.card-image-button,.card-image-button img,.featured-image,.featured-image img,.template-option,.template-option img,.catalog-card img,.detail-art{background:#fff}