:root{--paper:#f4ece0;--paper-2:#efe4d4;--card:#fbf6ee;--ink:#3a2e24;--ink-soft:#7a6a5a;--terra:#c0633f;--terra-deep:#a64f30;--sage:#8a9b6e;--mustard:#d8a64a;--line:#e0d3c0;--shadow:rgba(86,60,40,.16);--radius:22px}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%}body{font-family:Nunito Sans,sans-serif;background-color:var(--paper);color:var(--ink);min-height:100vh;line-height:1.5;background-image:radial-gradient(circle at 18% 8%,rgba(192,99,63,.06),transparent 42%),radial-gradient(circle at 88% 82%,rgba(138,155,110,.07),transparent 48%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='22'%3E%3Cg fill='none' stroke='%23d6c4a8' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round' opacity='0.55'%3E%3Cpath d='M0 10 L6 2 L12 10 M12 10 L18 2 L24 10 M24 10 L30 2 L36 10'/%3E%3Cpath d='M-6 21 L0 13 L6 21 M6 21 L12 13 L18 21 M18 21 L24 13 L30 21 M30 21 L36 13 L42 21'/%3E%3C/g%3E%3C/svg%3E");background-attachment:fixed,fixed,scroll}input,button,select,textarea{font-family:inherit}.yarn-deco{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;overflow:hidden}.yarn-deco i{position:absolute;border-radius:50%;opacity:.12;background:radial-gradient(circle at 35% 30%,#fff6,transparent 60%),var(--c);animation:floaty var(--d) ease-in-out infinite alternate}@keyframes floaty{0%{transform:translateY(0) rotate(0)}to{transform:translateY(-26px) rotate(22deg)}}.topbar{position:sticky;top:0;z-index:30;background:#f4ece0db;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px dashed var(--line);padding:calc(14px + env(safe-area-inset-top)) 20px 14px}.topbar-inner{max-width:980px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:14px}.brand{display:flex;align-items:center;gap:11px}.brand .knot{width:42px;height:42px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#d8744e,var(--terra-deep));display:grid;place-items:center;flex:none;box-shadow:0 4px 10px #a64f3066,inset 0 2px 3px #ffffff40;animation:spin 26s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.brand .knot svg{width:24px;height:24px}.brand h1{font-family:Fraunces,serif;font-weight:600;font-size:20px;letter-spacing:.2px;line-height:1.05}.brand small{display:block;font-size:11px;color:var(--ink-soft);font-weight:600;letter-spacing:1.5px;text-transform:uppercase}.top-actions{display:flex;gap:8px}.icon-btn{width:40px;height:40px;border-radius:12px;flex:none;cursor:pointer;background:var(--card);border:1.5px solid var(--line);color:var(--ink-soft);display:grid;place-items:center;transition:all .16s}.icon-btn:hover{border-color:var(--terra);color:var(--terra)}.icon-btn svg{width:20px;height:20px}.wrap{max-width:980px;margin:0 auto;padding:22px 20px 120px;position:relative;z-index:1}.topbar{position:sticky;z-index:30}.hero{margin:6px 0 22px}.hero h2{font-family:Fraunces,serif;font-weight:600;font-size:30px;line-height:1.1;letter-spacing:-.3px}.hero h2 em{font-style:italic;color:var(--terra)}.hero p{color:var(--ink-soft);margin-top:6px;font-size:15px}.search{position:relative;margin:0 0 16px}.search input{width:100%;font-size:15px;color:var(--ink);background:var(--card);border:1.5px solid var(--line);border-radius:16px;padding:14px 16px 14px 46px;transition:border-color .2s,box-shadow .2s}.search input::placeholder{color:#a89880}.search input:focus{outline:none;border-color:var(--terra);box-shadow:0 0 0 4px #c0633f1f}.search svg{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:20px;height:20px;color:#a89880}.filters{display:flex;gap:9px;overflow-x:auto;padding:2px 0 10px;margin-bottom:18px;-webkit-overflow-scrolling:touch}.filters::-webkit-scrollbar{display:none}.chip{flex:none;font-weight:600;font-size:13.5px;cursor:pointer;background:var(--card);color:var(--ink-soft);border:1.5px solid var(--line);border-radius:999px;padding:9px 16px;display:flex;align-items:center;gap:6px;transition:all .18s;white-space:nowrap}.chip:hover{border-color:var(--terra);color:var(--terra)}.chip.active{background:var(--ink);color:var(--paper);border-color:var(--ink)}.chip .dot{width:8px;height:8px;border-radius:50%}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}@media (min-width:680px){.grid{grid-template-columns:repeat(3,1fr);gap:20px}}.card{background:linear-gradient(135deg,rgba(255,255,255,.4),transparent 60%),var(--card);border:1.5px solid #e7d8c2;border-radius:14px 14px 24px 24px;overflow:hidden;cursor:pointer;position:relative;box-shadow:0 4px 10px #563c281a,inset 0 1px #ffffff80;transition:transform .3s cubic-bezier(.2,.7,.3,1),box-shadow .3s;transform-origin:center top;animation:rise .5s both,sway 7s ease-in-out infinite}.card:after{content:"";position:absolute;top:6px;right:6px;bottom:6px;left:6px;border-radius:9px 9px 18px 18px;border:1.8px dashed rgba(166,79,48,.38);pointer-events:none;z-index:3}.card:hover{animation-play-state:paused;transform:translateY(-7px) rotate(0) scale(1.015);box-shadow:0 20px 36px var(--shadow)}.card:nth-child(1){animation-delay:0s,.5s}.card:nth-child(2){animation-delay:.05s,1.1s}.card:nth-child(3){animation-delay:.1s,.2s}.card:nth-child(4){animation-delay:.15s,1.6s}.card:nth-child(5){animation-delay:.2s,.8s}.card:nth-child(6){animation-delay:.25s,1.9s}.card:nth-child(7){animation-delay:.3s,.4s}.card:nth-child(8){animation-delay:.35s,1.3s}@keyframes rise{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}@keyframes sway{0%,to{transform:rotate(-.7deg) translateY(0)}50%{transform:rotate(.7deg) translateY(-3px)}}@media (prefers-reduced-motion:reduce){.card,.yarn-deco i,.brand .knot{animation:none!important}}.thumb{position:relative;aspect-ratio:1/1;display:grid;place-items:center;overflow:hidden;border-bottom:1px solid var(--line)}.cover-img{width:100%;height:100%;object-fit:cover;display:block}.fav{position:absolute;top:10px;right:10px;z-index:4;width:34px;height:34px;border-radius:50%;border:none;cursor:pointer;background:#fbf6eee6;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:grid;place-items:center;box-shadow:0 2px 6px var(--shadow);transition:transform .15s}.fav:hover{transform:scale(1.12)}.fav svg{width:18px;height:18px;color:#c9b9a3;transition:color .15s,fill .15s}.fav.on svg{color:var(--terra)}.type-tag{position:absolute;top:10px;left:10px;z-index:4;font-size:11px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;background:#3a2e24d1;color:var(--paper);padding:4px 9px;border-radius:8px;display:flex;align-items:center;gap:4px}.type-tag svg{width:12px;height:12px}.video-badge{position:absolute;bottom:10px;left:10px;z-index:4;display:flex;align-items:center;gap:5px;font-size:11px;font-weight:700;letter-spacing:.3px;background:#c0633feb;color:#fff;padding:5px 10px 5px 8px;border-radius:9px;box-shadow:0 3px 8px #a64f3066;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.video-badge .play{width:16px;height:16px;border-radius:50%;background:#fff;display:grid;place-items:center;flex:none}.video-badge .play svg{width:9px;height:9px;color:var(--terra-deep);margin-left:1px}.vid-cover{width:100%;height:100%;position:relative;background:#3a2e24}.vid-cover img{width:100%;height:100%;object-fit:cover;display:block}.bigplay{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:48px;height:48px;border-radius:50%;background:#c0633feb;display:grid;place-items:center;box-shadow:0 4px 14px #00000059}.bigplay svg{width:20px;height:20px;color:#fff;margin-left:2px}.pdf-cover{width:100%;height:100%;background:#fdfaf4;padding:14px 13px;display:flex;flex-direction:column;gap:6px;position:relative}.pdf-cover:before{content:"";position:absolute;top:0;right:0;border-width:0 22px 22px 0;border-style:solid;border-color:#e7dcc8 var(--paper)}.pdf-cover .ln{height:5px;border-radius:3px;background:#e3d8c5}.pdf-cover .ln.t{height:8px;width:70%;background:#cdbfa6;margin-bottom:3px}.pdf-cover .ln.s{width:90%}.pdf-cover .ln.s2{width:60%}.pdf-cover .grid-mini{margin-top:6px;flex:1;display:grid;grid-template-columns:repeat(4,1fr);gap:4px}.pdf-cover .grid-mini i{background:#efe7d6;border-radius:3px}.card-body{padding:13px 14px 15px}.card-body h3{font-family:Fraunces,serif;font-weight:600;font-size:16.5px;line-height:1.2;margin-bottom:7px}.meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.pill{font-size:11px;font-weight:600;padding:3px 9px;border-radius:999px;background:var(--paper-2);color:var(--ink-soft)}.pill.level{background:#8a9b6e2e;color:#5f6f43}.pill.hook{background:#d8a64a33;color:#9a7320;display:flex;align-items:center;gap:4px}.pill.hook svg{width:11px;height:11px}.fab{position:fixed;right:20px;bottom:calc(26px + env(safe-area-inset-bottom));z-index:40;height:58px;padding:0 22px 0 18px;border:none;cursor:pointer;background:linear-gradient(135deg,var(--terra),var(--terra-deep));color:#fff;font-family:Fraunces,serif;font-weight:600;font-size:16px;border-radius:999px;display:flex;align-items:center;gap:9px;box-shadow:0 10px 24px #a64f3073,inset 0 2px 2px #ffffff40;transition:transform .18s,box-shadow .18s}.fab:hover{transform:translateY(-3px);box-shadow:0 16px 30px #a64f3080}.fab svg{width:22px;height:22px}.empty{text-align:center;padding:48px 20px;color:var(--ink-soft)}.empty .empty-art{font-size:54px;margin-bottom:10px}.empty h3{font-family:Fraunces,serif;font-weight:600;font-size:21px;color:var(--ink);margin-bottom:6px}.empty p{max-width:340px;margin:0 auto 18px;font-size:14.5px}.empty.small{padding:30px}.btn-save.inline{display:inline-flex;width:auto;padding:13px 22px}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#3a2e2473;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .25s}.overlay.open{opacity:1;pointer-events:auto}.sheet{position:fixed;left:0;right:0;bottom:0;z-index:51;max-width:560px;margin:0 auto;background:var(--paper);border-radius:26px 26px 0 0;box-shadow:0 -10px 40px #3a2e244d;transform:translateY(100%);transition:transform .32s cubic-bezier(.2,.8,.25,1);max-height:94vh;display:flex;flex-direction:column}.sheet.open{transform:none}.sheet-grip{width:44px;height:5px;border-radius:99px;background:var(--line);margin:11px auto 4px}.sheet-head{display:flex;align-items:center;justify-content:space-between;padding:8px 20px 14px;border-bottom:1px dashed var(--line)}.sheet-head h3{font-family:Fraunces,serif;font-weight:600;font-size:21px}.sheet-head .close{width:34px;height:34px;border-radius:50%;border:1.5px solid var(--line);background:var(--card);cursor:pointer;display:grid;place-items:center;color:var(--ink-soft)}.sheet-head .close svg{width:18px;height:18px}.sheet-body{overflow-y:auto;padding:20px 20px 8px}.field{margin-bottom:18px}.field>label{display:block;font-weight:700;font-size:13.5px;margin-bottom:9px;color:var(--ink)}.field .hint{font-weight:500;color:var(--ink-soft);font-size:12px}.field input[type=text],.field textarea,.field select{width:100%;font-size:15px;color:var(--ink);background:var(--card);border:1.5px solid var(--line);border-radius:13px;padding:13px 14px;transition:border-color .2s,box-shadow .2s}.field textarea{resize:vertical;min-height:74px}.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--terra);box-shadow:0 0 0 4px #c0633f1f}.field-ok{margin-top:7px;font-size:12.5px;font-weight:600;color:#5f6f43}.field-warn{margin-top:7px;font-size:12.5px;font-weight:600;color:var(--terra-deep)}.file-btn{width:100%;text-align:left;cursor:pointer;background:var(--card);border:1.5px dashed var(--line);border-radius:13px;padding:13px 14px;color:var(--ink-soft);font-size:14px;font-weight:600}.file-btn:hover{border-color:var(--terra);color:var(--terra)}.type-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.type-opt{cursor:pointer;background:var(--card);border:1.5px solid var(--line);border-radius:14px;padding:13px 6px;display:flex;flex-direction:column;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--ink-soft);transition:all .16s;text-align:center}.type-opt svg{width:22px;height:22px}.type-opt:hover{border-color:var(--terra)}.type-opt.sel{background:var(--ink);color:var(--paper);border-color:var(--ink)}.photo-row{display:flex;gap:10px;flex-wrap:wrap}.photo-add{width:78px;height:78px;border-radius:14px;border:2px dashed var(--line);background:var(--card);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--ink-soft);font-size:10.5px;font-weight:600;transition:all .16s}.photo-add:hover{border-color:var(--terra);color:var(--terra)}.photo-add svg{width:22px;height:22px}.photo-thumb{width:78px;height:78px;border-radius:14px;position:relative;overflow:hidden;border:1px solid var(--line);background-size:cover;background-position:center}.photo-thumb .x{position:absolute;top:3px;right:3px;width:20px;height:20px;border-radius:50%;border:none;background:#3a2e24cc;color:#fff;cursor:pointer;font-size:13px;line-height:1;display:grid;place-items:center}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}.fav-toggle{display:flex;align-items:center;justify-content:space-between;background:var(--card);border:1.5px solid var(--line);border-radius:13px;padding:12px 14px;cursor:pointer}.fav-toggle span{font-weight:700;font-size:14px;display:flex;align-items:center;gap:8px}.fav-toggle span svg{width:18px;height:18px;color:var(--ink-soft)}.switch{width:46px;height:27px;border-radius:99px;background:var(--line);position:relative;transition:background .2s;flex:none}.switch:after{content:"";position:absolute;top:3px;left:3px;width:21px;height:21px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:transform .2s}.fav-toggle.on .switch{background:var(--terra)}.fav-toggle.on .switch:after{transform:translate(19px)}.fav-toggle.on span svg{color:var(--terra)}.sheet-foot{padding:14px 20px calc(18px + env(safe-area-inset-bottom));border-top:1px dashed var(--line);background:var(--paper)}.btn-save{width:100%;border:none;cursor:pointer;font-family:Fraunces,serif;font-weight:600;font-size:17px;color:#fff;background:linear-gradient(135deg,var(--terra),var(--terra-deep));border-radius:15px;padding:15px;display:flex;align-items:center;justify-content:center;gap:9px;box-shadow:0 8px 20px #a64f3066;transition:transform .15s}.btn-save:hover{transform:translateY(-2px)}.btn-save:disabled{opacity:.6;cursor:default;transform:none}.btn-save svg{width:20px;height:20px}.detail-meta{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin-bottom:14px}.fav-pill{border:none;cursor:pointer;display:flex;align-items:center;gap:5px;background:var(--paper-2)}.fav-pill svg{width:13px;height:13px}.fav-pill.on{background:#c0633f26;color:var(--terra-deep)}.tag-row{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}.tag{font-size:12px;font-weight:600;color:var(--ink-soft);background:var(--paper-2);padding:4px 10px;border-radius:999px}.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:16px}.gallery img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:12px;border:1px solid var(--line);display:block}.video-embed{position:relative;aspect-ratio:16/9;margin-bottom:16px;border-radius:14px;overflow:hidden;border:1px solid var(--line)}.video-embed iframe{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;border:0}.ext-link{display:block;text-decoration:none;text-align:center;font-weight:700;font-size:14.5px;color:var(--terra-deep);background:var(--card);border:1.5px solid var(--line);border-radius:13px;padding:13px;margin-bottom:12px;transition:border-color .16s}.ext-link:hover{border-color:var(--terra)}.text-block{white-space:pre-wrap;background:var(--card);border:1.5px solid var(--line);border-radius:13px;padding:14px;font-size:14.5px;margin-bottom:16px}.notes-block{background:#d8a64a1f;border:1.5px solid rgba(216,166,74,.4);border-radius:13px;padding:14px;margin-bottom:8px}.notes-block strong{display:block;font-family:Fraunces,serif;font-size:15px;margin-bottom:5px}.notes-block p{white-space:pre-wrap;font-size:14.5px;color:var(--ink)}.detail-foot{display:flex;gap:10px}.detail-foot .btn-save{flex:1}.btn-ghost{border:1.5px solid var(--line);background:var(--card);border-radius:15px;padding:15px 18px;cursor:pointer;font-family:Fraunces,serif;font-weight:600;font-size:16px;display:flex;align-items:center;gap:8px;color:var(--ink-soft)}.btn-ghost svg{width:18px;height:18px}.btn-ghost.danger{color:#b04632;border-color:#b0463259}.btn-ghost.danger:hover{background:#b0463214}
