:root{--bg:#050505;--bg-soft:#0b0b0d;--surface:#ffffff0b;--surface-strong:#ffffff14;--surface-hover:#7c5cff1a;--text-main:#f5f5f5;--text-muted:#ffffffad;--text-soft:#ffffffd1;--border:#ffffff14;--border-hover:#7c5cff59;--primary:#7c5cff;--accent:#00c2a8;--accent-soft:#00c2a824;--danger-bg:#ff50501f;--danger-border:#ff505040;--danger-text:#ffb4b4;--success-bg:#00c2a81f;--success-border:#00c2a847;--success-text:#7ff1df;--shadow:0 18px 45px #0000004d;--radius-lg:24px;--radius-md:16px;--radius-sm:12px}*{box-sizing:border-box}html{font-size:clamp(14px,.9vw,16px)}body{min-width:320px;color:var(--text-main);background:radial-gradient(circle at top left, #5050b42e, transparent 30%), radial-gradient(circle at top right, #00b48c24, transparent 25%), linear-gradient(180deg, var(--bg) 0%, var(--bg-soft) 100%);margin:0;font-family:Pretendard,Noto Sans KR,Arial,sans-serif;line-height:1.5}button,input,textarea{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}#root{min-height:100vh}.container{width:min(100% - 32px,1100px);margin:0 auto;padding:48px 0 80px}.container>h2{letter-spacing:-.03em;margin:0 0 18px;font-size:clamp(1.8rem,4vw,2.625rem);font-weight:800}h1{margin:0 0 20px;font-size:clamp(1.8rem,3vw,2.5rem);line-height:1.2}h2,h3{line-height:1.3}.header{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);justify-content:space-between;align-items:center;gap:20px;margin-bottom:32px;padding:24px 28px;display:flex}.header>div{align-items:center;gap:12px;display:flex}.header span{font-weight:700;color:var(--text-soft)!important}.nav{flex-wrap:wrap;gap:10px;display:flex}.nav a{color:var(--text-soft);white-space:nowrap;border-radius:999px;padding:10px 14px;font-weight:700;transition:background .2s,color .2s,transform .2s}.nav a:hover{color:#fff;background:#7c5cff2e;transform:translateY(-1px)}.form,.board-wrap,.post-item{border:1px solid var(--border);border-radius:var(--radius-lg);background:linear-gradient(180deg, var(--surface), #ffffff06);box-shadow:var(--shadow)}.form{flex-direction:column;gap:16px;padding:28px;display:flex}input,textarea{border:1px solid var(--border);border-radius:var(--radius-md);color:#fff;background:#ffffff0f;outline:none;width:100%;padding:13px 16px;transition:border-color .2s,box-shadow .2s,background .2s}input::placeholder,textarea::placeholder{color:#ffffff6b}input:focus,textarea:focus{background:#ffffff16;border-color:#7c5cffa6;box-shadow:0 0 0 4px #7c5cff29}textarea{resize:vertical;min-height:clamp(140px,18vw,220px)}.button-group{flex-wrap:wrap;align-items:center;gap:10px;margin-top:24px;display:flex}.notice-link{color:#e5e7eb;text-decoration:none;transition:all .2s}.notice-link:hover{color:#38bdf8;text-shadow:0 0 8px #38bdf8b3;text-decoration:underline}.action-button,.write-button{color:#fff;background:linear-gradient(135deg, var(--primary), var(--accent));border:0;border-radius:14px;justify-content:center;align-items:center;min-width:110px;min-height:44px;padding:11px 18px;font-weight:800;transition:transform .2s,box-shadow .2s,opacity .2s;display:inline-flex}.action-button:hover,.write-button:hover{opacity:.95;transform:translateY(-2px);box-shadow:0 14px 26px #00c2a829}.secondary-button{color:var(--text-main);border:1px solid var(--border);background:#ffffff14}.secondary-button:hover{box-shadow:none;background:#ffffff21}.error,.success{border-radius:14px;margin:0 0 20px;padding:14px 18px;font-weight:700}.error{color:var(--danger-text);border:1px solid var(--danger-border);background:var(--danger-bg)}.success{color:var(--success-text);border:1px solid var(--success-border);background:var(--success-bg)}.board-wrap{padding:28px}.board-wrap h2{margin-top:0}.board-table{border-collapse:collapse;border-top:1px solid var(--border);width:100%;font-size:.95rem}.board-table th,.board-table td{border-bottom:1px solid var(--border);text-align:center;vertical-align:middle;padding:14px 10px}.board-table th{color:#7ff1df;background:#ffffff09;font-weight:800}.board-table tr{transition:background .2s}.board-table tbody tr:hover{background:var(--surface-hover)}.board-table .title-cell{text-align:left}.board-table .title-cell a{color:#fff;font-weight:700}.board-table .title-cell a:hover{color:#7ff1df;text-decoration:underline}.empty{color:var(--text-muted);padding:40px 16px}.col-no{width:90px}.col-writer{width:120px}.post-item{padding:28px;transition:border-color .2s,background .2s,transform .2s}.post-item:hover{border-color:var(--border-hover);background:linear-gradient(180deg, var(--surface-hover), #ffffff08);transform:translateY(-3px)}.post-item h1,.post-item h2,.post-item h3{margin-top:0}.post-content{color:var(--text-muted);word-break:break-word;white-space:pre-wrap;margin:0;line-height:1.75}.pagination{flex-wrap:wrap;justify-content:center;gap:6px;margin-top:24px;display:flex}.pagination button{border:1px solid var(--border);min-width:34px;height:34px;color:var(--text-soft);background:#ffffff0f;border-radius:10px;padding:0 10px;transition:background .2s,border-color .2s,color .2s}.pagination button:hover:not(:disabled),.pagination button.active{color:#050505;border-color:var(--accent);background:var(--accent)}.pagination button:disabled{cursor:not-allowed;opacity:.4}@media (width<=768px){.container{width:min(100% - 24px,100%);padding:32px 0 56px}.header{flex-direction:column;align-items:stretch}.header>div,.nav{justify-content:center}.board-wrap{overflow-x:auto}.board-table{min-width:560px}}@media (width<=480px){.container{width:min(100% - 20px,100%)}.header,.form,.board-wrap,.post-item{border-radius:var(--radius-md);padding:16px}.nav a,.write-button,.action-button{width:100%}}
