:root{--bg: #f7f4ef;--surface: #ffffff;--text: #1a1a1a;--muted: #5c5c5c;--accent: #c9a227;--accent-dark: #9a7b1a;--border: #e8e2d8;--shadow: 0 12px 40px rgba(26, 26, 26, .08);font-family:Segoe UI,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at top right,rgba(201,162,39,.12),transparent 40%),var(--bg);color:var(--text)}#app{min-height:100vh}.portal{max-width:1080px;margin:0 auto;padding:48px 24px 64px}.portal__header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:40px}.portal__brand{display:flex;align-items:center;gap:16px}.portal__brand img{width:56px;height:56px;object-fit:contain}.portal__title{margin:0;font-size:1.75rem;font-weight:600;letter-spacing:.02em}.portal__subtitle{margin:4px 0 0;color:var(--muted);font-size:1rem}.portal__user{text-align:right;font-size:.9rem;color:var(--muted)}.portal__user strong{display:block;color:var(--text)}.portal__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px}.card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:28px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:16px;transition:transform .15s ease,box-shadow .15s ease}.card:hover{transform:translateY(-2px);box-shadow:0 16px 48px #1a1a1a1f}.card__logo{width:48px;height:48px;object-fit:contain}.card__name{margin:0;font-size:1.35rem}.card__description{margin:0;color:var(--muted);line-height:1.5;flex:1}.card__button{align-self:flex-start;border:none;border-radius:999px;padding:12px 24px;background:var(--accent);color:#fff;font-size:.95rem;font-weight:600;cursor:pointer}.card__button:hover{background:var(--accent-dark)}.state{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:48px 32px;text-align:center;box-shadow:var(--shadow)}.state h2{margin:0 0 12px}.state p{margin:0 0 24px;color:var(--muted)}.button{border:none;border-radius:999px;padding:12px 28px;background:var(--accent);color:#fff;font-size:1rem;font-weight:600;cursor:pointer}.button--ghost{background:transparent;color:var(--text);border:1px solid var(--border)}.button:hover{background:var(--accent-dark)}.button--ghost:hover{background:#f0ebe3}.actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
