:root{font-family:Pretendard,-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo',sans-serif;color:#191a18;background:#fff;--ink:#20211e;--surface:#f3f3f0;--ease:cubic-bezier(.22,1,.36,1)}
body{background:#fff;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font-family:inherit}
.logo{font-family:inherit;font-weight:850;font-size:26px;letter-spacing:-1.3px}
.logo span{color:var(--ink)!important}
.side{background:#fff;border-color:#e9e9e5}
.main{padding-top:48px}
.eyebrow{font-size:10px;letter-spacing:.16em;font-weight:700;color:#777971}
h1{font-size:42px;font-weight:800;letter-spacing:-.055em;line-height:1.15;margin:12px 0 14px}
.desc{color:#767872;font-size:14px;line-height:1.6;margin-bottom:28px;letter-spacing:-.025em}
.primary,.ghost,.filter button,.nav button,.folder-open,.folder-action,.cat-row button{transition:transform .16s var(--ease),background-color .18s,color .18s;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.primary{background:var(--ink);border:1.5px solid var(--ink);border-radius:999px;font-weight:700;padding:12px 18px}
.ghost{background:var(--surface);border:1px solid #dedfd8;border-radius:999px;color:var(--ink);font-weight:650}
button:active:not(:disabled){transform:scale(.96)}
button:focus-visible,.card:focus-visible{outline:2px solid #45473f;outline-offset:4px}
.search{background:var(--surface);border:1.3px solid #d3d5cc;border-radius:19px;font-size:16px;padding:16px 18px;margin-bottom:18px;transition:border-color .18s,box-shadow .18s}
.search:focus{border-color:var(--ink);box-shadow:0 0 0 3px #22230f0a}
.category-bar{gap:8px;align-items:center;margin-bottom:24px;flex-direction:row}
.filter{margin-bottom:0;gap:7px;padding:3px 0}
.filter button{font-size:13px;font-weight:650;color:#686b62;background:#f4f4f1;border:1px solid transparent;border-radius:999px;padding:10px 15px}
.filter button.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.category-bar #manageCats{font-size:11px;padding:9px 12px;align-self:center}
.folder-box{padding:20px;border:1.4px solid var(--ink);border-radius:25px;background:#fff;margin-bottom:30px}
.folder-top{gap:9px;margin-bottom:14px;align-items:center}
.folder-top strong{font-size:18px;font-weight:800;letter-spacing:-.04em}
.folder-path{font-size:11px;color:#7b7d75;max-width:100%;overflow-wrap:anywhere}
.folder-top .ghost{font-size:11px;padding:8px 11px}
.folder-list{gap:9px;max-height:290px}
.folder-row{background:var(--surface);border:1px solid #dadcd3;border-radius:16px;padding:3px;gap:0}
.folder-row .folder-open{background:transparent;font-size:14px;font-weight:650;padding:13px 10px;min-width:0;overflow-wrap:anywhere}
.folder-action{width:30px;height:34px;border:0;background:transparent;color:#797c71;font-size:15px;border-radius:10px;flex-shrink:0}
.folder-row .folder-open.chosen{background:#e4e6dd}
.section{margin-bottom:17px}.section h2{font-size:20px;font-weight:800;letter-spacing:-.04em}.section .meta{color:#7b7e73;font-size:12px}
.cards{gap:25px 16px}.card{border-radius:20px;transition:transform .2s var(--ease);outline-offset:5px}
.card:active{transform:scale(.975)}
.thumb{border-radius:20px;background:#f0f1eb;aspect-ratio:1.15}
.card h3{font-size:14px;line-height:1.5;font-weight:700;letter-spacing:-.025em;margin:11px 2px 4px}
.card .meta{font-size:11px;color:#808478;margin-left:2px}
.empty{padding:60px 18px;background:#f6f6f3;border:1px dashed #cbd0c1;border-radius:24px;color:#7b7f72;font-size:14px;line-height:1.9}
.footer{margin-top:48px;color:#8a8d81;line-height:2}
.modal{display:flex;visibility:hidden;opacity:0;pointer-events:none;background:#17191366;transition:opacity .22s ease,visibility 0s .22s}
.modal.show{display:flex;visibility:visible;opacity:1;pointer-events:auto;transition:opacity .22s ease,visibility 0s}
.panel{border-radius:28px;padding:26px;box-shadow:0 20px 80px #10150b26;transform:translateY(20px) scale(.985);transition:transform .32s var(--ease);scrollbar-gutter:auto}
.modal.show .panel{transform:translateY(0) scale(1)}
.modal-heading{top:-26px;padding:12px 0 16px;align-items:center;gap:10px;border-color:#e9ebe3}
.modal-heading h2{font-size:24px;line-height:1.3;font-weight:800;letter-spacing:-.04em;overflow-wrap:anywhere}
.modal-heading-actions button{border-radius:999px;padding:10px 13px}
.field{gap:8px;margin:20px 0}.field label{font-size:12px;font-weight:700;color:#676b60}
.field input,.field textarea,.field select{background:#f6f7f2;border:1px solid #dce0d3;border-radius:15px;font-size:16px;padding:13px;color:var(--ink)}
.field input:focus,.field textarea:focus,.field select:focus{outline:2px solid #a7af98;outline-offset:1px}
.actions{gap:8px;flex-wrap:wrap}.detail-preview{width:100%;max-height:300px;object-fit:contain;background:#f0f1eb;border-radius:18px;margin:18px 0 4px}
.detail-link{display:block;padding:16px 18px;border:1px solid var(--ink);border-radius:16px;background:var(--ink);color:#fff;text-decoration:none;font-size:14px;font-weight:650;text-align:center}
#detail>p{font-size:15px;line-height:1.8}#detail>.meta{font-size:12px;color:#727767}
#authRoot>div{border-radius:28px!important;border-color:#252820!important}#authRoot h1{font-weight:800!important}
.login-choice input{accent-color:#272a23}
.folder-box{border:0;padding:0;background:transparent}
.folder-top{margin-bottom:20px}.folder-top strong{font-size:24px}
.folder-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;max-height:none;overflow:visible}
.folder-tile{position:relative;min-width:0;border:1.4px solid #20211e;border-radius:25px;background:#fff;padding:10px}
.folder-tile .folder-open{display:block;width:100%;padding:0;text-align:left;color:#191a18;border-radius:18px}
.folder-art{display:grid;place-items:center;height:130px;background:#e6e6e2;border-radius:18px;font-family:Georgia,serif;font-size:61px;color:#191a18;margin-bottom:15px}
.folder-art.tone-1{background:#eeeee9}.folder-art.tone-2{background:#deded9}
.folder-art svg{width:78px;height:78px;display:block;color:#171916}
.folder-art,.folder-art.tone-1,.folder-art.tone-2{background:#e7e7e2}
#folderPath[hidden]{display:none!important}
.folder-tile strong{display:block;font-size:17px;line-height:1.4;font-weight:750;overflow-wrap:anywhere;margin:0 30px 5px 4px}
.folder-caption{display:block;font-size:11px;line-height:1.6;color:#7b7d75;margin:0 24px 8px 4px;overflow-wrap:anywhere}
.folder-back,.folder-shortcuts{grid-column:1/-1}.folder-back{justify-self:start}.folder-shortcuts{display:flex;gap:8px;margin-bottom:4px;flex-wrap:wrap}
.folder-menu{position:absolute;right:10px;bottom:15px}.folder-menu summary{list-style:none;cursor:pointer;font-size:23px;line-height:30px;width:30px;text-align:center;border-radius:50%}.folder-menu summary::-webkit-details-marker{display:none}
.folder-menu[open]{z-index:20}.folder-menu[open] summary{background:#eeeee9}
.folder-menu>div{position:absolute;right:0;top:35px;width:125px;padding:6px;background:#fff;border:1px solid #d6d6cf;box-shadow:0 8px 25px #0002;border-radius:14px}
.folder-menu button{display:block;text-align:left;width:100%;padding:11px 9px;background:none;border:0;border-radius:8px;color:#20211e;font:inherit;font-size:12px}
#cards[hidden],#filters[hidden],#createFolder[hidden],.section[hidden],.folder-box[hidden]{display:none!important}
@media(max-width:900px){.folder-box{padding:0!important}.folder-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.folder-tile{border-radius:23px;padding:9px}.folder-art{height:112px;font-size:53px;border-radius:16px}.folder-tile strong{font-size:16px}.folder-top strong{font-size:23px}}
@media(hover:hover){.card:hover{transform:translateY(-3px)}.folder-action:hover{background:#e3e6db}.ghost:hover{background:#e8ebe1}.primary:hover{background:#393d30}}
@media(min-width:901px){.nav{gap:8px}.nav button{font-weight:650;border-radius:14px}.nav button.active{background:#eeefe9;color:#20211e}}
@media(max-width:900px){
 .side{padding:24px 22px 0;border:0;display:block}.side .logo{font-size:23px}
 .nav{position:fixed;z-index:30;bottom:calc(14px + env(safe-area-inset-bottom,0px));left:50%;transform:translateX(-50%);width:calc(100% - 32px);max-width:480px;display:grid;grid-template-columns:repeat(3,1fr);gap:0;background:rgba(255,255,255,.98);border:1.5px solid var(--ink);border-radius:999px;padding:6px;box-shadow:0 5px 24px #15190e0a;overflow:visible;isolation:isolate}
 .nav::before{content:'';position:absolute;inset:6px auto 6px 6px;width:calc((100% - 12px)/3);background:#eeefe9;border-radius:999px;z-index:-1;transform:translateX(calc(var(--tab-index,0)*100%));transition:transform .28s var(--ease)}
 .nav button,.nav button:nth-child(n+3){display:block;text-align:center;font-size:12px;font-weight:600;color:#5f6556;padding:15px 3px;min-height:46px;background:transparent;border-radius:999px}
 .nav button.active{background:transparent;color:#151911;font-weight:800}
 body.archive-dialog-open .nav{visibility:hidden;pointer-events:none}
 .main{padding:28px 20px 150px!important}.head{flex-wrap:nowrap;gap:12px;align-items:center}.head h1{font-size:36px;white-space:normal;font-weight:800}.head .primary{font-size:12px;padding:11px 14px}
 .eyebrow{display:none}.desc{font-size:13px;margin-bottom:25px}
 .cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:23px 13px}.card h3{font-size:13px}
 .floating-refresh{bottom:calc(99px + env(safe-area-inset-bottom,0px))!important;right:18px!important;border:1.3px solid #30352a!important;box-shadow:0 3px 12px #171d0c12!important}
 .modal{padding:0;align-items:flex-end}.panel{width:100%;max-width:650px;max-height:calc(100dvh - 30px);border-radius:28px 28px 0 0;padding:14px 21px calc(24px + env(safe-area-inset-bottom,0px));transform:translateY(100%);transition:transform .34s var(--ease)}
 .panel::before{content:'';display:block;width:34px;height:4px;background:#ced2c5;border-radius:9px;margin:0 auto 12px}
 .modal-heading{top:-14px;padding-top:13px}.modal-heading h2{font-size:22px}.modal-heading-actions button{padding:10px 12px}
 .category-bar{gap:6px}.category-bar #manageCats{padding:9px 10px}.filter button{padding:10px 12px;font-size:12px}
 .folder-box{padding:17px;border-radius:23px}.folder-path{flex-basis:100%;order:3}.folder-top{gap:8px}
}
@media(max-width:350px){.main{padding-left:14px!important;padding-right:14px!important}.head h1{font-size:31px}.folder-action{width:26px}.modal-heading{flex-wrap:wrap}.modal-heading-actions{margin-left:auto}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}