* { box-sizing: border-box; }
body { margin:0; font-family: Roboto, Arial, sans-serif; background:#f6f7fb; color:#323338; }

/* Upload page */
.upload-wrap { display:flex; align-items:center; justify-content:center; height:100vh; }
.upload-card { background:#fff; padding:40px; border-radius:8px; box-shadow:0 1px 4px rgba(0,0,0,.1); width:400px; text-align:center; }
.upload-card h1 { font-size:20px; margin-bottom:8px; }
.upload-card p { font-size:13px; color:#676879; margin-bottom:20px; }
.upload-card input[type=file] { display:block; width:100%; margin-bottom:16px; }
.upload-card button { background:#0073ea; color:#fff; border:none; padding:10px 18px; border-radius:4px; cursor:pointer; font-size:14px; }
.upload-card button:hover { background:#0060b9; }

/* Board topbar */
.board-topbar { display:flex; align-items:center; justify-content:space-between; background:#fff; padding:14px 24px; border-bottom:1px solid #e6e9ef; }
.board-title { font-size:20px; font-weight:600; }
.back-link { color:#0073ea; text-decoration:none; font-size:13px; }

.board-root { padding:20px 24px; }

/* Group block */
.group-block { margin-bottom:28px; border-radius:6px; overflow:hidden; }
.group-header { background:#00c875; color:#fff; padding:8px 14px; font-weight:600; font-size:14px; }
.group-table { width:100%; border-collapse:collapse; background:#fff; }
.group-table th { text-align:left; font-size:12px; color:#676879; font-weight:500; padding:8px 12px; border-bottom:1px solid #e6e9ef; background:#f5f6f8; white-space:nowrap; }
.group-table td { padding:8px 12px; font-size:13px; border-bottom:1px solid #eef0f4; white-space:nowrap; }
.group-table tr:hover td { background:#f5faff; }
.item-name-cell { color:#0073ea; cursor:pointer; font-weight:500; }
.item-name-cell:hover { text-decoration:underline; }

.pill { display:inline-block; padding:3px 10px; border-radius:4px; color:#fff; font-size:12px; font-weight:600; }

/* Slider panel */
.overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.25); z-index:10; }
.overlay.active { display:block; }
/*.item-panel { position:fixed; top:0; right:-520px; width:480px; height:100%; background:#fff; box-shadow:-2px 0 8px rgba(0,0,0,.15); z-index:11; transition:right .25s ease; display:flex; flex-direction:column; }
.item-panel.open { right:0; }*/
.item-panel { position:fixed; top:0; right:-770px; width:750px; height:100%; background:#fff; box-shadow:-2px 0 8px rgba(0,0,0,.15); z-index:11; transition:right .25s ease; display:flex; flex-direction:column; }
.item-panel.open { right:0; }
.panel-header { display:flex; align-items:center; justify-content:space-between; padding:16px 20px; border-bottom:1px solid #e6e9ef; }
.panel-header h2 { font-size:17px; margin:0; word-break:break-word; padding-right:10px; }
.panel-close { background:none; border:none; font-size:22px; cursor:pointer; color:#676879; }
.panel-body { padding:16px 20px; overflow-y:auto; flex:1; }

.panel-fields { margin-bottom:20px; }
.field-row { display:flex; padding:6px 0; border-bottom:1px solid #f0f1f4; font-size:13px; }
.field-label { width:140px; flex-shrink:0; color:#676879; }
.field-value { flex:1; word-break:break-word; }

.panel-updates h3 { font-size:14px; margin:0 0 10px; color:#323338; }
.update-card { background:#f6f7fb; border-radius:6px; padding:10px 12px; margin-bottom:10px; }
.update-meta { font-size:12px; color:#676879; margin-bottom:4px; }
.update-owner { font-weight:600; color:#323338; }
.update-body { font-size:13px; line-height:1.4; white-space:pre-wrap; }
.reply-list { margin-top:8px; padding-left:14px; border-left:2px solid #e6e9ef; }
.reply-card { padding:6px 0; }
.reply-card .update-body { font-size:12.5px; }
.empty-note { color:#9699a6; font-size:13px; }