* {

margin: 0;

padding: 0;

box-sizing: border-box;

}

body {

font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);

min-height: 100vh;

padding: 15px;

display: flex;

align-items: center;

justify-content: center;

}

.container {

background: white;

border-radius: 20px;

padding: 25px;

box-shadow: 0 20px 40px rgba(0,0,0,0.15);

max-width: 450px;

width: 100%;

margin: 0 auto;

}

h1 {

color: #333;

text-align: center;

margin-bottom: 25px;

font-size: clamp(20px, 5vw, 26px);

font-weight: 700;

line-height: 1.2;

}

.info {

background: #f8f9fa;

padding: 15px;

margin-bottom: 12px;

border-radius: 12px;

border-left: 4px solid #667eea;

font-size: clamp(14px, 4vw, 16px);

color: #333;

display: flex;

align-items: flex-start;

gap: 12px;

word-wrap: break-word;

overflow-wrap: break-word;

transition: background 0.3s, border-left-color 0.3s;

}

.info:last-child {

margin-bottom: 0;

}

.info span {

font-size: clamp(16px, 4.5vw, 18px);

flex-shrink: 0;

}

.info-content {

flex: 1;

min-width: 0;

}

.info strong {

display: block;

margin-bottom: 2px;

color: #555;

font-weight: 600;

}

.emergency {

background: #fff5f5;

border-left-color: #e53e3e;

}

.emergency a {

color: #c53030;

text-decoration: none;

font-weight: 600;

}

.emergency a:hover {

text-decoration: underline;

}

/* Responsive breakpoints */

@media (max-width: 480px) {

body {

padding: 10px;

}

.container {

padding: 20px;

border-radius: 15px;

}

.info {

padding: 12px;

gap: 10px;

flex-direction: row;

align-items: center;

}

.info strong {

display: inline;

margin-bottom: 0;

margin-right: 5px;

}

}

@media (max-width: 320px) {

.container {

padding: 15px;

}

.info {

padding: 10px;

font-size: 13px;

}

}

/* Landscape orientation on mobile */

@media (max-height: 500px) and (orientation: landscape) {

body {

padding: 10px;

}

.container {

max-width: 90vw;

padding: 15px;

}

h1 {

margin-bottom: 15px;

font-size: 18px;

}

.info {

margin-bottom: 8px;

padding: 10px;

}

}