/* Character creation mobile composition, November 2026. */
#create.reference-character-creation{background:linear-gradient(180deg,#02071299,#02050bc9),url('/assets/crownspire-moonlit.webp') center center/cover no-repeat #040916!important}
#create.reference-character-creation:before{position:absolute;background:linear-gradient(90deg,#01040a55,transparent 45%,#01040a77),radial-gradient(circle at 50% 12%,#b8d7ff55,transparent 30%);opacity:1}
#create .creation-reference-header{position:relative;padding:12px 0 22px}
#create .creation-logo{font-family:'Cormorant Garamond',Georgia,serif;font-variant:small-caps;font-weight:500;font-size:clamp(39px,7vw,86px);letter-spacing:.015em;line-height:.8;text-shadow:0 3px 8px #000,0 0 20px #7ca6e8}
#create .creation-logo span{font-size:.66em;letter-spacing:.06em;margin-top:9px}
#create .creation-subtitle{font-family:'Cinzel',Georgia,serif;font-size:clamp(12px,2.2vw,22px);letter-spacing:.14em;text-shadow:0 2px 8px #000}
#create .creation-reference-layout{grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:10px;align-items:stretch}
#create .creation-reference-preview{overflow:hidden;min-height:570px;background:radial-gradient(ellipse at 50% 24%,#acc9ff38,transparent 50%),linear-gradient(180deg,#0711224d,#02040ba8);border:1px solid #a4b7d288;box-shadow:inset 0 0 60px #02040a,0 0 25px #0008}
#create .creation-reference-preview:before,#create .creation-reference-preview:after{content:'✦';position:absolute;z-index:4;color:#e1e9f6;font-size:24px;text-shadow:0 0 12px #aac8ff}
#create .creation-reference-preview:before{top:-9px;left:-5px}
#create .creation-reference-preview:after{bottom:-9px;right:-5px}
#create .creation-preview-crest{font-size:160px;opacity:.12;top:12%}
#create .creation-figure{position:absolute;inset:10% 3% 0;filter:drop-shadow(0 0 18px #a3b8d944)}
#create .creation-figure-hair{position:absolute;z-index:1;left:18%;top:4%;width:64%;height:73%;border-radius:48% 48% 30% 30%;background:repeating-linear-gradient(97deg,#253047 0 4%,#8495b6 5%,#e3e9f5 7%,#4b5d80 10%,#151d31 13%);clip-path:polygon(26% 0,70% 0,93% 15%,100% 100%,73% 91%,52% 100%,28% 92%,0 100%,8% 16%);box-shadow:0 0 22px #8daee6}
#create .creation-figure-face{position:absolute;z-index:2;left:35%;top:16%;width:30%;height:26%;border-radius:42% 42% 47% 47%;background:linear-gradient(110deg,#66718b,#d2d5e2 43%,#777e95 80%,#29374c);box-shadow:inset -9px -7px 12px #1015259c}
#create .creation-figure-body{position:absolute;z-index:3;left:4%;right:4%;top:38%;bottom:0;background:linear-gradient(100deg,#03060e,#29364f 32%,#080d19 49%,#3b4863 66%,#040712);clip-path:polygon(31% 0,69% 0,87% 15%,100% 100%,0 100%,13% 15%);border-radius:45% 45% 0 0}
#create .creation-preview-caption{z-index:5;text-shadow:0 2px 5px #000;bottom:15px}
#create .creation-reference-layout .file{background:linear-gradient(140deg,#040915f5,#03060de9)!important;border-image:url('/assets/ui/reference-panel.svg') 35 fill / 25px / 0 stretch!important;border-width:25px!important;padding:19px 23px!important}
#create .file label,#create .creation-gender legend,#create .creation-appearance-heading{font-family:'Cormorant Garamond',Georgia,serif!important;font-size:clamp(18px,2.3vw,26px)!important;margin:11px 0 5px!important}
#create .file label:before{margin-right:7px}
#create .file #charName,#create .file select,#create .file #ambition,#create .file #fear{height:47px;min-height:47px;border-radius:5px!important;font-size:16px!important}
#create .creation-gender{margin:10px 0}
#create .creation-gender button,#create .creation-house-select{min-height:46px;height:46px;font-size:16px}
#create .creation-appearance-options button{min-height:64px;font-size:23px}
#create #createBtn{margin:18px auto 12px;min-height:70px}
@media(max-width:760px){
 #create .navtop{margin:6px 12px 0}
 #create .scroll{padding:0 10px 28px}
 #create .creation-reference-header{padding:4px 0 17px}
 #create .creation-logo{font-size:clamp(34px,10vw,53px)}
 #create .creation-subtitle{font-size:clamp(10px,3vw,15px);margin-top:13px}
 #create .creation-reference-layout{grid-template-columns:minmax(0,40%) minmax(0,60%);gap:0;align-items:start}
 #create .creation-reference-preview{min-height:490px;position:sticky;top:5px;border-right:0}
 #create .creation-reference-layout .file{border-width:13px!important;border-image-width:13px!important;padding:13px 9px!important;min-width:0}
 #create .file label,#create .creation-gender legend,#create .creation-appearance-heading{font-size:18px!important;margin:10px 0 5px!important}
 #create .file label:before{margin-right:4px}
 #create .file #charName,#create .file select,#create .file #ambition,#create .file #fear{height:44px;min-height:44px;padding:7px 8px!important;font-size:16px!important}
 #create .creation-gender-choices{gap:4px}
 #create .creation-gender button{font-size:12px;padding:2px;min-height:46px}
 #create .creation-house-select{font-size:14px;padding:0 8px;min-height:44px}
 #create .creation-house-row .housegrid.is-open{grid-template-columns:repeat(2,minmax(0,1fr))}
 #create .house{min-height:73px;padding:4px 1px}
 #create .house b{font-size:9px}
 #create .creation-appearance-options{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
 #create .creation-appearance-options button{min-height:48px;font-size:17px;padding:3px 0}
 #create .creation-appearance-options small{font-size:10px}
 #create .creation-figure{inset:13% 0 0}
 #create .creation-preview-crest{font-size:95px}
 #create .creation-preview-caption{font-size:9px;letter-spacing:.08em}
 #create #createBtn{width:96%;margin:20px auto;min-height:72px;font-size:clamp(15px,4vw,19px)!important}
}
@media(max-width:350px){#create .creation-reference-layout{grid-template-columns:36% 64%}#create .creation-gender-choices{grid-template-columns:1fr}#create .creation-reference-layout .file{padding:10px 7px!important}}