.preset-screen{--fade-in-transition: opacity .45s ease;position:fixed;inset:0;z-index:200;background:var(--colour-sky);display:flex;align-items:start;justify-content:center;padding:32px 24px;padding-top:14vh;transition:opacity .45s ease,transform .45s ease}.hide-while-loading{transition:opacity .45s ease}.preset-screen--loading .hide-while-loading{opacity:0}.preset-screen--exit{opacity:0;pointer-events:none;transform:scale(.97)}.preset-screen__inner{display:flex;flex-direction:column;align-items:center;gap:36px;max-width:640px;width:100%}.preset-screen__header{text-align:center;display:flex;flex-direction:column;align-items:center;gap:16px}.preset-screen__logo{height:80px;width:auto;display:block}.preset-screen__actions{position:absolute;top:24px;right:24px;z-index:10;display:flex;gap:10px;align-items:center}.preset-screen__grid{display:flex;flex-direction:row;gap:16px;padding-top:4vh;width:100%;align-items:center;justify-content:center}.preset-card{background:var(--colour-bg);border:2px solid var(--colour-border);border-radius:16px;overflow:hidden;cursor:pointer;padding:0;margin:0;display:flex;height:250px;width:250px;flex-direction:column;text-align:left;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;box-shadow:0 2px 8px #0000000d,0 0 0 0 transparent}.preset-card:hover{transform:translateY(-5px);border-color:var(--button-bg);box-shadow:0 12px 40px #0000001f,0 0 0 0 transparent}.preset-card:active{transform:translateY(-2px)}.preset-card__img-wrap{width:100%;height:100%;aspect-ratio:4 / 3;overflow:hidden;background:var(--colour-border)}.preset-card__img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}.preset-card:hover .preset-card__img{transform:scale(1.05)}.preset-card__info{padding:14px 16px 16px;display:flex;align-items:baseline;gap:8px}.preset-card__label{font-size:22px;font-weight:700;color:var(--colour-text);letter-spacing:-.02em;line-height:1}.preset-card__unit{font-size:15px;font-weight:600;color:var(--colour-text)}.preset-card__desc{font-size:13px;color:var(--colour-text-secondary);font-weight:500}.preset-card--compact{width:180px;height:auto;border-radius:12px}.preset-card--compact .preset-card__img-wrap{aspect-ratio:16 / 10}.preset-card--compact .preset-card__info{padding:10px 12px 12px}.preset-card--compact .preset-card__label{font-size:17px}.preset-card--compact .preset-card__unit{font-size:12px}.preset-card--compact .preset-card__desc{font-size:11px}.action-btn{padding:8px 18px}.continue-btn{position:relative}.continue-preview{position:absolute;top:calc(100% + 10px);right:0;width:220px;border-radius:12px;overflow:hidden;background-color:var(--colour-sky);box-shadow:0 8px 30px #0000002e;opacity:0;z-index:100;transform:translateY(-4px);pointer-events:none;transition:opacity .2s ease,transform .2s ease}.continue-btn:hover .continue-preview{opacity:1;transform:translateY(0)}.continue-preview__img{width:100%;height:auto;display:block}.new-config-wrapper{position:relative}.new-config-dropdown{position:absolute;top:calc(100% + 10px);right:0;display:flex;flex-direction:column;gap:10px;padding:12px;background:var(--colour-bg);border:1px solid var(--colour-border);border-radius:14px;box-shadow:0 8px 30px #00000026;opacity:0;transform:translateY(-4px);pointer-events:none;transition:opacity .2s ease,transform .2s ease;z-index:100}.new-config-dropdown--open{opacity:1;transform:translateY(0);pointer-events:auto}.preset-screen__projects{display:flex;flex-direction:column;gap:8px;width:100%}.project-item{display:flex;align-items:center;gap:14px;padding:10px;background:var(--colour-bg);border:1px solid var(--colour-border);border-radius:12px;text-decoration:none;color:inherit;width:100%;font-family:inherit;transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease}button.project-item{cursor:pointer;text-align:left}button.project-item:hover,.project-item:has(.project-item__link:hover){transform:translateY(-2px);border-color:var(--colour-border-hover);box-shadow:0 4px 16px #00000014}button.project-item:active,.project-item:has(.project-item__link:active){transform:translateY(0)}.project-item__img-wrap{width:80px;height:50px;border-radius:8px;overflow:hidden;background:var(--colour-surface);flex-shrink:0}.project-item__img{width:100%;height:100%;object-fit:cover;display:block}.project-item__info{display:flex;flex-direction:column;gap:2px;min-width:0}.project-item__title{font-size:14px;font-weight:400;color:var(--colour-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.project-item__meta{display:flex;align-items:center;gap:8px}.project-item__time{font-size:12px;color:var(--colour-text-secondary)}.project-item__visits{font-size:12px;color:var(--colour-text-secondary);padding-left:8px;border-left:1px solid var(--colour-border)}.project-item__link{display:flex;align-items:center;gap:14px;flex:1;min-width:0;background:none;border:none;padding:0;margin:0;cursor:pointer;text-align:left;font-family:inherit;color:inherit}.project-item__actions{position:relative;flex-shrink:0;display:flex;align-items:center}.project-item__menu-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:8px;background:transparent;border:none;color:#bbb;cursor:pointer;padding:0;transition:background .15s ease,color .15s ease}.project-item__menu-btn:hover{background:var(--colour-surface);color:#666}.project-item__dropdown{position:absolute;top:calc(100% + 4px);right:0;min-width:160px;background:#fff;border-radius:12px;box-shadow:0 4px 20px #0000001f;padding:6px;opacity:0;pointer-events:none;transform:translateY(-4px);transition:opacity .15s ease,transform .15s ease;z-index:10}.project-item__dropdown.active{opacity:1;pointer-events:all;transform:translateY(0)}.project-item__dropdown-item{display:block;width:100%;padding:10px 12px;background:transparent;border:none;border-radius:8px;color:#333;font-size:.82rem;font-weight:400;text-align:left;cursor:pointer}.project-item__dropdown-item:hover{background:#f5f5f5}.project-item__dropdown-item--disabled{color:#bbb;cursor:default}.project-item__dropdown-item--disabled:hover{background:transparent}.project-item__dropdown-item--destructive{color:#e03e3e}.project-item__dropdown-item--destructive:hover{background:#fef2f2}.project-item--deleting{opacity:.5;pointer-events:none;transition:opacity .3s ease}.project-item--deleting .project-item__link{pointer-events:none}.project-item--continue{border-style:dashed;border-color:var(--button-bg);background:color-mix(in srgb,var(--button-bg) 5%,var(--colour-bg))}.project-item--continue:hover{border-color:var(--button-bg);background:color-mix(in srgb,var(--button-bg) 10%,var(--colour-bg))}.project-item__badge{font-size:11px;font-weight:600;color:var(--button-bg);background:color-mix(in srgb,var(--button-bg) 12%,transparent);padding:2px 8px;border-radius:6px;width:fit-content}@media screen and (max-width:768px){.preset-screen__grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;justify-items:center;max-width:220px}.preset-screen__title{font-size:24px}.preset-screen__inner{gap:24px}.preset-screen{padding:40px 16px 24px}.preset-screen--projects{padding-top:24px}.preset-screen--projects .preset-screen__inner{max-width:100%}}
