.reward-client { --reward-ink:#21323b; --reward-muted:#68767b; --reward-border:#d7e4e1; --reward-mint:#dff5ef; color:var(--reward-ink); font-family:inherit; width:100%; }
.reward-panel { max-width:780px; margin:20px auto; padding:clamp(16px,3vw,26px); border:1px solid var(--reward-border); border-radius:22px; background:#fff; box-shadow:0 10px 32px rgba(42,81,80,.08); }
.reward-panel-head,.reward-summary,.reward-actions { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.reward-panel-head h2 { margin:1px 0 0; font-size:clamp(20px,3vw,26px); letter-spacing:.02em; }
.reward-eyebrow { margin:0; color:#16856f; font-size:12px; font-weight:800; letter-spacing:.12em; }
.reward-status,.reward-feed,.reward-identity-option,.reward-confirm { font:inherit; font-weight:700; border:0; cursor:pointer; }
.reward-status { padding:8px 11px; border-radius:999px; color:#126653; background:#e7f7f1; }
.reward-summary { margin:16px 0 12px; flex-wrap:wrap; font-size:14px; color:var(--reward-muted); }
.reward-identity { font-weight:750; color:var(--reward-ink); }.reward-food { padding:6px 10px; border-radius:9px; background:#fff6dc; color:#855d0d; font-weight:800; }
.reward-tank-shell { overflow:hidden; border:7px solid #fff; border-radius:18px; background:var(--reward-mint); box-shadow:inset 0 0 0 1px rgba(23,91,77,.1),0 3px 12px rgba(42,81,80,.09); }
.reward-tank { display:block; width:100%; height:clamp(250px,48vw,390px); touch-action:manipulation; }
.reward-tank.is-hovering { cursor:pointer; }
.reward-tank.is-hovering { cursor:pointer; }
.reward-actions { margin-top:14px; flex-wrap:wrap; }.reward-selection { flex:1 1 210px; margin:0; color:var(--reward-muted); font-size:13px; }
.reward-feed { min-height:42px; padding:9px 16px; border-radius:10px; color:#fff; background:#16856f; }.reward-feed:not(:disabled):hover { background:#0d6f5c; }.reward-feed:disabled { color:#899596; background:#e9eeee; cursor:not-allowed; }
.reward-message { min-height:1.4em; margin:12px 0 0; font-size:13px; color:var(--reward-muted); }.reward-message[data-tone="success"] { color:#13745d; }.reward-message[data-tone="warning"] { color:#9a5f18; }
.reward-toast { position:fixed; z-index:10001; top:max(16px,env(safe-area-inset-top)); left:50%; width:min(360px,calc(100vw - 32px)); padding:11px 16px; border-radius:12px; color:#fff; background:#14745f; box-shadow:0 8px 26px rgba(22,54,48,.25); text-align:center; font-size:14px; font-weight:750; opacity:0; pointer-events:none; transform:translate(-50%,-14px); transition:opacity .2s ease,transform .2s ease; }.reward-toast[data-tone="warning"] { background:#8a5a18; }.reward-toast.is-visible { opacity:1; transform:translate(-50%,0); }
.reward-identity-dialog { position:fixed; z-index:10000; inset:0; display:grid; place-items:center; padding:18px; background:rgba(17,34,42,.52); }.reward-identity-card { width:min(560px,100%); max-height:min(700px,calc(100vh - 36px)); overflow:auto; padding:clamp(20px,5vw,32px); border-radius:22px; background:#fff; box-shadow:0 20px 60px rgba(0,0,0,.25); }.reward-identity-card h2 { margin:4px 0 8px; font-size:24px; }.reward-identity-card > p:not(.reward-eyebrow) { color:var(--reward-muted); line-height:1.6; }
.reward-identity-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin:20px 0; }.reward-identity-option { min-height:42px; border:1px solid var(--reward-border); border-radius:10px; color:var(--reward-ink); background:#fff; }.reward-identity-option[aria-pressed="true"] { border-color:#16856f; color:#075a49; background:#e7f7f1; box-shadow:0 0 0 2px rgba(22,133,111,.12); }.reward-confirm { width:100%; min-height:46px; border-radius:11px; color:#fff; background:#16856f; }.reward-confirm:disabled { background:#b9c5c4; cursor:not-allowed; }.reward-dialog-note { margin:12px 0 0; font-size:12px; }
@media (max-width:520px) { .reward-panel { margin:12px auto; border-radius:16px; }.reward-panel-head { align-items:flex-start; }.reward-status { white-space:nowrap; }.reward-identity-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.reward-tank { height:270px; }.reward-actions { align-items:stretch; }.reward-feed { width:100%; } }
@media (min-width:768px) { .reward-tank { height:390px; } }