main.create-page{max-width:880px;padding-top:42px}.create-page .form-intro{margin:14px 0 10px;font-size:18px;max-width:620px}.create-page .required-note{font-size:14px;line-height:1.5;margin:0 0 28px;color:#b6b8c0}#character-form{font-family:Arial,sans-serif}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.form-field{margin-bottom:24px;min-width:0}.form-field label{display:flex;align-items:baseline;justify-content:space-between;gap:12px;font-size:16px;font-weight:700;margin-bottom:10px;color:#eee}.form-field label span{font-size:14px;font-weight:400;color:#aeb0b9}.form-field label .required-label{color:#eac942}.form-field input:not([type=file]),.form-field textarea{box-sizing:border-box;width:100%;border:1px solid #53555e;border-radius:6px;background:#212226;color:#f4f4f6;font:16px/1.5 Arial;padding:12px 14px}.form-field input::placeholder,.form-field textarea::placeholder{color:#989ba6;opacity:1}.form-field textarea{resize:vertical;min-height:100px}.form-field input:focus-visible,.form-field textarea:focus-visible,.text-button:focus-visible{outline:2px solid #f6cf35;outline-offset:3px}.create-page .field-help{font:14px/1.5 Arial;color:#b9bbc4;margin:8px 0 0}.sketch-field> .field-help{margin:-2px 0 14px}.upload-box{border:1px dashed #6d6f7b;border-radius:8px;padding:20px;background:#202125}.upload-box input[type=file]{font:16px/1.5 Arial;color:#dedee4;max-width:100%}.upload-box input::file-selector-button{font:700 14px/1.4 Arial;padding:9px 14px;margin-right:12px;border:1px solid #777984;border-radius:5px;background:#32343c;color:#f3f3f6;cursor:pointer}#sketch-image{display:block;max-width:100%;max-height:260px;object-fit:contain;margin-top:20px;border-radius:4px}.upload-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px;font-size:14px;overflow-wrap:anywhere}.text-button{color:#f6cf35;border:0;padding:6px 0;background:none;font:14px Arial;text-decoration:underline;cursor:pointer;flex-shrink:0}.create-page .field-error{font:14px/1.5 Arial;color:#ffb3a7}.creation-notes{padding:22px 24px;border-left:3px solid #f6cf35;border-radius:0 6px 6px 0;background:#222327;margin:4px 0 22px}.creation-notes h2{margin:0 0 10px;font:700 25px/1.2 Barlow}.creation-notes ul{margin:0;padding-left:20px;color:#c7c8d0;font:16px/1.65 Arial}.creation-notes li+li{margin-top:8px}.create-page .submission-privacy{font:14px/1.6 Arial;color:#afb2bc;margin:0 0 18px}.create-page #form-status{font:16px/1.5 Arial;color:#f0d578;margin:0 0 16px}.submit-character{padding:14px 22px;font-size:16px;cursor:pointer}.submit-character:disabled{opacity:.5;cursor:wait}.form-honey{display:none}.success-panel{padding:26px;background:#222327;border-left:3px solid #f6cf35;border-radius:0 8px 8px 0;margin-top:24px}.success-panel p{margin-top:0}.success-panel p:last-child{margin-bottom:0}@media(max-width:600px){.form-grid{grid-template-columns:1fr;gap:0}.creation-notes{padding:20px}.upload-box{padding:16px}.submit-character{width:100%}main.create-page{padding-top:30px}.upload-caption{align-items:flex-start}}

#character-form{margin-top:30px}.upload-box{text-align:center;padding:30px 24px;min-height:190px;box-sizing:border-box}.upload-icon{display:block;width:38px;height:38px;margin:0 auto 10px;color:#f6cf35}.create-page .upload-heading{font:700 17px/1.5 Arial;color:#eee;margin:0 0 16px}.upload-box input[type=file]{display:block;margin:0 auto;max-width:100%;width:310px}#sketch-image{margin:20px auto 0}.upload-caption{justify-content:center;flex-wrap:wrap}

.how-it-works{margin:26px 0 30px;padding:24px;background:#202125;border:1px solid #36383e;border-radius:8px}.how-it-works h2{font:700 25px/1.2 Barlow;margin:0 0 18px}.how-it-works ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;list-style:none;padding:0;margin:0;align-items:start}.how-it-works li{min-width:0}.step-icon{display:block;width:25px;height:25px;color:#f6cf35;margin-bottom:10px}.how-it-works h3{font:700 16px/1.4 Arial;margin:0 0 6px}.how-it-works p{font:14px/1.55 Arial;color:#b9bbc4;margin:0}.sketch-example-toggle{margin-top:10px;font:14px/1.5 Arial}.sketch-example-toggle summary{color:#f6cf35;cursor:pointer;text-underline-offset:3px}.sketch-example-toggle summary:hover{text-decoration:underline}.sketch-example-toggle summary:focus-visible{outline:2px solid #f6cf35;outline-offset:4px;border-radius:2px}.sketch-example{margin:12px 0 0}.sketch-example img{display:block;width:100%;height:auto;border-radius:4px}.sketch-example figcaption{margin-top:6px;font:13px/1.5 Arial;color:#b9bbc4}@media(max-width:600px){.how-it-works ol{grid-template-columns:1fr;gap:18px}.how-it-works li{display:grid;grid-template-columns:25px minmax(0,1fr);gap:13px}.step-icon{margin:0}.sketch-example{max-width:360px}}

.notification-option{margin:0 0 24px}.notify-toggle{display:flex;align-items:flex-start;gap:10px;width:fit-content;min-height:28px;cursor:pointer;font:16px/1.5 Arial;color:#eee}.notify-toggle input{width:18px;height:18px;margin:3px 0 0;accent-color:#f6cf35;flex-shrink:0}.notify-toggle input:focus-visible{outline:2px solid #f6cf35;outline-offset:3px}.notification-option .form-field{max-width:440px;margin:16px 0 0}.notification-option [hidden]{display:none}

.upload-box .sketch-example-toggle{margin:16px auto 0}.upload-box .sketch-example-toggle summary{width:fit-content;margin:0 auto}.upload-box .sketch-example{max-width:320px;margin:14px auto 0}@media(max-width:600px){.how-it-works{padding:20px}}

/* Compact guidance and an accessible native file control with a custom face. */
.how-it-works{padding:16px 18px;margin:20px 0 24px;background:#1b1c1f;border-color:#303137}.how-it-works h2{font:700 16px/1.3 Arial;margin:0 0 12px;color:#c6c7cc}.how-it-works ol{gap:20px}.how-it-works h3{font-size:14px;margin-bottom:4px}.how-it-works p{font-size:13px;line-height:1.45}.upload-box{padding:22px;min-height:0}.upload-icon{width:28px;height:28px;margin-bottom:8px}.create-page .upload-heading{font-size:16px;margin-bottom:12px}.sketch-picker{position:relative;width:156px;margin:0 auto;background:#32343c;border:1px solid #777984;border-radius:5px;padding:10px 12px;font:700 14px/1.5 Arial;color:#f3f3f6}.upload-box .sketch-picker input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;margin:0}.sketch-picker:focus-within{outline:2px solid #f6cf35;outline-offset:3px}.upload-box .sketch-example-toggle{margin-top:10px}@media(max-width:600px){.how-it-works li{display:block}.how-it-works ol{gap:12px}.how-it-works{padding:14px 16px}}