.menu { display: flex; flex-direction: column; gap: 16px; }
.tile { display: flex; align-items: center; gap: 16px; text-decoration: none; color: var(--ink); background: var(--white); border: 3px solid var(--ink); border-radius: 20px; padding: 18px; box-shadow: 6px 6px 0 var(--ink); min-height: 84px; }
.tile:active { transform: translate(3px, 3px); box-shadow: 3px 3px 0 var(--ink); }
.tile .num { flex: none; width: 48px; height: 48px; border-radius: 14px; background: var(--orange); border: 3px solid var(--ink); display: flex; align-items: center; justify-content: center; font-size: 22px; font-weight: 900; }
.tile b { display: block; font-size: 20px; font-weight: 900; }
.tile span { font-size: 14px; color: var(--gray); font-weight: 600; }
.tile.owner .num { background: var(--yellow); }
a.pill { text-decoration: none; display: inline-flex; align-items: center; }
select, textarea { font: inherit; font-size: 16px; padding: 12px 14px; border: 2px solid var(--ink); border-radius: 10px; background: var(--white); color: var(--ink); }
textarea { min-height: 84px; resize: vertical; }
.grid2 label { min-width: 0; }
.grid2 input { width: 100%; }
.item { display: flex; flex-direction: column; gap: 4px; padding: 10px 0; border-bottom: 2px solid #e5e5e5; }
.item:last-child { border-bottom: 0; }
.item .row span { color: var(--gray); font-size: 14px; }
.badge { display: inline-block; font-size: 12px; font-weight: 800; border: 2px solid var(--ink); border-radius: 999px; padding: 1px 8px; background: var(--white); }
.badge.rusak { background: var(--orange); }
.badge.selesai { background: var(--yellow); }
.small-btn { font: inherit; font-size: 13px; font-weight: 800; border: 2px solid var(--ink); border-radius: 10px; background: var(--white); padding: 6px 10px; min-height: 36px; cursor: pointer; align-self: flex-start; }
.thumb { width: 72px; height: 72px; object-fit: cover; border: 2px solid var(--ink); border-radius: 10px; }
.total { font-size: 22px; font-weight: 900; text-align: right; }
.otabs { display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: 8px; }
.otab { font: inherit; font-weight: 800; font-size: 15px; min-height: 48px; border: 3px solid var(--ink); border-radius: 14px; background: var(--white); color: var(--ink); cursor: pointer; padding: 6px 8px; }
.otab.on { background: var(--orange); box-shadow: 3px 3px 0 var(--ink); }
