:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--color-bg:#0b0e14;--color-bg-elev:#131822;--color-surface:#171d28;--color-text:#e9edf5;--color-text-muted:#8a93a5;--color-accent:#7b92ff;--color-accent-hover:#9aacff;--color-accent-soft:#7b92ff29;--color-danger:#ff6b6b;--color-border:#e9edf517;--color-border-strong:#e9edf52e;--tint-1:#1d2431;--tint-2:#232b39;--tint-3:#2b3444;--tint-4:#333d50;--shadow-sm:0 1px 2px #00000047, 0 1px 3px #0003;--shadow-md:0 4px 12px #00000057;--shadow-lg:0 12px 32px #0000006b;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-card:14px;--glass-bg:var(--color-surface);--glass-blur:0px;--glass-border:1px solid var(--color-border);--glass-radius:var(--radius-card);--font-heading:"Pretendard Variable", Pretendard, system-ui, sans-serif;--heading-weight:700;--heading-style:normal;--heading-tracking:-.025em;--text-xs:12px;--text-sm:14px;--text-base:16px;--text-lg:18px;--text-xl:22px;--text-2xl:30px;--lh-body:1.5;--lh-tight:1.25;--weight-normal:400;--weight-medium:500;--weight-semibold:600;--space-1:4px;--space-2:8px;--space-3:16px;--space-4:24px;--space-5:40px;--dur-fast:.14s;--dur-base:.24s;--ease-out:cubic-bezier(.16, 1, .3, 1);--ease-in-out:cubic-bezier(.65, 0, .35, 1);--app-bottom-nav-height:64px;--app-side-nav-width:248px}:root[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--color-bg:#f7f8fa;--color-bg-elev:#edf0f5;--color-surface:#fff;--color-text:#10141c;--color-text-muted:#6a7383;--color-accent:#3a5ce5;--color-accent-hover:#2b49cc;--color-accent-soft:#e7ecfd;--color-danger:#e5484d;--color-border:#10141c14;--color-border-strong:#10141c29;--tint-1:#e8ebf1;--tint-2:#dfe3eb;--tint-3:#d3d8e2;--tint-4:#c7cdd9;--shadow-sm:0 1px 2px #10141c0f, 0 1px 3px #10141c0a;--shadow-md:0 4px 12px #10141c14;--shadow-lg:0 12px 32px #10141c1f}.glass{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--glass-radius);box-shadow:var(--shadow-sm)}
*{box-sizing:border-box}html,body{padding:0;padding-top:env(safe-area-inset-top);background:var(--color-bg);color:var(--color-text);font-family:Pretendard Variable,Pretendard,system-ui,-apple-system,sans-serif;font-size:var(--text-base);line-height:var(--lh-body);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0}a{color:var(--color-accent);text-decoration:none}a:hover{color:var(--color-accent-hover)}h1,h2,h3{font-family:var(--font-heading);line-height:var(--lh-tight);letter-spacing:var(--heading-tracking);font-weight:var(--heading-weight);font-style:var(--heading-style);margin:0 0 var(--space-3)}h1{font-size:var(--text-2xl)}h2{font-size:var(--text-xl)}h3{font-size:var(--text-lg)}input,textarea,select{font:inherit;color:var(--color-text);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3);outline:none;width:100%;transition:border-color .15s,box-shadow .15s}input:focus,textarea:focus,select:focus{border-color:var(--color-accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--color-accent) 18%, transparent)}input[type=checkbox],input[type=radio]{width:auto}textarea{resize:vertical;min-height:72px}button{font:inherit;cursor:pointer;color:var(--color-text);background:var(--color-surface);border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3);font-weight:var(--weight-medium);transition:background .15s,border-color .15s,box-shadow .15s,opacity .15s}button:hover{background:var(--color-bg-elev)}button:disabled{opacity:.5;cursor:not-allowed}.container{width:100%;padding-inline:var(--space-3);margin-inline:auto}@media (min-width:768px){.container{max-width:960px;padding-inline:var(--space-4)}}.stack{gap:var(--space-3);flex-direction:column;display:flex}.row{align-items:center;gap:var(--space-2);display:flex}.row-wrap{align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.touch{justify-content:center;align-items:center;min-width:44px;min-height:44px;display:inline-flex}.sheet{z-index:101;border-top-left-radius:var(--glass-radius);border-top-right-radius:var(--glass-radius);max-height:60vh;padding:var(--space-3);padding-bottom:calc(var(--space-3) + env(safe-area-inset-bottom));position:fixed;bottom:0;left:0;right:0;overflow-y:auto}.grid-photos{grid-template-columns:repeat(3,1fr);gap:3px;display:grid}@media (min-width:768px){.grid-photos{grid-template-columns:repeat(7,1fr)}}@media (max-width:767px){.hide-mobile{display:none!important}}@media (min-width:768px){.show-mobile{display:none!important}}.app-content{padding-block:var(--space-3);padding-bottom:calc(var(--app-bottom-nav-height) + env(safe-area-inset-bottom));min-height:calc(100dvh - env(safe-area-inset-top))}@media (min-width:768px){.app-content{padding-bottom:var(--space-4);margin-inline-start:var(--app-side-nav-width)}}.app-bottom-nav{z-index:50;padding-bottom:env(safe-area-inset-bottom);background:var(--color-bg-elev);border-top:1px solid var(--color-border);justify-content:space-around;align-items:center;display:flex;position:fixed;bottom:0;left:0;right:0}.app-bottom-nav a{min-height:var(--app-bottom-nav-height);color:var(--color-text-muted);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:3px;font-size:10.5px;display:flex}.app-bottom-nav a[aria-current=page] span{font-weight:var(--weight-semibold)}.app-bottom-nav a[aria-current=page]{color:var(--color-accent)}.app-top-nav{z-index:50;width:var(--app-side-nav-width);gap:var(--space-1);padding:var(--space-4) var(--space-3);background:var(--color-bg-elev);border-right:1px solid var(--color-border);flex-direction:column;display:flex;position:fixed;top:0;bottom:0;left:0}.app-top-nav a{min-height:44px;padding-inline:var(--space-3);border-radius:var(--radius-md);color:var(--color-text-muted);font-size:var(--text-sm);align-items:center;gap:11px;display:flex}.app-top-nav a[aria-current=page]{background:var(--color-accent-soft);color:var(--color-accent);font-weight:600}.upload-item{gap:var(--space-2);margin-bottom:var(--space-2);flex-wrap:wrap;align-items:center;display:flex}.upload-item .upload-name{flex:100%}@media (min-width:768px){.upload-item .upload-name{flex:auto}}.btn-primary{background:var(--color-accent);border-color:var(--color-accent);color:#fff}.btn-primary:hover{background:var(--color-accent-hover);border-color:var(--color-accent-hover)}.btn-danger{background:var(--color-danger);border-color:var(--color-danger);color:#fff}.btn-danger:hover{background:#d33b40;border-color:#d33b40}.btn-ghost{background:0 0;border-color:#0000}.btn-ghost:hover{background:var(--color-bg-elev)}.btn-sm{padding:var(--space-1) var(--space-2);font-size:var(--text-sm)}.field{gap:var(--space-1);margin-bottom:var(--space-3);font-size:var(--text-sm);color:var(--color-text-muted);flex-direction:column;display:flex}.field input,.field textarea,.field select{margin-top:2px}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--glass-radius);box-shadow:var(--shadow-sm);padding:var(--space-4)}.card-sm{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:var(--space-3)}.badge{align-items:center;gap:var(--space-1);padding:2px var(--space-2);font-size:var(--text-xs);font-weight:var(--weight-medium);background:var(--color-bg-elev);color:var(--color-text-muted);border:1px solid var(--color-border);border-radius:999px;display:inline-flex}.muted{color:var(--color-text-muted)}.error-text{color:var(--color-danger);font-size:var(--text-sm)}.list-reset{margin:0;padding:0;list-style:none}.page-header{justify-content:space-between;align-items:center;gap:var(--space-3);margin-bottom:var(--space-4);display:flex}.page-title{font-family:var(--font-heading);font-size:var(--text-2xl);font-weight:var(--heading-weight);font-style:var(--heading-style);letter-spacing:var(--heading-tracking);margin:0}.grid-cards{gap:var(--space-3);grid-template-columns:repeat(2,1fr);display:grid}@media (min-width:768px){.grid-cards{grid-template-columns:repeat(3,1fr)}}.space-card,.album-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-card);box-shadow:var(--shadow-sm);color:var(--color-text);display:block;overflow:hidden}.space-card:hover,.album-card:hover{border-color:var(--color-border-strong);color:var(--color-text)}.card-collage{aspect-ratio:1.9;grid-template-rows:1fr 1fr;grid-template-columns:1fr 1fr;gap:2px;display:grid}.card-collage>*{min-width:0;min-height:0}.card-collage-single{grid-template-rows:1fr;grid-template-columns:1fr}.card-collage img{object-fit:cover;width:100%;height:100%;display:block}.card-collage span:first-child{background:var(--tint-1)}.card-collage span:nth-child(2){background:var(--tint-2)}.card-collage span:nth-child(3){background:var(--tint-3)}.card-collage span:nth-child(4){background:var(--tint-4)}.card-body{justify-content:space-between;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);display:flex}.card-name{font-weight:var(--weight-semibold);font-size:var(--text-sm);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.card-sub{font-size:var(--text-xs);white-space:nowrap}.badge-accent{background:var(--color-accent-soft);color:var(--color-accent);font-weight:var(--weight-semibold);border-color:#0000}.space-list{gap:var(--space-2);flex-direction:column;display:flex}@media (min-width:768px){.space-list{gap:var(--space-3);grid-template-columns:repeat(3,1fr);display:grid}}.space-card{align-items:center;gap:12px;padding:10px;display:flex}.space-card .card-collage{aspect-ratio:auto;border-radius:var(--radius-md);flex:none;width:74px;height:74px;overflow:hidden}.space-card .card-body{flex-direction:column;flex:1;justify-content:center;align-items:flex-start;gap:6px;min-width:0;padding:0;display:flex}.space-card .card-name{max-width:100%}.card-meta{align-items:center;gap:var(--space-1);display:flex}.card-storage{align-items:center;gap:9px;width:100%;display:flex}.storage-bar{background:var(--tint-1);border-radius:2px;flex:1;height:4px;overflow:hidden}.storage-bar>span{background:var(--color-accent);border-radius:2px;height:100%;display:block}@media (min-width:768px){.space-card{padding:0;display:block}.space-card .card-collage{aspect-ratio:1.9;border-radius:0;width:auto;height:auto}.space-card .card-body{padding:var(--space-3);gap:var(--space-2)}}.teaser-row{align-items:stretch}.teaser-card{align-items:center;gap:var(--space-2);padding:var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-card);background:var(--color-surface);color:var(--color-text);flex:1;display:flex}.teaser-card:hover{color:var(--color-text);border-color:var(--color-border-strong)}.teaser-accent{background:var(--color-accent-soft);border-color:#0000}.teaser-icon{background:var(--color-bg-elev);border-radius:999px;flex:none;justify-content:center;align-items:center;width:32px;height:32px;display:inline-flex}.teaser-icon-accent{background:var(--color-accent);color:#fff}.teaser-sub{font-size:var(--text-xs);display:block}.theme-swatch{align-items:flex-start;gap:var(--space-2);padding:var(--space-3);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-card);font-size:var(--text-sm);font-weight:var(--weight-semibold);flex-direction:column;flex:1;display:flex}.theme-swatch[aria-checked=true]{border:2px solid var(--color-accent);padding:calc(var(--space-3) - 1px)}.swatch-dot{border:1px solid var(--color-border-strong);border-radius:999px;width:16px;height:16px;display:inline-block}@keyframes oh-fade-in{0%{opacity:0}to{opacity:1}}@keyframes oh-sheet-in{0%{transform:translateY(100%)}70%{transform:translateY(-4%)}to{transform:translateY(0)}}@keyframes oh-page-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes oh-chrome-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.viewer-overlay{animation:oh-fade-in var(--dur-base) var(--ease-out)}.viewer-chrome{animation:oh-chrome-in var(--dur-base) var(--ease-out) var(--dur-fast) both}.viewer-sheet{animation:oh-sheet-in var(--dur-base) var(--ease-out)}.page-enter{animation:oh-page-in var(--dur-base) var(--ease-out)}@media (min-width:768px){.page-enter{animation-name:oh-fade-in}}.app-bottom-nav a svg{transition:transform var(--dur-fast) var(--ease-out)}.app-bottom-nav a[aria-current=page] svg{transform:scale(1.08)}@media (prefers-reduced-motion:reduce){.viewer-overlay,.viewer-sheet,.viewer-chrome,.page-enter{animation:oh-fade-in var(--dur-fast) linear}.app-bottom-nav a svg{transition:none}.app-bottom-nav a[aria-current=page] svg{transform:none}}.cover-option{background:var(--tint-1);aspect-ratio:1;border-radius:var(--radius-md);cursor:pointer;border:none;padding:0;overflow:hidden}.cover-option img{object-fit:cover;width:100%;height:100%;display:block}.cover-option{position:relative}.cover-option-on{outline:3px solid var(--color-accent);outline-offset:-3px}.cover-check{background:var(--color-accent);width:22px;height:22px;color:var(--color-bg);border-radius:999px;justify-content:center;align-items:center;display:inline-flex;position:absolute;top:4px;right:4px;box-shadow:0 1px 4px #00000073}.cover-option:disabled{opacity:.6;cursor:progress}.viewer-sheet{padding:var(--space-2);border-top-left-radius:var(--glass-radius);border-top-right-radius:var(--glass-radius);max-height:50vh;overflow-y:auto}.viewer-uploader{margin:0 0 var(--space-1);font-size:var(--text-xs)}.viewer-actions{justify-content:space-around;align-items:flex-start;gap:var(--space-1);display:flex}.viewer-action{width:60px;min-height:44px;padding:var(--space-1) 0;color:var(--color-text);font-size:10px;font-weight:var(--weight-normal);background:0 0;border:none;flex-direction:column;justify-content:flex-start;align-items:center;gap:5px;display:flex}.viewer-action:hover{color:var(--color-accent);background:0 0}.viewer-action-on{color:var(--color-accent)}.viewer-action-danger{color:var(--color-danger)}.viewer-edit{margin-top:var(--space-2);gap:var(--space-2)}.viewer-date{gap:var(--space-2);flex-wrap:wrap}.viewer-date input[type=date]{flex:1;min-width:140px}.viewer-comment{margin-top:var(--space-2)}@media (min-width:768px){.viewer-sheet>*{max-width:720px;margin-inline:auto}.viewer-actions{max-width:420px}}.thumb-heart{color:#fff;background:#00000073;border:none;border-radius:999px;justify-content:center;align-items:center;width:24px;height:24px;padding:0;font-size:12px;line-height:1;display:inline-flex;position:absolute;top:4px;right:4px}.thumb-heart:hover{background:#0009}.thumb-heart[aria-pressed=true]{color:var(--color-danger)}.badge-blur{color:#fff;font-size:9px;font-weight:var(--weight-semibold);background:#0000008c;border-radius:999px;padding:2px 6px;position:absolute;top:4px;left:4px}.thumb-figure{margin:0}.thumb-figure figcaption{text-overflow:ellipsis;overflow:hidden}