/* কম্পোনেন্ট: কার্ড, ক্যাটাগরি টাইল, ডিজাইনার প্যানেল */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}
.tiles{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.tile{font:inherit;color:var(--ink);background:var(--card);border:2px solid var(--line);border-radius:16px;padding:12px 6px;cursor:pointer;min-height:100px;display:grid;gap:4px;align-content:center;justify-items:center;text-align:center;transition:transform .18s,border-color .18s,box-shadow .18s}
.tile:hover{transform:translateY(-4px) rotate(-1deg);box-shadow:var(--shadow)}.tile[aria-pressed=true]{border-color:var(--acc);background:var(--soft);box-shadow:0 0 0 4px rgba(232,99,26,.16)}
.tile .i{font-size:30px;line-height:1.1}.tile .t{font-size:14px;font-weight:700;line-height:1.2}
.designer{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:20px;margin-top:20px;align-items:start}
.d-stage{position:sticky;top:84px;overflow:hidden}.stage{background:radial-gradient(ellipse at 50% 38%,var(--card) 0,var(--soft) 78%);padding:12px 12px 6px}
.bar{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
.seg{display:inline-flex;background:var(--bg);border:1px solid var(--line);border-radius:99px;padding:3px;gap:2px}
.seg button{font:700 14px var(--f-body);color:var(--mut);background:none;border:0;border-radius:99px;padding:2px 13px;cursor:pointer;min-height:34px}.seg button.on{background:var(--brown);color:#fff}
.stage canvas{display:block;width:100%;max-width:470px;height:auto;margin:6px auto 0;filter:drop-shadow(0 18px 18px rgba(43,29,22,.18))}
.d-panel{padding:18px;display:grid;gap:14px}.d-panel h2{margin:0;font-size:22px}
.fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}.fields .full{grid-column:1/-1}
.chk{display:flex;gap:10px;align-items:center;font-size:15px;color:var(--ink);cursor:pointer}.chk input{width:22px;height:22px;min-height:0;flex:none}
.emo{display:grid;grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:6px}.emo button{font-size:24px;background:var(--bg);border:2px solid var(--line);border-radius:12px;min-height:44px;cursor:pointer}.emo button.on{border-color:var(--acc);background:var(--soft)}
.opts{display:grid;grid-template-columns:1fr 110px;gap:12px}.swatches{display:flex;gap:10px;flex-wrap:wrap;padding:3px}
.sw{position:relative;cursor:pointer}.sw input{position:absolute;opacity:0;inset:0;width:100%;height:100%;min-height:0;cursor:pointer}
.sw span{display:block;width:36px;height:36px;border-radius:50%;border:3px solid var(--card);box-shadow:0 0 0 2px var(--line);transition:transform .15s}.sw input:checked+span{box-shadow:0 0 0 3px var(--acc);transform:scale(1.14)}
.sw input:focus-visible+span{outline:3px solid var(--tan);outline-offset:2px}
.d-actions{display:grid;grid-template-columns:1fr auto;gap:10px}.hint{margin:0;color:var(--mut);font-size:14px}
@media (max-width:1000px){.tiles{grid-template-columns:repeat(4,1fr)}}
@media (max-width:860px){.designer{grid-template-columns:1fr}.d-stage{position:static}}
@media (max-width:560px){.tiles{grid-template-columns:repeat(3,1fr)}.tile{min-height:92px;padding:8px 4px}.tile .t{font-size:13px}.opts{grid-template-columns:1fr}.d-actions{grid-template-columns:1fr}}
/* গ্যালারি কার্ড (হোম ও গ্যালারি পেজে একই) */
.gal{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.gc{overflow:hidden;transition:transform .2s}.gc:hover{transform:translateY(-4px)}
.gc .info{padding:12px 14px 16px;display:grid;gap:10px}.gc .gt{display:block;font:800 18px var(--f-head)}.gc .gcat{color:var(--mut);font-size:14px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.gb{display:flex;gap:10px}.gb .btn{flex:1}
@media (max-width:860px){.gal{grid-template-columns:1fr 1fr}}@media (max-width:560px){.gal{grid-template-columns:1fr}}