| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141 |
- * {
- box-sizing: border-box;
- }
- body {
- margin: 0;
- padding: var(--space-4);
- background: linear-gradient(140deg, #f9fbfc 0%, #edf2f6 100%);
- color: var(--text);
- font-family: var(--font-body);
- }
- .container {
- max-width: 900px;
- margin: 0 auto;
- }
- h1,
- h2,
- h3 {
- margin-top: 0;
- }
- .card {
- background: var(--surface);
- border: 1px solid var(--border);
- border-radius: var(--radius);
- padding: var(--space-4);
- margin-bottom: var(--space-4);
- }
- .field {
- margin-bottom: var(--space-3);
- }
- label {
- display: block;
- margin-bottom: var(--space-1);
- font-weight: 600;
- }
- input,
- select,
- textarea,
- button {
- width: 100%;
- padding: var(--space-2);
- border: 1px solid var(--border);
- border-radius: 8px;
- font-size: 1rem;
- }
- input[type='checkbox'] {
- width: auto;
- }
- textarea {
- min-height: 110px;
- resize: vertical;
- }
- button {
- background: #f5f8fb;
- cursor: pointer;
- }
- button:hover {
- background: #e9f0f7;
- }
- .wizard-actions {
- display: grid;
- grid-template-columns: repeat(3, 1fr);
- gap: var(--space-2);
- }
- .inline-actions {
- display: grid;
- grid-template-columns: 1fr;
- gap: var(--space-2);
- }
- .progress {
- margin-bottom: var(--space-3);
- color: var(--muted);
- }
- .error {
- color: var(--danger);
- min-height: 1.2rem;
- margin-top: 0.2rem;
- font-size: 0.9rem;
- }
- .hint,
- small {
- display: block;
- color: var(--muted);
- margin-top: 0.25rem;
- font-size: 0.85rem;
- }
- .hidden,
- .hp-field {
- display: none;
- }
- .upload-item {
- font-size: 0.9rem;
- color: var(--muted);
- margin-top: 0.25rem;
- }
- .status-text {
- margin-top: var(--space-2);
- color: var(--muted);
- min-height: 1.2rem;
- }
- table {
- width: 100%;
- border-collapse: collapse;
- }
- th,
- td {
- border: 1px solid var(--border);
- padding: var(--space-2);
- vertical-align: top;
- text-align: left;
- }
- @media (max-width: 640px) {
- body {
- padding: var(--space-2);
- }
- .wizard-actions {
- grid-template-columns: 1fr;
- }
- }
|