:root{--page-ivory:#fbf7ef;--surface-ivory:#fffdf8;--surface-blush:#f8ebe5;--surface-sage:#e8efe6;--surface-lavender:#eeebf5;--accent-peach:#d98f78;--accent-sage:#78937b;--text-dark:#453d3a;--text-muted:#8c817b;--border-soft:#eaded3;--shadow-soft:0 10px 28px #7153421a;--border-radius:16px}*{box-sizing:border-box}body{background-color:var(--page-ivory);min-width:320px;color:var(--text-dark);background-image:radial-gradient(#d8b49b1f 1px,#0000 1px);background-size:18px 18px;margin:0;padding:0;font-family:Pretendard,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.5}button,a,.logo{-webkit-tap-highlight-color:transparent;cursor:pointer}.no-cursor{-webkit-user-select:none;user-select:none;min-height:100vh;padding:0 24px 40px}.no-cursor>button:first-child{color:var(--text-muted);background:0 0;border:0;margin:12px 0 -10px auto;font-size:12px;display:block}.navbar-header{border-bottom:1px solid var(--border-soft);justify-content:space-between;align-items:center;gap:24px;max-width:1200px;margin:0 auto 36px;padding:22px 0 18px;display:flex}.navbar-header .logo{color:var(--accent-sage);letter-spacing:-.04em;font-size:clamp(1.25rem,2vw,1.55rem);font-weight:800}.navbar-header nav .nav-links{align-items:center;gap:12px;margin:0;padding:0;list-style:none;display:flex}.navbar-header nav .nav-links li a{max-width:min(42vw,320px);color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:600;text-decoration:none;transition:color .2s,background-color .2s;display:block;overflow:hidden}.navbar-header nav .nav-links li a:hover{color:var(--accent-peach)}.navbar-header nav .nav-links li a[onClick*="navigate('/login')"]{color:#9e6553;box-shadow:none;background-color:#f8e5dc;border:1px solid #efd3c7;border-radius:999px;padding:7px 12px}.ctrl,.main-container,.card{width:min(100%,1200px);margin-left:auto;margin-right:auto}.ctrl{justify-content:flex-end;margin-bottom:24px;display:flex}.write-btn{background:var(--accent-peach);color:#fffaf5;border:1px solid #e8b9a7;border-radius:999px;padding:10px 19px;font-size:14px;font-weight:700;transition:transform .2s,box-shadow .2s,background-color .2s;box-shadow:0 5px 12px #c47b6233}.write-btn:hover{background:#ca8068;transform:translateY(-1px);box-shadow:0 8px 16px #c47b6240}.card{border:1px solid var(--border-soft);border-radius:var(--border-radius);background:var(--surface-sage);box-shadow:var(--shadow-soft);gap:18px;padding:24px;display:flex;overflow-x:auto}.book-card{border:1px solid #d6e2d3;border-left:5px solid var(--accent-sage);background:var(--surface-ivory);min-width:160px;height:240px;color:var(--text-dark);text-align:center;border-radius:10px;justify-content:center;align-items:center;margin:0;padding:15px;font-size:13px;font-weight:600;display:flex;box-shadow:0 6px 16px #59705a1f}.main-container{padding:0 0 20px}.main-container>p{color:var(--text-muted);text-align:center;margin:72px auto;font-size:15px}.media-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:24px;display:grid}.media-card{border:1px solid var(--border-soft);border-radius:var(--border-radius);background:var(--surface-ivory);height:100%;box-shadow:var(--shadow-soft);flex-direction:column;transition:transform .2s,box-shadow .2s;display:flex;overflow:visible}.media-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px #71534226}.media-card:has(.dropdown-menu:hover){box-shadow:var(--shadow-soft)!important;transform:none!important}.image-wrapper{border-radius:var(--border-radius) var(--border-radius) 0 0;background:var(--surface-lavender);width:100%;padding-top:140%;position:relative;overflow:hidden}.media-image,.no-image{width:100%;height:100%;position:absolute;inset:0}.media-image{object-fit:cover}.no-image{background:var(--surface-lavender);color:#9b91aa;justify-content:center;align-items:center;font-size:14px;font-style:italic;display:flex}.info-wrapper{background:var(--surface-ivory);border-radius:0 0 var(--border-radius) var(--border-radius);flex-direction:column;flex-grow:1;min-height:110px;padding:16px;display:flex;position:relative}.menu-btn{z-index:20;color:#9b8b83;padding:4px 8px;font-size:1.2rem;font-weight:700;position:absolute;top:12px;right:12px}.menu-btn:hover{color:var(--accent-peach)}.media-title{color:var(--text-dark);word-break:break-all;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0 36px 6px 0;font-size:15px;font-weight:700;line-height:1.4;display:-webkit-box;overflow:hidden}.media-creator{color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;margin:0 0 10px;font-size:13px;overflow:hidden}.media-date{color:#ad9f98;margin-top:auto;font-size:11px}.write-page{width:min(100%,760px);margin:0 auto;padding:12px 0 64px}.write-header{text-align:center;margin-bottom:28px}.write-header h1{color:var(--text-dark);letter-spacing:-.05em;margin:4px 0 8px;font-size:clamp(1.65rem,4vw,2.2rem)}.write-header p:last-child{color:var(--text-muted);margin:0;font-size:14px}.write-eyebrow{color:var(--accent-peach);letter-spacing:.14em;margin:0;font-size:11px;font-weight:800}.write-form{border:1px solid var(--border-soft);box-shadow:var(--shadow-soft);background:#fffdf8e6;border-radius:24px;flex-direction:column;gap:24px;padding:clamp(20px,4vw,38px);display:flex}.form-section{flex-direction:column;gap:10px;display:flex}.form-label{color:var(--text-dark);font-size:13px;font-weight:800}.dropdown-container{display:block;position:relative}.dropdown-btn{border:1px solid var(--border-soft);background:var(--surface-ivory);width:100%;color:var(--text-dark);text-align:left;font:inherit;border-radius:12px;padding:13px 16px;font-size:14px}.media-picker-section{background:var(--surface-lavender);border-radius:16px;align-items:center;padding:22px 16px}.media-picker-section .form-label{align-self:stretch}.selected-info{max-width:100%;color:var(--text-muted);text-align:center;flex-direction:column;gap:2px;font-size:13px;display:flex}.selected-info strong{color:var(--text-dark);font-size:15px}.details-section{grid-template-columns:1fr 1fr;gap:16px;display:grid}.field-group{flex-direction:column;gap:8px;display:flex}.write-form input,.write-form textarea{border:1px solid var(--border-soft);width:100%;color:var(--text-dark);font:inherit;background:#fffefa;border-radius:12px;outline:none;padding:13px 14px;transition:border-color .2s,box-shadow .2s}.write-form textarea{resize:vertical;min-height:170px;line-height:1.7}.write-form input:focus,.write-form textarea:focus,.dropdown-btn:focus-visible{border-color:var(--accent-peach);box-shadow:0 0 0 3px #d98f7829}.form-actions{justify-content:flex-end;gap:10px;padding-top:4px;display:flex}.cancel-btn,.submit-btn{font:inherit;border-radius:999px;padding:11px 22px;font-size:14px;font-weight:700}.cancel-btn{border:1px solid var(--border-soft);color:var(--text-muted);background:0 0}.submit-btn{background:var(--accent-peach);color:#fffaf5;border:1px solid #e8b9a7}.cancel-btn:hover,.submit-btn:hover{transform:translateY(-1px)}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#0006;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal-content{background:var(--surface-ivory);border:1px solid var(--border-soft);border-radius:20px;flex-direction:column;gap:16px;width:100%;max-width:480px;padding:24px;display:flex;box-shadow:0 20px 40px #00000026}.modal-search-row{gap:8px;display:flex}.modal-search-input{border:1px solid var(--border-soft);color:var(--text-dark);background:#fff;border-radius:12px;outline:none;flex:1;padding:12px 16px;font-size:14px}.modal-search-input:focus{border-color:var(--accent-peach);box-shadow:0 0 0 3px #d98f7829}.modal-results-list{flex-direction:column;gap:8px;max-height:320px;display:flex;overflow-y:auto}.modal-result-item{cursor:pointer;background:var(--surface-sage);border:1px solid #d6e2d3;border-radius:10px;justify-content:space-between;align-items:center;padding:12px;transition:background .2s;display:flex}.modal-result-item:hover{background:#dce7da}.dropdown-btn{margin:0;font-size:16px;font-weight:600}.dropdown-menu{z-index:999;border:1px solid var(--border-soft);background:var(--surface-ivory);border-radius:10px;width:160px;margin:0;padding:8px 0;list-style:none;position:absolute;top:calc(100% + 6px);right:50%;box-shadow:0 10px 22px #71534229}.dropdown-menu li a,.dropdown-menu li button{width:100%;color:var(--text-muted);text-align:left;cursor:pointer;background:0 0;border:0;padding:12px 18px;font-size:15px;font-weight:600;text-decoration:none;display:block}.dropdown-menu li a:hover,.dropdown-menu li button:hover{background:var(--surface-blush);color:#a56452}footer{border-top:1px solid var(--border-soft);max-width:1200px;margin:54px auto 0;padding-top:24px}footer p{text-align:center;color:var(--text-muted)!important}@media (width<=640px){.no-cursor{padding:0 16px 32px}.navbar-header{flex-direction:column;align-items:flex-start;gap:14px;margin-bottom:26px}.navbar-header nav,.navbar-header nav .nav-links,.navbar-header nav .nav-links li,.navbar-header nav .nav-links li a{width:100%;max-width:none}.media-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.info-wrapper{padding:13px}}.detail-page{width:min(100%,900px);margin:0 auto;padding:12px 0 64px}.detail-top-bar{margin-bottom:24px}.detail-not-found{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:20px;min-height:60vh;display:flex}.detail-container{border:1px solid var(--border-soft);box-shadow:var(--shadow-soft);background:#fffdf8f2;border-radius:24px;gap:36px;padding:clamp(20px,4vw,40px);display:flex}.detail-poster-wrapper{background:var(--surface-lavender);border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;width:240px;height:350px;display:flex;overflow:hidden;box-shadow:0 12px 24px #71534226}.detail-poster-img{object-fit:cover;width:100%;height:100%}.detail-no-image{color:var(--text-muted);font-size:14px;font-style:italic}.detail-content-wrapper{flex-direction:column;flex-grow:1;gap:20px;display:flex}.detail-subject-badge{background:var(--surface-blush);color:#a56452;letter-spacing:.1em;border-radius:999px;margin-bottom:8px;padding:4px 10px;font-size:11px;font-weight:800;display:inline-block}.detail-title{color:var(--text-dark);margin:0 0 4px;font-size:clamp(1.4rem,3vw,1.8rem);font-weight:800;line-height:1.3}.detail-creator{color:var(--text-muted);margin:0;font-size:14px;font-weight:600}.detail-meta-box{background:var(--surface-sage);border:1px solid #d6e2d3;border-radius:14px;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;padding:16px;display:grid}.detail-meta-item{flex-direction:column;gap:2px;display:flex}.meta-label{color:var(--text-muted);text-transform:uppercase;font-size:11px;font-weight:700}.meta-value{color:var(--text-dark);font-size:14px;font-weight:700}.detail-review-section{flex-direction:column;flex-grow:1;gap:8px;display:flex}.review-heading{color:var(--text-dark);margin:0;font-size:13px;font-weight:800}.review-box{border:1px solid var(--border-soft);background:#fffefa;border-radius:14px;flex-grow:1;min-height:120px;padding:16px}.review-box p{color:var(--text-dark);white-space:pre-wrap;margin:0;font-size:14px;line-height:1.7}@media (width<=768px){.detail-container{text-align:center;flex-direction:column;align-items:center}.detail-poster-wrapper{width:180px;height:260px}.detail-content-wrapper{text-align:left;width:100%}}