.recipePreview{text-align:left;border:1px solid #6fc;border-radius:8px;flex-direction:column;gap:8px;margin:5px;padding:10px;display:flex}.recipeRow{align-items:center;gap:12px;width:100%;display:flex}.recipePreview .recipeMeta{flex:auto;min-width:0}.recipePreview .recipeArrow{justify-content:center;align-items:center;display:flex}.recipeIngredientsCenter{box-sizing:border-box;justify-content:center;width:100%;padding:6px 0 10px;display:flex}.recipeIngredientsCenter .ul{width:100%;max-width:640px}.showArea{box-sizing:border-box;background-color:#ffffff08;border-radius:6px;justify-content:center;align-items:center;width:50vw;padding:8px 12px;display:flex}.showRow{box-sizing:border-box;background-color:#2a3b4726;border-radius:8px;justify-content:center;align-items:center;gap:12px;width:100%;display:flex}.showArea .h3{margin:0;font-size:1rem}.showArea.active{background-color:#ffffff0f}.li{list-style-type:none}.ingredientList{justify-self:center;margin:0;padding:0}.ingredientList li{align-items:center;gap:8px;margin-bottom:6px;display:flex}.displayArea{justify-content:center;width:100%}.button *{all:unset}.ingredientArea,.categoryArea{box-sizing:border-box;flex-direction:column;justify-content:flex-start;align-items:center;gap:8px;width:100%;display:flex}.searchTextField{box-sizing:border-box;align-self:center;max-width:640px;margin-top:5px;margin-bottom:12px}.sectionControls{justify-content:center;align-items:center;gap:8px;width:100%;display:flex;position:relative}.clearButton{color:#b2f0e5;cursor:pointer;background-color:#1a1a1a;border:1px solid #6fc;border-radius:6px;padding:6px;font-size:.9rem;position:absolute;right:0}.clearButton:hover{background-color:#162525}.arrow-trigger-standalone svg{transition:transform .16s}.arrow-trigger-standalone.open svg{transform:rotate(180deg)}.centered-column{flex-direction:column;align-items:center;display:flex}.centered-row{flex-direction:row;align-items:center;display:flex}#amountOfMissingIngredients{text-align:center;width:6ch;min-width:3ch}.upButton{margin:12px auto;display:block}.prep-content{flex:auto;min-width:0}@media (orientation:landscape){.displayArea{float:left;box-sizing:border-box;width:50%;min-height:100vh;padding:8px;overflow-y:auto}.showArea{width:50%;max-width:50vw}.mainRow{align-items:flex-start;gap:8px;display:flex}}@media (orientation:portrait){.displayArea{box-sizing:border-box;width:100%;padding:8px}.input[type=text],.textarea,.select{padding:12px;font-size:1.125rem}.displayArea input[type=text],.displayArea input[type=number],.displayArea textarea{box-sizing:border-box;max-width:640px}.prep-timer-row{display:block}.displayArea[data-visible=false]{display:none}}.login-overlay{z-index:1000;background:#0000008c;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.login-modal{background:#0f1b22;border:1px solid #6fc;border-radius:12px;width:auto;padding:24px;position:relative;box-shadow:0 14px 40px #00000059}.login-close{color:#b2f0e5;cursor:pointer;background:0 0;border:none;padding:4px;position:absolute;top:2px;right:2px}.login-close:hover{color:#6fc}
.login-shell{justify-content:center;align-items:center;padding:20px;font-family:Arial,sans-serif;display:flex}.login-card{color:#b0c7d1;background:#0f1b22;border:1px solid #6fc5;border-radius:12px;width:min(420px,100%);padding:20px;box-shadow:0 16px 36px #00000059}.login-header{flex-direction:column;gap:10px;margin-bottom:14px;display:flex}.pill-group{background:#2a3b4726;border:1px solid #6fc3;border-radius:10px;grid-template-columns:repeat(2,1fr);gap:8px;padding:6px;display:grid}.pill{color:#b0c7d1;cursor:pointer;background:0 0;border:none;border-radius:8px;padding:10px 12px;font-weight:700;transition:all .18s}.pill:hover{color:#e6fff7;background:#1c262e}.pill.active{color:#0d1317;background:#6fc;box-shadow:0 6px 18px #66ffcc47}.lede{color:#99e6d1;margin:0;font-size:.95rem}.form{flex-direction:column;gap:12px;display:flex}.field{color:#b0c7d1;flex-direction:column;gap:6px;font-size:.9rem;display:flex}.field input{color:#e6fff7;background:#1a1a1a;border:1px solid #6fc4;border-radius:8px;outline:none;padding:11px;transition:border .18s,box-shadow .18s}.field input:focus{border-color:#6fc;box-shadow:0 0 0 3px #66ffcc2e}.primary{color:#0d1317;cursor:pointer;background:linear-gradient(120deg,#3cc,#6fc);border:1px solid #6fc;border-radius:8px;width:100%;margin-top:4px;padding:12px;font-weight:700;transition:transform .15s,box-shadow .15s,opacity .2s}.primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 10px 26px #66ffcc42}.primary:disabled{opacity:.65;cursor:not-allowed}.secondary{color:#e6fff7;cursor:pointer;background:#1c262e;border:1px solid #6fc5;border-radius:8px;width:100%;margin-top:10px;padding:10px;transition:border .18s,background .18s}.secondary:hover{background:#22313c;border-color:#6fc}.status-line{color:#b0c7d1;flex-wrap:wrap;align-items:center;gap:10px;min-height:24px;margin-top:10px;font-size:.9rem;display:flex}.error{color:#ffb4b4}.info{color:#99e6d1}.success{color:#6fc}@media (max-width:520px){.login-card{padding:16px}.pill{padding:9px}}