:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:#213547;background-color:#fff9fb;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;min-width:320px;min-height:100vh;background-color:#fff9fb}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}:root{--pink: #ff7aa2;--peach: #ffe8d6;--mint: #d9f3e4;--ink: #29323c;--muted: #6b7a87;--bg: #fff9fb;--line: #f3e7eb}body{background:var(--bg);color:var(--ink)}::selection{background:var(--pink);color:#fff}::placeholder{opacity:.5!important}#main-content{padding-top:0;background:var(--bg)}.brand-dot{width:10px;height:10px;background:var(--pink);display:inline-block;border-radius:999px;margin-left:.35rem}.btn-ibu{background:var(--pink);color:#fff;border:none}.btn-ibu:hover{background:#e15f8a;color:#fff}h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{margin-bottom:.5rem;font-weight:600;line-height:1.2;color:var(--ink)}h1,.h1{font-size:2.25rem}h2,.h2{font-size:1.875rem}h3,.h3{font-size:1.5rem}h4,.h4{font-size:1.25rem}h5,.h5{font-size:1.125rem}h6,.h6{font-size:1rem}a{text-decoration:none;color:var(--ink)}a:hover{color:var(--pink);text-decoration:underline}.navbar{background:#fff;border-bottom:1px solid var(--line)}.navbar-brand{padding-top:.75rem;padding-bottom:.75rem;font-weight:600;line-height:1.2}.navbar .navbar-toggler{right:1rem}.hero{background:linear-gradient(180deg,var(--peach),#fff);border:1px solid #ffe1cf;border-radius:20px}.toolbar{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;justify-content:space-between;border:1px solid #f1e5ea;background:#fff;border-radius:12px;padding:.75rem}.toolbar .left,.toolbar .right{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.badge-cat{background:var(--mint);color:#185c3f;border:1px solid #c8ebdb}.post-card{border:1px solid #f1e5ea;background:#fff;border-radius:16px;overflow:hidden;transition:transform .2s,box-shadow .2s}.post-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px #ff7aa226}.post-thumb{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;border-bottom:1px solid #f1e5ea}.post-meta{color:var(--muted)}.form-control{height:45px;line-height:1.5;font-size:.875rem;border:1px solid #f1e5ea;border-radius:8px;background:#fff;color:var(--ink);transition:border-color .2s,box-shadow .2s}.form-control:focus{border-color:var(--pink);box-shadow:0 0 0 .2rem #ff7aa226;outline:0}textarea.form-control{height:auto;min-height:120px;line-height:1.5;font-size:.875rem;padding:.75rem}.form-select{height:45px;line-height:1.5;font-size:.875rem;border:1px solid #f1e5ea;border-radius:8px;background:#fff;color:var(--ink);transition:border-color .2s,box-shadow .2s}.form-select:focus{border-color:var(--pink);box-shadow:0 0 0 .2rem #ff7aa226;outline:0}.form-label{font-weight:500;color:var(--ink);margin-bottom:.5rem}.btn{height:45px;font-size:.875rem;font-weight:500;border-radius:8px;padding:.5rem 1rem;transition:all .2s;border:1px solid transparent}.btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #0000001a}.btn-lg{height:55px;font-size:1rem;padding:.75rem 1.5rem}.btn-primary{background:var(--pink);color:#fff;border-color:var(--pink)}.btn-primary:hover{background:#e15f8a;border-color:#e15f8a;color:#fff}.btn-primary:focus{box-shadow:0 0 0 .2rem #ff7aa240}.btn-outline-secondary{background:#fff;color:var(--ink);border-color:#f1e5ea}.btn-outline-secondary:hover{background:var(--peach);border-color:var(--peach);color:var(--ink)}.btn-outline-pink{background:#fff;color:#ff7aa2;border-color:#ff7aa2}.btn-outline-pink:hover{background:#ff7aa2;border-color:#ff7aa2;color:#fff}.btn-outline-pink i{color:#ff7aa2}.btn-outline-pink:hover i{color:#fff}.btn-pink{background:#dc3545;color:#fff;border-color:#dc3545}.btn-pink:hover{background:#fff;color:#dc3545;border-color:#dc3545}#sidebar{background:#fff;border-radius:8px;padding:1.5rem;height:fit-content;box-shadow:0 1px 3px #0000001a}#sidebar .nav-link{color:var(--ink);padding:.75rem 1rem;border-radius:6px;margin-bottom:.25rem;text-decoration:none;transition:all .2s;display:flex;align-items:center}#sidebar .nav-link:hover{background:var(--peach);color:var(--pink)}#sidebar .nav-link.active{background:var(--pink);color:#fff}#sidebar .nav-link.active i{color:#fff}.btn-outline-danger{background:#fff;color:#dc3545;border-color:#dc3545}.btn-outline-danger:hover{background:#dc3545;border-color:#dc3545;color:#fff}.btn-group-sm .btn{height:38px;font-size:.8125rem;padding:.25rem .75rem}.table{color:var(--ink)}.table thead th{border-bottom:2px solid var(--line);font-weight:600;color:var(--ink);background:#fff}.table tbody tr{border-bottom:1px solid var(--line)}.table tbody tr:hover{background:var(--peach)}.table td,.table th{padding:.75rem;vertical-align:middle}#article-section,#new-article-section,#new-user-section,#category-section{background:#fff;border:1px solid #f1e5ea;border-radius:16px;padding:1.5rem;margin-bottom:1.5rem}#article-section form,#new-article-section form,#new-user-section form,#category-section form{margin-top:1rem}#new-article-section,#new-user-section,#category-section{max-width:100%}#new-article-section .form-control,#new-user-section .form-control,#category-section .form-control,#new-article-section .form-select,#new-user-section .form-select,#category-section .form-select{width:100%}#article-section .table-responsive,#category-section .table-responsive{background:#fff;border:1px solid #f1e5ea;border-radius:12px;overflow:hidden}#article-section h2,#new-article-section h2,#new-user-section h2,#category-section h2{margin-bottom:1rem;color:var(--ink)}.badge{padding:.35em .65em;font-size:.75em;font-weight:600;border-radius:6px}.text-bg-success{background:var(--mint);color:#185c3f;border:1px solid #c8ebdb}.footer{background:#fff;border-top:1px solid var(--line);border-bottom:0;color:var(--muted)}.footer a{color:var(--ink)}.footer a:hover{color:var(--pink);text-decoration:underline}.pagination{gap:.5rem;margin:0}.pagination .page-item{margin:0}.pagination .page-link{background:#fff;color:var(--ink);border:1px solid #f1e5ea;border-radius:8px;padding:.5rem 1rem;font-size:.875rem;font-weight:500;min-width:45px;height:45px;display:flex;align-items:center;justify-content:center;transition:all .2s;text-decoration:none;cursor:pointer}.pagination .page-link button{background:transparent;border:none;color:inherit;font-size:inherit;font-weight:inherit;padding:0;width:100%;height:100%;cursor:pointer}.pagination .page-link:hover{background:var(--peach);border-color:var(--peach);color:var(--ink);transform:translateY(-1px);box-shadow:0 4px 12px #0000001a}.pagination .page-item.active .page-link{background:var(--pink);border-color:var(--pink);color:#fff;box-shadow:0 4px 12px #ff7aa240}.pagination .page-item.active .page-link:hover{background:#e15f8a;border-color:#e15f8a;color:#fff}.pagination .page-item.disabled .page-link{background:#f8f9fa;border-color:#f1e5ea;color:var(--muted);opacity:.6;cursor:not-allowed;pointer-events:none}.pagination .page-item.disabled .page-link:hover{transform:none;box-shadow:none;background:#f8f9fa;border-color:#f1e5ea;color:var(--muted)}@media(max-width:768px){.hero{text-align:center}.toolbar{flex-direction:column;align-items:stretch}.toolbar .left{width:100%;flex-direction:column}#article-section,#new-article-section,#new-user-section,#category-section{padding:1rem;border-radius:12px}.btn-group-sm .btn{height:36px;font-size:.75rem;padding:.2rem .5rem}}html,body,#root{height:100%;margin:0;background:var(--bg)}#login-page{min-height:calc(100vh - 220px);display:flex;align-items:center;justify-content:center;background:transparent;padding:0 16px}.login-card{width:100%;max-width:420px;background:#fff;border-radius:16px;padding:32px 28px;box-shadow:0 8px 24px #00000014}.login-title{text-align:center;font-size:1.5rem;margin-bottom:1.5rem;color:#29323c}.login-card .form-label{margin-bottom:6px;color:#6b7a87}.login-card .form-control{border-radius:10px;border:1px solid #e6d8de;height:44px;padding:0 12px;margin-bottom:14px}.login-card .btn-login{width:100%;height:44px;border:none;border-radius:10px;background:#ff7aa2;color:#fff;font-weight:600;cursor:pointer;transition:.2s}.login-card .btn-login:hover{background:#ff4d84}
