/* Stitch P03: mode selection is bound to the existing creation form and recovery path. */
#createProjectDialog{width:min(940px,calc(100vw - 48px));max-width:none;max-height:calc(100dvh - 64px);padding:0;border:1px solid #dce1ed;border-radius:18px;background:#fff;color:#172a41;box-shadow:0 30px 80px #15223d38;overflow:hidden}
#createProjectDialog::backdrop{background:#17243d69;backdrop-filter:blur(6px)}
#createProjectDialog #createProjectForm{display:flex;flex-direction:column;max-height:calc(100dvh - 64px);padding:0}
#createProjectDialog #createProjectForm>header{display:flex;align-items:center;gap:15px;flex-shrink:0;padding:22px 28px;border-bottom:1px solid #dfe4ee;background:#fff}
#createProjectDialog .fynix-create-mark{display:grid;place-content:center;width:44px;height:44px;border-radius:13px;background:#e9f0f5;color:var(--accent);font-size:30px;font-weight:400;flex-shrink:0}
#createProjectDialog #createProjectTitle{margin:0;font-size:21px;font-weight:700;color:#172a41;letter-spacing:-.025em}
#createProjectDialog #createProjectForm>header p{margin:6px 0 0;font-size:12px;line-height:1.6;color:#637689}
#createProjectDialog #closeCreateDialog{margin-left:auto;width:32px;height:32px;display:grid;place-content:center;border:0;background:transparent;color:#817e96;font-size:26px;flex-shrink:0}
#createProjectDialog .create-dialog-body{display:grid;grid-template-columns:1fr 1fr;align-content:start;gap:24px 18px;overflow:auto;min-height:0;padding:24px 28px 28px;background:#fff}
#createProjectDialog .fynix-create-basics{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:18px;padding:18px;border:1px solid #e9e7f5;border-radius:13px;background:#f6f9fb}
#createProjectDialog .fynix-create-basics>.field{grid-column:auto;margin:0}.fynix-create-basics:has(#createFolderField[hidden])>.field:first-child{grid-column:1/-1!important}
#createProjectDialog .field{display:grid;gap:9px;min-width:0;color:#172a41}
#createProjectDialog .field>span{font-size:13px;font-weight:650;color:#172a41}
#createProjectDialog .field>small{font-size:11px;line-height:1.65;color:#637689}
#createProjectDialog :is(input:not([type=radio]),select){width:100%;min-width:0;box-sizing:border-box;min-height:43px;padding:10px 12px;border:1px solid #ccd6e8;border-radius:8px;background:#fff;color:#1c2f46;font-family:inherit;font-size:13px;line-height:1.5;box-shadow:none}
#createProjectDialog input::placeholder{color:#aaa6bb}#createProjectDialog input[type=file]{padding:12px;background:#f8f9ff;border-style:dashed;min-height:80px;font-size:11px}
#createProjectDialog input[type=file]::file-selector-button{padding:8px 10px;margin-right:10px;background:#e7eff5;border:0;border-radius:6px;color:var(--accent-strong)}
#createProjectDialog .mode-choice{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;grid-column:1/-1;margin:0;padding:0;border:0;min-width:0}
#createProjectDialog .mode-choice>legend{display:block;width:100%;box-sizing:border-box;padding:0 0 15px;font-size:14px;font-weight:650;color:#172a41}
#createProjectDialog .mode-choice>legend:before{content:'';display:inline-block;width:6px;height:16px;background:var(--accent-strong);border-radius:4px;vertical-align:-3px;margin-right:9px}
#createProjectDialog .create-mode-group,#createProjectDialog .create-mode-options{display:contents}
#createProjectDialog .create-mode-heading{display:none}
#createProjectDialog .create-mode-options>label{display:grid;grid-template-columns:32px minmax(0,1fr) 16px;align-items:start;gap:9px;min-height:118px;box-sizing:border-box;padding:17px 16px;border:1px solid #dce3f0;border-radius:13px;background:#fff;cursor:pointer;position:relative}
#createProjectDialog .create-mode-options>label:hover{background:#fcfcff;border-color:#a7bdcd}
#createProjectDialog .create-mode-options>label:has(input:checked){border:2px solid var(--accent-strong);padding:16px 15px;background:#eff5f9;box-shadow:0 0 0 2px rgb(66 107 136 / 8%)}
#createProjectDialog .create-mode-options>label:has(input[value=canvas]){grid-column:1/-1;min-height:82px}
#createProjectDialog .fynix-mode-icon{grid-column:1;grid-row:1;display:grid;place-content:center;width:32px;height:32px;background:#e7eff5;border-radius:9px;color:#55566b}
#createProjectDialog .fynix-mode-icon svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#createProjectDialog .create-mode-options>label:has(input:checked) .fynix-mode-icon{background:var(--accent-strong);color:#fff}
#createProjectDialog .create-mode-options>label>input{grid-column:3;grid-row:1;margin:3px 0 0;appearance:none;width:18px;height:18px;min-width:18px;border:2px solid #dadbe8;border-radius:50%;background:#fff}
#createProjectDialog .create-mode-options>label>input:checked{border-color:var(--accent-strong);background:var(--accent-strong);box-shadow:inset 0 0 0 4px #fff}
#createProjectDialog .create-mode-options>label>span:not(.fynix-mode-icon){grid-column:2;grid-row:1;display:grid;gap:7px;min-width:0}
#createProjectDialog .create-mode-options b{font-size:13px;font-weight:650;line-height:1.5;color:#172a41}.create-mode-options label:has(input:checked) b{color:var(--accent)!important}
#createProjectDialog .create-mode-options small{font-size:11px;line-height:1.75;color:#637689}
#createProjectDialog #createProductField,#createProjectDialog #createReferenceField{padding:16px;border:1px solid #e1e6f1;border-radius:11px;background:#fff;align-content:start}
#createProjectDialog #createProjectForm>footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:10px;flex-shrink:0;padding:17px 28px;border-top:1px solid #dfe4ef;background:#fff}
#createProjectDialog #createHint{flex-basis:100%;font-size:11px;color:#77778c;line-height:1.6;margin:0 0 2px}#createProjectDialog #createHint:before{content:'';width:6px;height:6px;display:inline-block;background:var(--accent-strong);border-radius:50%;margin-right:7px}
#createProjectDialog .primary-action{min-height:43px;padding:11px 23px;border:1px solid var(--accent-strong);border-radius:8px;background:var(--accent-strong);color:#fff;font-size:13px;font-weight:600}
#createProjectDialog .secondary-action{min-height:42px;padding:10px 17px;border:1px solid #dce3f0;border-radius:8px;background:#fff;color:#5f6277;font-size:12px}
#createProjectDialog #createError{grid-column:1/-1;margin:0;padding:12px;border:1px solid #facfce;background:#fff4f2;color:#ab4039;border-radius:8px;font-size:12px;line-height:1.6}
#createProjectDialog :is(button,input,select):focus-visible{outline:2px solid var(--accent-strong);outline-offset:3px}#createProjectDialog :is(button,input,select):disabled{opacity:.55;cursor:not-allowed}#createProjectDialog [hidden]{display:none!important}
@media(max-width:700px){#createProjectDialog{width:calc(100vw - 24px);max-height:calc(100dvh - 24px);border-radius:13px}#createProjectDialog #createProjectForm{max-height:calc(100dvh - 24px)}#createProjectDialog #createProjectForm>header{padding:18px;gap:10px}#createProjectDialog #createProjectTitle{font-size:18px}#createProjectDialog #createProjectForm>header p{font-size:10px}#createProjectDialog .create-dialog-body{padding:18px;gap:18px}#createProjectDialog .fynix-create-basics{grid-template-columns:1fr;padding:14px}#createProjectDialog .mode-choice{grid-template-columns:1fr}#createProjectDialog .create-mode-options>label{min-height:85px}#createProjectDialog #createProductField,#createProjectDialog #createReferenceField{grid-column:1/-1}#createProjectDialog #createProjectForm>footer{padding:14px 18px}#createProjectDialog .primary-action{flex:1}}

/* Reset the legacy hidden-radio/span tile decoration inside each complete card. */
#createProjectDialog .mode-choice .create-mode-options>label>span{min-height:0;height:auto;padding:0;border:0;background:transparent;box-shadow:none}
#createProjectDialog .mode-choice .create-mode-options>label>span.fynix-mode-icon{width:32px;height:32px;background:#e7eff5;border-radius:9px;display:grid;place-content:center}
#createProjectDialog .mode-choice .create-mode-options>label:has(input:checked)>span.fynix-mode-icon{background:var(--accent-strong);color:#fff}
#createProjectDialog .mode-choice .create-mode-options>label>input{position:static;opacity:1;pointer-events:auto}
#createProjectDialog .mode-choice input:checked+span::after{display:none}
#createProjectDialog .mode-choice input:focus-visible+span{outline:0}
#createProjectDialog .create-mode-options>label:has(input:focus-visible){outline:2px solid var(--accent-strong);outline-offset:3px}

#createProjectDialog .mode-choice label>span:not(.fynix-mode-icon){border:0;background:transparent;padding:0;border-radius:0}
#createProjectDialog .create-mode-options small{font-size:11px;line-height:1.65}
#createProjectDialog .create-dialog-body{background:#fff}
#createProjectDialog #createProjectForm>header,#createProjectDialog #createProjectForm>footer{background:#f8fbfd}
@supports(backdrop-filter:blur(1px)){
  #createProjectDialog{background:rgb(250 253 255 / 95%);backdrop-filter:blur(14px)}
  #createProjectDialog #createProjectForm>header,#createProjectDialog #createProjectForm>footer{background:rgb(245 250 254 / 88%)}
}
@media(max-width:850px) and (min-width:561px){#createProjectDialog .mode-choice{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){#createProjectDialog .mode-choice{grid-template-columns:minmax(0,1fr)}#createProjectDialog .create-mode-options>label{min-height:88px}#createProjectDialog .create-dialog-body{grid-template-columns:minmax(0,1fr)}}
@media(prefers-reduced-transparency:reduce),(prefers-reduced-motion:reduce),(forced-colors:active){
  #createProjectDialog{background:#fff;backdrop-filter:none}
  #createProjectDialog::backdrop{backdrop-filter:none}
  #createProjectDialog #createProjectForm>header,#createProjectDialog #createProjectForm>footer{background:#f8fbfd}
}