@layer guma-composition {
/* Login composition. Common font, field, button and icon material lives in shared owners. */
.login-page{min-height:100dvh;padding:var(--ui-space-2xl) var(--ui-space-xl);display:grid;align-items:center}
.login-frame{width:min(1360px,100%);margin:auto;border:var(--ui-border) solid var(--ui-edge);border-radius:var(--ui-radius-panel);box-shadow:var(--ui-shadow-panel);background:var(--guma-surface);overflow:clip}
.login-topbar{display:flex;align-items:center;justify-content:space-between;gap:var(--ui-space-lg);min-height:70px;padding:var(--ui-space-sm) 42px}
.login-brand{display:flex;align-items:center;gap:var(--ui-space-md);text-decoration:none;color:var(--guma-text)}
.login-brand .brand-copy strong{font-size:var(--ui-font-heading);font-weight:var(--ui-weight-medium);letter-spacing:.025em;white-space:nowrap}
.login-brand .brand-copy strong>span{color:var(--guma-gold);font-weight:var(--ui-weight-heading)}
.login-brand .brand-copy small{display:none}
.login-utilities{display:flex;align-items:center;gap:var(--ui-space-lg)}
.login-locale{display:flex;align-items:center;margin:0;border:1px solid var(--guma-border);border-radius:var(--ui-radius-pill);overflow:hidden}
.login-locale button{border:0;background:transparent;color:var(--guma-text);padding:0 var(--ui-space-lg);min-height:44px;font-size:var(--ui-font-label);cursor:pointer}
.login-locale button[aria-pressed=true]{background:var(--ui-action-gradient);border-radius:var(--ui-radius-pill)}
.login-mode{display:grid;place-items:center;width:44px;height:44px;border:0;background:transparent;color:var(--guma-text);cursor:pointer}
.login-mode svg{width:22px;height:22px}
.login-help{position:relative}
.login-help summary{display:flex;gap:6px;align-items:center;list-style:none;cursor:pointer;min-height:44px;color:var(--guma-muted);font-size:var(--ui-font-label)}
.login-help summary svg{width:20px;height:20px}
.login-help__panel{position:absolute;right:0;top:calc(100% + 8px);width:min(290px,calc(100vw - 32px));padding:var(--ui-space-lg);z-index:20}
.login-help__panel p{margin:8px 0 0}
.login-shell{display:grid;grid-template-columns:45% 55%;min-height:clamp(720px,83vh,850px)}
.login-primary{padding:32px 30px 28px;min-width:0}
.login-primary__content{display:flex;flex-direction:column;gap:var(--ui-space-xl);height:100%;max-width:556px;margin:0 auto}
.login-introduction h1{margin:0 0 12px;font-size:var(--ui-font-welcome);line-height:1.13;font-weight:var(--ui-weight-heading);letter-spacing:-.035em}
.login-introduction em{font-style:normal;white-space:nowrap}.login-introduction em span{color:var(--guma-gold)}
.login-introduction p{margin:0;font-size:var(--ui-font-presentation);line-height:1.4;color:var(--guma-muted)}
.login-features{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--ui-space-md);padding:0 2px}
.login-feature{min-width:0;text-align:center;display:flex;align-items:center;flex-direction:column;gap:var(--ui-space)}
.login-feature strong{font-weight:var(--ui-weight-normal);font-size:var(--ui-font-label)}
.login-feature>span:last-child:not(.work-app-icon){display:none}
.login-feature .work-app-icon{--ui-app-icon:var(--ui-app-icon-feature);--ui-app-glyph:var(--ui-app-glyph-feature);--ui-radius-icon:20px}
.login-card{--ui-control:52px;padding:26px 30px 32px;min-width:0}
.login-card__heading{margin-bottom:16px}
.login-card__heading h2{margin:0 0 2px;font-size:var(--ui-font-display);letter-spacing:-.035em}
.login-card__heading>span{font-size:var(--ui-font-body);color:var(--guma-muted)}
.login-card form{display:flex;flex-direction:column;gap:var(--ui-space)}
.login-card form>label{font-size:var(--ui-font-label);margin-top:6px}
.login-field input{padding:0;font-size:var(--ui-font-data)}
.login-field__icon{display:grid;place-items:center;color:var(--guma-muted)}
.login-field__icon svg{width:20px;height:20px}
.login-password-toggle{display:grid;place-items:center;flex:0 0 var(--ui-touch);align-self:stretch;border:0;padding:0;background:transparent;color:var(--guma-muted);cursor:pointer}
.login-password-toggle svg{width:22px;height:22px}
.login-submit{margin-top:16px;width:100%;--ui-control:var(--ui-control-prominent);--ui-button-font:var(--ui-font-presentation)}
.login-values{margin-top:auto;color:var(--guma-muted);font-size:var(--ui-font-caption);line-height:1.5}
.login-values>p,.login-values__line{display:none}
.login-values__items{display:flex;flex-wrap:wrap;gap:6px 10px;margin-bottom:4px}
.login-values__items span{display:flex;align-items:center;gap:var(--ui-space-xs)}.login-values__items svg{display:none}.login-values small{font-size:var(--ui-font-tiny)}
.login-hero{position:relative;min-width:0;--work-scene-image:url('../images/login-hero-excavator-2026-09-09.png');background:var(--ui-media-ink);display:flex;align-items:flex-end;padding:42px 56px 46px;color:var(--ui-media-text)}
.login-hero__shade{position:absolute;inset:0;z-index:1;background:var(--ui-media-shade)}
.login-hero__content{position:relative;z-index:2;width:100%}
.login-hero__content h2{margin:0 0 12px;font-size:var(--ui-font-welcome);color:var(--ui-media-text);line-height:1.08;font-weight:var(--ui-weight-strong);letter-spacing:-.035em}
.login-hero__content h2 span{color:var(--ui-media-gold)}
.login-hero__content>p{font-size:var(--ui-font-body);max-width:48ch;margin:0 0 8px;line-height:1.5}
.login-stats{margin-top:14px;font-size:var(--ui-font-caption);color:var(--ui-media-text)}
.login-stats summary{cursor:pointer;min-height:32px;display:list-item}
.login-stat-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--ui-space-md);padding-top:var(--ui-space)}.login-stat{display:grid;gap:var(--ui-space-xs)}.login-stat strong{font-size:var(--ui-font-title);font-weight:var(--ui-weight-strong)}.login-stat span{font-size:var(--ui-font-caption)}
.login-copyright{position:absolute;z-index:2;bottom:12px;left:36px;font-size:var(--ui-font-tiny);color:var(--ui-media-text)}
.login-error{margin:0 0 12px;display:flex;align-items:flex-start;gap:var(--ui-space)}.login-error svg{width:20px;flex:none}.login-error ul{margin:0;padding-left:var(--ui-space-lg)}
@media(min-width:1600px){.login-frame{max-width:1440px}.login-primary{padding:40px}.login-shell{min-height:780px}.login-introduction h1{font-size:var(--ui-font-hero-large)}}
@media(max-width:1099px){.login-page{padding:var(--ui-space-xl)}.login-topbar{padding-inline:var(--ui-space-xl)}.login-primary{padding:var(--ui-space-xl)}.login-primary__content{gap:var(--ui-space-xl)}.login-shell{grid-template-columns:1fr 1fr;min-height:700px}.login-card{padding:18px;--ui-control:44px}.login-feature .work-app-icon{--ui-app-icon:56px;--ui-app-glyph:34px}.login-hero{padding:30px var(--ui-space-xl) 42px}.login-hero__content h2{font-size:var(--ui-font-display)}.login-copyright{left:24px}}
@media(max-width:699px){.login-page{padding:0;display:block}.login-frame{min-height:100dvh;border:0;border-radius:0;box-shadow:none}.login-topbar{padding:10px max(var(--ui-space-lg),env(safe-area-inset-right));min-height:64px;gap:var(--ui-space)}.login-brand .brand-copy strong{font-size:var(--ui-font-subheading)}.login-utilities{gap:var(--ui-space-xs)}.login-locale button{padding-inline:10px}.login-help summary>span{display:none}.login-help summary{width:44px;justify-content:center}.login-mode{width:44px}.login-shell{display:flex;flex-direction:column;min-height:0}.login-primary{padding:26px var(--ui-space-xl) var(--ui-space-xl)}.login-primary__content{max-width:460px;gap:22px}.login-introduction p{font-size:var(--ui-font-data)}.login-submit{--ui-control:52px;--ui-button-font:var(--ui-font-input)}.login-introduction h1{font-size:var(--ui-font-display)}.login-card{padding:18px;--ui-control:44px}.login-hero{min-height:250px;padding:var(--ui-space-2xl) var(--ui-space-xl) 38px}.login-hero__content h2{font-size:var(--ui-font-heading)}.login-hero__content>p{font-size:var(--ui-font-label)}.login-copyright{left:20px}.login-stats{display:none}.login-values{margin-top:0}.login-field input{font-size:var(--ui-font-input)}}
@media(orientation:landscape) and (max-height:500px){.login-page{padding:0}.login-frame{border:0;border-radius:0}.login-topbar{min-height:56px}.login-shell{min-height:620px;grid-template-columns:1fr 1fr}.login-primary{padding:var(--ui-space-xl) var(--ui-space-xl)}.login-hero__content h2{font-size:var(--ui-font-display)}}
@media(max-width:359px){.login-topbar{padding-inline:var(--ui-space-md)}.login-brand .brand-copy strong{font-size:var(--ui-font-subheading)}.login-topbar{flex-wrap:wrap}.login-utilities{gap:0;margin-left:auto}.login-mode{width:44px}.login-primary{padding-inline:var(--ui-space-lg)}.login-introduction h1{font-size:var(--ui-font-heading)}.login-features{gap:var(--ui-space)}.login-feature .work-app-icon{--ui-app-icon:50px;--ui-app-glyph:30px}.login-feature strong{font-size:var(--ui-font-caption)}}

}